@burdenoff/microfe-bigconsole 2026.716.4 → 2026.717.1
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/dist/bigconsole/BigConsoleRoot.js +8 -8
- package/dist/bigconsole/components/dashboard/DashboardCanvas.js +24 -24
- package/dist/bigconsole/components/preview/AiPreviewContent.js +116 -0
- package/dist/bigconsole/components/preview/AiPreviewContent.js.map +1 -0
- package/dist/bigconsole/components/preview/AiPreviewPanel.js +82 -151
- package/dist/bigconsole/components/preview/AiPreviewPanel.js.map +1 -1
- package/dist/bigconsole/components/preview/previewShared.js +13 -23
- package/dist/bigconsole/components/preview/previewShared.js.map +1 -1
- package/dist/bigconsole/components/widgets/PropertiesPanel.js +9 -9
- package/dist/bigconsole/hooks/index.js +5 -5
- package/dist/bigconsole/hooks/useWidgetCatalog.js +11 -11
- package/dist/bigconsole/index.js +1 -1
- package/dist/bigconsole/pages/DashboardBuilderPage.js +3 -3
- package/dist/bigconsole/pages/DashboardViewPage.js +3 -3
- package/dist/bigconsole/pages/DataSinkViewPage.js +18 -18
- package/dist/bigconsole/pages/DataSinkViewPage.js.map +1 -1
- package/dist/index.js +3 -3
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AiPreviewPanel.js","names":[],"sources":["../../../../src/bigconsole/components/preview/AiPreviewPanel.tsx"],"sourcesContent":["/**\n * AI Preview — watch the assistant build.\n *\n * Opens by itself the moment a prompt starts, and shows the DataSink → Dashboard\n * → Parser → Widget chain filling in live: a step rail driven by the agent's own\n * narration, and four tabs listing the real entities as they land.\n *\n * Why polling and not a subscription: the four entity types have no working\n * GraphQL subscriptions (DataSink's are declared in the SDL but have no\n * resolvers; the others have none at all). The same 3.5s poll is already used by\n * DashboardViewPage for exactly this reason. Note the real freshness floor is\n * fe-libs' ~15s shared read cache, not this interval.\n */\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport { Badge, Button, Tabs, TabsContent, TabsList, TabsTrigger } from '@burdenoff/fe-libs/ui';\nimport { Loader2, Sparkles, X } from 'lucide-react';\n\nimport { PREVIEW_STEPS, type PreviewStepKey, useAssistantRunStore } from '../../assistant/assistantRunStore';\nimport { useBigConsoleNavigate } from '../../context';\nimport { useDashboardOperations } from '../../hooks/useDashboardOperations';\nimport { useDataSinkOperations } from '../../hooks/useDataSinkOperations';\nimport { useParserOperations } from '../../hooks/useParserOperations';\nimport { useWidgetOperations } from '../../hooks/useWidgetOperations';\nimport { EmptyOrLoading, StepRail, formatAgo, useAssistantSidebarWidth } from './previewShared';\n\n/** Matches DashboardViewPage's live cadence. */\nconst LIVE_POLL_MS = 3500;\n/** Keep polling briefly after the turn ends — the last write can land late. */\nconst TRAILING_POLL_MS = 30_000;\n/** Parsers are listed per console; a console IS a dashboard. */\nconst DEFAULT_CONSOLE_ID = 'default';\n\ninterface RowProps {\n id: string;\n title: string;\n meta?: string;\n isNew: boolean;\n onOpen?: () => void;\n}\n\nfunction EntityRow({ id, title, meta, isNew, onOpen }: RowProps) {\n return (\n <div\n data-testid=\"ai-preview-row\"\n data-entity-id={id}\n className={[\n 'flex items-center justify-between gap-3 rounded-md border px-3 py-2',\n isNew ? 'border-status-success-border bg-status-success-bg/30' : 'border-border-subtle bg-bg-surface',\n ].join(' ')}\n >\n <div className=\"min-w-0\">\n <p className=\"truncate text-sm font-medium text-text-primary\">{title}</p>\n {meta ? <p className=\"truncate text-xs text-text-muted\">{meta}</p> : null}\n </div>\n <div className=\"flex shrink-0 items-center gap-2\">\n {isNew ? (\n <Badge className=\"bg-status-success-bg text-status-success-text\">\n <Sparkles className=\"mr-1 size-3\" />\n just built\n </Badge>\n ) : null}\n {onOpen ? (\n <Button size=\"sm\" variant=\"ghost\" onClick={onOpen}>\n Open\n </Button>\n ) : null}\n </div>\n </div>\n );\n}\n\nexport function AiPreviewPanel() {\n const navigate = useBigConsoleNavigate();\n\n const isRunning = useAssistantRunStore((state) => state.isRunning);\n const previewOpen = useAssistantRunStore((state) => state.previewOpen);\n const hasRun = useAssistantRunStore((state) => state.hasRun);\n const steps = useAssistantRunStore((state) => state.steps);\n const entityIds = useAssistantRunStore((state) => state.entityIds);\n const caption = useAssistantRunStore((state) => state.caption);\n const error = useAssistantRunStore((state) => state.error);\n const updatedAt = useAssistantRunStore((state) => state.updatedAt);\n const openPreview = useAssistantRunStore((state) => state.openPreview);\n const closePreview = useAssistantRunStore((state) => state.closePreview);\n const setRichMounted = useAssistantRunStore((state) => state.setRichMounted);\n\n // Tell the app-shell mini panel to stand down while this full panel is on a\n // /bigconsole page. On unmount (e.g. navigating to /workflows mid-run) this\n // flips false and the mini panel takes over so the build stays visible.\n useEffect(() => {\n setRichMounted(true);\n return () => setRichMounted(false);\n }, [setRichMounted]);\n\n const [tab, setTab] = useState<PreviewStepKey>('datasink');\n const [now, setNow] = useState(() => Date.now());\n\n const dashboardId = entityIds.dashboard;\n\n // The panel does its own fetching, so the tabs are live even before the user\n // opens them — the \"just built\" highlight must be right the instant they look.\n const sinks = useDataSinkOperations({ skipFetch: true });\n const dashboards = useDashboardOperations();\n const parsers = useParserOperations({ consoleId: dashboardId ?? DEFAULT_CONSOLE_ID, skipFetch: true });\n const widgets = useWidgetOperations(undefined, dashboardId, { skipFetch: !dashboardId });\n\n const refetchRef = useRef({\n sinks: sinks.refetch,\n dashboards: dashboards.refetch,\n parsers: parsers.refetch,\n widgets: widgets.refetch,\n });\n refetchRef.current = {\n sinks: sinks.refetch,\n dashboards: dashboards.refetch,\n parsers: parsers.refetch,\n widgets: widgets.refetch,\n };\n\n // Follow the build. Keeps polling for a short while after the turn settles so\n // the final widget does not miss the panel by a second.\n useEffect(() => {\n if (!hasRun) return;\n\n let stopAt = Number.POSITIVE_INFINITY;\n if (!isRunning) stopAt = Date.now() + TRAILING_POLL_MS;\n\n const poll = () => {\n if (typeof document !== 'undefined' && document.visibilityState !== 'visible') return;\n if (Date.now() > stopAt) return;\n void refetchRef.current.sinks();\n void refetchRef.current.dashboards();\n if (dashboardId) {\n void refetchRef.current.parsers();\n void refetchRef.current.widgets();\n }\n setNow(Date.now());\n };\n\n poll();\n const intervalId = window.setInterval(poll, LIVE_POLL_MS);\n const onVisible = () => {\n if (document.visibilityState === 'visible') poll();\n };\n document.addEventListener('visibilitychange', onVisible);\n return () => {\n window.clearInterval(intervalId);\n document.removeEventListener('visibilitychange', onVisible);\n };\n }, [hasRun, isRunning, dashboardId]);\n\n // Jump the user to whatever is being worked on, so they are not left staring\n // at the Data Sinks tab while the parser is the thing actually happening.\n useEffect(() => {\n const active = PREVIEW_STEPS.find((key) => steps[key] === 'running');\n if (active) setTab(active);\n }, [steps]);\n\n const agoSeconds = updatedAt ? Math.max(0, Math.floor((now - updatedAt) / 1000)) : 0;\n\n // Keep clear of the assistant.\n //\n // The assistant sidebar is `position: fixed` — it OVERLAYS the page instead of\n // reflowing it. A panel that spans the full content width therefore runs\n // underneath it, and everything in that overlapped strip (tabs, Open buttons)\n // silently stops taking clicks. Measure the real element rather than hardcoding\n // 560px: the widget is responsive, and it can be closed mid-run.\n const assistantWidth = useAssistantSidebarWidth();\n\n const sinkRows = useMemo(() => sinks.dataSinks.slice(0, 25), [sinks.dataSinks]);\n const dashboardRows = useMemo(() => dashboards.dashboards.slice(0, 25), [dashboards.dashboards]);\n const parserRows = useMemo(() => parsers.parsers.slice(0, 25), [parsers.parsers]);\n const widgetRows = useMemo(() => widgets.widgets.slice(0, 25), [widgets.widgets]);\n\n if (!hasRun) return null;\n\n if (!previewOpen) {\n return (\n <div className=\"flex justify-end px-4 pt-3 md:px-6\" style={{ marginRight: assistantWidth }}>\n <Button size=\"sm\" variant=\"outline\" onClick={openPreview} data-testid=\"ai-preview-open\">\n <Sparkles className=\"mr-1.5 size-4\" />\n Preview\n {isRunning ? <Loader2 className=\"ml-1.5 size-3.5 animate-spin\" /> : null}\n </Button>\n </div>\n );\n }\n\n return (\n <section\n data-testid=\"ai-preview-panel\"\n aria-label=\"AI preview\"\n style={{ marginRight: assistantWidth ? assistantWidth + 16 : undefined }}\n className=\"mx-4 mt-3 overflow-hidden rounded-lg border border-border-default bg-bg-sunken shadow-sm md:mx-6\"\n >\n {/* Header + live strip */}\n <div className=\"flex items-center justify-between gap-3 border-b border-border-subtle bg-bg-surface px-3 py-2\">\n <div className=\"flex min-w-0 items-center gap-2\">\n <Sparkles className=\"size-4 shrink-0 text-action-primary-bg\" />\n <h2 className=\"truncate text-sm font-semibold text-text-primary\">AI Preview</h2>\n {isRunning ? (\n <span\n className=\"inline-flex items-center gap-1.5 rounded-full bg-status-success-bg px-2 py-0.5 text-[11px] font-semibold uppercase tracking-wide text-status-success-text\"\n data-testid=\"ai-preview-live\"\n >\n <span className=\"relative flex size-2\">\n <span className=\"absolute inline-flex size-full animate-ping rounded-full bg-status-success-text opacity-75\" />\n <span className=\"relative inline-flex size-2 rounded-full bg-status-success-text\" />\n </span>\n Live\n </span>\n ) : null}\n <span className=\"truncate text-xs text-text-muted\" data-testid=\"ai-preview-ago\">\n {isRunning ? (caption ? caption : 'Working…') : error ? 'Stopped' : 'Done'} · updated{' '}\n {formatAgo(agoSeconds)}\n </span>\n </div>\n <Button\n size=\"sm\"\n variant=\"ghost\"\n onClick={closePreview}\n aria-label=\"Close preview\"\n data-testid=\"ai-preview-close\"\n >\n <X className=\"size-4\" />\n </Button>\n </div>\n\n {/* Step rail */}\n <div className=\"border-b border-border-subtle px-3 py-2\">\n <StepRail steps={steps} />\n </div>\n\n {/* Tabs */}\n <Tabs value={tab} onValueChange={(value) => setTab(value as PreviewStepKey)}>\n <TabsList className=\"mx-3 mt-2\">\n <TabsTrigger value=\"datasink\" data-testid=\"ai-preview-tab-datasink\">\n Data Sinks\n </TabsTrigger>\n <TabsTrigger value=\"dashboard\" data-testid=\"ai-preview-tab-dashboard\">\n Dashboards\n </TabsTrigger>\n <TabsTrigger value=\"parser\" data-testid=\"ai-preview-tab-parser\">\n Parsers\n </TabsTrigger>\n <TabsTrigger value=\"widget\" data-testid=\"ai-preview-tab-widget\">\n Widgets\n </TabsTrigger>\n </TabsList>\n\n <div className=\"max-h-[320px] overflow-y-auto p-3\">\n <TabsContent value=\"datasink\" className=\"space-y-2\">\n {sinkRows.length === 0 ? (\n <EmptyOrLoading loading={sinks.loading} empty=\"No data sinks yet.\" />\n ) : (\n sinkRows.map((sink) => (\n <EntityRow\n key={sink.id}\n id={sink.id}\n title={sink.name ?? sink.key}\n meta={sink.status}\n isNew={sink.id === entityIds.datasink}\n onOpen={() => navigate(`/datasinks/${sink.id}`)}\n />\n ))\n )}\n </TabsContent>\n\n <TabsContent value=\"dashboard\" className=\"space-y-2\">\n {dashboardRows.length === 0 ? (\n <EmptyOrLoading loading={dashboards.loading} empty=\"No dashboards yet.\" />\n ) : (\n dashboardRows.map((dashboard) => (\n <EntityRow\n key={dashboard.id}\n id={dashboard.id}\n title={dashboard.name}\n meta={`${String(dashboard.widgetCount ?? 0)} widget(s)`}\n isNew={dashboard.id === entityIds.dashboard}\n onOpen={() => navigate(`/dashboards/${dashboard.id}`)}\n />\n ))\n )}\n </TabsContent>\n\n <TabsContent value=\"parser\" className=\"space-y-2\">\n {!dashboardId ? (\n <p className=\"px-1 py-6 text-sm text-text-muted\">\n Parsers are listed per dashboard — waiting for the dashboard to be created.\n </p>\n ) : parserRows.length === 0 ? (\n <EmptyOrLoading loading={parsers.loading} empty=\"No parsers on this dashboard yet.\" />\n ) : (\n parserRows.map((parser) => (\n <EntityRow\n key={parser.id}\n id={parser.id}\n title={parser.name}\n meta={`${parser.type} · ${parser.status}`}\n isNew={parser.id === entityIds.parser}\n onOpen={() => navigate(`/parsers/${parser.id}`)}\n />\n ))\n )}\n </TabsContent>\n\n <TabsContent value=\"widget\" className=\"space-y-2\">\n {!dashboardId ? (\n <p className=\"px-1 py-6 text-sm text-text-muted\">\n Widgets live on a dashboard — waiting for the dashboard to be created.\n </p>\n ) : widgetRows.length === 0 ? (\n <EmptyOrLoading loading={widgets.loading} empty=\"No widgets on this dashboard yet.\" />\n ) : (\n widgetRows.map((widget) => (\n <EntityRow\n key={widget.id}\n id={widget.id}\n title={widget.title}\n meta={widget.type}\n // A widget has no link of its own in the narration, so the most\n // recent one on the dashboard being built is the new one.\n isNew={widget.id === widgetRows[widgetRows.length - 1]?.id && steps.widget === 'done'}\n onOpen={() => navigate(`/dashboards/${dashboardId}`)}\n />\n ))\n )}\n </TabsContent>\n </div>\n </Tabs>\n\n {error ? (\n <p\n className=\"border-t border-border-subtle px-3 py-2 text-xs text-status-error-text\"\n data-testid=\"ai-preview-error\"\n >\n {error}\n </p>\n ) : null}\n </section>\n );\n}\n\nexport default AiPreviewPanel;\n"],"mappings":";;;;;;;;;;;;;AA0BA,IAAM,IAAe,MAEf,IAAmB,KAEnB,IAAqB;AAU3B,SAAS,EAAU,EAAE,OAAI,UAAO,SAAM,UAAO,aAAoB;AAC/D,QACE,kBAAC,OAAD;EACE,eAAY;EACZ,kBAAgB;EAChB,WAAW,CACT,uEACA,IAAQ,yDAAyD,qCAClE,CAAC,KAAK,IAAI;YANb,CAQE,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,KAAD;IAAG,WAAU;cAAkD;IAAU,CAAA,EACxE,IAAO,kBAAC,KAAD;IAAG,WAAU;cAAoC;IAAS,CAAA,GAAG,KACjE;MACN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACG,IACC,kBAAC,GAAD;IAAO,WAAU;cAAjB,CACE,kBAAC,GAAD,EAAU,WAAU,eAAgB,CAAA,EAAA,aAE9B;QACN,MACH,IACC,kBAAC,GAAD;IAAQ,MAAK;IAAK,SAAQ;IAAQ,SAAS;cAAQ;IAE1C,CAAA,GACP,KACA;KACF;;;AAIV,SAAgB,IAAiB;CAC/B,IAAM,IAAW,GAAuB,EAElC,IAAY,GAAsB,MAAU,EAAM,UAAU,EAC5D,IAAc,GAAsB,MAAU,EAAM,YAAY,EAChE,IAAS,GAAsB,MAAU,EAAM,OAAO,EACtD,IAAQ,GAAsB,MAAU,EAAM,MAAM,EACpD,IAAY,GAAsB,MAAU,EAAM,UAAU,EAC5D,IAAU,GAAsB,MAAU,EAAM,QAAQ,EACxD,IAAQ,GAAsB,MAAU,EAAM,MAAM,EACpD,IAAY,GAAsB,MAAU,EAAM,UAAU,EAC5D,IAAc,GAAsB,MAAU,EAAM,YAAY,EAChE,IAAe,GAAsB,MAAU,EAAM,aAAa,EAClE,IAAiB,GAAsB,MAAU,EAAM,eAAe;AAK5E,UACE,EAAe,GAAK,QACP,EAAe,GAAM,GACjC,CAAC,EAAe,CAAC;CAEpB,IAAM,CAAC,GAAK,KAAU,EAAyB,WAAW,EACpD,CAAC,GAAK,KAAU,QAAe,KAAK,KAAK,CAAC,EAE1C,IAAc,EAAU,WAIxB,IAAQ,EAAsB,EAAE,WAAW,IAAM,CAAC,EAClD,IAAa,GAAwB,EACrC,IAAU,EAAoB;EAAE,WAAW,KAAe;EAAoB,WAAW;EAAM,CAAC,EAChG,IAAU,EAAoB,KAAA,GAAW,GAAa,EAAE,WAAW,CAAC,GAAa,CAAC,EAElF,IAAa,EAAO;EACxB,OAAO,EAAM;EACb,YAAY,EAAW;EACvB,SAAS,EAAQ;EACjB,SAAS,EAAQ;EAClB,CAAC;AA0CF,CAzCA,EAAW,UAAU;EACnB,OAAO,EAAM;EACb,YAAY,EAAW;EACvB,SAAS,EAAQ;EACjB,SAAS,EAAQ;EAClB,EAID,QAAgB;AACd,MAAI,CAAC,EAAQ;EAEb,IAAI,IAAS;AACb,EAAK,MAAW,IAAS,KAAK,KAAK,GAAG;EAEtC,IAAM,UAAa;AACb,UAAO,WAAa,OAAe,SAAS,oBAAoB,aAChE,KAAK,KAAK,GAAG,MACZ,EAAW,QAAQ,OAAO,EAC1B,EAAW,QAAQ,YAAY,EAChC,MACG,EAAW,QAAQ,SAAS,EAC5B,EAAW,QAAQ,SAAS,GAEnC,EAAO,KAAK,KAAK,CAAC;;AAGpB,KAAM;EACN,IAAM,IAAa,OAAO,YAAY,GAAM,EAAa,EACnD,UAAkB;AACtB,GAAI,SAAS,oBAAoB,aAAW,GAAM;;AAGpD,SADA,SAAS,iBAAiB,oBAAoB,EAAU,QAC3C;AAEX,GADA,OAAO,cAAc,EAAW,EAChC,SAAS,oBAAoB,oBAAoB,EAAU;;IAE5D;EAAC;EAAQ;EAAW;EAAY,CAAC,EAIpC,QAAgB;EACd,IAAM,IAAS,EAAc,MAAM,MAAQ,EAAM,OAAS,UAAU;AACpE,EAAI,KAAQ,EAAO,EAAO;IACzB,CAAC,EAAM,CAAC;CAEX,IAAM,IAAa,IAAY,KAAK,IAAI,GAAG,KAAK,OAAO,IAAM,KAAa,IAAK,CAAC,GAAG,GAS7E,IAAiB,IAA0B,EAE3C,IAAW,QAAc,EAAM,UAAU,MAAM,GAAG,GAAG,EAAE,CAAC,EAAM,UAAU,CAAC,EACzE,IAAgB,QAAc,EAAW,WAAW,MAAM,GAAG,GAAG,EAAE,CAAC,EAAW,WAAW,CAAC,EAC1F,IAAa,QAAc,EAAQ,QAAQ,MAAM,GAAG,GAAG,EAAE,CAAC,EAAQ,QAAQ,CAAC,EAC3E,IAAa,QAAc,EAAQ,QAAQ,MAAM,GAAG,GAAG,EAAE,CAAC,EAAQ,QAAQ,CAAC;AAgBjF,QAdK,IAEA,IAaH,kBAAC,WAAD;EACE,eAAY;EACZ,cAAW;EACX,OAAO,EAAE,aAAa,IAAiB,IAAiB,KAAK,KAAA,GAAW;EACxE,WAAU;YAJZ;GAOE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,GAAD,EAAU,WAAU,0CAA2C,CAAA;MAC/D,kBAAC,MAAD;OAAI,WAAU;iBAAmD;OAAe,CAAA;MAC/E,IACC,kBAAC,QAAD;OACE,WAAU;OACV,eAAY;iBAFd,CAIE,kBAAC,QAAD;QAAM,WAAU;kBAAhB,CACE,kBAAC,QAAD,EAAM,WAAU,8FAA+F,CAAA,EAC/G,kBAAC,QAAD,EAAM,WAAU,mEAAoE,CAAA,CAC/E;kBAEF;WACL;MACJ,kBAAC,QAAD;OAAM,WAAU;OAAmC,eAAY;iBAA/D;QACG,IAAa,KAAoB,aAAc,IAAQ,YAAY;QAAO;QAAW;QACrF,EAAU,EAAW;QACjB;;MACH;QACN,kBAAC,GAAD;KACE,MAAK;KACL,SAAQ;KACR,SAAS;KACT,cAAW;KACX,eAAY;eAEZ,kBAAC,GAAD,EAAG,WAAU,UAAW,CAAA;KACjB,CAAA,CACL;;GAGN,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,IAAD,EAAiB,UAAS,CAAA;IACtB,CAAA;GAGN,kBAAC,IAAD;IAAM,OAAO;IAAK,gBAAgB,MAAU,EAAO,EAAwB;cAA3E,CACE,kBAAC,GAAD;KAAU,WAAU;eAApB;MACE,kBAAC,GAAD;OAAa,OAAM;OAAW,eAAY;iBAA0B;OAEtD,CAAA;MACd,kBAAC,GAAD;OAAa,OAAM;OAAY,eAAY;iBAA2B;OAExD,CAAA;MACd,kBAAC,GAAD;OAAa,OAAM;OAAS,eAAY;iBAAwB;OAElD,CAAA;MACd,kBAAC,GAAD;OAAa,OAAM;OAAS,eAAY;iBAAwB;OAElD,CAAA;MACL;QAEX,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,GAAD;OAAa,OAAM;OAAW,WAAU;iBACrC,EAAS,WAAW,IACnB,kBAAC,GAAD;QAAgB,SAAS,EAAM;QAAS,OAAM;QAAuB,CAAA,GAErE,EAAS,KAAK,MACZ,kBAAC,GAAD;QAEE,IAAI,EAAK;QACT,OAAO,EAAK,QAAQ,EAAK;QACzB,MAAM,EAAK;QACX,OAAO,EAAK,OAAO,EAAU;QAC7B,cAAc,EAAS,cAAc,EAAK,KAAK;QAC/C,EANK,EAAK,GAMV,CACF;OAEQ,CAAA;MAEd,kBAAC,GAAD;OAAa,OAAM;OAAY,WAAU;iBACtC,EAAc,WAAW,IACxB,kBAAC,GAAD;QAAgB,SAAS,EAAW;QAAS,OAAM;QAAuB,CAAA,GAE1E,EAAc,KAAK,MACjB,kBAAC,GAAD;QAEE,IAAI,EAAU;QACd,OAAO,EAAU;QACjB,MAAM,GAAG,OAAO,EAAU,eAAe,EAAE,CAAC;QAC5C,OAAO,EAAU,OAAO,EAAU;QAClC,cAAc,EAAS,eAAe,EAAU,KAAK;QACrD,EANK,EAAU,GAMf,CACF;OAEQ,CAAA;MAEd,kBAAC,GAAD;OAAa,OAAM;OAAS,WAAU;iBAClC,IAIE,EAAW,WAAW,IACxB,kBAAC,GAAD;QAAgB,SAAS,EAAQ;QAAS,OAAM;QAAsC,CAAA,GAEtF,EAAW,KAAK,MACd,kBAAC,GAAD;QAEE,IAAI,EAAO;QACX,OAAO,EAAO;QACd,MAAM,GAAG,EAAO,KAAK,KAAK,EAAO;QACjC,OAAO,EAAO,OAAO,EAAU;QAC/B,cAAc,EAAS,YAAY,EAAO,KAAK;QAC/C,EANK,EAAO,GAMZ,CACF,GAfF,kBAAC,KAAD;QAAG,WAAU;kBAAoC;QAE7C,CAAA;OAeM,CAAA;MAEd,kBAAC,GAAD;OAAa,OAAM;OAAS,WAAU;iBAClC,IAIE,EAAW,WAAW,IACxB,kBAAC,GAAD;QAAgB,SAAS,EAAQ;QAAS,OAAM;QAAsC,CAAA,GAEtF,EAAW,KAAK,MACd,kBAAC,GAAD;QAEE,IAAI,EAAO;QACX,OAAO,EAAO;QACd,MAAM,EAAO;QAGb,OAAO,EAAO,OAAO,EAAW,EAAW,SAAS,IAAI,MAAM,EAAM,WAAW;QAC/E,cAAc,EAAS,eAAe,IAAc;QACpD,EARK,EAAO,GAQZ,CACF,GAjBF,kBAAC,KAAD;QAAG,WAAU;kBAAoC;QAE7C,CAAA;OAiBM,CAAA;MACV;OACD;;GAEN,IACC,kBAAC,KAAD;IACE,WAAU;IACV,eAAY;cAEX;IACC,CAAA,GACF;GACI;MAjKR,kBAAC,OAAD;EAAK,WAAU;EAAqC,OAAO,EAAE,aAAa,GAAgB;YACxF,kBAAC,GAAD;GAAQ,MAAK;GAAK,SAAQ;GAAU,SAAS;GAAa,eAAY;aAAtE;IACE,kBAAC,GAAD,EAAU,WAAU,iBAAkB,CAAA;;IAErC,IAAY,kBAAC,GAAD,EAAS,WAAU,gCAAiC,CAAA,GAAG;IAC7D;;EACL,CAAA,GAVU"}
|
|
1
|
+
{"version":3,"file":"AiPreviewPanel.js","names":[],"sources":["../../../../src/bigconsole/components/preview/AiPreviewPanel.tsx"],"sourcesContent":["/**\n * AI Preview — watch the assistant build, with the real content inline.\n *\n * Opens by itself the moment a prompt starts. A step rail (driven by the agent's\n * own narration) shows DataSink → Dashboard → Parser → Widget filling in, and\n * the four tabs show the ACTUAL content of each entity as it lands — the data\n * sink's rows, the live dashboard, the parser's transformed output, the rendered\n * widget charts — not a list of links. The tab auto-switches to whatever step is\n * being worked on, and each tab has an \"Open\" button (top-right) that jumps to\n * the real page.\n *\n * The content renderers need Apollo + the BigConsole providers, which is why\n * this full panel lives inside BigConsoleRoot; the store-only app-shell mini\n * panel (AiPreviewMiniPanel) keeps the lighter link view for other pages.\n */\nimport { useEffect, useState } from 'react';\nimport { Button, Tabs, TabsContent, TabsList, TabsTrigger } from '@burdenoff/fe-libs/ui';\nimport { ArrowUpRight, Loader2, Sparkles, X } from 'lucide-react';\n\nimport { PREVIEW_STEPS, type PreviewStepKey, useAssistantRunStore } from '../../assistant/assistantRunStore';\nimport { useBigConsoleNavigate } from '../../context';\nimport { StepRail, formatAgo, useAssistantSidebarWidth } from './previewShared';\nimport { DashboardContent, DataSinkContent, ParserContent, WidgetsContent } from './AiPreviewContent';\n\n/** A tab's top bar: what this tab is, plus a jump-to-the-real-page button. */\nfunction TabHeader({ label, onOpen }: { label: string; onOpen?: () => void }) {\n return (\n <div className=\"mb-2 flex items-center justify-between gap-2\">\n <span className=\"text-xs font-semibold uppercase tracking-wide text-text-muted\">{label}</span>\n {onOpen ? (\n <Button size=\"sm\" variant=\"outline\" onClick={onOpen} data-testid=\"ai-preview-open-entity\">\n Open\n <ArrowUpRight className=\"ml-1 size-3.5\" />\n </Button>\n ) : null}\n </div>\n );\n}\n\nexport function AiPreviewPanel() {\n const navigate = useBigConsoleNavigate();\n\n const isRunning = useAssistantRunStore((state) => state.isRunning);\n const previewOpen = useAssistantRunStore((state) => state.previewOpen);\n const hasRun = useAssistantRunStore((state) => state.hasRun);\n const steps = useAssistantRunStore((state) => state.steps);\n const entityIds = useAssistantRunStore((state) => state.entityIds);\n const caption = useAssistantRunStore((state) => state.caption);\n const error = useAssistantRunStore((state) => state.error);\n const updatedAt = useAssistantRunStore((state) => state.updatedAt);\n const openPreview = useAssistantRunStore((state) => state.openPreview);\n const closePreview = useAssistantRunStore((state) => state.closePreview);\n const setRichMounted = useAssistantRunStore((state) => state.setRichMounted);\n\n // Tell the app-shell mini panel to stand down while this full panel is on a\n // /bigconsole page. On unmount (e.g. navigating to /workflows mid-run) this\n // flips false and the mini panel takes over so the build stays visible.\n useEffect(() => {\n setRichMounted(true);\n return () => setRichMounted(false);\n }, [setRichMounted]);\n\n const [tab, setTab] = useState<PreviewStepKey>('datasink');\n const [now, setNow] = useState(() => Date.now());\n\n const dashboardId = entityIds.dashboard;\n\n // Tick the \"updated Xs ago\" label while a turn is live.\n useEffect(() => {\n if (!isRunning) return;\n const intervalId = window.setInterval(() => setNow(Date.now()), 1000);\n return () => window.clearInterval(intervalId);\n }, [isRunning]);\n\n // Jump the user to whatever is being worked on, so they are not left staring\n // at the Data Sinks tab while the parser is the thing actually happening.\n useEffect(() => {\n const active = PREVIEW_STEPS.find((key) => steps[key] === 'running');\n if (active) setTab(active);\n }, [steps]);\n\n const agoSeconds = updatedAt ? Math.max(0, Math.floor((now - updatedAt) / 1000)) : 0;\n\n // Keep clear of the assistant.\n //\n // The assistant sidebar is `position: fixed` — it OVERLAYS the page instead of\n // reflowing it. A panel that spans the full content width therefore runs\n // underneath it, and everything in that overlapped strip (tabs, Open buttons)\n // silently stops taking clicks. Measure the real element rather than hardcoding\n // 560px: the widget is responsive, and it can be closed mid-run.\n const assistantWidth = useAssistantSidebarWidth();\n\n if (!hasRun) return null;\n\n if (!previewOpen) {\n return (\n <div className=\"flex justify-end px-4 pt-3 md:px-6\" style={{ marginRight: assistantWidth }}>\n <Button size=\"sm\" variant=\"outline\" onClick={openPreview} data-testid=\"ai-preview-open\">\n <Sparkles className=\"mr-1.5 size-4\" />\n Preview\n {isRunning ? <Loader2 className=\"ml-1.5 size-3.5 animate-spin\" /> : null}\n </Button>\n </div>\n );\n }\n\n return (\n <section\n data-testid=\"ai-preview-panel\"\n aria-label=\"AI preview\"\n style={{ marginRight: assistantWidth ? assistantWidth + 16 : undefined }}\n className=\"mx-4 mt-3 overflow-hidden rounded-lg border border-border-default bg-bg-sunken shadow-sm md:mx-6\"\n >\n {/* Header + live strip */}\n <div className=\"flex items-center justify-between gap-3 border-b border-border-subtle bg-bg-surface px-3 py-2\">\n <div className=\"flex min-w-0 items-center gap-2\">\n <Sparkles className=\"size-4 shrink-0 text-action-primary-bg\" />\n <h2 className=\"truncate text-sm font-semibold text-text-primary\">AI Preview</h2>\n {isRunning ? (\n <span\n className=\"inline-flex items-center gap-1.5 rounded-full bg-status-success-bg px-2 py-0.5 text-[11px] font-semibold uppercase tracking-wide text-status-success-text\"\n data-testid=\"ai-preview-live\"\n >\n <span className=\"relative flex size-2\">\n <span className=\"absolute inline-flex size-full animate-ping rounded-full bg-status-success-text opacity-75\" />\n <span className=\"relative inline-flex size-2 rounded-full bg-status-success-text\" />\n </span>\n Live\n </span>\n ) : null}\n <span className=\"truncate text-xs text-text-muted\" data-testid=\"ai-preview-ago\">\n {isRunning ? (caption ? caption : 'Working…') : error ? 'Stopped' : 'Done'} · updated{' '}\n {formatAgo(agoSeconds)}\n </span>\n </div>\n <Button\n size=\"sm\"\n variant=\"ghost\"\n onClick={closePreview}\n aria-label=\"Close preview\"\n data-testid=\"ai-preview-close\"\n >\n <X className=\"size-4\" />\n </Button>\n </div>\n\n {/* Step rail */}\n <div className=\"border-b border-border-subtle px-3 py-2\">\n <StepRail steps={steps} />\n </div>\n\n {/* Tabs — each shows the real content of the built entity */}\n <Tabs value={tab} onValueChange={(value) => setTab(value as PreviewStepKey)}>\n <TabsList className=\"mx-3 mt-2\">\n <TabsTrigger value=\"datasink\" data-testid=\"ai-preview-tab-datasink\">\n Data Sink\n </TabsTrigger>\n <TabsTrigger value=\"dashboard\" data-testid=\"ai-preview-tab-dashboard\">\n Dashboard\n </TabsTrigger>\n <TabsTrigger value=\"parser\" data-testid=\"ai-preview-tab-parser\">\n Parser\n </TabsTrigger>\n <TabsTrigger value=\"widget\" data-testid=\"ai-preview-tab-widget\">\n Widget\n </TabsTrigger>\n </TabsList>\n\n <div className=\"max-h-[440px] overflow-y-auto p-3\">\n <TabsContent value=\"datasink\">\n <TabHeader\n label=\"Data Sink\"\n onOpen={entityIds.datasink ? () => navigate(`/datasinks/${entityIds.datasink}`) : undefined}\n />\n <DataSinkContent id={entityIds.datasink} live={isRunning} />\n </TabsContent>\n\n <TabsContent value=\"dashboard\">\n <TabHeader\n label=\"Dashboard\"\n onOpen={entityIds.dashboard ? () => navigate(`/dashboards/${entityIds.dashboard}`) : undefined}\n />\n <DashboardContent dashboardId={entityIds.dashboard} />\n </TabsContent>\n\n <TabsContent value=\"parser\">\n <TabHeader\n label=\"Parser\"\n onOpen={entityIds.parser ? () => navigate(`/parsers/${entityIds.parser}`) : undefined}\n />\n <ParserContent parserId={entityIds.parser} live={isRunning} />\n </TabsContent>\n\n <TabsContent value=\"widget\">\n <TabHeader label=\"Widget\" onOpen={dashboardId ? () => navigate(`/dashboards/${dashboardId}`) : undefined} />\n <WidgetsContent dashboardId={dashboardId} live={isRunning} />\n </TabsContent>\n </div>\n </Tabs>\n\n {error ? (\n <p\n className=\"border-t border-border-subtle px-3 py-2 text-xs text-status-error-text\"\n data-testid=\"ai-preview-error\"\n >\n {error}\n </p>\n ) : null}\n </section>\n );\n}\n\nexport default AiPreviewPanel;\n"],"mappings":"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"}
|
|
@@ -1,47 +1,37 @@
|
|
|
1
1
|
import { PREVIEW_STEPS as e, PREVIEW_STEP_LABEL as t } from "../../assistant/assistantRunStore.js";
|
|
2
2
|
import { useEffect as n, useState as r } from "react";
|
|
3
3
|
import { Check as i, ChevronRight as a, Loader2 as o, Minus as s } from "lucide-react";
|
|
4
|
-
import {
|
|
5
|
-
import { jsx as l, jsxs as u } from "react/jsx-runtime";
|
|
4
|
+
import { jsx as c, jsxs as l } from "react/jsx-runtime";
|
|
6
5
|
//#region src/bigconsole/components/preview/previewShared.tsx
|
|
7
|
-
function
|
|
8
|
-
return e === "done" ? /* @__PURE__ */
|
|
6
|
+
function u({ status: e }) {
|
|
7
|
+
return e === "done" ? /* @__PURE__ */ c(i, { className: "size-3.5 text-status-success-text" }) : e === "running" ? /* @__PURE__ */ c(o, { className: "size-3.5 animate-spin text-action-primary-bg" }) : e === "skipped" ? /* @__PURE__ */ c(s, { className: "size-3.5 text-text-muted" }) : /* @__PURE__ */ c("span", { className: "size-1.5 rounded-full bg-border-strong" });
|
|
9
8
|
}
|
|
10
|
-
function
|
|
11
|
-
return /* @__PURE__ */
|
|
9
|
+
function d({ steps: n }) {
|
|
10
|
+
return /* @__PURE__ */ c("div", {
|
|
12
11
|
className: "flex flex-wrap items-center gap-1",
|
|
13
12
|
"data-testid": "ai-preview-step-rail",
|
|
14
|
-
children: e.map((r, i) => /* @__PURE__ */
|
|
13
|
+
children: e.map((r, i) => /* @__PURE__ */ l("div", {
|
|
15
14
|
className: "flex items-center gap-1",
|
|
16
|
-
children: [/* @__PURE__ */
|
|
15
|
+
children: [/* @__PURE__ */ l("span", {
|
|
17
16
|
"data-testid": `ai-preview-step-${r}`,
|
|
18
17
|
"data-status": n[r],
|
|
19
18
|
className: ["inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-xs font-medium", n[r] === "done" ? "border-status-success-border bg-status-success-bg text-status-success-text" : n[r] === "running" ? "border-border-strong bg-bg-surface text-text-primary" : "border-border-default text-text-muted"].join(" "),
|
|
20
19
|
children: [
|
|
21
|
-
/* @__PURE__ */
|
|
20
|
+
/* @__PURE__ */ c(u, { status: n[r] }),
|
|
22
21
|
t[r],
|
|
23
|
-
n[r] === "skipped" ? /* @__PURE__ */
|
|
22
|
+
n[r] === "skipped" ? /* @__PURE__ */ c("span", {
|
|
24
23
|
className: "text-[10px]",
|
|
25
24
|
children: "skipped"
|
|
26
25
|
}) : null
|
|
27
26
|
]
|
|
28
|
-
}), i < e.length - 1 ? /* @__PURE__ */
|
|
27
|
+
}), i < e.length - 1 ? /* @__PURE__ */ c(a, { className: "size-3.5 text-text-muted" }) : null]
|
|
29
28
|
}, r))
|
|
30
29
|
});
|
|
31
30
|
}
|
|
32
|
-
function
|
|
31
|
+
function f(e) {
|
|
33
32
|
return e < 5 ? "just now" : e < 60 ? `${String(e)}s ago` : `${String(Math.floor(e / 60))}m ago`;
|
|
34
33
|
}
|
|
35
|
-
function
|
|
36
|
-
return e ? /* @__PURE__ */ u("div", {
|
|
37
|
-
className: "flex items-center gap-2 px-1 py-6 text-sm text-text-muted",
|
|
38
|
-
children: [/* @__PURE__ */ l(c, { className: "size-4" }), "Loading…"]
|
|
39
|
-
}) : /* @__PURE__ */ l("p", {
|
|
40
|
-
className: "px-1 py-6 text-sm text-text-muted",
|
|
41
|
-
children: t
|
|
42
|
-
});
|
|
43
|
-
}
|
|
44
|
-
function h() {
|
|
34
|
+
function p() {
|
|
45
35
|
let [e, t] = r(0);
|
|
46
36
|
return n(() => {
|
|
47
37
|
let e = () => {
|
|
@@ -56,6 +46,6 @@ function h() {
|
|
|
56
46
|
}, []), e;
|
|
57
47
|
}
|
|
58
48
|
//#endregion
|
|
59
|
-
export {
|
|
49
|
+
export { d as StepRail, f as formatAgo, p as useAssistantSidebarWidth };
|
|
60
50
|
|
|
61
51
|
//# sourceMappingURL=previewShared.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"previewShared.js","names":[],"sources":["../../../../src/bigconsole/components/preview/previewShared.tsx"],"sourcesContent":["/**\n * Presentational bits shared by the two AI-preview surfaces:\n * - AiPreviewPanel — the full panel with live entity tabs, mounted inside\n * BigConsoleRoot (needs the BigConsole Apollo context).\n * - AiPreviewMiniPanel — the lightweight, store-only panel mounted by the app\n * shell so the build stays visible on ANY page.\n *\n * Nothing here touches Apollo, React Query, or BigConsole context — it is pure\n * store-shape + DOM, which is exactly why the mini panel can live in the app\n * shell without dragging the data layer along.\n */\nimport { useEffect, useState } from 'react';\nimport {
|
|
1
|
+
{"version":3,"file":"previewShared.js","names":[],"sources":["../../../../src/bigconsole/components/preview/previewShared.tsx"],"sourcesContent":["/**\n * Presentational bits shared by the two AI-preview surfaces:\n * - AiPreviewPanel — the full panel with live entity tabs, mounted inside\n * BigConsoleRoot (needs the BigConsole Apollo context).\n * - AiPreviewMiniPanel — the lightweight, store-only panel mounted by the app\n * shell so the build stays visible on ANY page.\n *\n * Nothing here touches Apollo, React Query, or BigConsole context — it is pure\n * store-shape + DOM, which is exactly why the mini panel can live in the app\n * shell without dragging the data layer along.\n */\nimport { useEffect, useState } from 'react';\nimport { Check, ChevronRight, Loader2, Minus } from 'lucide-react';\n\nimport {\n PREVIEW_STEP_LABEL,\n PREVIEW_STEPS,\n type PreviewStepKey,\n type PreviewStepStatus,\n} from '../../assistant/assistantRunStore';\n\nexport function StepPip({ status }: { status: PreviewStepStatus }) {\n if (status === 'done') return <Check className=\"size-3.5 text-status-success-text\" />;\n if (status === 'running') return <Loader2 className=\"size-3.5 animate-spin text-action-primary-bg\" />;\n if (status === 'skipped') return <Minus className=\"size-3.5 text-text-muted\" />;\n return <span className=\"size-1.5 rounded-full bg-border-strong\" />;\n}\n\nexport function StepRail({ steps }: { steps: Record<PreviewStepKey, PreviewStepStatus> }) {\n return (\n <div className=\"flex flex-wrap items-center gap-1\" data-testid=\"ai-preview-step-rail\">\n {PREVIEW_STEPS.map((key, index) => (\n <div key={key} className=\"flex items-center gap-1\">\n <span\n data-testid={`ai-preview-step-${key}`}\n data-status={steps[key]}\n className={[\n 'inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-xs font-medium',\n steps[key] === 'done'\n ? 'border-status-success-border bg-status-success-bg text-status-success-text'\n : steps[key] === 'running'\n ? 'border-border-strong bg-bg-surface text-text-primary'\n : 'border-border-default text-text-muted',\n ].join(' ')}\n >\n <StepPip status={steps[key]} />\n {PREVIEW_STEP_LABEL[key]}\n {steps[key] === 'skipped' ? <span className=\"text-[10px]\">skipped</span> : null}\n </span>\n {index < PREVIEW_STEPS.length - 1 ? <ChevronRight className=\"size-3.5 text-text-muted\" /> : null}\n </div>\n ))}\n </div>\n );\n}\n\nexport function formatAgo(seconds: number): string {\n if (seconds < 5) return 'just now';\n if (seconds < 60) return `${String(seconds)}s ago`;\n return `${String(Math.floor(seconds / 60))}m ago`;\n}\n\n/**\n * Width of the assistant sidebar, or 0 when it is closed.\n *\n * Polled rather than subscribed: the widget lives in fe-libs, is mounted by the\n * app shell, and emits nothing when it opens or closes. Reading the DOM is the\n * only honest signal available, and it is cheap.\n */\nexport function useAssistantSidebarWidth(): number {\n const [width, setWidth] = useState(0);\n\n useEffect(() => {\n const measure = () => {\n const el = document.querySelector('[data-testid=\"assistant-widget-window\"][data-layout=\"sidebar\"]');\n const rect = el?.getBoundingClientRect();\n // Below `sm` the sidebar is full-width; reserving that would leave no room\n // for the preview at all, so on small screens let it stack underneath.\n const next = rect && rect.width < window.innerWidth * 0.75 ? Math.round(rect.width) : 0;\n setWidth((current) => (current === next ? current : next));\n };\n measure();\n const intervalId = window.setInterval(measure, 500);\n window.addEventListener('resize', measure);\n return () => {\n window.clearInterval(intervalId);\n window.removeEventListener('resize', measure);\n };\n }, []);\n\n return width;\n}\n"],"mappings":";;;;;AAqBA,SAAgB,EAAQ,EAAE,aAAyC;AAIjE,QAHI,MAAW,SAAe,kBAAC,GAAD,EAAO,WAAU,qCAAsC,CAAA,GACjF,MAAW,YAAkB,kBAAC,GAAD,EAAS,WAAU,gDAAiD,CAAA,GACjG,MAAW,YAAkB,kBAAC,GAAD,EAAO,WAAU,4BAA6B,CAAA,GACxE,kBAAC,QAAD,EAAM,WAAU,0CAA2C,CAAA;;AAGpE,SAAgB,EAAS,EAAE,YAA+D;AACxF,QACE,kBAAC,OAAD;EAAK,WAAU;EAAoC,eAAY;YAC5D,EAAc,KAAK,GAAK,MACvB,kBAAC,OAAD;GAAe,WAAU;aAAzB,CACE,kBAAC,QAAD;IACE,eAAa,mBAAmB;IAChC,eAAa,EAAM;IACnB,WAAW,CACT,wFACA,EAAM,OAAS,SACX,+EACA,EAAM,OAAS,YACb,yDACA,wCACP,CAAC,KAAK,IAAI;cAVb;KAYE,kBAAC,GAAD,EAAS,QAAQ,EAAM,IAAQ,CAAA;KAC9B,EAAmB;KACnB,EAAM,OAAS,YAAY,kBAAC,QAAD;MAAM,WAAU;gBAAc;MAAc,CAAA,GAAG;KACtE;OACN,IAAQ,EAAc,SAAS,IAAI,kBAAC,GAAD,EAAc,WAAU,4BAA6B,CAAA,GAAG,KACxF;KAlBI,EAkBJ,CACN;EACE,CAAA;;AAIV,SAAgB,EAAU,GAAyB;AAGjD,QAFI,IAAU,IAAU,aACpB,IAAU,KAAW,GAAG,OAAO,EAAQ,CAAC,SACrC,GAAG,OAAO,KAAK,MAAM,IAAU,GAAG,CAAC,CAAC;;AAU7C,SAAgB,IAAmC;CACjD,IAAM,CAAC,GAAO,KAAY,EAAS,EAAE;AAoBrC,QAlBA,QAAgB;EACd,IAAM,UAAgB;GAEpB,IAAM,IADK,SAAS,cAAc,qEAAiE,EAClF,uBAAuB,EAGlC,IAAO,KAAQ,EAAK,QAAQ,OAAO,aAAa,MAAO,KAAK,MAAM,EAAK,MAAM,GAAG;AACtF,MAAU,MAAa,MAAY,IAAO,IAAU,EAAM;;AAE5D,KAAS;EACT,IAAM,IAAa,OAAO,YAAY,GAAS,IAAI;AAEnD,SADA,OAAO,iBAAiB,UAAU,EAAQ,QAC7B;AAEX,GADA,OAAO,cAAc,EAAW,EAChC,OAAO,oBAAoB,UAAU,EAAQ;;IAE9C,EAAE,CAAC,EAEC"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { useWidgetStore as e } from "../../store/widgetStore.js";
|
|
2
2
|
import "../../store/index.js";
|
|
3
|
-
import t from "
|
|
4
|
-
import n from "../../hooks/
|
|
5
|
-
import r from "../../hooks/
|
|
6
|
-
import
|
|
7
|
-
import a from "../../hooks/
|
|
8
|
-
import o from "../../hooks/
|
|
3
|
+
import { getWidgetDefinition as t } from "./WidgetRegistry.js";
|
|
4
|
+
import n from "../../hooks/useWidgetOperations.js";
|
|
5
|
+
import r from "../../hooks/useDrilldownOperations.js";
|
|
6
|
+
import i from "../../hooks/useWidgetActions.js";
|
|
7
|
+
import a from "../../hooks/useDataSinkOperations.js";
|
|
8
|
+
import o from "../../hooks/useParserOperations.js";
|
|
9
9
|
import "../../hooks/index.js";
|
|
10
10
|
import { getWidgetBinding as s, getWidgetBindingStatus as c, serializeWidgetBinding as ee } from "../../utils/widgetBinding.js";
|
|
11
11
|
import te from "./ActionConfigDialog.js";
|
|
@@ -339,14 +339,14 @@ var je = l(function({ isOpen: l, onClose: m }) {
|
|
|
339
339
|
z,
|
|
340
340
|
F
|
|
341
341
|
]);
|
|
342
|
-
let { updateWidget: Pe } =
|
|
342
|
+
let { updateWidget: Pe } = n(z?.pageId, z?.dashboardId, { skipFetch: !0 }), { createDrilldown: Fe, updateDrilldown: Ie, deleteDrilldown: Le } = r(), { dataSinks: V } = a({ skipFetch: !1 }), [Re, H] = f(null), { executeParser: ze } = o({
|
|
343
343
|
consoleId: z?.dashboardId,
|
|
344
344
|
skipFetch: !0
|
|
345
345
|
}), [Be, U] = f(!1), [Ve, W] = f(void 0), [He, G] = f(!1), [Ue, K] = f(null);
|
|
346
346
|
d(() => {
|
|
347
347
|
W(void 0), G(!1), K(null), U(!1);
|
|
348
348
|
}, [L]);
|
|
349
|
-
let { actions: q, loading: J, createAction: We, updateAction: Ge, deleteAction: Ke, reorderActions: Y } =
|
|
349
|
+
let { actions: q, loading: J, createAction: We, updateAction: Ge, deleteAction: Ke, reorderActions: Y } = i(L || void 0), [qe, X] = f(!1), [Je, Z] = f(void 0), [Ye, Xe] = f(!1), Ze = u(() => {
|
|
350
350
|
Z(void 0), X(!0);
|
|
351
351
|
}, []), Qe = u((e) => {
|
|
352
352
|
Z(e), X(!0);
|
|
@@ -570,7 +570,7 @@ var je = l(function({ isOpen: l, onClose: m }) {
|
|
|
570
570
|
...t,
|
|
571
571
|
drilldownConfig: e
|
|
572
572
|
}), I(!0);
|
|
573
|
-
}, []), lt = z ?
|
|
573
|
+
}, []), lt = z ? t(z.type) : null;
|
|
574
574
|
return /* @__PURE__ */ k(_e, {
|
|
575
575
|
open: l,
|
|
576
576
|
onOpenChange: (e) => !e && m(),
|
|
@@ -1,15 +1,13 @@
|
|
|
1
1
|
import "./useCrossFilter.js";
|
|
2
2
|
import "./useWorkflowOperations.js";
|
|
3
|
-
import "./useDashboardOperations.js";
|
|
4
|
-
import "./useDataSinkOperations.js";
|
|
5
|
-
import "./useParserOperations.js";
|
|
6
|
-
import "./useBigConsoleAnalytics.js";
|
|
7
|
-
import "./useWidgetOperations.js";
|
|
8
3
|
import "./useWidgetData.js";
|
|
9
4
|
import "./useWidgetCatalog.js";
|
|
10
5
|
import "./useAutoRefresh.js";
|
|
6
|
+
import "./useBigConsoleAnalytics.js";
|
|
7
|
+
import "./useWidgetOperations.js";
|
|
11
8
|
import "./useWidgetComments.js";
|
|
12
9
|
import "./useWidgetConfigPersist.js";
|
|
10
|
+
import "./useDashboardOperations.js";
|
|
13
11
|
import "./useWidgetExport.js";
|
|
14
12
|
import "./useDashboardImageExport.js";
|
|
15
13
|
import "./useDrilldown.js";
|
|
@@ -20,6 +18,8 @@ import "./useExportDashboard.js";
|
|
|
20
18
|
import "./useImportDashboard.js";
|
|
21
19
|
import "./useEventWebhooks.js";
|
|
22
20
|
import "./useEventLogs.js";
|
|
21
|
+
import "./useDataSinkOperations.js";
|
|
22
|
+
import "./useParserOperations.js";
|
|
23
23
|
import "./usePipelineOperations.js";
|
|
24
24
|
import "./useGlobalFilters.js";
|
|
25
25
|
import "./useDashboardSharing.js";
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import { GetWidgetTypesDocument as e } from "../../generated/wspace-operations.js";
|
|
2
|
-
import {
|
|
3
|
-
import
|
|
2
|
+
import t, { WIDGET_CATEGORY_LABELS as n, getAllWidgetDefinitions as r, getWidgetDefinition as i } from "../components/widgets/WidgetRegistry.js";
|
|
3
|
+
import { isFederationAccessible as a, mapFromFederationWidgetType as o } from "../utils/widgetTypeMapping.js";
|
|
4
4
|
import { useEffect as s, useMemo as c } from "react";
|
|
5
5
|
import { useQuery as l } from "@tanstack/react-query";
|
|
6
6
|
import { print as u } from "graphql";
|
|
7
7
|
//#region src/bigconsole/hooks/useWidgetCatalog.ts
|
|
8
|
-
var d = new Set(Object.keys(
|
|
8
|
+
var d = new Set(Object.keys(n)), f = "Puzzle", p = "Installed";
|
|
9
9
|
function m(e) {
|
|
10
10
|
let n = String(e).toLowerCase();
|
|
11
|
-
return Object.prototype.hasOwnProperty.call(
|
|
11
|
+
return Object.prototype.hasOwnProperty.call(t, n) || a(e);
|
|
12
12
|
}
|
|
13
13
|
function h(e) {
|
|
14
|
-
let
|
|
15
|
-
return Object.prototype.hasOwnProperty.call(
|
|
14
|
+
let n = String(e).toLowerCase();
|
|
15
|
+
return Object.prototype.hasOwnProperty.call(t, n) ? n : o(e);
|
|
16
16
|
}
|
|
17
17
|
function g(e) {
|
|
18
18
|
return {
|
|
@@ -53,7 +53,7 @@ function g(e) {
|
|
|
53
53
|
}
|
|
54
54
|
function _(e) {
|
|
55
55
|
if (!m(e.type)) return g(e);
|
|
56
|
-
let t = h(e.type), n =
|
|
56
|
+
let t = h(e.type), n = i(t), r = d.has(e.category) ? e.category : n.category;
|
|
57
57
|
return {
|
|
58
58
|
type: t,
|
|
59
59
|
name: e.label,
|
|
@@ -82,12 +82,12 @@ function _(e) {
|
|
|
82
82
|
};
|
|
83
83
|
}
|
|
84
84
|
function v(t = {}) {
|
|
85
|
-
let { workspaceId: n, apiGatewayUrl:
|
|
85
|
+
let { workspaceId: n, apiGatewayUrl: i, authToken: a, enabled: o = !0 } = t, { data: d, isLoading: f, error: p } = l({
|
|
86
86
|
queryKey: ["widgetCatalog", n],
|
|
87
87
|
queryFn: async () => {
|
|
88
88
|
let t = { "Content-Type": "application/json" };
|
|
89
|
-
n && (t["x-workspace-id"] = n),
|
|
90
|
-
let
|
|
89
|
+
n && (t["x-workspace-id"] = n), a && (t.Authorization = `Bearer ${a}`);
|
|
90
|
+
let r = i ? `${i}/workspaces/graphql` : "/workspaces/graphql", o = await fetch(r, {
|
|
91
91
|
method: "POST",
|
|
92
92
|
headers: t,
|
|
93
93
|
body: JSON.stringify({ query: u(e) })
|
|
@@ -108,7 +108,7 @@ function v(t = {}) {
|
|
|
108
108
|
loading: f,
|
|
109
109
|
error: p ?? void 0
|
|
110
110
|
} : {
|
|
111
|
-
definitions:
|
|
111
|
+
definitions: r(),
|
|
112
112
|
source: "static",
|
|
113
113
|
loading: f,
|
|
114
114
|
error: p ?? void 0
|
package/dist/bigconsole/index.js
CHANGED
|
@@ -2,9 +2,9 @@ import "./store/drilldownStore.js";
|
|
|
2
2
|
import "./store/index.js";
|
|
3
3
|
import "./context/BigConsoleContext.js";
|
|
4
4
|
import "./context/index.js";
|
|
5
|
-
import "./components/DrilldownModal.js";
|
|
6
5
|
import "./hooks/useDrilldown.js";
|
|
7
6
|
import "./hooks/index.js";
|
|
7
|
+
import "./components/DrilldownModal.js";
|
|
8
8
|
import "./BigConsoleRoot.js";
|
|
9
9
|
import "./AdminRoot.js";
|
|
10
10
|
import "./assistant/pageContext.js";
|
|
@@ -3,8 +3,8 @@ import { useDashboardStore as t } from "../store/dashboardStore.js";
|
|
|
3
3
|
import "../store/index.js";
|
|
4
4
|
import { useBigConsoleNavigate as n } from "../context/BigConsoleContext.js";
|
|
5
5
|
import "../context/index.js";
|
|
6
|
-
import r from "../hooks/
|
|
7
|
-
import i from "../hooks/
|
|
6
|
+
import r from "../hooks/useWidgetOperations.js";
|
|
7
|
+
import i from "../hooks/useDashboardOperations.js";
|
|
8
8
|
import a from "../hooks/usePageOperations.js";
|
|
9
9
|
import "../hooks/index.js";
|
|
10
10
|
import { BuilderCanvas as o } from "../components/builder/BuilderCanvas.js";
|
|
@@ -35,7 +35,7 @@ function x(e) {
|
|
|
35
35
|
t?.unregister && t.unregister(e);
|
|
36
36
|
}
|
|
37
37
|
var S = f(function() {
|
|
38
|
-
let { dashboardId: f } = g(), y = n(), [S, C] = h(!1), [w, T] = h(null), [E, D] = h(!1), [O, k] = h(null), { fetchDashboard: A, updateDashboard: j, loading: M, error: N } =
|
|
38
|
+
let { dashboardId: f } = g(), y = n(), [S, C] = h(!1), [w, T] = h(null), [E, D] = h(!1), [O, k] = h(null), { fetchDashboard: A, updateDashboard: j, loading: M, error: N } = i(), { createWidget: P, updateWidget: F, deleteWidget: I, duplicateWidget: L, batchUpdatePositions: R } = r(void 0, f), { createPage: z, updatePage: B, deletePage: V, reorderPages: H } = a(), U = t((e) => e.setCurrentDashboard), W = t((e) => e.currentDashboard), G = t((e) => e.setViewMode), K = e((e) => e.selectWidget), q = e((e) => e.widgets), J = e((e) => e.clipboardWidgetId), Y = e((e) => e.clipboardAction), X = e((e) => e.clearClipboard);
|
|
39
39
|
m(() => (G("edit"), () => G("view")), [G]), m(() => {
|
|
40
40
|
if (!f) {
|
|
41
41
|
y("/dashboards");
|
|
@@ -3,8 +3,8 @@ import { useDashboardStore as t } from "../store/dashboardStore.js";
|
|
|
3
3
|
import "../store/index.js";
|
|
4
4
|
import { useBigConsoleNavigate as n } from "../context/BigConsoleContext.js";
|
|
5
5
|
import "../context/index.js";
|
|
6
|
-
import r from "../hooks/
|
|
7
|
-
import i from "../hooks/
|
|
6
|
+
import r from "../hooks/useWidgetOperations.js";
|
|
7
|
+
import i from "../hooks/useDashboardOperations.js";
|
|
8
8
|
import a from "../hooks/useFilterUrlSync.js";
|
|
9
9
|
import ee from "../hooks/usePageOperations.js";
|
|
10
10
|
import "../hooks/index.js";
|
|
@@ -20,7 +20,7 @@ import { Button as re, IllustratedEmptyState as h } from "@burdenoff/fe-libs/ui"
|
|
|
20
20
|
import { Fragment as ie, jsx as g, jsxs as _ } from "react/jsx-runtime";
|
|
21
21
|
//#region src/bigconsole/pages/DashboardViewPage.tsx
|
|
22
22
|
var v = l(function() {
|
|
23
|
-
let { dashboardId: l } = m(), v = n(), [y, b] = p(null), [ae, x] = p(!1), [S, C] = p(!1), [oe, w] = p(!1), [T, E] = p(!1), { isInDrilldown: D, getContextFromUrl: O, getDrilldownMetadata: k } = a(), A = t((e) => e.currentDashboard), j = t((e) => e.setCurrentDashboard), M = t((e) => e.setGlobalFilterValue), N = t((e) => e.clearAllGlobalFilters), P = e((e) => e.widgets), F = e((e) => e.clipboardWidgetId), I = e((e) => e.clipboardAction), L = e((e) => e.clearClipboard), R = e((e) => e.selectWidget), { loading: z, error: B, fetchDashboard: V, updateDashboard: H } =
|
|
23
|
+
let { dashboardId: l } = m(), v = n(), [y, b] = p(null), [ae, x] = p(!1), [S, C] = p(!1), [oe, w] = p(!1), [T, E] = p(!1), { isInDrilldown: D, getContextFromUrl: O, getDrilldownMetadata: k } = a(), A = t((e) => e.currentDashboard), j = t((e) => e.setCurrentDashboard), M = t((e) => e.setGlobalFilterValue), N = t((e) => e.clearAllGlobalFilters), P = e((e) => e.widgets), F = e((e) => e.clipboardWidgetId), I = e((e) => e.clipboardAction), L = e((e) => e.clearClipboard), R = e((e) => e.selectWidget), { loading: z, error: B, fetchDashboard: V, updateDashboard: H } = i(), { createWidget: U, deleteWidget: W, duplicateWidget: G, batchUpdatePositions: K, refetch: q } = r(y || void 0, l), { createPage: J, updatePage: Y, deletePage: X, reorderPages: Z } = ee();
|
|
24
24
|
d(() => {
|
|
25
25
|
if (!l) {
|
|
26
26
|
v("/dashboards");
|
|
@@ -1,26 +1,26 @@
|
|
|
1
1
|
import { useDataSinkStore as e } from "../store/dataSinkStore.js";
|
|
2
2
|
import { useAppNavigate as t } from "../contexts/NavigationContext.js";
|
|
3
3
|
import "../contexts/index.js";
|
|
4
|
-
import n from "../
|
|
4
|
+
import n from "../components/datasink/DataSinkTableViewer.js";
|
|
5
|
+
import ee from "../hooks/useDataSinkOperations.js";
|
|
5
6
|
import r from "../components/datasink/DataSinkStatusBadge.js";
|
|
6
|
-
import { isNative as i, nativeConfirm as
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import re from "../components/datasink/DataSinkTableViewer.js";
|
|
7
|
+
import { isNative as i, nativeConfirm as te, nativeImpact as a, nativeNotify as o } from "../../utils/nativeBridge.js";
|
|
8
|
+
import ne from "../hooks/useDataSinkSubscription.js";
|
|
9
|
+
import re from "../components/datasink/DataSinkDataViewer.js";
|
|
10
10
|
import ie from "../components/datasink/LinkedWorkflowsPanel.js";
|
|
11
11
|
import ae from "../components/datasink/LinkedParsersPanel.js";
|
|
12
12
|
import oe from "../components/datasink/WorkflowStatusPanel.js";
|
|
13
13
|
import se from "../components/datasink/ExportDataSinkDialog.js";
|
|
14
14
|
import { memo as s, useCallback as c, useEffect as ce, useState as l } from "react";
|
|
15
15
|
import { useParams as le } from "react-router-dom";
|
|
16
|
-
import { AlertCircle as ue, ArrowLeft as u, Code as de, Database as d, Download as fe, Edit as pe, Eye as
|
|
16
|
+
import { AlertCircle as ue, ArrowLeft as u, Code as de, Database as d, Download as fe, Edit as pe, Eye as me, EyeOff as f, Grid3X3 as p, Loader2 as m, RefreshCw as he, Trash2 as h } from "lucide-react";
|
|
17
17
|
import { Button as g, Card as _, CardContent as v, CardHeader as y, CardTitle as b, GlassCard as ge, IllustratedEmptyState as _e, NextSteps as ve, PagePurpose as ye } from "@burdenoff/fe-libs/ui";
|
|
18
18
|
import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
|
|
19
19
|
import { formatDistanceToNow as w } from "date-fns";
|
|
20
20
|
//#region src/bigconsole/pages/DataSinkViewPage.tsx
|
|
21
21
|
var T = s(function() {
|
|
22
|
-
let { dataSinkId: s } = le(), T = t(), [E, D] = l(!1), [O, k] = l(!1), [A, j] = l(!1), [M, N] = l(!1), [P, be] = l(null), [F, I] = l(!1), [L, R] = l("table"), [z, xe] = l(100), [B, V] = l(0), [H, Se] = l(null), [Ce, we] = l(!1), U = e((e) => s ? e.dataSinks.get(s) : void 0), { loading: Te, error: W, fetchDataSink: G, getDataSinkData: K, refreshDataSink: q, deleteDataSink: J } =
|
|
23
|
-
|
|
22
|
+
let { dataSinkId: s } = le(), T = t(), [E, D] = l(!1), [O, k] = l(!1), [A, j] = l(!1), [M, N] = l(!1), [P, be] = l(null), [F, I] = l(!1), [L, R] = l("table"), [z, xe] = l(100), [B, V] = l(0), [H, Se] = l(null), [Ce, we] = l(!1), U = e((e) => s ? e.dataSinks.get(s) : void 0), { loading: Te, error: W, fetchDataSink: G, getDataSinkData: K, refreshDataSink: q, deleteDataSink: J } = ee({ skipFetch: !0 });
|
|
23
|
+
ne({
|
|
24
24
|
dataSinkId: s,
|
|
25
25
|
enabled: !!s
|
|
26
26
|
}), ce(() => {
|
|
@@ -41,18 +41,18 @@ var T = s(function() {
|
|
|
41
41
|
}
|
|
42
42
|
}, [s, q]), De = c(async () => {
|
|
43
43
|
if (!s) return;
|
|
44
|
-
let e = await
|
|
44
|
+
let e = await te({
|
|
45
45
|
title: "Delete DataSink?",
|
|
46
46
|
message: "Are you sure you want to delete this DataSink?",
|
|
47
47
|
okButtonTitle: "Delete",
|
|
48
48
|
cancelButtonTitle: "Cancel"
|
|
49
49
|
});
|
|
50
50
|
if (e === null ? window.confirm("Are you sure you want to delete this DataSink?") : e) {
|
|
51
|
-
|
|
51
|
+
a("medium"), j(!0);
|
|
52
52
|
try {
|
|
53
|
-
await J(s), i() &&
|
|
53
|
+
await J(s), i() && o("success"), T("/datasinks");
|
|
54
54
|
} catch {
|
|
55
|
-
i() &&
|
|
55
|
+
i() && o("error");
|
|
56
56
|
} finally {
|
|
57
57
|
j(!1);
|
|
58
58
|
}
|
|
@@ -96,7 +96,7 @@ var T = s(function() {
|
|
|
96
96
|
}, []);
|
|
97
97
|
return Te && !U ? /* @__PURE__ */ S("div", {
|
|
98
98
|
className: "flex items-center justify-center min-h-[400px]",
|
|
99
|
-
children: /* @__PURE__ */ S(
|
|
99
|
+
children: /* @__PURE__ */ S(m, { className: "w-8 h-8 text-text-secondary animate-spin" })
|
|
100
100
|
}) : W ? /* @__PURE__ */ S("div", {
|
|
101
101
|
className: "flex items-center justify-center min-h-[400px] p-card-padding",
|
|
102
102
|
children: /* @__PURE__ */ C("div", {
|
|
@@ -158,7 +158,7 @@ var T = s(function() {
|
|
|
158
158
|
disabled: O,
|
|
159
159
|
variant: "secondary",
|
|
160
160
|
size: "default",
|
|
161
|
-
children: [/* @__PURE__ */ S(
|
|
161
|
+
children: [/* @__PURE__ */ S(he, { className: `w-4 h-4 mr-2 ${O ? "animate-spin" : ""}` }), O ? "Refreshing..." : "Refresh"]
|
|
162
162
|
}),
|
|
163
163
|
/* @__PURE__ */ C(g, {
|
|
164
164
|
onClick: $,
|
|
@@ -177,7 +177,7 @@ var T = s(function() {
|
|
|
177
177
|
disabled: A,
|
|
178
178
|
variant: "destructive",
|
|
179
179
|
size: "default",
|
|
180
|
-
children: [/* @__PURE__ */ S(
|
|
180
|
+
children: [/* @__PURE__ */ S(h, { className: "w-4 h-4 mr-2" }), A ? "Deleting..." : "Delete"]
|
|
181
181
|
})
|
|
182
182
|
]
|
|
183
183
|
})]
|
|
@@ -320,7 +320,7 @@ var T = s(function() {
|
|
|
320
320
|
onClick: () => R("table"),
|
|
321
321
|
className: `p-1.5 ${L === "table" ? "bg-bg-sunken text-text-primary" : "text-text-secondary hover:text-text-primary"}`,
|
|
322
322
|
title: "Table view",
|
|
323
|
-
children: /* @__PURE__ */ S(
|
|
323
|
+
children: /* @__PURE__ */ S(p, { className: "w-4 h-4" })
|
|
324
324
|
}), /* @__PURE__ */ S("button", {
|
|
325
325
|
type: "button",
|
|
326
326
|
onClick: () => R("json"),
|
|
@@ -333,11 +333,11 @@ var T = s(function() {
|
|
|
333
333
|
disabled: F,
|
|
334
334
|
variant: E ? "secondary" : "default",
|
|
335
335
|
size: "sm",
|
|
336
|
-
children: F ? /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ S(
|
|
336
|
+
children: F ? /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ S(m, { className: "w-4 h-4 mr-2 animate-spin" }), "Loading..."] }) : E ? /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ S(f, { className: "w-4 h-4 mr-2" }), "Hide Data"] }) : /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ S(me, { className: "w-4 h-4 mr-2" }), "Show Data"] })
|
|
337
337
|
})]
|
|
338
338
|
})]
|
|
339
339
|
}),
|
|
340
|
-
E && P && /* @__PURE__ */ C(v, { children: [S(L === "table" ?
|
|
340
|
+
E && P && /* @__PURE__ */ C(v, { children: [S(L === "table" ? n : re, {
|
|
341
341
|
data: P,
|
|
342
342
|
maxHeight: "400px"
|
|
343
343
|
}), H !== null && /* @__PURE__ */ C("div", {
|