@odigos/ui-kit 0.0.286 → 0.0.288
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.cursor/rules/frontend-workflow.mdc +27 -0
- package/.cursor/rules/ui-feedback-tables-forms.mdc +40 -0
- package/.cursor/rules/ui-implementation.mdc +21 -0
- package/.cursor/rules/ui-pages-and-drawers.mdc +34 -0
- package/.cursor/rules/ui-visual-language.mdc +27 -0
- package/CHANGELOG.md +22 -0
- package/docs/api-context.md +1 -1
- package/lib/chunks/helpers-BCSEuuKh.js +9 -0
- package/lib/chunks/index-Cy84opXf.js +351 -0
- package/lib/chunks/source-instrument-form-context-D6pVu22G.js +5 -0
- package/lib/chunks/ui-components-D8rTJS7r.js +1943 -0
- package/lib/components/_cards/data-card/index.d.ts +6 -1
- package/lib/components/_cards/text-card/index.d.ts +3 -0
- package/lib/components/button/index.d.ts +3 -1
- package/lib/components/drawer/header/index.d.ts +2 -0
- package/lib/components/drop-data/index.d.ts +4 -10
- package/lib/components/hover-actions/index.d.ts +1 -1
- package/lib/components/index.d.ts +4 -0
- package/lib/components/info-row/index.d.ts +11 -0
- package/lib/components/input/index.d.ts +2 -0
- package/lib/components/popup/index.d.ts +17 -0
- package/lib/components/select-window-hours/index.d.ts +17 -0
- package/lib/components/table/index.d.ts +10 -0
- package/lib/components/table/styled.d.ts +11 -0
- package/lib/components/table/table-rows/index.d.ts +6 -1
- package/lib/components/table/types.d.ts +11 -2
- package/lib/components/trace-view/index.d.ts +4 -0
- package/lib/components/trace-view/styled.d.ts +43 -0
- package/lib/components/trace-view/types.d.ts +46 -0
- package/lib/components.js +1 -1
- package/lib/constants/index.d.ts +1 -0
- package/lib/constants/instrumentation-rules/index.d.ts +2 -1
- package/lib/constants/strings/index.d.ts +20 -0
- package/lib/constants/url-templatization/index.d.ts +90 -0
- package/lib/constants.js +1 -1
- package/lib/containers/_drawers/edit-source-drawer/overview/instructions-card.d.ts +21 -0
- package/lib/containers/_drawers/edit-source-drawer/pods/containers-card/process-card.d.ts +1 -7
- package/lib/containers/_drawers/index.d.ts +3 -0
- package/lib/containers/_drawers/url-templatization-custom-template-drawer/destination-step.d.ts +16 -0
- package/lib/containers/_drawers/url-templatization-custom-template-drawer/index.d.ts +18 -0
- package/lib/containers/_drawers/url-templatization-default-rule-drawer/index.d.ts +14 -0
- package/lib/containers/_drawers/url-templatization-template-view-drawer/index.d.ts +9 -0
- package/lib/containers/central-connections/helpers.d.ts +8 -0
- package/lib/containers/central-connections/index.d.ts +1 -0
- package/lib/containers/index.d.ts +2 -0
- package/lib/containers/insights/consts.d.ts +6 -0
- package/lib/containers/insights/findings/drawer/anomaly/anomaly-trace-compare/helpers.d.ts +15 -0
- package/lib/containers/insights/findings/drawer/anomaly/anomaly-trace-compare/index.d.ts +7 -0
- package/lib/containers/insights/findings/drawer/anomaly/index.d.ts +16 -0
- package/lib/containers/insights/findings/drawer/anomaly/why-this-fired/index.d.ts +6 -0
- package/lib/containers/insights/findings/drawer/helpers.d.ts +9 -0
- package/lib/containers/insights/findings/drawer/index.d.ts +6 -0
- package/lib/containers/insights/findings/drawer/violation/index.d.ts +7 -0
- package/lib/containers/insights/findings/drawer/violation/violation-trace-view/index.d.ts +8 -0
- package/lib/containers/insights/findings/helpers.d.ts +57 -0
- package/lib/containers/insights/findings/index.d.ts +2 -0
- package/lib/containers/insights/findings/resolve-findings/index.d.ts +11 -0
- package/lib/containers/insights/index.d.ts +6 -0
- package/lib/containers/insights/insights-context.d.ts +44 -0
- package/lib/containers/insights/overview/contained-table-and-heading/index.d.ts +19 -0
- package/lib/containers/insights/overview/index.d.ts +6 -0
- package/lib/containers/insights/settings-and-configurations/constants.d.ts +16 -0
- package/lib/containers/insights/settings-and-configurations/content-panel/index.d.ts +11 -0
- package/lib/containers/insights/settings-and-configurations/index.d.ts +2 -0
- package/lib/containers/insights/settings-and-configurations/menu-config.d.ts +24 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/constants.d.ts +40 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/create-override-panel.d.ts +14 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/index.d.ts +2 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/mappers.d.ts +12 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/mock.d.ts +4 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/policies-menu.d.ts +10 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/policy-editor.d.ts +8 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/policy-list-item.d.ts +8 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/risk-levels.d.ts +15 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/risk-model-drawer/constants.d.ts +16 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/risk-model-drawer/default-catalog.d.ts +3 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/risk-model-drawer/helpers.d.ts +30 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/risk-model-drawer/index.d.ts +10 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/signal-weights-panel.d.ts +13 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/signal-weights.d.ts +17 -0
- package/lib/containers/insights/settings-and-configurations/panels/detection/types.d.ts +29 -0
- package/lib/containers/insights/settings-and-configurations/panels/guardrails/constants.d.ts +40 -0
- package/lib/containers/insights/settings-and-configurations/panels/guardrails/create-panel.d.ts +13 -0
- package/lib/containers/insights/settings-and-configurations/panels/guardrails/edit-panel.d.ts +10 -0
- package/lib/containers/insights/settings-and-configurations/panels/guardrails/facet-section.d.ts +15 -0
- package/lib/containers/insights/settings-and-configurations/panels/guardrails/guardrail-list-item.d.ts +8 -0
- package/lib/containers/insights/settings-and-configurations/panels/guardrails/guardrails-menu.d.ts +9 -0
- package/lib/containers/insights/settings-and-configurations/panels/guardrails/index.d.ts +2 -0
- package/lib/containers/insights/settings-and-configurations/panels/guardrails/mappers.d.ts +25 -0
- package/lib/containers/insights/settings-and-configurations/panels/guardrails/types.d.ts +10 -0
- package/lib/containers/insights/settings-and-configurations/panels/learning/constants.d.ts +82 -0
- package/lib/containers/insights/settings-and-configurations/panels/learning/create-override-panel.d.ts +21 -0
- package/lib/containers/insights/settings-and-configurations/panels/learning/index.d.ts +2 -0
- package/lib/containers/insights/settings-and-configurations/panels/learning/mappers.d.ts +38 -0
- package/lib/containers/insights/settings-and-configurations/panels/learning/policies-menu.d.ts +10 -0
- package/lib/containers/insights/settings-and-configurations/panels/learning/policy-editor.d.ts +9 -0
- package/lib/containers/insights/settings-and-configurations/panels/learning/policy-list-item.d.ts +8 -0
- package/lib/containers/insights/settings-and-configurations/panels/learning/types.d.ts +31 -0
- package/lib/containers/insights/settings-and-configurations/panels/storage/constants.d.ts +52 -0
- package/lib/containers/insights/settings-and-configurations/panels/storage/formatters.d.ts +5 -0
- package/lib/containers/insights/settings-and-configurations/panels/storage/index.d.ts +2 -0
- package/lib/containers/insights/settings-and-configurations/panels/storage/layout.d.ts +18 -0
- package/lib/containers/insights/settings-and-configurations/panels/storage/mappers.d.ts +27 -0
- package/lib/containers/insights/settings-and-configurations/panels/system/constants.d.ts +33 -0
- package/lib/containers/insights/settings-and-configurations/panels/system/index.d.ts +2 -0
- package/lib/containers/insights/settings-and-configurations/settings-menu/category-header.d.ts +8 -0
- package/lib/containers/insights/settings-and-configurations/settings-menu/index.d.ts +7 -0
- package/lib/containers/insights/transactions/drawer/baselines/helpers.d.ts +16 -0
- package/lib/containers/insights/transactions/drawer/baselines/index.d.ts +5 -0
- package/lib/containers/insights/transactions/drawer/index.d.ts +2 -0
- package/lib/containers/insights/transactions/drawer/observations/helpers.d.ts +11 -0
- package/lib/containers/insights/transactions/drawer/observations/index.d.ts +5 -0
- package/lib/containers/insights/transactions/helpers.d.ts +35 -0
- package/lib/containers/insights/transactions/index.d.ts +2 -0
- package/lib/containers/url-templatization/converters.d.ts +43 -0
- package/lib/containers/url-templatization/custom-templates-list.d.ts +16 -0
- package/lib/containers/url-templatization/default-rules-list.d.ts +10 -0
- package/lib/containers/url-templatization/helpers.d.ts +17 -0
- package/lib/containers/url-templatization/index.d.ts +5 -0
- package/lib/containers/url-templatization/scope-summary.d.ts +8 -0
- package/lib/containers/url-templatization/template-path.d.ts +8 -0
- package/lib/containers.js +1909 -286
- package/lib/contexts/odigos-api/capabilities.d.ts +4 -0
- package/lib/contexts/odigos-api/hooks/use-insights-api.d.ts +162 -0
- package/lib/contexts/odigos-api/hooks/use-sources-api.d.ts +10 -1
- package/lib/contexts/odigos-api/index.d.ts +2 -1
- package/lib/contexts/odigos-api/internal/notify.d.ts +4 -3
- package/lib/contexts/odigos-api/types.d.ts +229 -1
- package/lib/contexts/odigos-api/use-odigos-api.d.ts +2 -0
- package/lib/contexts/odigos-context.d.ts +3 -3
- package/lib/contexts.js +1 -1
- package/lib/functions/index.d.ts +1 -0
- package/lib/functions/parse-raw-otlp/index.d.ts +43 -0
- package/lib/functions.js +1 -1
- package/lib/hooks/index.d.ts +1 -0
- package/lib/hooks/useAnchoredPopup.d.ts +44 -0
- package/lib/hooks/useCopy.d.ts +2 -3
- package/lib/hooks/useOnClickOutside.d.ts +1 -0
- package/lib/hooks/useTimeAgo.d.ts +4 -0
- package/lib/hooks.js +1 -1
- package/lib/icons/common/clock-icon/index.d.ts +2 -0
- package/lib/icons/common/index.d.ts +4 -0
- package/lib/icons/common/insights-findings-icon/index.d.ts +2 -0
- package/lib/icons/common/insights-transactions-icon/index.d.ts +2 -0
- package/lib/icons/common/threat-detection-icon/index.d.ts +2 -0
- package/lib/icons/overview/index.d.ts +2 -0
- package/lib/icons/overview/insights-icon/index.d.ts +2 -0
- package/lib/icons/overview/url-templatization-icon/index.d.ts +2 -0
- package/lib/icons.js +1 -1
- package/lib/snippets/actions/index.d.ts +8 -5
- package/lib/snippets/blast-radius/animated-edge.d.ts +10 -0
- package/lib/snippets/blast-radius/blast-radius-node.d.ts +6 -0
- package/lib/snippets/blast-radius/helpers.d.ts +29 -0
- package/lib/snippets/blast-radius/index.d.ts +7 -0
- package/lib/snippets/blast-radius/types.d.ts +19 -0
- package/lib/snippets/code-modal/index.d.ts +9 -0
- package/lib/snippets/index.d.ts +2 -0
- package/lib/snippets/trace-modal/index.d.ts +8 -0
- package/lib/snippets/upgrade-modal/index.d.ts +1 -1
- package/lib/snippets/wide-drawer/index.d.ts +6 -0
- package/lib/snippets.js +1 -1
- package/lib/store.js +1 -1
- package/lib/theme/palettes/index.d.ts +7 -1
- package/lib/theme.js +1 -1
- package/lib/types/actions/index.d.ts +12 -0
- package/lib/types/common/index.d.ts +9 -2
- package/lib/types/index.d.ts +1 -0
- package/lib/types/insights/index.d.ts +598 -0
- package/lib/types/instrumentation-rules/index.d.ts +1 -0
- package/lib/types/workload/index.d.ts +61 -0
- package/lib/types.js +1 -1
- package/lib/visuals.js +1 -1
- package/package.json +1 -1
- package/lib/chunks/helpers-C5bkjRbO.js +0 -9
- package/lib/chunks/index-DBZ1mLhG.js +0 -298
- package/lib/chunks/source-instrument-form-context-CnRKQq6W.js +0 -5
- package/lib/chunks/ui-components-Ci-Vq1Dl.js +0 -1620
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Frontend implementation without a dedicated designer — reuse existing Odigos UI, do not block on Figma
|
|
3
|
+
alwaysApply: true
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Odigos frontend workflow
|
|
7
|
+
|
|
8
|
+
The frontend team is two developers. Alon owns technical direction and UX decisions. There is no dedicated designer and no Figma requirement before implementation.
|
|
9
|
+
|
|
10
|
+
Apply this only to frontend/UI work in this design-system repo.
|
|
11
|
+
|
|
12
|
+
## How to implement
|
|
13
|
+
|
|
14
|
+
- Do not treat Figma as a hard dependency. Start from the product requirement plus existing screens, shared components, and similar flows.
|
|
15
|
+
- Search the repo for an existing implementation before proposing a new pattern, layout, or interaction.
|
|
16
|
+
- Prefer existing ui-kit components, layouts, and already-shipped Odigos screens over new visual conventions.
|
|
17
|
+
- Consistency with the current product matters more than novelty. Do not invent design debt to move faster.
|
|
18
|
+
- A first implementation can start from a clear product/UX spec. Visual polish comes after review and iteration.
|
|
19
|
+
|
|
20
|
+
## When something is ambiguous
|
|
21
|
+
|
|
22
|
+
- If the decision can be derived from an existing Odigos screen or component, follow that.
|
|
23
|
+
- If it cannot, surface the UX decision explicitly and treat Alon as the design owner. Do not silently invent a new pattern.
|
|
24
|
+
|
|
25
|
+
## Encoding design knowledge
|
|
26
|
+
|
|
27
|
+
When a UI pattern is reused or decided, prefer capturing it in shared components, examples, or a Cursor rule over leaving it as tribal knowledge.
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Odigos feedback, tables, and forms — Badge, Note, Table, NoData, shared fields
|
|
3
|
+
globs: **/*.{ts,tsx}
|
|
4
|
+
alwaysApply: false
|
|
5
|
+
---
|
|
6
|
+
|
|
7
|
+
# Feedback, tables, and forms
|
|
8
|
+
|
|
9
|
+
**Status and feedback**
|
|
10
|
+
|
|
11
|
+
- Pill/status: `Badge` + `StatusType`
|
|
12
|
+
- Inline or in-page banner: `Note`
|
|
13
|
+
- Global toast: `ToastList` via the notification store
|
|
14
|
+
- Empty: `NoData` (icon, title, subtitle, optional CTA)
|
|
15
|
+
- Loading: `Loader` or table `SkeletonLoader`
|
|
16
|
+
- Conditions/health: `Condition` / `Conditions` / `StatusCard`
|
|
17
|
+
- There is no `Alert` or `Snackbar` component
|
|
18
|
+
|
|
19
|
+
**Tables**
|
|
20
|
+
|
|
21
|
+
- Use `Table` (`TableVariant.Data` or `Pretty`)
|
|
22
|
+
- Loading: `isLoading`
|
|
23
|
+
- Empty: `noDataProps` → `NoData`
|
|
24
|
+
- Row actions: `getRowActions` / `HoverAction`
|
|
25
|
+
- Wrap with `SectionCard` + `Search` like `CentralConnections` or `RulesTable`
|
|
26
|
+
|
|
27
|
+
**Forms**
|
|
28
|
+
|
|
29
|
+
- Fields: `Input`, `Textarea`, `Checkbox`, `Toggle`, `DropDown`, `Autocomplete`, `InputList`, `InputTable`, `FieldTitle`, `FieldMessage`
|
|
30
|
+
- Catalog/YAML-driven fields: `DynamicField`
|
|
31
|
+
- Drawer forms: save/cancel in `WideDrawer` footer; dirty close → `CancelModal`
|
|
32
|
+
- Settings forms: save/cancel on `Island`
|
|
33
|
+
- Labels/validation: `BUTTON_TEXTS`, `FORM_ALERTS`
|
|
34
|
+
|
|
35
|
+
@src/components/badge/index.tsx
|
|
36
|
+
@src/components/note/index.tsx
|
|
37
|
+
@src/components/no-data/index.tsx
|
|
38
|
+
@src/components/table/index.tsx
|
|
39
|
+
@src/components/input/index.tsx
|
|
40
|
+
@src/containers/toast-list/index.tsx
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Frontend/UI work — search existing Odigos patterns before inventing new UI
|
|
3
|
+
alwaysApply: true
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# UI implementation
|
|
7
|
+
|
|
8
|
+
There is no dedicated designer. Infer the first implementation from the product requirement and existing Odigos UI. Alon owns UX decisions that cannot be derived from the product.
|
|
9
|
+
|
|
10
|
+
Before creating a new UI pattern:
|
|
11
|
+
|
|
12
|
+
1. Search ui-kit (`src/components`, `src/containers`, `src/snippets`) and shipped screens for a similar implementation.
|
|
13
|
+
2. Prefer existing shared components over new ones.
|
|
14
|
+
3. Do not invent new colors, type sizes, or visual conventions. Use `theme.v2` and existing component styles.
|
|
15
|
+
4. Side-panel create/edit/detail flows use `Drawer` or `WideDrawer`, not a new page.
|
|
16
|
+
5. Status uses `Badge` + `StatusType`. Inline/page feedback uses `Note`. Toasts use `ToastList`. There is no `Alert` or `Snackbar`.
|
|
17
|
+
6. Tables use `Table` with `isLoading` (`SkeletonLoader`) and `noDataProps` (`NoData`).
|
|
18
|
+
7. New pages follow an existing container structure (Overview, table page, Settings, or graph). Do not invent a generic List/Detail/Settings page type.
|
|
19
|
+
8. If no suitable pattern exists, flag it explicitly before inventing a new one. Do not silently create design debt.
|
|
20
|
+
|
|
21
|
+
Canonical examples live in Storybook container stories and `src/containers/*/story.stories.tsx`.
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Odigos page layouts and drawer flows — Overview, table pages, Settings, Drawer, WideDrawer
|
|
3
|
+
globs: **/*.{ts,tsx}
|
|
4
|
+
alwaysApply: false
|
|
5
|
+
---
|
|
6
|
+
|
|
7
|
+
# Pages and drawers
|
|
8
|
+
|
|
9
|
+
There are no generic `ListPage`, `DetailPage`, or `SettingsPage` abstractions. Compose from existing containers.
|
|
10
|
+
|
|
11
|
+
**Page chrome:** `PageContent` → `SectionCard` (title / search / filters / actions + body). App shell is `Header` + `Navbar`. Bulk/dirty actions use bottom `Island`.
|
|
12
|
+
|
|
13
|
+
**Use an existing page shape:**
|
|
14
|
+
|
|
15
|
+
- Entity board: `Overview` — filters in `SectionCard`, columns, drawers, `Island`
|
|
16
|
+
- Table page: `CentralConnections` or `SamplingRules` — `SectionCard` + `Table` + search + create action + `Island`
|
|
17
|
+
- Settings: `Settings` — side menu + stacked `SectionCard`s + dirty `Island` + YAML `Drawer`
|
|
18
|
+
- Graph: `ServiceMap` only when the page is a canvas
|
|
19
|
+
|
|
20
|
+
**Detail is a drawer, not a route.** Create/edit/detail of an entity opens a drawer.
|
|
21
|
+
|
|
22
|
+
- Two-column create/pick flows: `WideDrawer` (list + form, Cancel/Save or Back/Next, dirty `CancelModal`)
|
|
23
|
+
- Tabbed detail: `Drawer` + `Segment` (see `EditSourceDrawer`)
|
|
24
|
+
- Stepped wizard: `Drawer` + step state (see `CreateCloudConnectorDrawer`)
|
|
25
|
+
- Confirm discard/delete: `CancelModal` / `DeleteModal` / `WarningModal`
|
|
26
|
+
- Do not use `Modal` as a substitute for these side-panel workflows
|
|
27
|
+
|
|
28
|
+
@src/components/styled.ts
|
|
29
|
+
@src/components/_cards/section-card/index.tsx
|
|
30
|
+
@src/components/drawer/index.tsx
|
|
31
|
+
@src/snippets/wide-drawer/index.tsx
|
|
32
|
+
@src/containers/overview/index.tsx
|
|
33
|
+
@src/containers/central-connections/index.tsx
|
|
34
|
+
@src/containers/settings/index.tsx
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Odigos visual language — theme.v2 colors, type sizes, and existing radii
|
|
3
|
+
globs: **/*.{ts,tsx}
|
|
4
|
+
alwaysApply: false
|
|
5
|
+
---
|
|
6
|
+
|
|
7
|
+
# Visual language
|
|
8
|
+
|
|
9
|
+
Use the styled-components theme. Do not introduce new hex colors, type sizes, or one-off visual scales.
|
|
10
|
+
|
|
11
|
+
- Colors: `theme.v2.colors.{family}.{weight}` from `@/theme/palettes`.
|
|
12
|
+
- Type sizes: `theme.v2.text.size` or `Typography` + `TypographySize` (`xxxs` 10 through `xxxl` 48).
|
|
13
|
+
- Status color: `StatusType` + `getStatusColor`, never hardcoded status hex.
|
|
14
|
+
- Fonts: `theme.font_family` — Inter, Kode Mono, IBM Plex Mono.
|
|
15
|
+
- z-index: `theme.v2.zIndex` (drawer/modal `1000`, dropdown `1100`, tooltip `1200`).
|
|
16
|
+
|
|
17
|
+
There is no spacing or shadow token scale. Reuse the values already used by primitives:
|
|
18
|
+
|
|
19
|
+
- Gaps/padding: `2, 4, 8, 12, 16, 24, 32` via `PageContent`, `FlexRow`, `FlexColumn`, `Padding`
|
|
20
|
+
- Radii already in use: inputs/buttons `6px`, `SectionCard` `16px`, drawer/modal `20px`, `Badge` pill `100px`
|
|
21
|
+
|
|
22
|
+
Copy comes from `@/constants/strings` (`DISPLAY_TITLES`, `BUTTON_TEXTS`, `FORM_ALERTS`) or the domain constants next to the feature. Do not invent button labels when a shared string exists.
|
|
23
|
+
|
|
24
|
+
@src/theme/palettes/index.ts
|
|
25
|
+
@src/components/typography/index.tsx
|
|
26
|
+
@src/functions/get-status-color/index.ts
|
|
27
|
+
@src/constants/strings/index.ts
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,27 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## [0.0.288](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.287...ui-kit-v0.0.288) (2026-08-24)
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
### Features
|
|
7
|
+
|
|
8
|
+
* add auto-guardrail for transaction services ([#1232](https://github.com/odigos-io/ui-kit/issues/1232)) ([c4bf356](https://github.com/odigos-io/ui-kit/commit/c4bf356ef7c553b1943f07666e5ae4d5f488ec30))
|
|
9
|
+
* Add required artifacts to show instrumentation steps on the source ([#1246](https://github.com/odigos-io/ui-kit/issues/1246)) ([9e96967](https://github.com/odigos-io/ui-kit/commit/9e9696700857ac8a9b806b8fb014ee8b2c6e4c8a))
|
|
10
|
+
* add transactions as a Guardrails facet (PLAT-1441) ([#1238](https://github.com/odigos-io/ui-kit/issues/1238)) ([718cde7](https://github.com/odigos-io/ui-kit/commit/718cde7d15bd5d60b0d4ae792bdfd3bd79aeaabc))
|
|
11
|
+
* implement Blast Radius for Findings of type `Violation` ([#1234](https://github.com/odigos-io/ui-kit/issues/1234)) ([6e71908](https://github.com/odigos-io/ui-kit/commit/6e71908826ca5631d210e577d60ceec8e47723af))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
### Bug Fixes
|
|
15
|
+
|
|
16
|
+
* clean up unused insights findings lookback settings ([#1236](https://github.com/odigos-io/ui-kit/issues/1236)) ([367fe90](https://github.com/odigos-io/ui-kit/commit/367fe9095806c3156955fa1c1370cc3fc014133d))
|
|
17
|
+
|
|
18
|
+
## [0.0.287](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.286...ui-kit-v0.0.287) (2026-08-23)
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
### Features
|
|
22
|
+
|
|
23
|
+
* add security/insights page ([#1173](https://github.com/odigos-io/ui-kit/issues/1173)) ([a9ae296](https://github.com/odigos-io/ui-kit/commit/a9ae296df7cf46a9e3a3ec772dc07a27a08dbd68))
|
|
24
|
+
|
|
3
25
|
## [0.0.286](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.285...ui-kit-v0.0.286) (2026-08-12)
|
|
4
26
|
|
|
5
27
|
|
package/docs/api-context.md
CHANGED
|
@@ -219,7 +219,7 @@ export default function OdigosApiAdapter({ children, context }) {
|
|
|
219
219
|
// the CSRF hook so the very first render reports the loading
|
|
220
220
|
// state and the gate doesn't briefly mount the provider with a
|
|
221
221
|
// null token.
|
|
222
|
-
if (!ready) return <Loader />;
|
|
222
|
+
if (!ready) return <Loader withSpinner />;
|
|
223
223
|
|
|
224
224
|
return (
|
|
225
225
|
<OdigosApiProvider apolloConfig={apolloConfig} operations={operations} context={context}>
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import{Fragment as n,useMemo as o,useContext as a,createContext as s}from"react";import{T as i,t as u,b as l,P as c}from"./ui-components-D8rTJS7r.js";import p from"styled-components";var d;(e=>{e.Default="default",e.Action="action",e.Endpoint="endpoint",e.Scope="scope",e.Duration="duration"})(d||(d={}));const f=[d.Action,d.Endpoint,d.Scope,d.Duration],h=p.span`
|
|
2
|
+
font-family: ${({theme:e,$isMono:t})=>t?e.font_family.secondary:e.font_family.primary};
|
|
3
|
+
font-size: ${({theme:e})=>e.v2.text.size.xxs}px;
|
|
4
|
+
line-height: 20px;
|
|
5
|
+
color: ${({theme:e,$variant:t})=>{const r=e.v2.colors;switch(t){case"action":return r.green[400];case"endpoint":return r.purple[300];case"scope":return r.yellow[400];case"duration":return r.orange[500];default:return r.white[500]}}};
|
|
6
|
+
`,m=p.span`
|
|
7
|
+
text-decoration: underline dotted;
|
|
8
|
+
text-underline-offset: 3px;
|
|
9
|
+
`,v=({parts:o})=>{const a=o.map(e=>({...e,text:e.text.trim()})).filter(e=>e.text.length>0);return e(t,{children:a.map((o,a)=>{const s=e(h,{$variant:o.variant,$isMono:f.includes(o.variant),children:o.text});return r(n,{children:[0!==a&&e(t,{children:" "}),o.tooltipItems?.length?e(i,{text:o.tooltipItems,inline:!0,maxWidth:"300px",children:e(m,{children:s})}):s]},`${o.variant}-${a}`)})})};function g(){return{sources:[],namespaces:[],languages:[]}}function y(e){return!e||!e.sources?.length&&!e.namespaces?.length&&!e.languages?.length}function x(e){return e?{sources:e.sources?[...e.sources]:[],namespaces:e.namespaces?[...e.namespaces]:[],languages:e.languages?[...e.languages]:[]}:{sources:[],namespaces:[],languages:[]}}function k(e){return null==e||0===e}function T(e){return{name:"",notes:"",disabled:!1,ruleType:"Relevance",sourceScopes:{sources:[],namespaces:[],languages:[]},operationType:"all",routeType:"route",route:"",serverAddress:"",method:"",kafkaTopic:"",durationPreset:"500",customDurationMs:"",keepErrors:!1,percentageMode:"costReduction"===e?"sample":"all",percentagePreset:"0",customPercentage:""}}function A(e){return y(e.sourceScopes)?null:e.sourceScopes}function S(e){return A(e)}function R(e){if("all"===e.percentageMode)return null;if("custom"===e.percentagePreset){const t=parseFloat(e.customPercentage);return isNaN(t)?null:t}return parseFloat(e.percentagePreset)}function P(e){if("custom"===e.durationPreset){const t=parseFloat(e.customDurationMs);return isNaN(t)?null:t}return parseInt(e.durationPreset,10)}function b(e){return{httpServer:{[e.routeType]:e.route||null,method:e.method||null}}}function D(e){return"all"===e.operationType?null:"httpServer"===e.operationType?b(e):"httpClient"===e.operationType?{httpClient:{serverAddress:e.serverAddress||null,["route"===e.routeType?"templatedPath":"templatedPathPrefix"]:e.route||null,method:e.method||null}}:null}function I(e){return"all"===e.operationType?null:"httpServer"===e.operationType?b(e):"kafkaConsumer"===e.operationType?{kafkaConsumer:{kafkaTopic:e.kafkaTopic||null}}:"kafkaProducer"===e.operationType?{kafkaProducer:{kafkaTopic:e.kafkaTopic||null}}:null}function M(e){return{ruleId:"",name:e.name||null,disabled:!1,notes:e.notes||null,sourceScopes:A(e),percentageAtMost:R(e),operation:D(e)}}function C(e){return{ruleId:"",name:e.name||null,disabled:!1,notes:e.notes||null,sourceScopes:A(e),error:e.keepErrors,durationAtLeastMs:"Duration"===e.ruleType?P(e):null,percentageAtLeast:R(e),operation:I(e)}}function $(e){return{ruleId:"",name:e.name||null,disabled:!1,notes:e.notes||null,sourceScopes:A(e),percentageAtMost:R(e)??0,operation:I(e)}}function E(e){return{name:e.name||null,disabled:e.disabled,sourceScopes:S(e),operation:D(e),percentageAtMost:R(e),notes:e.notes||null}}function w(e){return{name:e.name||null,disabled:e.disabled,sourceScopes:S(e),error:"Error"===e.ruleType,durationAtLeastMs:"Duration"===e.ruleType?P(e):null,operation:I(e),percentageAtLeast:R(e),notes:e.notes||null}}function L(e){return{name:e.name||null,disabled:e.disabled,sourceScopes:S(e),operation:I(e),percentageAtMost:R(e)??0,notes:e.notes||null}}const N=["5000","1000","500","100","50"],O=["50","25","10","1","0.5","0.1","0"];function H(e){if(null==e)return{percentageMode:"all",percentagePreset:"0",customPercentage:""};const t=O.find(t=>Number(t)===e);return t?{percentageMode:"sample",percentagePreset:t,customPercentage:""}:{percentageMode:"sample",percentagePreset:"custom",customPercentage:String(e)}}function K(e){if(!e)return{operationType:"all",routeType:"route",route:"",serverAddress:"",method:"",kafkaTopic:""};const t=e;return t.httpServer?{operationType:"httpServer",routeType:t.httpServer.routePrefix?"routePrefix":"route",route:t.httpServer.route||t.httpServer.routePrefix||"",serverAddress:"",method:t.httpServer.method||"",kafkaTopic:""}:t.kafkaConsumer?{operationType:"kafkaConsumer",routeType:"route",route:"",serverAddress:"",method:"",kafkaTopic:t.kafkaConsumer.kafkaTopic||""}:t.kafkaProducer?{operationType:"kafkaProducer",routeType:"route",route:"",serverAddress:"",method:"",kafkaTopic:t.kafkaProducer.kafkaTopic||""}:{operationType:"all",routeType:"route",route:"",serverAddress:"",method:"",kafkaTopic:""}}function j(e){const t=T(),r=x(e.rule.sourceScopes),n=(e=>"highlyRelevant"!==e.category?"Relevance":e.rule.error?"Error":null!=e.rule.durationAtLeastMs?"Duration":"Relevance")(e);let o,a,s={durationPreset:"500",customDurationMs:""},i=!1;switch(e.category){case"noisy":o=(e=>{const t=e.rule.operation;return t?t.httpServer?{operationType:"httpServer",routeType:t.httpServer.routePrefix?"routePrefix":"route",route:t.httpServer.route||t.httpServer.routePrefix||"",serverAddress:"",method:t.httpServer.method||"",kafkaTopic:""}:t.httpClient?{operationType:"httpClient",routeType:t.httpClient.templatedPathPrefix?"routePrefix":"route",route:t.httpClient.templatedPath||t.httpClient.templatedPathPrefix||"",serverAddress:t.httpClient.serverAddress||"",method:t.httpClient.method||"",kafkaTopic:""}:{operationType:"all",routeType:"route",route:"",serverAddress:"",method:"",kafkaTopic:""}:{operationType:"all",routeType:"route",route:"",serverAddress:"",method:"",kafkaTopic:""}})(e),a=k(u=e.rule.percentageAtMost)?{percentageMode:"all",percentagePreset:"0",customPercentage:""}:H(u);break;case"highlyRelevant":o=K(e.rule.operation),a=H(e.rule.percentageAtLeast),s=(e=>{if(null==e)return{durationPreset:"500",customDurationMs:""};const t=N.find(t=>Number(t)===e);return t?{durationPreset:t,customDurationMs:""}:{durationPreset:"custom",customDurationMs:String(e)}})(e.rule.durationAtLeastMs),i=e.rule.error;break;case"costReduction":o=K(e.rule.operation),a=H(e.rule.percentageAtMost)}var u;return{...t,name:e.rule.name||"",notes:e.rule.notes||"",disabled:e.rule.disabled,ruleType:n,sourceScopes:r,...o,...s,keepErrors:i,...a}}const z=s({platformType:c.K8s,tier:l.Community,version:"v0.0.0"}),F=({children:t,platformType:r,tier:n,version:a})=>{const s=o(()=>({platformType:r,tier:n,version:a}),[r,n,a]);return e(z.Provider,{value:s,children:t})},J=(e,t)=>null==e?0:"number"==typeof e||"string"==typeof e?e:t?e[t]??0:0,V=(e,t,r)=>{const n=J(t,r);return!n||u(e)>=u(n)},B=e=>{const t=a(z),r=J(e,t.platformType),n=V(t.version,r),o=t.platformType===c.K8s,s=t.platformType===c.Vm,i=t.platformType===c.Connector,u=t.platformType===c.AwsEcs;return{...t,isVersionSupported:n,minSupportedVersion:r,isK8s:o,isVm:s,isConnector:i,isAwsEcs:u,isEnterprise:t.tier===l.Onprem}};var W;(e=>{e.Noisy="noisy",e.HighlyRelevant="highly-relevant",e.CostReduction="cost-reduction"})(W||(W={}));const _=[{value:W.Noisy,label:"1. Noisy Operations",tooltip:"Rules that reduce noise from high-volume, low-value operations"},{value:W.HighlyRelevant,label:"2. Highly Relevant Operations",tooltip:"Rules that prioritize important traces for retention"},{value:W.CostReduction,label:"3. Cost Reduction",tooltip:"Rules that optimize costs by sampling less critical data"}],q={[W.Noisy]:"This is the most efficient way to sample (with Head Sampling). Prefer to use it where possible.",[W.HighlyRelevant]:'Any trace from the "Noisy Operations" category is sampled prior to checking highly relevance.',[W.CostReduction]:"Cost reduction rules use Tail Sampling to drop traces that are unlikely to be useful for debugging or monitoring."},G={[W.Noisy]:"Noisy Operations rules list",[W.HighlyRelevant]:"Highly Relevant Operations rules list",[W.CostReduction]:"Cost Reduction rules list"},Q={[W.Noisy]:"noisy",[W.HighlyRelevant]:"highlyRelevant",[W.CostReduction]:"costReduction"},U={noisy:W.Noisy,highlyRelevant:W.HighlyRelevant,costReduction:W.CostReduction};function X(e){const t=e.kind?String(e.kind).toLowerCase():"deployment";return e.namespace&&e.name?`${t} '${e.name}' in namespace '${e.namespace}'`:e.name?`${t} '${e.name}'`:e.namespace?`any service in namespace '${e.namespace}'`:""}function Y(e){return`any service in namespace '${e}'`}function Z(e){return`${e} services`}function ee(e,t="global"){const r=(e=>{if(!e)return[];const t=[];for(const r of e.sources??[]){const e=X(r);e&&t.push(e)}for(const r of e.namespaces??[])r&&t.push(Y(r));for(const r of e.languages??[])r&&t.push(Z(r));return t})(e);if(!r.length)return"source"===t?[]:[{text:" in ",variant:d.Default},{text:"any service in the cluster",variant:d.Scope}];const n=[{text:" in ",variant:d.Default}],o=r.slice(0,2),a=r.slice(2);return o.forEach((e,t)=>{t>0&&n.push({text:", ",variant:d.Default}),n.push({text:e,variant:d.Scope})}),a.length>0&&n.push({text:` + ${a.length} more`,variant:d.Default,tooltipItems:a}),n}function te(e,t){const r=(n=e).startsWith("/")?n.slice(1):n;var n;return t?`${t} /${r}`:`/${r}`}function re(e){const t=e.method;return e.route?[{text:" for server endpoint ",variant:d.Default},{text:te(e.route,t),variant:d.Endpoint}]:e.routePrefix?[{text:" for endpoints under ",variant:d.Default},{text:te(e.routePrefix,t),variant:d.Endpoint}]:[]}function ne(e,t="global"){const r=[];if(k(e.percentageAtMost)?r.push({text:"Drop all traces",variant:d.Action}):(r.push({text:`Keep at most ${e.percentageAtMost}%`,variant:d.Action}),r.push({text:" of traces",variant:d.Default})),e.operation){const t=e.operation.httpServer,n=t?(e=>{const t=e.method;return e.route?[{text:" where the root span is ",variant:d.Default},{text:te(e.route,t),variant:d.Endpoint}]:e.routePrefix?[{text:" where the root span is under ",variant:d.Default},{text:te(e.routePrefix,t),variant:d.Endpoint}]:[]})(t):[];n.length>0&&r.push(...n);const o=e.operation.httpClient,a=o?.templatedPath||o?.templatedPathPrefix,s=o?.serverAddress;if((a||s)&&0===n.length){const e=o?.method;if(r.push({text:" to ",variant:d.Default}),a){const t=te(a,e);s&&(r.push({text:"server address ",variant:d.Default}),r.push({text:s,variant:d.Endpoint}),r.push({text:" ",variant:d.Default})),r.push({text:t,variant:d.Endpoint})}else s&&(r.push({text:"server address ",variant:d.Default}),r.push({text:s,variant:d.Endpoint}))}}else r.push({text:" on ",variant:d.Default}),r.push({text:"any operation",variant:d.Endpoint});return r.push(...ee(e.sourceScopes,t)),r}function oe(e,t="global"){const r=[];if(null!=e.percentageAtLeast?(r.push({text:`Keep ${e.percentageAtLeast}%`,variant:d.Action}),r.push({text:" of traces",variant:d.Default})):r.push({text:"Keep all traces",variant:d.Action}),e.operation){const t=e.operation.httpServer;t&&r.push(...re(t))}else r.push({text:" on ",variant:d.Default}),r.push({text:"any operation",variant:d.Endpoint});return r.push(...ee(e.sourceScopes,t)),!e.error&&null!=e.durationAtLeastMs&&e.durationAtLeastMs>0&&(r.push({text:" with duration > ",variant:d.Default}),r.push({text:`${e.durationAtLeastMs}ms`,variant:d.Duration})),r}function ae(e,t="global"){const r=[];if(r.push({text:`Keep at most ${e.percentageAtMost}%`,variant:d.Action}),r.push({text:" of traces",variant:d.Default}),e.operation){const t=e.operation.httpServer,n=t?re(t):[];n.length>0&&r.push(...n);const o=e.operation.kafkaConsumer?.kafkaTopic;o&&0===n.length&&(r.push({text:" from ",variant:d.Default}),r.push({text:`topic '${o}'`,variant:d.Endpoint}))}else r.push({text:" on ",variant:d.Default}),r.push({text:"any operation",variant:d.Endpoint});return r.push(...ee(e.sourceScopes,t)),r}function se(e){return e.error?"Error":null!=e.durationAtLeastMs?"Duration":"Relevance"}function ie(e,t,r){const n=Q[t],o=[];for(const a of e)switch(t){case W.Noisy:for(const e of a.noisyOperations)r?.has(e.ruleId)||o.push({ruleId:e.ruleId,samplingId:a.id,name:e.name??null,disabled:e.disabled,notes:e.notes??null,summary:ne(e),category:n});break;case W.HighlyRelevant:for(const e of a.highlyRelevantOperations)r?.has(e.ruleId)||o.push({ruleId:e.ruleId,samplingId:a.id,name:e.name??null,disabled:e.disabled,notes:e.notes??null,summary:oe(e),category:n,typeBadge:se(e)});break;case W.CostReduction:for(const e of a.costReductionRules)r?.has(e.ruleId)||o.push({ruleId:e.ruleId,samplingId:a.id,name:e.name??null,disabled:e.disabled,notes:e.notes??null,summary:ae(e),category:n})}return o}function ue(e,t){switch(e){case"noisy":return ne(t);case"highlyRelevant":return oe(t);case"costReduction":return ae(t)}}function le(e,t,r,n){for(const o of e)if(o.id===t)switch(n){case"noisy":{const e=o.noisyOperations.find(e=>e.ruleId===r);if(e)return{category:"noisy",samplingId:o.id,rule:e};break}case"highlyRelevant":{const e=o.highlyRelevantOperations.find(e=>e.ruleId===r);if(e)return{category:"highlyRelevant",samplingId:o.id,rule:e};break}case"costReduction":{const e=o.costReductionRules.find(e=>e.ruleId===r);if(e)return{category:"costReduction",samplingId:o.id,rule:e};break}}return null}function ce(e,t){const r=le(e,t.samplingId,t.rule.ruleId,t.category);return r?{...r,summary:ue(r.category,r.rule)}:null}function pe(e,t){const r=le(e,t.samplingId,t.ruleId,t.category);return r?{...r,summary:ue(r.category,r.rule)}:null}function de(e,t,r){for(const n of e){const o=le(e,n.id,t,r);if(o)return{...o,summary:ue(o.category,o.rule)}}return null}function fe(e){if(!e)return null;const t=(e.sources??[]).map(e=>`${e.namespace}/${e.kind}/${e.name}`).sort(),r=(e.namespaces??[]).slice().sort(),n=(e.languages??[]).slice().sort();return t.length||r.length||n.length?[t.join("|"),r.join("|"),n.join("|")].join("::"):null}function he(e){return null==e?null:e}function me(e,t){return JSON.stringify({sourceScopes:fe(e),operation:he(t)})}function ve(e,t,r,n){return JSON.stringify({sourceScopes:fe(e),error:t??!1,durationAtLeastMs:(o=r,null==o?null:o),operation:he(n)});var o}function ge(e,t){return JSON.stringify({sourceScopes:fe(e),operation:he(t)})}function ye(e,t,r,n){switch(t){case"noisy":{const t=me(r.sourceScopes,r.operation);for(const r of e)for(const e of r.noisyOperations)if((!n||e.ruleId!==n)&&me(e.sourceScopes,e.operation)===t)return e.ruleId;return null}case"highlyRelevant":{const t=ve(r.sourceScopes,r.error,r.durationAtLeastMs,r.operation);for(const r of e)for(const e of r.highlyRelevantOperations)if((!n||e.ruleId!==n)&&ve(e.sourceScopes,e.error,e.durationAtLeastMs,e.operation)===t)return e.ruleId;return null}case"costReduction":{const t=ge(r.sourceScopes,r.operation);for(const r of e)for(const e of r.costReductionRules)if((!n||e.ruleId!==n)&&ge(e.sourceScopes,e.operation)===t)return e.ruleId;return null}}}function xe(e){return e&&e.enabled?[{text:`Keep ${e.keepPercentage??0}%`,variant:d.Action},{text:" of ",variant:d.Default},{text:"traces for kubelet health probes in the entire cluster",variant:d.Scope}]:[{text:"Auto rule is ",variant:d.Default},{text:"disabled",variant:d.Action}]}function ke(e){return!0===e.error&&y(e.sourceScopes)&&!e.operation&&(null==e.percentageAtLeast||100===e.percentageAtLeast)}function Te(e){for(const t of e){const e=t.highlyRelevantOperations.find(ke);if(e)return{rule:e,samplingId:t.id}}return null}function Ae(e){return!e||e.disabled?[{text:"Auto rule is ",variant:d.Default},{text:"disabled",variant:d.Action}]:[{text:"Keep all traces",variant:d.Action},{text:" of ",variant:d.Default},{text:"error traces across the entire cluster",variant:d.Scope}]}function Se(e){return y(e.sourceScopes)&&!e.operation}function Re(e){for(const t of e){const e=t.costReductionRules.find(Se);if(e)return{rule:e,samplingId:t.id}}return null}function Pe(e){return!e||e.disabled?[{text:" is ",variant:d.Default},{text:"disabled",variant:d.Action}]:[{text:`Keep at most ${e.percentageAtMost}%`,variant:d.Action},{text:" of ",variant:d.Default},{text:"traces across the entire cluster",variant:d.Scope}]}export{w as A,E as B,v as C,pe as D,ue as E,Q as F,ye as G,_ as H,q as I,G as J,F as O,U as R,W as S,d as a,ee as b,V as c,k as d,ae as e,oe as f,ne as g,$ as h,y as i,C as j,M as k,Ae as l,g as m,x as n,Pe as o,xe as p,T as q,J as r,de as s,Te as t,B as u,j as v,Re as w,ce as x,ie as y,L as z};
|