Analytics Catalog
Embed the AnalyticsCatalog explorer to let users browse and search the metrics, attributes, facts, datasets, visualizations, and dashboards of a workspace.
AnalyticsCatalog from @gooddata/sdk-ui-catalog renders an interactive explorer of the objects in a workspace, with search, filters, and a detail view of each object.
The explorer lists these object types:
| Object type | What it is |
|---|---|
| Metrics | Saved calculations defined in MAQL |
| Attributes | Descriptive dimensions for slicing data |
| Facts | Raw numeric columns available for aggregation |
| Datasets | Tables of the logical data model (LDM) that link facts and attributes |
| Visualizations | Saved visualizations |
| Dashboards | Saved dashboards |
Basic usage
AnalyticsCatalog takes the backend and workspace from BackendProvider and WorkspaceProvider, or from the backend and workspace props.
import { AnalyticsCatalog } from "@gooddata/sdk-ui-catalog";
import "@gooddata/sdk-ui-catalog/styles/css/main.css";
export const CatalogPage = () => <AnalyticsCatalog workspace="<workspace-id>" />;
To handle a click on an object, for example to route to your own page, use onCatalogItemNavigation or onCatalogItemOpenClick. To open the detail of an object on first render, pass its reference in openCatalogItemRef.
Catalog objects in code
The explorer is a UI. To use catalog objects in your own code:
- For typed references at build time, generate a catalog file with
catalog-export. See Export catalog and typed references with the metadata catalog. - To load the catalog at runtime, use
backend.workspace(workspaceId).catalog().load(). See Load the workspace catalog at runtime.
Props
| Prop | Type | Required | Description | Inherited from |
|---|---|---|---|---|
backend | IAnalyticalBackend | No | An analytical backend to use within the analytics catalog. Can be omitted and taken from context. | — |
locale | string | No | A locale to use for translations. Can be omitted and taken from context. | — |
onCatalogDetailClosed | () => void | No | Handler when closing catalog detail. | — |
onCatalogDetailOpened | (ref: ICatalogItemRef) => void | No | Handler when opening catalog detail. | — |
onCatalogItemNavigation | (event: MouseEvent, ref: ICatalogItemRef) => void | No | Handler for navigating to a catalog item. Consumers can handle route changes. | — |
onCatalogItemOpenClick | (e: MouseEvent, linkClickEvent: OpenHandlerEvent) => void | No | Handler for opening catalog items. | — |
onCreateObject | (objectType: CatalogCreateObjectType) => void | No | Handler for creating a new object from the catalog header. | — |
openCatalogItemRef | ICatalogItemRef | No | Reference to the catalog item to open on initial render. | — |
workspace | string | No | A workspace to use within the analytics catalog. Can be omitted and taken from context. | — |
Related
Load measures, attributes, and date datasets while your application runs, and turn catalog items into IMeasure and IAttribute objects.
Install and configure @gooddata/catalog-export to generate JavaScript or TypeScript constants for the Logical Data Model objects in a workspace.
Embed natural-language search for analytical objects with the SemanticSearch component or the useSemanticSearch hook, and filter results by object type or tag.
Components, events, slots, and actions of the AI Assistant chat in @gooddata/sdk-ui-gen-ai.
Add GoodData.UI to an existing React application by installing the packages, importing the styles, connecting the analytical backend, and rendering a dashboard your users pick from a list.