🛠️
Developer docs
Start BuildingGuides
  • ✨Getting Started
  • 🎛️Self Hosted Config
  • ✍️SSO Login
    • Saml Identity Provider (Idp)
    • Oidc Identity Provider (Idp)
  • 🎞️Framework Specific Guide
    • ⚛️Reactjs
    • ⚛️Nextjs
    • ⚛️Vuejs
    • ⚛️Angular
    • ⚛️Svelte
    • ⚛️Solid
    • ⚛️Vanilla JS
  • ℹ️Token
  • ℹ️How to embed?
  • 🏛️Multi-Tenant Access Control
  • Embed using iFrame (Not Recommended approach)
  • 🔑License Key Validation for Self-Hosted App
  • Test
  • 👩‍💻Helpers
    • ✳️Token Body
    • ✅Options
      • Custom Fiscal Year filter setup in DataBrain
    • 🈂️Server Event
    • Embed Functions
    • Override Language
    • ✈️Embedding Architecture
    • ✈️LLM Architecture
    • ✨LLM Connectors
      • Open AI
      • Claude AI
      • Azure Open AI
      • Llama
      • Mixtral
    • 🆔Workspace Name
    • 🆔Dashboard ID
    • 🆔Metric ID
    • 🆔API Token
    • 🆔End User Metric Creation
    • Embedding APIs
      • Sync Datasource
  • Metric App Filter
  • Dashboard App Filter
  • Chat Mode
    • Step 1: Create Datamart and Workspace
    • Step 2: Create Data App and Embed ID
  • ✨Solutions Alchemy
    • Dashboards for Client Groups
    • Dashboard for Multiple Clients
    • Embedding: Role based Dashboard Filtering
    • Localized Currency Symbols
    • Manage Metrics
Powered by GitBook
On this page
  • Step 1:
  • Step 2:

Metric App Filter

Metric App Filter: Instruction Manual

PreviousSync DatasourceNextDashboard App Filter

Last updated 4 months ago

Using the App Filter in Metric:

Step 1:

Create a Metric Filter

  • In your Metric, create a new filter

  • In the "Apply On" section, enable the "App Filter" option

Step 2:

Passing Filter Values Method 1: Passing from Component

  • Use the parameter "metric-filter-options" to pass values directly from a component to the metric filter.

  • Configuration changes based on the Filter Type and the Data Type.

  1. Single-Select Filter:

    • For string-based filters, pass just the value:

      metric-filter-options={JSON.stringify({ // note that invalid options will be filtered out
        "Filter name for a string datatype": {
          options: [
                      { value: 'James Smith', label: 'James' },
                      { value: 'Olivia Johnson', label: 'Olivia' },
                      { value: 'Emma Brown', label: 'Emma' },
                    ] // should have unique elements
          defaultOption: 'James Smith', // value of the selected option
        },
        "Filter name for a number datatype": {
          options: [{ value: 1, label: 'user_1' }, { value: 2, label: 'user_2' }], // should have unique elements
          defaultOption: 1, // value of the selected option
        },

2. Multi-Select Filter:

  • For string-based filters, pass an array of values:

    metric-filter-options={JSON.stringify({ // note that invalid options will be filtered out
      "Filter name for a string datatype": {
        options: [
                    { value: 'James Smith', label: 'James' },
                    { value: 'Olivia Johnson', label: 'Olivia' },
                    { value: 'Emma Brown', label: 'Emma' },
                  ] // should have unique elements
        defaultOption: ['James Smith', 'Olivia Johnson' ], // value of the selected option
      },
      "Filter name for a number datatype": {
        options: [{ value: 1, label: 'user_1' }, { value: 2, label: 'user_2' }], // should have unique elements
        defaultOption: 1, // value of the selected option
      },

Method 2: Passing from Guest Token

  • You can link a guest token here to pass the filter values dynamically.

Refer the below document to generate a guest token.

{
  "clientId": "id",
  "workspaceName": "workspacename",
  "params" : {
     "appFilters": [{
			“metricId”: “The id of the metric you want to have app filters”,
			“values”: {
				“paid_orders”: true,
				“amount”: 500,
				“country”: ["USA", "CANADA"] || "USA" // based on filter variant(select or multi select)
			}
		}]
   }
}

Make sure the options and values match the data type of the filter for successful integration.

Method 3: Handling Large Selections with SQL Integration

Filters with a large number of options (e.g., over 500), manually passing all values becomes inefficient. With SQL integration, you can dynamically fetch options from your database, simplifying the process.

The SQL query specified under the "sql" key dynamically fetches the latest values from the specified database table.

{
  "clientId": "id", 
  "workspaceName": "workspacename",
  "params": {
    "appFilters": [
      {
        "metricId": "The id of the metric you want to have app filters",
        "values": {
          "paid_orders": true,
          "amount": 500,
          "country": {
            "sql": "SELECT \"name\" FROM \"public\".\"countries\" WHERE isEnabled=true",
            "columnName": "name"
          }
        }
      }
    ]
  }
}

Key Benefits:

  1. Dynamic Updates: The SQL query retrieves only the latest relevant options from your database.

    • Example: SELECT "name" FROM "public"."countries" WHERE isEnabled=true fetches active country names.

  2. Efficiency: Eliminates the need to manually manage large datasets in the configuration.

  3. Flexibility: The columnName specifies the field in the query result to use as filter values.

  4. Scalability: Handles thousands of options seamlessly, reducing payload size and improving performance.

This approach is ideal for keeping filters updated with minimal effort, ensuring they remain efficient and user-friendly.

Refer the below "Options" document for further queries.

✅Options
ℹ️Token