@industry-theme/principal-view-panels 0.12.91 → 0.12.92

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.
@@ -1,6 +1,13 @@
1
1
  import React from 'react';
2
2
  import type { PanelComponentProps } from '@principal-ade/panel-framework-core';
3
- import type { MetricSource, DiscoveredCanvas, DataProvider } from '@principal-ai/principal-view-core';
3
+ import type { MetricSource, DiscoveredCanvas, DiscoveredStoryboard, DiscoveredWorkflow, WorkflowTemplate, DataProvider } from '@principal-ai/principal-view-core';
4
+ /**
5
+ * Workflow with its loaded template, used for navigation from source links.
6
+ */
7
+ export interface LoadedWorkflow {
8
+ file: DiscoveredWorkflow;
9
+ template: WorkflowTemplate;
10
+ }
4
11
  export interface DashboardPanelProps extends PanelComponentProps {
5
12
  /**
6
13
  * The discovered dashboard to display.
@@ -14,6 +21,17 @@ export interface DashboardPanelProps extends PanelComponentProps {
14
21
  * For testing with sample data, pass MockDataProvider from @principal-ai/principal-view-react.
15
22
  */
16
23
  dataProvider?: DataProvider;
24
+ /**
25
+ * Discovered storyboards for navigating from source links to workflows.
26
+ * When provided, clicking a source link will emit an 'openCanvas' event
27
+ * with the matching storyboard and workflow.
28
+ */
29
+ storyboards?: DiscoveredStoryboard[];
30
+ /**
31
+ * Loaded workflows with their templates, for navigating from source links.
32
+ * Used to include the full workflow template in the 'openCanvas' event.
33
+ */
34
+ workflows?: LoadedWorkflow[];
17
35
  /**
18
36
  * Callback when a metric source link is clicked.
19
37
  * Use this to navigate to the referenced workflow/canvas.
@@ -1 +1 @@
1
- {"version":3,"file":"DashboardPanel.d.ts","sourceRoot":"","sources":["../../src/panels/DashboardPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AACjF,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qCAAqC,CAAC;AAI/E,OAAO,KAAK,EAEV,YAAY,EAGZ,gBAAgB,EAChB,YAAY,EAEb,MAAM,mCAAmC,CAAC;AAsB3C,MAAM,WAAW,mBAAoB,SAAQ,mBAAmB;IAC9D;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAE5C;;;;OAIG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;IAE5B;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAE/C;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAgNxD,CAAC"}
1
+ {"version":3,"file":"DashboardPanel.d.ts","sourceRoot":"","sources":["../../src/panels/DashboardPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AACjF,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qCAAqC,CAAC;AAI/E,OAAO,KAAK,EAEV,YAAY,EAGZ,gBAAgB,EAChB,oBAAoB,EACpB,kBAAkB,EAClB,gBAAgB,EAChB,YAAY,EAEb,MAAM,mCAAmC,CAAC;AAsB3C;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,kBAAkB,CAAC;IACzB,QAAQ,EAAE,gBAAgB,CAAC;CAC5B;AAED,MAAM,WAAW,mBAAoB,SAAQ,mBAAmB;IAC9D;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAE5C;;;;OAIG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;IAE5B;;;;OAIG;IACH,WAAW,CAAC,EAAE,oBAAoB,EAAE,CAAC;IAErC;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,EAAE,CAAC;IAE7B;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAE/C;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAyQxD,CAAC"}
@@ -182723,7 +182723,7 @@ function MetricPanel({ metric, data, onMetricClick, onSourceClick }) {
182723
182723
  }, children: jsx("span", { style: { color: theme2.colors.textSecondary, fontSize: theme2.fontSizes[1] }, children: "Loading..." }) });
182724
182724
  }
182725
182725
  if (data.error) {
182726
- return jsxs("div", { style: {
182726
+ return jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [jsxs("div", { style: {
182727
182727
  backgroundColor: theme2.colors.surface || theme2.colors.background,
182728
182728
  border: `1px solid ${theme2.colors.error}`,
182729
182729
  borderRadius: ((_c = theme2.radii) == null ? void 0 : _c[2]) || 8,
@@ -182734,7 +182734,7 @@ function MetricPanel({ metric, data, onMetricClick, onSourceClick }) {
182734
182734
  marginBottom: ((_e4 = theme2.space) == null ? void 0 : _e4[2]) || 8,
182735
182735
  fontSize: theme2.fontSizes[1],
182736
182736
  fontWeight: theme2.fontWeights.medium
182737
- }, children: metric.name }), jsx("div", { style: { color: theme2.colors.textSecondary, fontSize: theme2.fontSizes[0] }, children: data.error })] });
182737
+ }, children: metric.name }), jsx("div", { style: { color: theme2.colors.textSecondary, fontSize: theme2.fontSizes[0] }, children: data.error })] }), metric.sources && metric.sources.length > 0 && onSourceClick && jsx("div", { style: { display: "flex", gap: 8, flexWrap: "wrap" }, children: metric.sources.map((source2, i) => jsx(SourceLink, { source: source2, onClick: onSourceClick }, i)) })] });
182738
182738
  }
182739
182739
  const handleClick = () => {
182740
182740
  onMetricClick == null ? void 0 : onMetricClick(metric.id);
@@ -206088,6 +206088,8 @@ const DashboardPanel = ({
206088
206088
  events,
206089
206089
  selectedDashboard,
206090
206090
  dataProvider,
206091
+ storyboards,
206092
+ workflows,
206091
206093
  onSourceClick,
206092
206094
  onMetricClick
206093
206095
  }) => {
@@ -206132,21 +206134,64 @@ const DashboardPanel = ({
206132
206134
  (source2) => {
206133
206135
  if (onSourceClick) {
206134
206136
  onSourceClick(source2);
206135
- } else if (events == null ? void 0 : events.emit) {
206137
+ return;
206138
+ }
206139
+ if (!(events == null ? void 0 : events.emit)) return;
206140
+ const matchingStoryboard = storyboards == null ? void 0 : storyboards.find(
206141
+ (sb) => sb.basename === source2.storyboard || sb.name === source2.storyboard
206142
+ );
206143
+ if (matchingStoryboard) {
206144
+ const matchingWorkflowMeta = matchingStoryboard.workflows.find(
206145
+ (wf) => wf.name === source2.workflow || wf.id.endsWith(`/${source2.workflow}`)
206146
+ );
206147
+ if (matchingWorkflowMeta) {
206148
+ const fullWorkflow = workflows == null ? void 0 : workflows.find(
206149
+ (wf) => wf.file.path === matchingWorkflowMeta.path
206150
+ );
206151
+ events.emit({
206152
+ type: "custom",
206153
+ source: "dashboard-panel",
206154
+ timestamp: Date.now(),
206155
+ payload: {
206156
+ action: "openCanvas",
206157
+ canvasId: matchingStoryboard.canvas.id,
206158
+ canvas: matchingStoryboard.canvas,
206159
+ workflowId: matchingWorkflowMeta.id,
206160
+ workflow: fullWorkflow == null ? void 0 : fullWorkflow.template,
206161
+ openMode: "detail",
206162
+ // Include source info for potential node/event highlighting
206163
+ sourceNodes: source2.nodes,
206164
+ sourceEvent: source2.event
206165
+ }
206166
+ });
206167
+ return;
206168
+ }
206136
206169
  events.emit({
206137
- type: "dashboard:source-click",
206170
+ type: "custom",
206138
206171
  source: "dashboard-panel",
206139
206172
  timestamp: Date.now(),
206140
206173
  payload: {
206141
- source: source2,
206142
- storyboard: source2.storyboard,
206143
- workflow: source2.workflow,
206144
- nodes: source2.nodes
206174
+ action: "openCanvas",
206175
+ canvasId: matchingStoryboard.canvas.id,
206176
+ canvas: matchingStoryboard.canvas,
206177
+ openMode: "editor"
206145
206178
  }
206146
206179
  });
206180
+ return;
206147
206181
  }
206182
+ events.emit({
206183
+ type: "dashboard:source-click",
206184
+ source: "dashboard-panel",
206185
+ timestamp: Date.now(),
206186
+ payload: {
206187
+ source: source2,
206188
+ storyboard: source2.storyboard,
206189
+ workflow: source2.workflow,
206190
+ nodes: source2.nodes
206191
+ }
206192
+ });
206148
206193
  },
206149
- [onSourceClick, events]
206194
+ [onSourceClick, events, storyboards, workflows]
206150
206195
  );
206151
206196
  const handleMetricClick = useCallback(
206152
206197
  (metricId) => {