@burdenoff/microfe-bigconsole 2026.731.8 → 2026.801.2

package/dist/bigconsole/pages/DashboardViewPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardViewPage.js","names":[],"sources":["../../../src/bigconsole/pages/DashboardViewPage.tsx"],"sourcesContent":["/**\n * DashboardViewPage\n *\n * View/edit a single dashboard - fetches data from real backend.\n * Supports drilldown context propagation via URL parameters.\n */\n\nimport { type FC, memo, useEffect, useCallback, useState, useRef } from 'react';\nimport { useParams } from 'react-router-dom';\nimport { ArrowLeft } from 'lucide-react';\nimport { Button, IllustratedEmptyState } from '@burdenoff/fe-libs/ui';\nimport { useBigConsoleNavigate } from '../context';\nimport {\n  DashboardCanvas,\n  ExportDashboardDialog,\n  PublishToStoreDialog,\n  DrilldownBreadcrumb,\n  LiveCanvasToggle,\n} from '../components/dashboard';\nimport { useDashboardStore, useWidgetStore } from '../store';\nimport { useDashboardOperations, useWidgetOperations, usePageOperations } from '../hooks';\nimport { useFilterUrlSync } from '../hooks/useFilterUrlSync';\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const DashboardViewPage: FC = memo(function DashboardViewPage() {\n  const { dashboardId } = useParams<{ dashboardId: string }>();\n  const navigate = useBigConsoleNavigate();\n  const [currentPageId, setCurrentPageId] = useState<string | null>(null);\n  const [isSaving, setIsSaving] = useState(false);\n  const [notFound, setNotFound] = useState(false);\n  const [isExportDialogOpen, setIsExportDialogOpen] = useState(false);\n  // Live canvas: when on, poll the dashboard + widget STRUCTURE so server-side\n  // pipeline builds (AI assistant agent or any other writer) appear without a reload.\n  const [isLive, setIsLive] = useState(false);\n\n  // Drilldown context from URL\n  const { isInDrilldown, getContextFromUrl, getDrilldownMetadata } = useFilterUrlSync();\n\n  // Store actions\n  const currentDashboard = useDashboardStore((state) => state.currentDashboard);\n  const setCurrentDashboard = useDashboardStore((state) => state.setCurrentDashboard);\n  const setGlobalFilterValue = useDashboardStore((state) => state.setGlobalFilterValue);\n  const clearAllGlobalFilters = useDashboardStore((state) => state.clearAllGlobalFilters);\n  const widgets = useWidgetStore((state) => state.widgets);\n  const clipboardWidgetId = useWidgetStore((state) => state.clipboardWidgetId);\n  const clipboardAction = useWidgetStore((state) => state.clipboardAction);\n  const clearClipboard = useWidgetStore((state) => state.clearClipboard);\n  const selectWidget = useWidgetStore((state) => state.selectWidget);\n\n  // Dashboard operations hook\n  const { loading, error, fetchDashboard, updateDashboard } = useDashboardOperations();\n\n  // Widget operations hook\n  const {\n    createWidget: createWidgetMutation,\n    deleteWidget: deleteWidgetMutation,\n    duplicateWidget: duplicateWidgetMutation,\n    batchUpdatePositions,\n    refetch: refetchWidgets,\n  } = useWidgetOperations(currentPageId || undefined, dashboardId);\n\n  // Page operations hook\n  const {\n    createPage: createPageMutation,\n    updatePage: updatePageMutation,\n    deletePage: deletePageMutation,\n    reorderPages: reorderPagesMutation,\n  } = usePageOperations();\n\n  // Load dashboard data\n  useEffect(() => {\n    if (!dashboardId) {\n      navigate('/dashboards');\n      return;\n    }\n\n    // Clear stale global filters from previous dashboard before loading new one.\n    // This prevents drilldown context filters (ctx_*) from the source dashboard\n    // from persisting and incorrectly filtering data on the target dashboard.\n    clearAllGlobalFilters();\n\n    setNotFound(false);\n\n    // Fetch dashboard from backend\n    fetchDashboard(dashboardId).then((dashboard) => {\n      if (dashboard) {\n        // Set the first page as current page\n        if (dashboard.pages && dashboard.pages.length > 0) {\n          setCurrentPageId(dashboard.pages[0].id);\n        }\n      } else {\n        // Dashboard not found\n        setNotFound(true);\n      }\n    });\n\n    // Cleanup\n    return () => {\n      setCurrentDashboard(null);\n      clearAllGlobalFilters();\n      setNotFound(false);\n    };\n  }, [dashboardId, navigate, fetchDashboard, setCurrentDashboard, clearAllGlobalFilters]);\n\n  // Load drilldown context from URL and apply to global filters\n  useEffect(() => {\n    if (!isInDrilldown) return;\n\n    // Get context params from URL (ctx_* params)\n    const contextParams = getContextFromUrl();\n    const drilldownMeta = getDrilldownMetadata();\n\n    // Apply context to dashboard state (available for widgets to use)\n    // Store as special filter values that widgets can reference\n    Object.entries(contextParams).forEach(([key, value]) => {\n      // Store context params as global filter values with ctx_ prefix for clarity\n      setGlobalFilterValue(`ctx_${key}`, value);\n    });\n\n    // Store drilldown metadata as special values\n    if (drilldownMeta.depth > 0) {\n      setGlobalFilterValue('__drilldown_depth', drilldownMeta.depth);\n      setGlobalFilterValue('__drilldown_parent', drilldownMeta.parent);\n      setGlobalFilterValue('__drilldown_path', drilldownMeta.path);\n    }\n\n    // Log for debugging\n    if (Object.keys(contextParams).length > 0) {\n      console.debug('[DashboardViewPage] Loaded drilldown context:', {\n        context: contextParams,\n        metadata: drilldownMeta,\n      });\n    }\n  }, [isInDrilldown, getContextFromUrl, getDrilldownMetadata, setGlobalFilterValue]);\n\n  // ---------------------------------------------------------------------------\n  // Live canvas: poll dashboard + widget STRUCTURE while live mode is on.\n  //\n  // The per-widget DATA poll (WidgetWrapper → refreshInterval) already keeps\n  // numbers fresh, but nothing refetches the board's STRUCTURE, so a widget the\n  // AI assistant's api-calls agent (DataSink → Parser → Widget) — or any other\n  // server-side writer — adds would never appear without a manual reload. This\n  // interval closes that gap: it silently refetches the dashboard (pages) and\n  // the widget list, so new widgets/pages materialise on the canvas live.\n  //\n  // Efficiency: it runs ONLY while live mode is on AND the tab is visible, and\n  // pauses while the board is in edit mode so a poll cannot clobber an in-flight\n  // drag/resize. Polling, not subscriptions — the backend GraphQL server is\n  // HTTP-only with no graphql-ws/PubSub transport (see LiveBoardBanner).\n  //\n  // Latency note: the floor on how quickly a change shows up is NOT this poll\n  // interval but fe-libs' shared GraphQL read cache (RECENT_QUERY_CACHE_TTL_MS,\n  // ~15s) — `network-only` is served from that short-lived client cache, so a\n  // newly-created widget surfaces on the next poll AFTER its cache entry\n  // expires. No manual reload is ever needed; worst-case freshness is ~15s.\n  // ---------------------------------------------------------------------------\n  const refetchWidgetsRef = useRef(refetchWidgets);\n  refetchWidgetsRef.current = refetchWidgets;\n\n  useEffect(() => {\n    if (!isLive || !dashboardId) return;\n\n    const LIVE_POLL_MS = 3500;\n\n    const pollStructure = () => {\n      // Skip work when the tab is backgrounded or the board is being edited.\n      if (typeof document !== 'undefined' && document.visibilityState !== 'visible') return;\n      if (useDashboardStore.getState().viewMode === 'edit') return;\n      void fetchDashboard(dashboardId, { silent: true });\n      void refetchWidgetsRef.current();\n    };\n\n    // Refetch immediately on enable so newly-built widgets show up at once,\n    // then settle into the cadence.\n    pollStructure();\n    const intervalId = window.setInterval(pollStructure, LIVE_POLL_MS);\n\n    // Catch up the moment the operator returns to the tab.\n    const handleVisibility = () => {\n      if (document.visibilityState === 'visible') pollStructure();\n    };\n    document.addEventListener('visibilitychange', handleVisibility);\n\n    return () => {\n      window.clearInterval(intervalId);\n      document.removeEventListener('visibilitychange', handleVisibility);\n    };\n  }, [isLive, dashboardId, fetchDashboard]);\n\n  // Handle save - batch update widget positions and dashboard metadata\n  const handleSave = useCallback(async () => {\n    if (!dashboardId) return;\n\n    setIsSaving(true);\n    try {\n      // Get all widgets and their positions\n      const widgetList = Array.from(widgets.values());\n      if (widgetList.length > 0) {\n        const positionUpdates = widgetList.map((widget) => ({\n          id: widget.id,\n          position: widget.position,\n        }));\n\n        await batchUpdatePositions(positionUpdates);\n      }\n\n      // Update dashboard metadata if needed\n      if (currentDashboard) {\n        await updateDashboard({\n          id: dashboardId,\n          name: currentDashboard.name,\n          description: currentDashboard.description,\n        });\n      }\n    } catch (error) {\n    } finally {\n      setIsSaving(false);\n    }\n  }, [dashboardId, widgets, currentDashboard, batchUpdatePositions, updateDashboard]);\n\n  // Navigate back to the dashboards list\n  const handleBack = useCallback(() => {\n    navigate('/dashboards');\n  }, [navigate]);\n\n  // Handle page change\n  const handlePageChange = useCallback((pageId: string) => {\n    setCurrentPageId(pageId);\n  }, []);\n\n  // Handle paste widget from clipboard\n  const handlePaste = useCallback(async () => {\n    const pageId = currentPageId || currentDashboard?.pages?.[0]?.id;\n    if (!clipboardWidgetId || !dashboardId || !pageId) {\n      return;\n    }\n\n    const sourceWidget = widgets.get(clipboardWidgetId);\n    if (!sourceWidget) {\n      clearClipboard();\n      return;\n    }\n\n    // Calculate new position (place at bottom of existing widgets)\n    const widgetsArray = Array.from(widgets.values());\n    const maxY = widgetsArray.reduce((max, w) => {\n      const widgetBottom = (w.positionY ?? 0) + (w.positionHeight ?? 4);\n      return Math.max(max, widgetBottom);\n    }, 0);\n\n    const newPosition = {\n      x: 0,\n      y: maxY,\n      width: sourceWidget.positionWidth ?? 4,\n      height: sourceWidget.positionHeight ?? 4,\n    };\n\n    const newTitle = clipboardAction === 'copy' ? `${sourceWidget.title} (Copy)` : sourceWidget.title;\n\n    let newWidget = null;\n\n    // Try duplicateWidget API first\n    try {\n      newWidget = await duplicateWidgetMutation(clipboardWidgetId, newPosition, newTitle);\n    } catch (err) {}\n\n    // Fallback: Create new widget with source widget's data\n    if (!newWidget) {\n      newWidget = await createWidgetMutation({\n        pageId,\n        dashboardId,\n        type: sourceWidget.type,\n        title: newTitle,\n        description: sourceWidget.description,\n        // v2.0: Data source fields (DataSink → Parser → Widget)\n        dataSinkId: (sourceWidget as unknown as Record<string, string | undefined>).dataSinkId,\n        datasetId: (sourceWidget as unknown as Record<string, string | undefined>).datasetId,\n        parserId: (sourceWidget as unknown as Record<string, string | undefined>).parserId,\n        parserRules: (sourceWidget as unknown as Record<string, string | undefined>).parserRules,\n        config: sourceWidget.config || {},\n        position: newPosition,\n        refreshInterval: sourceWidget.refreshInterval ?? undefined,\n        metadata: sourceWidget.metadata,\n      });\n    }\n\n    if (newWidget) {\n      selectWidget(newWidget.id);\n\n      // If cut action, delete the original widget from backend\n      if (clipboardAction === 'cut') {\n        await deleteWidgetMutation(clipboardWidgetId);\n      }\n    }\n\n    clearClipboard();\n  }, [\n    clipboardWidgetId,\n    clipboardAction,\n    dashboardId,\n    currentPageId,\n    currentDashboard,\n    widgets,\n    duplicateWidgetMutation,\n    createWidgetMutation,\n    deleteWidgetMutation,\n    selectWidget,\n    clearClipboard,\n  ]);\n\n  // Handle export\n  const handleExport = useCallback(() => {\n    setIsExportDialogOpen(true);\n  }, []);\n\n  // Publish this dashboard as a reusable store template\n  const [isPublishDialogOpen, setIsPublishDialogOpen] = useState(false);\n  const handlePublishTemplate = useCallback(() => {\n    setIsPublishDialogOpen(true);\n  }, []);\n  const handlePublishClose = useCallback(() => {\n    setIsPublishDialogOpen(false);\n  }, []);\n\n  const handleExportClose = useCallback(() => {\n    setIsExportDialogOpen(false);\n  }, []);\n\n  // ============================================================================\n  // Page Management Callbacks\n  // ============================================================================\n\n  // Handle adding a new page\n  const handlePageAdd = useCallback(async () => {\n    if (!currentDashboard || !dashboardId) return;\n\n    const newPageCount = (currentDashboard.pages?.length || 0) + 1;\n    const newPageName = `Page ${newPageCount}`;\n\n    // Call GraphQL mutation to create page\n    // Note: 'order' is not available for create - backend auto-assigns order\n    const newPage = await createPageMutation({\n      dashboardId,\n      name: newPageName,\n    });\n\n    if (newPage) {\n      // Update local state with the created page\n      setCurrentDashboard({\n        ...currentDashboard,\n        pages: [...(currentDashboard.pages || []), newPage],\n      });\n\n      // Switch to the new page\n      setCurrentPageId(newPage.id);\n    }\n  }, [currentDashboard, dashboardId, setCurrentDashboard, createPageMutation]);\n\n  // Handle renaming a page\n  const handlePageRename = useCallback(\n    async (pageId: string, newName: string) => {\n      if (!currentDashboard) return;\n\n      // Call GraphQL mutation to update page\n      const updatedPage = await updatePageMutation({\n        id: pageId,\n        name: newName,\n      });\n\n      if (updatedPage) {\n        setCurrentDashboard({\n          ...currentDashboard,\n          pages: currentDashboard.pages?.map((page) => (page.id === pageId ? { ...page, name: newName } : page)),\n        });\n      }\n    },\n    [currentDashboard, setCurrentDashboard, updatePageMutation]\n  );\n\n  // Handle duplicating a page\n  const handlePageDuplicate = useCallback(\n    async (pageId: string) => {\n      if (!currentDashboard || !dashboardId) return;\n\n      const sourcePage = currentDashboard.pages?.find((p) => p.id === pageId);\n      if (!sourcePage) return;\n\n      // Call GraphQL mutation to create a copy of the page\n      // Note: 'order' is not available for create - backend auto-assigns order\n      const newPage = await createPageMutation({\n        dashboardId,\n        name: `${sourcePage.name} (Copy)`,\n      });\n\n      if (newPage) {\n        setCurrentDashboard({\n          ...currentDashboard,\n          pages: [...(currentDashboard.pages || []), newPage],\n        });\n\n        setCurrentPageId(newPage.id);\n      }\n      // Note: Widget duplication would require additional backend support\n    },\n    [currentDashboard, dashboardId, setCurrentDashboard, createPageMutation]\n  );\n\n  // Handle deleting a page\n  const handlePageDelete = useCallback(\n    async (pageId: string) => {\n      if (!currentDashboard || (currentDashboard.pages?.length || 0) <= 1) return;\n\n      // Call GraphQL mutation to delete page\n      const success = await deletePageMutation(pageId);\n\n      if (success) {\n        const updatedPages = currentDashboard.pages\n          ?.filter((p) => p.id !== pageId)\n          .map((p, index) => ({ ...p, order: index }));\n\n        setCurrentDashboard({\n          ...currentDashboard,\n          pages: updatedPages,\n        });\n\n        // Switch to first page if current page was deleted\n        if (currentPageId === pageId) {\n          setCurrentPageId(updatedPages?.[0]?.id || null);\n        }\n      }\n    },\n    [currentDashboard, setCurrentDashboard, currentPageId, deletePageMutation]\n  );\n\n  // Handle reordering pages\n  const handlePagesReorder = useCallback(\n    async (reorderedPages: Array<{ id: string; name?: string; order?: number }>) => {\n      if (!currentDashboard || !dashboardId) return;\n\n      // Update local state optimistically\n      setCurrentDashboard({\n        ...currentDashboard,\n        pages: reorderedPages.map((page, index) => ({\n          ...page,\n          order: index,\n        })),\n      });\n\n      // Call GraphQL mutation to persist the reorder\n      const pageIds = reorderedPages.map((p) => p.id);\n      await reorderPagesMutation(dashboardId, pageIds);\n    },\n    [currentDashboard, dashboardId, setCurrentDashboard, reorderPagesMutation]\n  );\n\n  // Error state\n  if (error) {\n    return (\n      <div className=\"flex flex-col items-center justify-center h-full\" style={{ padding: 'var(--space-pagePadding)' }}>\n        <div className=\"bg-status-error-bg border border-status-error-border rounded-lg p-6 w-full max-w-md\">\n          <h3 className=\"text-lg font-medium text-status-error-text mb-2\">Error loading dashboard</h3>\n          <p className=\"text-sm text-text-secondary mb-4 break-words\">{error.message}</p>\n          <div className=\"flex flex-wrap gap-3\">\n            <button\n              type=\"button\"\n              onClick={() => fetchDashboard(dashboardId!)}\n              className=\"px-4 py-2 text-sm font-medium text-action-primary-fg bg-action-primary-bg hover:bg-action-primary-bgHover rounded-md\"\n            >\n              Retry\n            </button>\n            <button\n              type=\"button\"\n              onClick={() => navigate('/dashboards')}\n              className=\"px-4 py-2 text-sm font-medium text-text-secondary bg-bg-sunken hover:bg-bg-sunken/80 rounded-md\"\n            >\n              Back to Dashboards\n            </button>\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  // Not found state\n  if (notFound) {\n    return (\n      <div className=\"flex flex-col items-center justify-center h-full\" style={{ padding: 'var(--space-pagePadding)' }}>\n        <IllustratedEmptyState\n          illustration=\"empty-data\"\n          title=\"Dashboard not found\"\n          description={\n            <>\n              The dashboard you&apos;re looking for doesn&apos;t exist or has been deleted.\n              <span className=\"mt-2 block font-mono text-xs text-text-tertiary break-all\">ID: {dashboardId}</span>\n            </>\n          }\n          action={\n            <button\n              type=\"button\"\n              onClick={() => navigate('/dashboards')}\n              className=\"px-4 py-2 text-sm font-medium text-action-primary-fg bg-action-primary-bg hover:bg-action-primary-bgHover rounded-md\"\n            >\n              Back to Dashboards\n            </button>\n          }\n        />\n      </div>\n    );\n  }\n\n  // Loading state\n  if (loading || !currentDashboard) {\n    return (\n      <div className=\"flex items-center justify-center h-full\">\n        <div className=\"flex flex-col items-center gap-4\">\n          <div className=\"animate-spin w-8 h-8 border-4 border-action-primary-bg border-t-transparent rounded-full\" />\n          <p className=\"text-sm text-text-secondary\">Loading dashboard...</p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"h-full flex flex-col overflow-hidden\">\n      {/* Page header with back navigation - visible in both view and edit modes */}\n      <div className=\"flex items-center gap-3 px-3 py-2 border-b border-border-default bg-bg-surface flex-shrink-0\">\n        <Button\n          onClick={handleBack}\n          variant=\"ghost\"\n          size=\"sm\"\n          title=\"Back to Dashboards\"\n          aria-label=\"Back to Dashboards\"\n        >\n          <ArrowLeft className=\"w-4 h-4 mr-2\" />\n          Back\n        </Button>\n        <h2 className=\"text-sm font-semibold text-text-primary truncate\">{currentDashboard.name}</h2>\n        {/* Live canvas toggle — watch server-side pipeline builds appear without a reload */}\n        <div className=\"ml-auto flex-shrink-0\">\n          <LiveCanvasToggle isLive={isLive} onToggle={() => setIsLive((prev) => !prev)} />\n        </div>\n      </div>\n\n      {/* Drilldown Breadcrumb - shown when navigating via drilldown */}\n      {isInDrilldown && (\n        <DrilldownBreadcrumb\n          currentDashboardId={currentDashboard.id}\n          currentDashboardName={currentDashboard.name}\n          basePath=\"/bigconsole/dashboards\"\n        />\n      )}\n\n      {/* Dashboard Canvas with Page Tabs */}\n      <div className=\"flex-1 min-w-0 overflow-hidden\">\n        <DashboardCanvas\n          dashboardId={currentDashboard.id}\n          pageId={currentPageId || currentDashboard.pages?.[0]?.id}\n          title={currentDashboard.name}\n          onPaste={handlePaste}\n          onSave={handleSave}\n          isSaving={isSaving}\n          onExport={handleExport}\n          onPublishTemplate={handlePublishTemplate}\n          // Page tabs props\n          pages={(currentDashboard.pages || []).map((page, index) => ({\n            id: page.id,\n            name: page.name || `Page ${index + 1}`,\n            order: page.order ?? 0,\n          }))}\n          activePageId={currentPageId || currentDashboard.pages?.[0]?.id}\n          onPageChange={handlePageChange}\n          onPageAdd={handlePageAdd}\n          onPageRename={handlePageRename}\n          onPageDuplicate={handlePageDuplicate}\n          onPageDelete={handlePageDelete}\n          onPagesReorder={handlePagesReorder}\n          showPageTabs={true}\n        />\n      </div>\n\n      {/* Export Dashboard Dialog */}\n      <ExportDashboardDialog\n        isOpen={isExportDialogOpen}\n        dashboardId={currentDashboard.id}\n        dashboardName={currentDashboard.name}\n        onClose={handleExportClose}\n      />\n\n      {/* Publish as Template */}\n      <PublishToStoreDialog\n        isOpen={isPublishDialogOpen}\n        dashboardId={currentDashboard.id}\n        dashboardName={currentDashboard.name}\n        dashboardDescription={currentDashboard.description}\n        onClose={handlePublishClose}\n      />\n    </div>\n  );\n});\n\nexport default DashboardViewPage;\n"],"mappings":"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"}
+{"version":3,"file":"DashboardViewPage.js","names":[],"sources":["../../../src/bigconsole/pages/DashboardViewPage.tsx"],"sourcesContent":["/**\n * DashboardViewPage\n *\n * View/edit a single dashboard - fetches data from real backend.\n * Supports drilldown context propagation via URL parameters.\n */\n\nimport { type FC, memo, useEffect, useCallback, useState, useRef } from 'react';\nimport { useParams } from 'react-router';\nimport { ArrowLeft } from 'lucide-react';\nimport { Button, IllustratedEmptyState } from '@burdenoff/fe-libs/ui';\nimport { useBigConsoleNavigate } from '../context';\nimport {\n  DashboardCanvas,\n  ExportDashboardDialog,\n  PublishToStoreDialog,\n  DrilldownBreadcrumb,\n  LiveCanvasToggle,\n} from '../components/dashboard';\nimport { useDashboardStore, useWidgetStore } from '../store';\nimport { useDashboardOperations, useWidgetOperations, usePageOperations } from '../hooks';\nimport { useFilterUrlSync } from '../hooks/useFilterUrlSync';\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const DashboardViewPage: FC = memo(function DashboardViewPage() {\n  const { dashboardId } = useParams<{ dashboardId: string }>();\n  const navigate = useBigConsoleNavigate();\n  const [currentPageId, setCurrentPageId] = useState<string | null>(null);\n  const [isSaving, setIsSaving] = useState(false);\n  const [notFound, setNotFound] = useState(false);\n  const [isExportDialogOpen, setIsExportDialogOpen] = useState(false);\n  // Live canvas: when on, poll the dashboard + widget STRUCTURE so server-side\n  // pipeline builds (AI assistant agent or any other writer) appear without a reload.\n  const [isLive, setIsLive] = useState(false);\n\n  // Drilldown context from URL\n  const { isInDrilldown, getContextFromUrl, getDrilldownMetadata } = useFilterUrlSync();\n\n  // Store actions\n  const currentDashboard = useDashboardStore((state) => state.currentDashboard);\n  const setCurrentDashboard = useDashboardStore((state) => state.setCurrentDashboard);\n  const setGlobalFilterValue = useDashboardStore((state) => state.setGlobalFilterValue);\n  const clearAllGlobalFilters = useDashboardStore((state) => state.clearAllGlobalFilters);\n  const widgets = useWidgetStore((state) => state.widgets);\n  const clipboardWidgetId = useWidgetStore((state) => state.clipboardWidgetId);\n  const clipboardAction = useWidgetStore((state) => state.clipboardAction);\n  const clearClipboard = useWidgetStore((state) => state.clearClipboard);\n  const selectWidget = useWidgetStore((state) => state.selectWidget);\n\n  // Dashboard operations hook\n  const { loading, error, fetchDashboard, updateDashboard } = useDashboardOperations();\n\n  // Widget operations hook\n  const {\n    createWidget: createWidgetMutation,\n    deleteWidget: deleteWidgetMutation,\n    duplicateWidget: duplicateWidgetMutation,\n    batchUpdatePositions,\n    refetch: refetchWidgets,\n  } = useWidgetOperations(currentPageId || undefined, dashboardId);\n\n  // Page operations hook\n  const {\n    createPage: createPageMutation,\n    updatePage: updatePageMutation,\n    deletePage: deletePageMutation,\n    reorderPages: reorderPagesMutation,\n  } = usePageOperations();\n\n  // Load dashboard data\n  useEffect(() => {\n    if (!dashboardId) {\n      navigate('/dashboards');\n      return;\n    }\n\n    // Clear stale global filters from previous dashboard before loading new one.\n    // This prevents drilldown context filters (ctx_*) from the source dashboard\n    // from persisting and incorrectly filtering data on the target dashboard.\n    clearAllGlobalFilters();\n\n    setNotFound(false);\n\n    // Fetch dashboard from backend\n    fetchDashboard(dashboardId).then((dashboard) => {\n      if (dashboard) {\n        // Set the first page as current page\n        if (dashboard.pages && dashboard.pages.length > 0) {\n          setCurrentPageId(dashboard.pages[0].id);\n        }\n      } else {\n        // Dashboard not found\n        setNotFound(true);\n      }\n    });\n\n    // Cleanup\n    return () => {\n      setCurrentDashboard(null);\n      clearAllGlobalFilters();\n      setNotFound(false);\n    };\n  }, [dashboardId, navigate, fetchDashboard, setCurrentDashboard, clearAllGlobalFilters]);\n\n  // Load drilldown context from URL and apply to global filters\n  useEffect(() => {\n    if (!isInDrilldown) return;\n\n    // Get context params from URL (ctx_* params)\n    const contextParams = getContextFromUrl();\n    const drilldownMeta = getDrilldownMetadata();\n\n    // Apply context to dashboard state (available for widgets to use)\n    // Store as special filter values that widgets can reference\n    Object.entries(contextParams).forEach(([key, value]) => {\n      // Store context params as global filter values with ctx_ prefix for clarity\n      setGlobalFilterValue(`ctx_${key}`, value);\n    });\n\n    // Store drilldown metadata as special values\n    if (drilldownMeta.depth > 0) {\n      setGlobalFilterValue('__drilldown_depth', drilldownMeta.depth);\n      setGlobalFilterValue('__drilldown_parent', drilldownMeta.parent);\n      setGlobalFilterValue('__drilldown_path', drilldownMeta.path);\n    }\n\n    // Log for debugging\n    if (Object.keys(contextParams).length > 0) {\n      console.debug('[DashboardViewPage] Loaded drilldown context:', {\n        context: contextParams,\n        metadata: drilldownMeta,\n      });\n    }\n  }, [isInDrilldown, getContextFromUrl, getDrilldownMetadata, setGlobalFilterValue]);\n\n  // ---------------------------------------------------------------------------\n  // Live canvas: poll dashboard + widget STRUCTURE while live mode is on.\n  //\n  // The per-widget DATA poll (WidgetWrapper → refreshInterval) already keeps\n  // numbers fresh, but nothing refetches the board's STRUCTURE, so a widget the\n  // AI assistant's api-calls agent (DataSink → Parser → Widget) — or any other\n  // server-side writer — adds would never appear without a manual reload. This\n  // interval closes that gap: it silently refetches the dashboard (pages) and\n  // the widget list, so new widgets/pages materialise on the canvas live.\n  //\n  // Efficiency: it runs ONLY while live mode is on AND the tab is visible, and\n  // pauses while the board is in edit mode so a poll cannot clobber an in-flight\n  // drag/resize. Polling, not subscriptions — the backend GraphQL server is\n  // HTTP-only with no graphql-ws/PubSub transport (see LiveBoardBanner).\n  //\n  // Latency note: the floor on how quickly a change shows up is NOT this poll\n  // interval but fe-libs' shared GraphQL read cache (RECENT_QUERY_CACHE_TTL_MS,\n  // ~15s) — `network-only` is served from that short-lived client cache, so a\n  // newly-created widget surfaces on the next poll AFTER its cache entry\n  // expires. No manual reload is ever needed; worst-case freshness is ~15s.\n  // ---------------------------------------------------------------------------\n  const refetchWidgetsRef = useRef(refetchWidgets);\n  refetchWidgetsRef.current = refetchWidgets;\n\n  useEffect(() => {\n    if (!isLive || !dashboardId) return;\n\n    const LIVE_POLL_MS = 3500;\n\n    const pollStructure = () => {\n      // Skip work when the tab is backgrounded or the board is being edited.\n      if (typeof document !== 'undefined' && document.visibilityState !== 'visible') return;\n      if (useDashboardStore.getState().viewMode === 'edit') return;\n      void fetchDashboard(dashboardId, { silent: true });\n      void refetchWidgetsRef.current();\n    };\n\n    // Refetch immediately on enable so newly-built widgets show up at once,\n    // then settle into the cadence.\n    pollStructure();\n    const intervalId = window.setInterval(pollStructure, LIVE_POLL_MS);\n\n    // Catch up the moment the operator returns to the tab.\n    const handleVisibility = () => {\n      if (document.visibilityState === 'visible') pollStructure();\n    };\n    document.addEventListener('visibilitychange', handleVisibility);\n\n    return () => {\n      window.clearInterval(intervalId);\n      document.removeEventListener('visibilitychange', handleVisibility);\n    };\n  }, [isLive, dashboardId, fetchDashboard]);\n\n  // Handle save - batch update widget positions and dashboard metadata\n  const handleSave = useCallback(async () => {\n    if (!dashboardId) return;\n\n    setIsSaving(true);\n    try {\n      // Get all widgets and their positions\n      const widgetList = Array.from(widgets.values());\n      if (widgetList.length > 0) {\n        const positionUpdates = widgetList.map((widget) => ({\n          id: widget.id,\n          position: widget.position,\n        }));\n\n        await batchUpdatePositions(positionUpdates);\n      }\n\n      // Update dashboard metadata if needed\n      if (currentDashboard) {\n        await updateDashboard({\n          id: dashboardId,\n          name: currentDashboard.name,\n          description: currentDashboard.description,\n        });\n      }\n    } catch (error) {\n    } finally {\n      setIsSaving(false);\n    }\n  }, [dashboardId, widgets, currentDashboard, batchUpdatePositions, updateDashboard]);\n\n  // Navigate back to the dashboards list\n  const handleBack = useCallback(() => {\n    navigate('/dashboards');\n  }, [navigate]);\n\n  // Handle page change\n  const handlePageChange = useCallback((pageId: string) => {\n    setCurrentPageId(pageId);\n  }, []);\n\n  // Handle paste widget from clipboard\n  const handlePaste = useCallback(async () => {\n    const pageId = currentPageId || currentDashboard?.pages?.[0]?.id;\n    if (!clipboardWidgetId || !dashboardId || !pageId) {\n      return;\n    }\n\n    const sourceWidget = widgets.get(clipboardWidgetId);\n    if (!sourceWidget) {\n      clearClipboard();\n      return;\n    }\n\n    // Calculate new position (place at bottom of existing widgets)\n    const widgetsArray = Array.from(widgets.values());\n    const maxY = widgetsArray.reduce((max, w) => {\n      const widgetBottom = (w.positionY ?? 0) + (w.positionHeight ?? 4);\n      return Math.max(max, widgetBottom);\n    }, 0);\n\n    const newPosition = {\n      x: 0,\n      y: maxY,\n      width: sourceWidget.positionWidth ?? 4,\n      height: sourceWidget.positionHeight ?? 4,\n    };\n\n    const newTitle = clipboardAction === 'copy' ? `${sourceWidget.title} (Copy)` : sourceWidget.title;\n\n    let newWidget = null;\n\n    // Try duplicateWidget API first\n    try {\n      newWidget = await duplicateWidgetMutation(clipboardWidgetId, newPosition, newTitle);\n    } catch (err) {}\n\n    // Fallback: Create new widget with source widget's data\n    if (!newWidget) {\n      newWidget = await createWidgetMutation({\n        pageId,\n        dashboardId,\n        type: sourceWidget.type,\n        title: newTitle,\n        description: sourceWidget.description,\n        // v2.0: Data source fields (DataSink → Parser → Widget)\n        dataSinkId: (sourceWidget as unknown as Record<string, string | undefined>).dataSinkId,\n        datasetId: (sourceWidget as unknown as Record<string, string | undefined>).datasetId,\n        parserId: (sourceWidget as unknown as Record<string, string | undefined>).parserId,\n        parserRules: (sourceWidget as unknown as Record<string, string | undefined>).parserRules,\n        config: sourceWidget.config || {},\n        position: newPosition,\n        refreshInterval: sourceWidget.refreshInterval ?? undefined,\n        metadata: sourceWidget.metadata,\n      });\n    }\n\n    if (newWidget) {\n      selectWidget(newWidget.id);\n\n      // If cut action, delete the original widget from backend\n      if (clipboardAction === 'cut') {\n        await deleteWidgetMutation(clipboardWidgetId);\n      }\n    }\n\n    clearClipboard();\n  }, [\n    clipboardWidgetId,\n    clipboardAction,\n    dashboardId,\n    currentPageId,\n    currentDashboard,\n    widgets,\n    duplicateWidgetMutation,\n    createWidgetMutation,\n    deleteWidgetMutation,\n    selectWidget,\n    clearClipboard,\n  ]);\n\n  // Handle export\n  const handleExport = useCallback(() => {\n    setIsExportDialogOpen(true);\n  }, []);\n\n  // Publish this dashboard as a reusable store template\n  const [isPublishDialogOpen, setIsPublishDialogOpen] = useState(false);\n  const handlePublishTemplate = useCallback(() => {\n    setIsPublishDialogOpen(true);\n  }, []);\n  const handlePublishClose = useCallback(() => {\n    setIsPublishDialogOpen(false);\n  }, []);\n\n  const handleExportClose = useCallback(() => {\n    setIsExportDialogOpen(false);\n  }, []);\n\n  // ============================================================================\n  // Page Management Callbacks\n  // ============================================================================\n\n  // Handle adding a new page\n  const handlePageAdd = useCallback(async () => {\n    if (!currentDashboard || !dashboardId) return;\n\n    const newPageCount = (currentDashboard.pages?.length || 0) + 1;\n    const newPageName = `Page ${newPageCount}`;\n\n    // Call GraphQL mutation to create page\n    // Note: 'order' is not available for create - backend auto-assigns order\n    const newPage = await createPageMutation({\n      dashboardId,\n      name: newPageName,\n    });\n\n    if (newPage) {\n      // Update local state with the created page\n      setCurrentDashboard({\n        ...currentDashboard,\n        pages: [...(currentDashboard.pages || []), newPage],\n      });\n\n      // Switch to the new page\n      setCurrentPageId(newPage.id);\n    }\n  }, [currentDashboard, dashboardId, setCurrentDashboard, createPageMutation]);\n\n  // Handle renaming a page\n  const handlePageRename = useCallback(\n    async (pageId: string, newName: string) => {\n      if (!currentDashboard) return;\n\n      // Call GraphQL mutation to update page\n      const updatedPage = await updatePageMutation({\n        id: pageId,\n        name: newName,\n      });\n\n      if (updatedPage) {\n        setCurrentDashboard({\n          ...currentDashboard,\n          pages: currentDashboard.pages?.map((page) => (page.id === pageId ? { ...page, name: newName } : page)),\n        });\n      }\n    },\n    [currentDashboard, setCurrentDashboard, updatePageMutation]\n  );\n\n  // Handle duplicating a page\n  const handlePageDuplicate = useCallback(\n    async (pageId: string) => {\n      if (!currentDashboard || !dashboardId) return;\n\n      const sourcePage = currentDashboard.pages?.find((p) => p.id === pageId);\n      if (!sourcePage) return;\n\n      // Call GraphQL mutation to create a copy of the page\n      // Note: 'order' is not available for create - backend auto-assigns order\n      const newPage = await createPageMutation({\n        dashboardId,\n        name: `${sourcePage.name} (Copy)`,\n      });\n\n      if (newPage) {\n        setCurrentDashboard({\n          ...currentDashboard,\n          pages: [...(currentDashboard.pages || []), newPage],\n        });\n\n        setCurrentPageId(newPage.id);\n      }\n      // Note: Widget duplication would require additional backend support\n    },\n    [currentDashboard, dashboardId, setCurrentDashboard, createPageMutation]\n  );\n\n  // Handle deleting a page\n  const handlePageDelete = useCallback(\n    async (pageId: string) => {\n      if (!currentDashboard || (currentDashboard.pages?.length || 0) <= 1) return;\n\n      // Call GraphQL mutation to delete page\n      const success = await deletePageMutation(pageId);\n\n      if (success) {\n        const updatedPages = currentDashboard.pages\n          ?.filter((p) => p.id !== pageId)\n          .map((p, index) => ({ ...p, order: index }));\n\n        setCurrentDashboard({\n          ...currentDashboard,\n          pages: updatedPages,\n        });\n\n        // Switch to first page if current page was deleted\n        if (currentPageId === pageId) {\n          setCurrentPageId(updatedPages?.[0]?.id || null);\n        }\n      }\n    },\n    [currentDashboard, setCurrentDashboard, currentPageId, deletePageMutation]\n  );\n\n  // Handle reordering pages\n  const handlePagesReorder = useCallback(\n    async (reorderedPages: Array<{ id: string; name?: string; order?: number }>) => {\n      if (!currentDashboard || !dashboardId) return;\n\n      // Update local state optimistically\n      setCurrentDashboard({\n        ...currentDashboard,\n        pages: reorderedPages.map((page, index) => ({\n          ...page,\n          order: index,\n        })),\n      });\n\n      // Call GraphQL mutation to persist the reorder\n      const pageIds = reorderedPages.map((p) => p.id);\n      await reorderPagesMutation(dashboardId, pageIds);\n    },\n    [currentDashboard, dashboardId, setCurrentDashboard, reorderPagesMutation]\n  );\n\n  // Error state\n  if (error) {\n    return (\n      <div className=\"flex flex-col items-center justify-center h-full\" style={{ padding: 'var(--space-pagePadding)' }}>\n        <div className=\"bg-status-error-bg border border-status-error-border rounded-lg p-6 w-full max-w-md\">\n          <h3 className=\"text-lg font-medium text-status-error-text mb-2\">Error loading dashboard</h3>\n          <p className=\"text-sm text-text-secondary mb-4 break-words\">{error.message}</p>\n          <div className=\"flex flex-wrap gap-3\">\n            <button\n              type=\"button\"\n              onClick={() => fetchDashboard(dashboardId!)}\n              className=\"px-4 py-2 text-sm font-medium text-action-primary-fg bg-action-primary-bg hover:bg-action-primary-bgHover rounded-md\"\n            >\n              Retry\n            </button>\n            <button\n              type=\"button\"\n              onClick={() => navigate('/dashboards')}\n              className=\"px-4 py-2 text-sm font-medium text-text-secondary bg-bg-sunken hover:bg-bg-sunken/80 rounded-md\"\n            >\n              Back to Dashboards\n            </button>\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  // Not found state\n  if (notFound) {\n    return (\n      <div className=\"flex flex-col items-center justify-center h-full\" style={{ padding: 'var(--space-pagePadding)' }}>\n        <IllustratedEmptyState\n          illustration=\"empty-data\"\n          title=\"Dashboard not found\"\n          description={\n            <>\n              The dashboard you&apos;re looking for doesn&apos;t exist or has been deleted.\n              <span className=\"mt-2 block font-mono text-xs text-text-tertiary break-all\">ID: {dashboardId}</span>\n            </>\n          }\n          action={\n            <button\n              type=\"button\"\n              onClick={() => navigate('/dashboards')}\n              className=\"px-4 py-2 text-sm font-medium text-action-primary-fg bg-action-primary-bg hover:bg-action-primary-bgHover rounded-md\"\n            >\n              Back to Dashboards\n            </button>\n          }\n        />\n      </div>\n    );\n  }\n\n  // Loading state\n  if (loading || !currentDashboard) {\n    return (\n      <div className=\"flex items-center justify-center h-full\">\n        <div className=\"flex flex-col items-center gap-4\">\n          <div className=\"animate-spin w-8 h-8 border-4 border-action-primary-bg border-t-transparent rounded-full\" />\n          <p className=\"text-sm text-text-secondary\">Loading dashboard...</p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"h-full flex flex-col overflow-hidden\">\n      {/* Page header with back navigation - visible in both view and edit modes */}\n      <div className=\"flex items-center gap-3 px-3 py-2 border-b border-border-default bg-bg-surface flex-shrink-0\">\n        <Button\n          onClick={handleBack}\n          variant=\"ghost\"\n          size=\"sm\"\n          title=\"Back to Dashboards\"\n          aria-label=\"Back to Dashboards\"\n        >\n          <ArrowLeft className=\"w-4 h-4 mr-2\" />\n          Back\n        </Button>\n        <h2 className=\"text-sm font-semibold text-text-primary truncate\">{currentDashboard.name}</h2>\n        {/* Live canvas toggle — watch server-side pipeline builds appear without a reload */}\n        <div className=\"ml-auto flex-shrink-0\">\n          <LiveCanvasToggle isLive={isLive} onToggle={() => setIsLive((prev) => !prev)} />\n        </div>\n      </div>\n\n      {/* Drilldown Breadcrumb - shown when navigating via drilldown */}\n      {isInDrilldown && (\n        <DrilldownBreadcrumb\n          currentDashboardId={currentDashboard.id}\n          currentDashboardName={currentDashboard.name}\n          basePath=\"/bigconsole/dashboards\"\n        />\n      )}\n\n      {/* Dashboard Canvas with Page Tabs */}\n      <div className=\"flex-1 min-w-0 overflow-hidden\">\n        <DashboardCanvas\n          dashboardId={currentDashboard.id}\n          pageId={currentPageId || currentDashboard.pages?.[0]?.id}\n          title={currentDashboard.name}\n          onPaste={handlePaste}\n          onSave={handleSave}\n          isSaving={isSaving}\n          onExport={handleExport}\n          onPublishTemplate={handlePublishTemplate}\n          // Page tabs props\n          pages={(currentDashboard.pages || []).map((page, index) => ({\n            id: page.id,\n            name: page.name || `Page ${index + 1}`,\n            order: page.order ?? 0,\n          }))}\n          activePageId={currentPageId || currentDashboard.pages?.[0]?.id}\n          onPageChange={handlePageChange}\n          onPageAdd={handlePageAdd}\n          onPageRename={handlePageRename}\n          onPageDuplicate={handlePageDuplicate}\n          onPageDelete={handlePageDelete}\n          onPagesReorder={handlePagesReorder}\n          showPageTabs={true}\n        />\n      </div>\n\n      {/* Export Dashboard Dialog */}\n      <ExportDashboardDialog\n        isOpen={isExportDialogOpen}\n        dashboardId={currentDashboard.id}\n        dashboardName={currentDashboard.name}\n        onClose={handleExportClose}\n      />\n\n      {/* Publish as Template */}\n      <PublishToStoreDialog\n        isOpen={isPublishDialogOpen}\n        dashboardId={currentDashboard.id}\n        dashboardName={currentDashboard.name}\n        dashboardDescription={currentDashboard.description}\n        onClose={handlePublishClose}\n      />\n    </div>\n  );\n});\n\nexport default DashboardViewPage;\n"],"mappings":"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"}

package/dist/bigconsole/pages/DataParsersPage.js

@@ -7,7 +7,7 @@ import { isNative as i, nativeConfirm as a, nativeImpact as ee, nativeNotify as
 import te from "../components/parser/ParserCard.js";
 import ne from "../components/parser/ImportParserDialog.js";
 import { memo as s, useCallback as c, useMemo as l, useState as u } from "react";
-import { useParams as d } from "react-router-dom";
+import { useParams as d } from "react-router";
 import { AlertCircle as f, FileCode2 as p, Plus as m, Search as re, Upload as ie, X as ae } from "lucide-react";
 import { AuroraBackground as oe, Badge as h, Button as g, CTAOverflowMenu as _, Card as v, CardContent as y, GlassCard as b, GradientText as x, IllustratedEmptyState as S, Input as C, PagePurpose as se, Select as w, SelectContent as T, SelectItem as E, SelectTrigger as D, SelectValue as O, Spinner as ce } from "@burdenoff/fe-libs/ui";
 import { jsx as k, jsxs as A } from "react/jsx-runtime";

package/dist/bigconsole/pages/DataParsersPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataParsersPage.js","names":[],"sources":["../../../src/bigconsole/pages/DataParsersPage.tsx"],"sourcesContent":["/**\n * Data Parsers Page\n *\n * Page for listing and managing parsers with filtering and search.\n * Uses fe-libs shared UI components and semantic tokens for consistent styling.\n */\n\nimport { memo, useState, useMemo, useCallback } from 'react';\nimport { useParams } from 'react-router-dom';\nimport { useAppNavigate } from '../contexts';\nimport { isNative, nativeConfirm, nativeImpact, nativeNotify } from '../../utils/nativeBridge';\nimport { useParserStore } from '../store/parserStore';\nimport { useParserOperations } from '../hooks/useParserOperations';\nimport { useExportParser } from '../hooks/useExportParser';\nimport { ParserCard } from '../components/parser/ParserCard';\nimport { ImportParserDialog } from '../components/parser/ImportParserDialog';\nimport type { Parser, ParserType, ParserStatus } from '../types';\n\n// fe-libs UI components\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { Input } from '@burdenoff/fe-libs/ui';\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@burdenoff/fe-libs/ui';\nimport { Card, CardContent } from '@burdenoff/fe-libs/ui';\nimport { Badge } from '@burdenoff/fe-libs/ui';\nimport { Spinner } from '@burdenoff/fe-libs/ui';\nimport {\n  AuroraBackground,\n  GradientText,\n  GlassCard,\n  IllustratedEmptyState,\n  CTAOverflowMenu,\n  PagePurpose,\n} from '@burdenoff/fe-libs/ui';\n\n// Lucide icons\nimport { Plus, Search, AlertCircle, FileCode2, X, Upload } from 'lucide-react';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface ParserFilterOption<T> {\n  value: T | 'all';\n  label: string;\n}\n\n// ============================================================================\n// CONSTANTS\n// ============================================================================\n\nconst TYPE_OPTIONS: ParserFilterOption<ParserType>[] = [\n  { value: 'all', label: 'All Types' },\n  { value: 'jq', label: 'JQ' },\n  { value: 'jsonata', label: 'JSONata' },\n];\n\nconst STATUS_OPTIONS: ParserFilterOption<ParserStatus>[] = [\n  { value: 'all', label: 'All Status' },\n  { value: 'active', label: 'Active' },\n  { value: 'inactive', label: 'Inactive' },\n];\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\n// Default console ID for standalone parser listing\nconst DEFAULT_CONSOLE_ID = 'default';\n\nexport const DataParsersPage = memo(function DataParsersPage() {\n  const navigate = useAppNavigate();\n  const { consoleId: urlConsoleId } = useParams<{ consoleId?: string }>();\n\n  // Use URL consoleId or fall back to default\n  const consoleId = urlConsoleId || DEFAULT_CONSOLE_ID;\n\n  // Store state\n  const typeFilter = useParserStore((state) => state.typeFilter);\n  const statusFilter = useParserStore((state) => state.statusFilter);\n  const searchQuery = useParserStore((state) => state.searchQuery);\n  const setTypeFilter = useParserStore((state) => state.setTypeFilter);\n  const setStatusFilter = useParserStore((state) => state.setStatusFilter);\n  const setSearchQuery = useParserStore((state) => state.setSearchQuery);\n\n  // Local state\n  const [isDeleting, setIsDeleting] = useState(false);\n  const [deleteTargetId, setDeleteTargetId] = useState<string | null>(null);\n  const [isImportDialogOpen, setIsImportDialogOpen] = useState(false);\n\n  // Operations - use consoleId from URL or default\n  const { loading, error, parsers, deleteParser, refetch } = useParserOperations({\n    consoleId,\n    skipFetch: false,\n  });\n\n  // Export hook\n  const { downloadParser, loading: exportLoading } = useExportParser();\n\n  // Filter parsers\n  const filteredParsers = useMemo(() => {\n    if (!parsers) return [];\n\n    return parsers.filter((parser: Parser) => {\n      if (typeFilter && parser.type !== typeFilter) {\n        return false;\n      }\n      if (statusFilter && parser.status !== statusFilter) {\n        return false;\n      }\n      if (searchQuery) {\n        const query = searchQuery.toLowerCase();\n        const nameMatch = parser.name?.toLowerCase().includes(query);\n        const descMatch = parser.description?.toLowerCase().includes(query);\n        const inputKeyMatch = parser.inputSinkKey?.toLowerCase().includes(query);\n        const outputKeyMatch = parser.outputKey?.toLowerCase().includes(query);\n        if (!nameMatch && !descMatch && !inputKeyMatch && !outputKeyMatch) {\n          return false;\n        }\n      }\n      return true;\n    });\n  }, [parsers, typeFilter, statusFilter, searchQuery]);\n\n  // Handlers\n  const handleTypeFilterChange = useCallback(\n    (value: string) => {\n      setTypeFilter(value === 'all' ? null : (value as ParserType));\n    },\n    [setTypeFilter]\n  );\n\n  const handleStatusFilterChange = useCallback(\n    (value: string) => {\n      setStatusFilter(value === 'all' ? null : (value as ParserStatus));\n    },\n    [setStatusFilter]\n  );\n\n  const handleSearchChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      setSearchQuery(e.target.value);\n    },\n    [setSearchQuery]\n  );\n\n  const handleCreateParser = useCallback(() => {\n    // Navigate to dashboard-scoped parser creation if consoleId is provided\n    if (urlConsoleId) {\n      navigate(`/dashboards/${urlConsoleId}/parsers/new`);\n    } else {\n      navigate('/parsers/new');\n    }\n  }, [navigate, urlConsoleId]);\n\n  const handleViewParser = useCallback(\n    (id: string) => {\n      // Navigate to dashboard-scoped parser view if consoleId is provided\n      if (urlConsoleId) {\n        navigate(`/dashboards/${urlConsoleId}/parsers/${id}`);\n      } else {\n        navigate(`/parsers/${id}`);\n      }\n    },\n    [navigate, urlConsoleId]\n  );\n\n  const handleEditParser = useCallback(\n    (id: string) => {\n      // Navigate to dashboard-scoped parser edit if consoleId is provided\n      if (urlConsoleId) {\n        navigate(`/dashboards/${urlConsoleId}/parsers/${id}/edit`);\n      } else {\n        navigate(`/parsers/${id}/edit`);\n      }\n    },\n    [navigate, urlConsoleId]\n  );\n\n  const handleDeleteParser = useCallback(\n    async (id: string) => {\n      const native = await nativeConfirm({\n        title: 'Delete parser?',\n        message: 'Are you sure you want to delete this parser?',\n        okButtonTitle: 'Delete',\n        cancelButtonTitle: 'Cancel',\n      });\n      const ok = native === null ? window.confirm('Are you sure you want to delete this parser?') : native;\n      if (!ok) return;\n      nativeImpact('medium');\n      setIsDeleting(true);\n      setDeleteTargetId(id);\n      try {\n        await deleteParser(id);\n        if (isNative()) void nativeNotify('success');\n      } catch (err) {\n        if (isNative()) void nativeNotify('error');\n      } finally {\n        setIsDeleting(false);\n        setDeleteTargetId(null);\n      }\n    },\n    [deleteParser]\n  );\n\n  const handleClearFilters = useCallback(() => {\n    setTypeFilter(null);\n    setStatusFilter(null);\n    setSearchQuery('');\n  }, [setTypeFilter, setStatusFilter, setSearchQuery]);\n\n  const handleExportParser = useCallback(\n    async (id: string) => {\n      const parser = parsers.find((p: Parser) => p.id === id);\n      if (parser) {\n        await downloadParser(id, parser.name);\n      }\n    },\n    [parsers, downloadParser]\n  );\n\n  const handleImportParser = useCallback(() => {\n    setIsImportDialogOpen(true);\n  }, []);\n\n  const handleImportSuccess = useCallback(\n    (_parserId: string, _parserName: string, _wasUpdate: boolean) => {\n      // Refetch parsers to show the newly imported one\n      refetch();\n    },\n    [refetch]\n  );\n\n  const hasActiveFilters = typeFilter !== null || statusFilter !== null || (searchQuery?.length ?? 0) > 0;\n\n  // Error state\n  if (error) {\n    return (\n      <div style={{ padding: 'var(--space-pagePadding)' }}>\n        <Card\n          style={{\n            borderColor: 'var(--color-status-error-border)',\n            backgroundColor: 'var(--color-status-error-bgSubtle)',\n          }}\n        >\n          <CardContent style={{ padding: 'var(--space-pagePadding)' }}>\n            <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', textAlign: 'center' }}>\n              <div\n                style={{\n                  padding: 'var(--space-controlGap)',\n                  borderRadius: '50%',\n                  backgroundColor: 'var(--color-status-error-bgSubtle)',\n                  marginBottom: 'var(--space-formGap)',\n                }}\n              >\n                <AlertCircle\n                  style={{\n                    height: 'var(--size-icon-xl)',\n                    width: 'var(--size-icon-xl)',\n                    color: 'var(--color-status-error-text)',\n                  }}\n                />\n              </div>\n              <h3\n                style={{\n                  fontSize: 'var(--font-size-body-lg)',\n                  fontWeight: 'var(--font-weight-medium)',\n                  color: 'var(--color-status-error-text)',\n                  marginBottom: 'var(--space-controlGap)',\n                }}\n              >\n                Failed to load Parsers\n              </h3>\n              <p\n                style={{\n                  fontSize: 'var(--font-size-body-sm)',\n                  color: 'var(--color-text-secondary)',\n                  marginBottom: 'var(--space-formGap)',\n                }}\n              >\n                {error.message}\n              </p>\n              <Button size=\"sm\" onClick={() => refetch()}>\n                Try Again\n              </Button>\n            </div>\n          </CardContent>\n        </Card>\n      </div>\n    );\n  }\n\n  return (\n    <div style={{ minHeight: '100vh', backgroundColor: 'var(--color-bg-canvas)' }}>\n      {/* Header Section */}\n      <div className=\"relative overflow-hidden border-b border-border-seam bg-gloss-card\">\n        <AuroraBackground intensity=\"subtle\" />\n        <div style={{ padding: 'var(--space-pagePadding)' }}>\n          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n            <div style={{ display: 'flex', alignItems: 'center', gap: 'var(--space-formGap)' }}>\n              <div\n                style={{\n                  display: 'flex',\n                  height: 'var(--size-controlHeight-lg)',\n                  width: 'var(--size-controlHeight-lg)',\n                  alignItems: 'center',\n                  justifyContent: 'center',\n                  borderRadius: 'var(--radius-card)',\n                  backgroundColor: 'var(--color-action-primary-bg)',\n                }}\n              >\n                <FileCode2\n                  style={{\n                    height: 'var(--size-icon-lg)',\n                    width: 'var(--size-icon-lg)',\n                    color: 'var(--color-action-primary-text)',\n                  }}\n                />\n              </div>\n              <div>\n                <h1\n                  style={{\n                    fontSize: 'var(--font-size-heading-h4)',\n                    fontWeight: 'var(--font-weight-bold)',\n                    margin: 0,\n                    color: 'var(--color-text-primary)',\n                  }}\n                >\n                  <GradientText>Data Parsers</GradientText>\n                </h1>\n                <p style={{ fontSize: 'var(--font-size-body-sm)', color: 'var(--color-text-secondary)', margin: 0 }}>\n                  Transform and process data with JQ or JSONata expressions\n                </p>\n              </div>\n            </div>\n\n            <CTAOverflowMenu\n              primary={{\n                label: 'Create Parser',\n                onSelect: handleCreateParser,\n                icon: (\n                  <Plus\n                    style={{\n                      marginRight: 'var(--space-iconGap)',\n                      height: 'var(--size-icon-sm)',\n                      width: 'var(--size-icon-sm)',\n                    }}\n                  />\n                ),\n              }}\n              actions={[\n                {\n                  label: 'Import',\n                  onSelect: handleImportParser,\n                  icon: <Upload style={{ height: 'var(--size-icon-sm)', width: 'var(--size-icon-sm)' }} />,\n                },\n              ]}\n            />\n          </div>\n        </div>\n      </div>\n\n      {/* Main Content */}\n      <div style={{ padding: 'var(--space-pagePadding)' }}>\n        <PagePurpose className=\"mb-[var(--space-sectionGap)]\">\n          Parsers define how raw input — log lines, CSVs, JSON, or arbitrary text — is read and mapped into structured\n          fields. Build a parser once, test it against a sample, then reuse it across pipelines so every source lands in\n          a consistent, queryable shape.\n        </PagePurpose>\n\n        {/* Search and Filters Row */}\n        <div\n          style={{\n            display: 'flex',\n            alignItems: 'center',\n            gap: 'var(--space-controlGap)',\n            marginBottom: 'var(--space-sectionGap)',\n            flexWrap: 'wrap',\n          }}\n        >\n          {/* Search Bar */}\n          <div style={{ position: 'relative', maxWidth: '400px', flex: 1 }}>\n            <Search\n              style={{\n                position: 'absolute',\n                left: 'var(--space-controlGap)',\n                top: '50%',\n                transform: 'translateY(-50%)',\n                height: 'var(--size-icon-sm)',\n                width: 'var(--size-icon-sm)',\n                color: 'var(--color-text-muted)',\n              }}\n            />\n            <Input\n              type=\"text\"\n              placeholder=\"Search parsers...\"\n              value={searchQuery || ''}\n              onChange={handleSearchChange}\n              style={{ paddingLeft: 'var(--size-controlHeight-md)', height: 'var(--size-controlHeight-md)' }}\n            />\n          </div>\n\n          {/* Type Filter */}\n          <Select value={typeFilter || 'all'} onValueChange={handleTypeFilterChange}>\n            <SelectTrigger style={{ width: '150px' }}>\n              <SelectValue placeholder=\"All Types\" />\n            </SelectTrigger>\n            <SelectContent>\n              {TYPE_OPTIONS.map((opt) => (\n                <SelectItem key={opt.value} value={opt.value}>\n                  {opt.label}\n                </SelectItem>\n              ))}\n            </SelectContent>\n          </Select>\n\n          {/* Status Filter */}\n          <Select value={statusFilter || 'all'} onValueChange={handleStatusFilterChange}>\n            <SelectTrigger style={{ width: '150px' }}>\n              <SelectValue placeholder=\"All Status\" />\n            </SelectTrigger>\n            <SelectContent>\n              {STATUS_OPTIONS.map((opt) => (\n                <SelectItem key={opt.value} value={opt.value}>\n                  {opt.label}\n                </SelectItem>\n              ))}\n            </SelectContent>\n          </Select>\n\n          {/* Clear Filters */}\n          {hasActiveFilters && (\n            <Button variant=\"ghost\" size=\"sm\" onClick={handleClearFilters}>\n              <X\n                style={{\n                  marginRight: 'var(--space-iconGap)',\n                  height: 'var(--size-icon-sm)',\n                  width: 'var(--size-icon-sm)',\n                }}\n              />\n              Clear Filters\n            </Button>\n          )}\n\n          {/* Results Count */}\n          <Badge variant=\"secondary\" style={{ marginLeft: 'auto' }}>\n            {filteredParsers.length} {filteredParsers.length === 1 ? 'Parser' : 'Parsers'}\n          </Badge>\n        </div>\n\n        {/* Loading state */}\n        {loading && (\n          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', padding: '80px 0' }}>\n            <div style={{ textAlign: 'center' }}>\n              <Spinner\n                style={{\n                  height: 'var(--size-icon-xl)',\n                  width: 'var(--size-icon-xl)',\n                  margin: '0 auto var(--space-formGap)',\n                }}\n              />\n              <p style={{ fontSize: 'var(--font-size-body-sm)', color: 'var(--color-text-muted)' }}>\n                Loading parsers...\n              </p>\n            </div>\n          </div>\n        )}\n\n        {/* Empty state */}\n        {!loading && filteredParsers.length === 0 && !hasActiveFilters && (\n          <GlassCard treatment=\"insight\" className=\"border-border-seam\">\n            <IllustratedEmptyState\n              illustration=\"empty-data\"\n              title=\"No Parsers yet\"\n              description=\"Create your first parser to start transforming data with JQ or JSONata.\"\n              action={\n                <Button onClick={handleCreateParser}>\n                  <Plus\n                    style={{\n                      marginRight: 'var(--space-iconGap)',\n                      height: 'var(--size-icon-sm)',\n                      width: 'var(--size-icon-sm)',\n                    }}\n                  />\n                  Create Parser\n                </Button>\n              }\n            />\n          </GlassCard>\n        )}\n\n        {/* No results state */}\n        {!loading && filteredParsers.length === 0 && hasActiveFilters && (\n          <GlassCard treatment=\"insight\" className=\"border-border-seam\">\n            <IllustratedEmptyState\n              illustration=\"empty-search\"\n              title=\"No matching parsers\"\n              description=\"No parsers match your filters\"\n              action={\n                <Button variant=\"ghost\" size=\"sm\" onClick={handleClearFilters}>\n                  Clear Filters\n                </Button>\n              }\n            />\n          </GlassCard>\n        )}\n\n        {/* Parser Grid */}\n        {!loading && filteredParsers.length > 0 && (\n          <div\n            style={{\n              display: 'grid',\n              gridTemplateColumns: 'repeat(auto-fill, minmax(320px, 1fr))',\n              gap: 'var(--space-formGap)',\n            }}\n          >\n            {filteredParsers.map((parser: Parser) => (\n              <ParserCard\n                key={parser.id}\n                parser={parser}\n                onView={handleViewParser}\n                onEdit={handleEditParser}\n                onExport={handleExportParser}\n                onDelete={handleDeleteParser}\n                isDeleting={isDeleting && deleteTargetId === parser.id}\n              />\n            ))}\n          </div>\n        )}\n      </div>\n\n      {/* Import Parser Dialog */}\n      <ImportParserDialog\n        isOpen={isImportDialogOpen}\n        onClose={() => setIsImportDialogOpen(false)}\n        consoleId={consoleId}\n        onSuccess={handleImportSuccess}\n      />\n    </div>\n  );\n});\n\nexport default DataParsersPage;\n"],"mappings":"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"}
+{"version":3,"file":"DataParsersPage.js","names":[],"sources":["../../../src/bigconsole/pages/DataParsersPage.tsx"],"sourcesContent":["/**\n * Data Parsers Page\n *\n * Page for listing and managing parsers with filtering and search.\n * Uses fe-libs shared UI components and semantic tokens for consistent styling.\n */\n\nimport { memo, useState, useMemo, useCallback } from 'react';\nimport { useParams } from 'react-router';\nimport { useAppNavigate } from '../contexts';\nimport { isNative, nativeConfirm, nativeImpact, nativeNotify } from '../../utils/nativeBridge';\nimport { useParserStore } from '../store/parserStore';\nimport { useParserOperations } from '../hooks/useParserOperations';\nimport { useExportParser } from '../hooks/useExportParser';\nimport { ParserCard } from '../components/parser/ParserCard';\nimport { ImportParserDialog } from '../components/parser/ImportParserDialog';\nimport type { Parser, ParserType, ParserStatus } from '../types';\n\n// fe-libs UI components\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { Input } from '@burdenoff/fe-libs/ui';\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@burdenoff/fe-libs/ui';\nimport { Card, CardContent } from '@burdenoff/fe-libs/ui';\nimport { Badge } from '@burdenoff/fe-libs/ui';\nimport { Spinner } from '@burdenoff/fe-libs/ui';\nimport {\n  AuroraBackground,\n  GradientText,\n  GlassCard,\n  IllustratedEmptyState,\n  CTAOverflowMenu,\n  PagePurpose,\n} from '@burdenoff/fe-libs/ui';\n\n// Lucide icons\nimport { Plus, Search, AlertCircle, FileCode2, X, Upload } from 'lucide-react';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface ParserFilterOption<T> {\n  value: T | 'all';\n  label: string;\n}\n\n// ============================================================================\n// CONSTANTS\n// ============================================================================\n\nconst TYPE_OPTIONS: ParserFilterOption<ParserType>[] = [\n  { value: 'all', label: 'All Types' },\n  { value: 'jq', label: 'JQ' },\n  { value: 'jsonata', label: 'JSONata' },\n];\n\nconst STATUS_OPTIONS: ParserFilterOption<ParserStatus>[] = [\n  { value: 'all', label: 'All Status' },\n  { value: 'active', label: 'Active' },\n  { value: 'inactive', label: 'Inactive' },\n];\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\n// Default console ID for standalone parser listing\nconst DEFAULT_CONSOLE_ID = 'default';\n\nexport const DataParsersPage = memo(function DataParsersPage() {\n  const navigate = useAppNavigate();\n  const { consoleId: urlConsoleId } = useParams<{ consoleId?: string }>();\n\n  // Use URL consoleId or fall back to default\n  const consoleId = urlConsoleId || DEFAULT_CONSOLE_ID;\n\n  // Store state\n  const typeFilter = useParserStore((state) => state.typeFilter);\n  const statusFilter = useParserStore((state) => state.statusFilter);\n  const searchQuery = useParserStore((state) => state.searchQuery);\n  const setTypeFilter = useParserStore((state) => state.setTypeFilter);\n  const setStatusFilter = useParserStore((state) => state.setStatusFilter);\n  const setSearchQuery = useParserStore((state) => state.setSearchQuery);\n\n  // Local state\n  const [isDeleting, setIsDeleting] = useState(false);\n  const [deleteTargetId, setDeleteTargetId] = useState<string | null>(null);\n  const [isImportDialogOpen, setIsImportDialogOpen] = useState(false);\n\n  // Operations - use consoleId from URL or default\n  const { loading, error, parsers, deleteParser, refetch } = useParserOperations({\n    consoleId,\n    skipFetch: false,\n  });\n\n  // Export hook\n  const { downloadParser, loading: exportLoading } = useExportParser();\n\n  // Filter parsers\n  const filteredParsers = useMemo(() => {\n    if (!parsers) return [];\n\n    return parsers.filter((parser: Parser) => {\n      if (typeFilter && parser.type !== typeFilter) {\n        return false;\n      }\n      if (statusFilter && parser.status !== statusFilter) {\n        return false;\n      }\n      if (searchQuery) {\n        const query = searchQuery.toLowerCase();\n        const nameMatch = parser.name?.toLowerCase().includes(query);\n        const descMatch = parser.description?.toLowerCase().includes(query);\n        const inputKeyMatch = parser.inputSinkKey?.toLowerCase().includes(query);\n        const outputKeyMatch = parser.outputKey?.toLowerCase().includes(query);\n        if (!nameMatch && !descMatch && !inputKeyMatch && !outputKeyMatch) {\n          return false;\n        }\n      }\n      return true;\n    });\n  }, [parsers, typeFilter, statusFilter, searchQuery]);\n\n  // Handlers\n  const handleTypeFilterChange = useCallback(\n    (value: string) => {\n      setTypeFilter(value === 'all' ? null : (value as ParserType));\n    },\n    [setTypeFilter]\n  );\n\n  const handleStatusFilterChange = useCallback(\n    (value: string) => {\n      setStatusFilter(value === 'all' ? null : (value as ParserStatus));\n    },\n    [setStatusFilter]\n  );\n\n  const handleSearchChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      setSearchQuery(e.target.value);\n    },\n    [setSearchQuery]\n  );\n\n  const handleCreateParser = useCallback(() => {\n    // Navigate to dashboard-scoped parser creation if consoleId is provided\n    if (urlConsoleId) {\n      navigate(`/dashboards/${urlConsoleId}/parsers/new`);\n    } else {\n      navigate('/parsers/new');\n    }\n  }, [navigate, urlConsoleId]);\n\n  const handleViewParser = useCallback(\n    (id: string) => {\n      // Navigate to dashboard-scoped parser view if consoleId is provided\n      if (urlConsoleId) {\n        navigate(`/dashboards/${urlConsoleId}/parsers/${id}`);\n      } else {\n        navigate(`/parsers/${id}`);\n      }\n    },\n    [navigate, urlConsoleId]\n  );\n\n  const handleEditParser = useCallback(\n    (id: string) => {\n      // Navigate to dashboard-scoped parser edit if consoleId is provided\n      if (urlConsoleId) {\n        navigate(`/dashboards/${urlConsoleId}/parsers/${id}/edit`);\n      } else {\n        navigate(`/parsers/${id}/edit`);\n      }\n    },\n    [navigate, urlConsoleId]\n  );\n\n  const handleDeleteParser = useCallback(\n    async (id: string) => {\n      const native = await nativeConfirm({\n        title: 'Delete parser?',\n        message: 'Are you sure you want to delete this parser?',\n        okButtonTitle: 'Delete',\n        cancelButtonTitle: 'Cancel',\n      });\n      const ok = native === null ? window.confirm('Are you sure you want to delete this parser?') : native;\n      if (!ok) return;\n      nativeImpact('medium');\n      setIsDeleting(true);\n      setDeleteTargetId(id);\n      try {\n        await deleteParser(id);\n        if (isNative()) void nativeNotify('success');\n      } catch (err) {\n        if (isNative()) void nativeNotify('error');\n      } finally {\n        setIsDeleting(false);\n        setDeleteTargetId(null);\n      }\n    },\n    [deleteParser]\n  );\n\n  const handleClearFilters = useCallback(() => {\n    setTypeFilter(null);\n    setStatusFilter(null);\n    setSearchQuery('');\n  }, [setTypeFilter, setStatusFilter, setSearchQuery]);\n\n  const handleExportParser = useCallback(\n    async (id: string) => {\n      const parser = parsers.find((p: Parser) => p.id === id);\n      if (parser) {\n        await downloadParser(id, parser.name);\n      }\n    },\n    [parsers, downloadParser]\n  );\n\n  const handleImportParser = useCallback(() => {\n    setIsImportDialogOpen(true);\n  }, []);\n\n  const handleImportSuccess = useCallback(\n    (_parserId: string, _parserName: string, _wasUpdate: boolean) => {\n      // Refetch parsers to show the newly imported one\n      refetch();\n    },\n    [refetch]\n  );\n\n  const hasActiveFilters = typeFilter !== null || statusFilter !== null || (searchQuery?.length ?? 0) > 0;\n\n  // Error state\n  if (error) {\n    return (\n      <div style={{ padding: 'var(--space-pagePadding)' }}>\n        <Card\n          style={{\n            borderColor: 'var(--color-status-error-border)',\n            backgroundColor: 'var(--color-status-error-bgSubtle)',\n          }}\n        >\n          <CardContent style={{ padding: 'var(--space-pagePadding)' }}>\n            <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', textAlign: 'center' }}>\n              <div\n                style={{\n                  padding: 'var(--space-controlGap)',\n                  borderRadius: '50%',\n                  backgroundColor: 'var(--color-status-error-bgSubtle)',\n                  marginBottom: 'var(--space-formGap)',\n                }}\n              >\n                <AlertCircle\n                  style={{\n                    height: 'var(--size-icon-xl)',\n                    width: 'var(--size-icon-xl)',\n                    color: 'var(--color-status-error-text)',\n                  }}\n                />\n              </div>\n              <h3\n                style={{\n                  fontSize: 'var(--font-size-body-lg)',\n                  fontWeight: 'var(--font-weight-medium)',\n                  color: 'var(--color-status-error-text)',\n                  marginBottom: 'var(--space-controlGap)',\n                }}\n              >\n                Failed to load Parsers\n              </h3>\n              <p\n                style={{\n                  fontSize: 'var(--font-size-body-sm)',\n                  color: 'var(--color-text-secondary)',\n                  marginBottom: 'var(--space-formGap)',\n                }}\n              >\n                {error.message}\n              </p>\n              <Button size=\"sm\" onClick={() => refetch()}>\n                Try Again\n              </Button>\n            </div>\n          </CardContent>\n        </Card>\n      </div>\n    );\n  }\n\n  return (\n    <div style={{ minHeight: '100vh', backgroundColor: 'var(--color-bg-canvas)' }}>\n      {/* Header Section */}\n      <div className=\"relative overflow-hidden border-b border-border-seam bg-gloss-card\">\n        <AuroraBackground intensity=\"subtle\" />\n        <div style={{ padding: 'var(--space-pagePadding)' }}>\n          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n            <div style={{ display: 'flex', alignItems: 'center', gap: 'var(--space-formGap)' }}>\n              <div\n                style={{\n                  display: 'flex',\n                  height: 'var(--size-controlHeight-lg)',\n                  width: 'var(--size-controlHeight-lg)',\n                  alignItems: 'center',\n                  justifyContent: 'center',\n                  borderRadius: 'var(--radius-card)',\n                  backgroundColor: 'var(--color-action-primary-bg)',\n                }}\n              >\n                <FileCode2\n                  style={{\n                    height: 'var(--size-icon-lg)',\n                    width: 'var(--size-icon-lg)',\n                    color: 'var(--color-action-primary-text)',\n                  }}\n                />\n              </div>\n              <div>\n                <h1\n                  style={{\n                    fontSize: 'var(--font-size-heading-h4)',\n                    fontWeight: 'var(--font-weight-bold)',\n                    margin: 0,\n                    color: 'var(--color-text-primary)',\n                  }}\n                >\n                  <GradientText>Data Parsers</GradientText>\n                </h1>\n                <p style={{ fontSize: 'var(--font-size-body-sm)', color: 'var(--color-text-secondary)', margin: 0 }}>\n                  Transform and process data with JQ or JSONata expressions\n                </p>\n              </div>\n            </div>\n\n            <CTAOverflowMenu\n              primary={{\n                label: 'Create Parser',\n                onSelect: handleCreateParser,\n                icon: (\n                  <Plus\n                    style={{\n                      marginRight: 'var(--space-iconGap)',\n                      height: 'var(--size-icon-sm)',\n                      width: 'var(--size-icon-sm)',\n                    }}\n                  />\n                ),\n              }}\n              actions={[\n                {\n                  label: 'Import',\n                  onSelect: handleImportParser,\n                  icon: <Upload style={{ height: 'var(--size-icon-sm)', width: 'var(--size-icon-sm)' }} />,\n                },\n              ]}\n            />\n          </div>\n        </div>\n      </div>\n\n      {/* Main Content */}\n      <div style={{ padding: 'var(--space-pagePadding)' }}>\n        <PagePurpose className=\"mb-[var(--space-sectionGap)]\">\n          Parsers define how raw input — log lines, CSVs, JSON, or arbitrary text — is read and mapped into structured\n          fields. Build a parser once, test it against a sample, then reuse it across pipelines so every source lands in\n          a consistent, queryable shape.\n        </PagePurpose>\n\n        {/* Search and Filters Row */}\n        <div\n          style={{\n            display: 'flex',\n            alignItems: 'center',\n            gap: 'var(--space-controlGap)',\n            marginBottom: 'var(--space-sectionGap)',\n            flexWrap: 'wrap',\n          }}\n        >\n          {/* Search Bar */}\n          <div style={{ position: 'relative', maxWidth: '400px', flex: 1 }}>\n            <Search\n              style={{\n                position: 'absolute',\n                left: 'var(--space-controlGap)',\n                top: '50%',\n                transform: 'translateY(-50%)',\n                height: 'var(--size-icon-sm)',\n                width: 'var(--size-icon-sm)',\n                color: 'var(--color-text-muted)',\n              }}\n            />\n            <Input\n              type=\"text\"\n              placeholder=\"Search parsers...\"\n              value={searchQuery || ''}\n              onChange={handleSearchChange}\n              style={{ paddingLeft: 'var(--size-controlHeight-md)', height: 'var(--size-controlHeight-md)' }}\n            />\n          </div>\n\n          {/* Type Filter */}\n          <Select value={typeFilter || 'all'} onValueChange={handleTypeFilterChange}>\n            <SelectTrigger style={{ width: '150px' }}>\n              <SelectValue placeholder=\"All Types\" />\n            </SelectTrigger>\n            <SelectContent>\n              {TYPE_OPTIONS.map((opt) => (\n                <SelectItem key={opt.value} value={opt.value}>\n                  {opt.label}\n                </SelectItem>\n              ))}\n            </SelectContent>\n          </Select>\n\n          {/* Status Filter */}\n          <Select value={statusFilter || 'all'} onValueChange={handleStatusFilterChange}>\n            <SelectTrigger style={{ width: '150px' }}>\n              <SelectValue placeholder=\"All Status\" />\n            </SelectTrigger>\n            <SelectContent>\n              {STATUS_OPTIONS.map((opt) => (\n                <SelectItem key={opt.value} value={opt.value}>\n                  {opt.label}\n                </SelectItem>\n              ))}\n            </SelectContent>\n          </Select>\n\n          {/* Clear Filters */}\n          {hasActiveFilters && (\n            <Button variant=\"ghost\" size=\"sm\" onClick={handleClearFilters}>\n              <X\n                style={{\n                  marginRight: 'var(--space-iconGap)',\n                  height: 'var(--size-icon-sm)',\n                  width: 'var(--size-icon-sm)',\n                }}\n              />\n              Clear Filters\n            </Button>\n          )}\n\n          {/* Results Count */}\n          <Badge variant=\"secondary\" style={{ marginLeft: 'auto' }}>\n            {filteredParsers.length} {filteredParsers.length === 1 ? 'Parser' : 'Parsers'}\n          </Badge>\n        </div>\n\n        {/* Loading state */}\n        {loading && (\n          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', padding: '80px 0' }}>\n            <div style={{ textAlign: 'center' }}>\n              <Spinner\n                style={{\n                  height: 'var(--size-icon-xl)',\n                  width: 'var(--size-icon-xl)',\n                  margin: '0 auto var(--space-formGap)',\n                }}\n              />\n              <p style={{ fontSize: 'var(--font-size-body-sm)', color: 'var(--color-text-muted)' }}>\n                Loading parsers...\n              </p>\n            </div>\n          </div>\n        )}\n\n        {/* Empty state */}\n        {!loading && filteredParsers.length === 0 && !hasActiveFilters && (\n          <GlassCard treatment=\"insight\" className=\"border-border-seam\">\n            <IllustratedEmptyState\n              illustration=\"empty-data\"\n              title=\"No Parsers yet\"\n              description=\"Create your first parser to start transforming data with JQ or JSONata.\"\n              action={\n                <Button onClick={handleCreateParser}>\n                  <Plus\n                    style={{\n                      marginRight: 'var(--space-iconGap)',\n                      height: 'var(--size-icon-sm)',\n                      width: 'var(--size-icon-sm)',\n                    }}\n                  />\n                  Create Parser\n                </Button>\n              }\n            />\n          </GlassCard>\n        )}\n\n        {/* No results state */}\n        {!loading && filteredParsers.length === 0 && hasActiveFilters && (\n          <GlassCard treatment=\"insight\" className=\"border-border-seam\">\n            <IllustratedEmptyState\n              illustration=\"empty-search\"\n              title=\"No matching parsers\"\n              description=\"No parsers match your filters\"\n              action={\n                <Button variant=\"ghost\" size=\"sm\" onClick={handleClearFilters}>\n                  Clear Filters\n                </Button>\n              }\n            />\n          </GlassCard>\n        )}\n\n        {/* Parser Grid */}\n        {!loading && filteredParsers.length > 0 && (\n          <div\n            style={{\n              display: 'grid',\n              gridTemplateColumns: 'repeat(auto-fill, minmax(320px, 1fr))',\n              gap: 'var(--space-formGap)',\n            }}\n          >\n            {filteredParsers.map((parser: Parser) => (\n              <ParserCard\n                key={parser.id}\n                parser={parser}\n                onView={handleViewParser}\n                onEdit={handleEditParser}\n                onExport={handleExportParser}\n                onDelete={handleDeleteParser}\n                isDeleting={isDeleting && deleteTargetId === parser.id}\n              />\n            ))}\n          </div>\n        )}\n      </div>\n\n      {/* Import Parser Dialog */}\n      <ImportParserDialog\n        isOpen={isImportDialogOpen}\n        onClose={() => setIsImportDialogOpen(false)}\n        consoleId={consoleId}\n        onSuccess={handleImportSuccess}\n      />\n    </div>\n  );\n});\n\nexport default DataParsersPage;\n"],"mappings":"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"}

package/dist/bigconsole/pages/DataSinkBuilderPage.js

@@ -5,7 +5,7 @@ import { isNative as n, nativeCopyText as ee, nativeToast as te } from "../../ut
 import r from "../components/datasink/CacheTTLSelector.js";
 import ne from "../components/datasink/RefreshTypeSelector.js";
 import { memo as i, useCallback as a, useEffect as o, useMemo as re, useState as s } from "react";
-import { useParams as ie } from "react-router-dom";
+import { useParams as ie } from "react-router";
 import { AlertCircle as c, ArrowLeft as l, Check as ae, Copy as oe, Database as u, Eye as d, Loader2 as f, Save as se, Settings as ce } from "lucide-react";
 import { Button as p, Card as m, CardContent as h, CardHeader as g, CardTitle as _, GlassCard as le, IllustratedEmptyState as v, Input as y, Label as b, PagePurpose as ue, Textarea as x } from "@burdenoff/fe-libs/ui";
 import { Fragment as S, jsx as C, jsxs as w } from "react/jsx-runtime";

package/dist/bigconsole/pages/DataSinkBuilderPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataSinkBuilderPage.js","names":[],"sources":["../../../src/bigconsole/pages/DataSinkBuilderPage.tsx"],"sourcesContent":["/**\n * DataSink Builder Page\n *\n * Simplified page for creating and editing DataSinks.\n * DataSinks are now standalone - workflows push data to them via unique keys.\n * Required fields: name, key\n */\n\nimport { memo, useState, useMemo, useEffect, useCallback } from 'react';\nimport { useParams } from 'react-router-dom';\nimport { useAppNavigate } from '../contexts';\nimport { isNative, nativeCopyText, nativeToast } from '../../utils/nativeBridge';\nimport { useDataSinkOperations } from '../hooks/useDataSinkOperations';\nimport { CacheTTLSelector } from '../components/datasink/CacheTTLSelector';\nimport { RefreshTypeSelector } from '../components/datasink/RefreshTypeSelector';\nimport type { CreateDataSinkInput, UpdateDataSinkInput, DataSinkRefreshType } from '../types';\n\n// fe-libs UI components\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { Input } from '@burdenoff/fe-libs/ui';\nimport { Textarea } from '@burdenoff/fe-libs/ui';\nimport { Label } from '@burdenoff/fe-libs/ui';\nimport { Card, CardContent, CardHeader, CardTitle } from '@burdenoff/fe-libs/ui';\nimport { GlassCard, IllustratedEmptyState, PagePurpose } from '@burdenoff/fe-libs/ui';\n\n// Lucide icons\nimport { ArrowLeft, Save, Loader2, AlertCircle, Database, Settings, Eye, Copy, Check } from 'lucide-react';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface RefreshConfig {\n  type: 'manual' | 'scheduled';\n  schedule?: {\n    cron: string;\n    timezone: string;\n  };\n}\n\ninterface FormState {\n  name: string;\n  key: string;\n  description: string;\n  ttl: number;\n  refresh: RefreshConfig;\n  data: string; // JSON string for data payload\n}\n\ninterface FormErrors {\n  name?: string;\n  key?: string;\n  data?: string;\n}\n\n// ============================================================================\n// HELPERS\n// ============================================================================\n\n/**\n * Generate a key from name (slug format)\n */\nfunction generateKey(name: string): string {\n  return name\n    .toLowerCase()\n    .replace(/[^a-z0-9]+/g, '_')\n    .replace(/^_+|_+$/g, '')\n    .substring(0, 64);\n}\n\n/**\n * Validate form data\n */\nfunction validateForm(form: FormState): FormErrors {\n  const errors: FormErrors = {};\n\n  if (!form.name.trim()) {\n    errors.name = 'Name is required';\n  } else if (form.name.length < 2) {\n    errors.name = 'Name must be at least 2 characters';\n  } else if (form.name.length > 100) {\n    errors.name = 'Name must be less than 100 characters';\n  }\n\n  if (!form.key.trim()) {\n    errors.key = 'Key is required';\n  } else if (!/^[a-z0-9_]+$/.test(form.key)) {\n    errors.key = 'Key can only contain lowercase letters, numbers, and underscores';\n  } else if (form.key.length > 64) {\n    errors.key = 'Key must be less than 64 characters';\n  }\n\n  // Validate JSON data if provided\n  if (form.data && form.data.trim()) {\n    try {\n      JSON.parse(form.data);\n    } catch {\n      errors.data = 'Invalid JSON format';\n    }\n  }\n\n  return errors;\n}\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const DataSinkBuilderPage = memo(function DataSinkBuilderPage() {\n  const { dataSinkId } = useParams<{ dataSinkId?: string }>();\n  const navigate = useAppNavigate();\n\n  const isEdit = dataSinkId !== 'new' && !!dataSinkId;\n\n  // Form state\n  const [form, setForm] = useState<FormState>({\n    name: '',\n    key: '',\n    description: '',\n    ttl: 300, // 5 minutes default\n    refresh: {\n      type: 'manual',\n    },\n    data: '{}', // Default empty JSON object\n  });\n  const [errors, setErrors] = useState<FormErrors>({});\n  const [keyManuallyEdited, setKeyManuallyEdited] = useState(false);\n  const [isSaving, setIsSaving] = useState(false);\n  const [submitError, setSubmitError] = useState<string | null>(null);\n  const [keyCopied, setKeyCopied] = useState(false);\n\n  // Data preview state\n  const [isLoadingPreview, setIsLoadingPreview] = useState(false);\n  const [previewData, setPreviewData] = useState<unknown[] | null>(null);\n  const [previewError, setPreviewError] = useState<string | null>(null);\n\n  // Operations\n  const { loading, error, dataSinks, fetchDataSink, createDataSink, updateDataSink, getDataSinkData } =\n    useDataSinkOperations({\n      skipFetch: true,\n    });\n\n  // Get existing data sink if editing\n  const existingDataSink = isEdit ? dataSinks.find((ds) => ds.id === dataSinkId) : null;\n\n  // Load existing data sink for editing\n  useEffect(() => {\n    if (isEdit && dataSinkId && !existingDataSink) {\n      fetchDataSink(dataSinkId);\n    }\n  }, [isEdit, dataSinkId, existingDataSink, fetchDataSink]);\n\n  // Track if form has been initialized\n  const [formInitialized, setFormInitialized] = useState(false);\n\n  // Populate form with existing data when editing (only once)\n  useEffect(() => {\n    if (existingDataSink && !formInitialized) {\n      // Format existing data as pretty JSON string\n      let dataString = '';\n      if (existingDataSink.data) {\n        try {\n          // Check if data is already a string (JSON string from API)\n          if (typeof existingDataSink.data === 'string') {\n            // Parse and re-stringify to ensure proper formatting\n            const parsed = JSON.parse(existingDataSink.data);\n            dataString = JSON.stringify(parsed, null, 2);\n          } else {\n            // It's an object, just stringify it\n            dataString = JSON.stringify(existingDataSink.data, null, 2);\n          }\n        } catch {\n          // If parsing fails, use as-is if string, otherwise empty\n          dataString = typeof existingDataSink.data === 'string' ? existingDataSink.data : '';\n        }\n      }\n\n      setForm({\n        name: existingDataSink.name || '',\n        key: existingDataSink.key || '',\n        description: existingDataSink.description || '',\n        ttl: existingDataSink.ttl || 300,\n        refresh: existingDataSink.refresh\n          ? {\n              type: existingDataSink.refresh.type === 'scheduled' ? 'scheduled' : 'manual',\n              schedule: existingDataSink.refresh.schedule\n                ? {\n                    cron: existingDataSink.refresh.schedule.cron,\n                    timezone: existingDataSink.refresh.schedule.timezone,\n                  }\n                : undefined,\n            }\n          : { type: 'manual' },\n        data: dataString,\n      });\n      setKeyManuallyEdited(true); // Don't auto-generate key when editing\n      setFormInitialized(true); // Mark as initialized\n      setErrors({}); // Clear any errors\n    }\n  }, [existingDataSink, formInitialized]);\n\n  // Auto-generate key from name\n  const handleNameChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const name = e.target.value;\n      setForm((prev) => ({\n        ...prev,\n        name,\n        key: keyManuallyEdited ? prev.key : generateKey(name),\n      }));\n      setErrors((prev) => ({ ...prev, name: undefined }));\n    },\n    [keyManuallyEdited]\n  );\n\n  // Handle key change\n  const handleKeyChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n    const key = e.target.value.toLowerCase().replace(/[^a-z0-9_]/g, '');\n    setForm((prev) => ({ ...prev, key }));\n    setKeyManuallyEdited(true);\n    setErrors((prev) => ({ ...prev, key: undefined }));\n  }, []);\n\n  // Handle description change\n  const handleDescriptionChange = useCallback((e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    setForm((prev) => ({ ...prev, description: e.target.value }));\n  }, []);\n\n  // Handle TTL change\n  const handleTTLChange = useCallback((ttl: number | null) => {\n    setForm((prev) => ({ ...prev, ttl: ttl || 0 }));\n  }, []);\n\n  // Handle refresh config change\n  const handleRefreshChange = useCallback((config: RefreshConfig) => {\n    setForm((prev) => ({ ...prev, refresh: config }));\n  }, []);\n\n  // Handle data change\n  const handleDataChange = useCallback((e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    setForm((prev) => ({ ...prev, data: e.target.value }));\n    setErrors((prev) => ({ ...prev, data: undefined }));\n  }, []);\n\n  // Format JSON data\n  const handleFormatData = useCallback(() => {\n    try {\n      const parsed = JSON.parse(form.data);\n      setForm((prev) => ({ ...prev, data: JSON.stringify(parsed, null, 2) }));\n      setErrors((prev) => ({ ...prev, data: undefined }));\n    } catch {\n      setErrors((prev) => ({ ...prev, data: 'Invalid JSON format' }));\n    }\n  }, [form.data]);\n\n  // Copy key to clipboard\n  const handleCopyKey = useCallback(async () => {\n    if (form.key) {\n      await nativeCopyText(form.key);\n      setKeyCopied(true);\n      if (isNative()) void nativeToast('Key copied');\n      setTimeout(() => setKeyCopied(false), 2000);\n    }\n  }, [form.key]);\n\n  // Handle back navigation\n  const handleBack = useCallback(() => {\n    navigate('/datasinks');\n  }, [navigate]);\n\n  // Load data preview\n  const handleShowData = useCallback(async () => {\n    if (!isEdit || !existingDataSink) return;\n\n    setIsLoadingPreview(true);\n    setPreviewError(null);\n\n    try {\n      const result = await getDataSinkData({ key: existingDataSink.key });\n      if (result?.raw) {\n        // Get first 20 items if it's an array, otherwise wrap in array\n        const data = Array.isArray(result.raw) ? result.raw.slice(0, 20) : [result.raw];\n        setPreviewData(data);\n      } else {\n        setPreviewData([]);\n      }\n    } catch (err) {\n      setPreviewError(err instanceof Error ? err.message : 'Failed to load data');\n    } finally {\n      setIsLoadingPreview(false);\n    }\n  }, [isEdit, existingDataSink, getDataSinkData]);\n\n  // Handle form submission\n  const handleSubmit = useCallback(\n    async (e: React.FormEvent) => {\n      e.preventDefault();\n      setSubmitError(null);\n\n      // Validate form\n      const validationErrors = validateForm(form);\n      if (Object.keys(validationErrors).length > 0) {\n        setErrors(validationErrors);\n        return;\n      }\n\n      setIsSaving(true);\n      try {\n        // Parse data JSON\n        let parsedData: Record<string, unknown> = {};\n        if (form.data && form.data.trim()) {\n          try {\n            parsedData = JSON.parse(form.data) as Record<string, unknown>;\n          } catch {\n            setErrors((prev) => ({ ...prev, data: 'Invalid JSON format' }));\n            setIsSaving(false);\n            return;\n          }\n        }\n\n        if (isEdit && existingDataSink) {\n          // Update existing\n          const input: UpdateDataSinkInput = {\n            id: existingDataSink.id,\n            version: existingDataSink.version,\n            name: form.name,\n            description: form.description || undefined,\n            ttl: form.ttl,\n            refresh: {\n              type: form.refresh.type as DataSinkRefreshType,\n              schedule: form.refresh.schedule,\n            },\n            data: parsedData, // Include data in update\n          };\n          const result = await updateDataSink(input);\n          if (!result) {\n            throw new Error('Failed to update DataSink');\n          }\n        } else {\n          // Create new - simplified flow (standalone DataSinks)\n          const input: CreateDataSinkInput = {\n            key: form.key,\n            name: form.name,\n            description: form.description || undefined,\n            ttl: form.ttl,\n            refresh: {\n              type: form.refresh.type as DataSinkRefreshType,\n              schedule: form.refresh.schedule,\n            },\n            data: parsedData, // Include data in create\n          };\n          const result = await createDataSink(input);\n          if (!result) {\n            throw new Error('Failed to create DataSink');\n          }\n        }\n        navigate('/datasinks');\n      } catch (err) {\n        setSubmitError(err instanceof Error ? err.message : 'Failed to save DataSink');\n      } finally {\n        setIsSaving(false);\n      }\n    },\n    [form, isEdit, existingDataSink, createDataSink, updateDataSink, navigate]\n  );\n\n  // Check if form is valid\n  const isFormValid = useMemo(() => {\n    const nameValid = form.name.trim().length >= 2;\n    const keyValid = form.key.trim().length > 0;\n\n    // Check JSON validity if data is provided\n    let dataValid = true;\n    if (form.data && form.data.trim()) {\n      try {\n        JSON.parse(form.data);\n      } catch {\n        dataValid = false;\n      }\n    }\n\n    return nameValid && keyValid && dataValid;\n  }, [form.name, form.key, form.data]);\n\n  // Loading state\n  if (loading && isEdit) {\n    return (\n      <div className=\"flex items-center justify-center min-h-[400px]\">\n        <Loader2 className=\"w-8 h-8 text-text-secondary animate-spin\" />\n      </div>\n    );\n  }\n\n  // Error state\n  if (error) {\n    return (\n      <div className=\"flex items-center justify-center min-h-[400px] p-card-padding\">\n        <div className=\"text-center\">\n          <AlertCircle className=\"w-12 h-12 text-status-error-text mx-auto mb-4\" />\n          <p className=\"text-status-error-text text-body-sm font-medium mb-2\">Failed to load DataSink</p>\n          <p className=\"text-text-tertiary text-body-xs\">{error.message}</p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"min-h-screen bg-bg-canvas\">\n      <div className=\"max-w-3xl mx-auto p-card-padding\">\n        {/* Header */}\n        <div className=\"mb-6\">\n          <Button onClick={handleBack} variant=\"ghost\" size=\"sm\" className=\"mb-4\">\n            <ArrowLeft className=\"w-4 h-4 mr-2\" />\n            Back to DataSinks\n          </Button>\n          <h1 className=\"text-heading-h1 font-bold text-text-primary\">\n            {isEdit ? 'Edit DataSink' : 'Create DataSink'}\n          </h1>\n          <p className=\"text-body-sm text-text-secondary mt-1\">\n            {isEdit\n              ? 'Update the DataSink configuration.'\n              : 'Create a new DataSink to store and cache data. Use the unique key to connect workflows.'}\n          </p>\n        </div>\n\n        {/* Error Alert */}\n        {submitError && (\n          <div className=\"mb-6 p-4 bg-status-error-bg/10 border border-status-error-border/30 rounded-lg flex items-start gap-3\">\n            <AlertCircle className=\"w-5 h-5 text-status-error-text flex-shrink-0 mt-0.5\" />\n            <div>\n              <p className=\"text-sm font-medium text-status-error-text\">Failed to save DataSink</p>\n              <p className=\"text-xs text-status-error-text/80 mt-1\">{submitError}</p>\n            </div>\n          </div>\n        )}\n\n        <PagePurpose className=\"mb-6\">\n          A data sink is the named, structured store your dashboards read from. Give it a unique key, configure how long\n          data is cached and how it refreshes, then point a workflow at that key to push data in. Get the basics right\n          here and everything downstream connects to it.\n        </PagePurpose>\n\n        {/* Form */}\n        <form onSubmit={handleSubmit} className=\"space-y-6\">\n          {/* Basic Information — primary emphasis zone */}\n          <GlassCard treatment=\"glass\" glow>\n            <CardHeader className=\"pb-4\">\n              <div className=\"flex items-center gap-3\">\n                <div className=\"w-8 h-8 rounded-full bg-action-primary-bg/10 flex items-center justify-center\">\n                  <Database className=\"w-4 h-4 text-action-primary-bg\" />\n                </div>\n                <div>\n                  <CardTitle className=\"text-base\">Basic Information</CardTitle>\n                  <p className=\"text-xs text-text-secondary mt-0.5\">Essential details for your DataSink</p>\n                </div>\n              </div>\n            </CardHeader>\n            <CardContent className=\"space-y-5\">\n              {/* Name field */}\n              <div className=\"space-y-2\">\n                <Label htmlFor=\"name\">\n                  Name <span className=\"text-status-error-text\">*</span>\n                </Label>\n                <Input\n                  id=\"name\"\n                  type=\"text\"\n                  value={form.name}\n                  onChange={handleNameChange}\n                  placeholder=\"e.g., Sales Metrics\"\n                  className={errors.name ? 'border-status-error-border' : ''}\n                />\n                {errors.name && <p className=\"text-body-xs text-status-error-text\">{errors.name}</p>}\n              </div>\n\n              {/* Key field */}\n              <div className=\"space-y-2\">\n                <Label htmlFor=\"key\">\n                  Unique Key <span className=\"text-status-error-text\">*</span>\n                </Label>\n                <div className=\"flex gap-2\">\n                  <Input\n                    id=\"key\"\n                    type=\"text\"\n                    value={form.key}\n                    onChange={handleKeyChange}\n                    placeholder=\"sales_metrics\"\n                    disabled={isEdit}\n                    className={`font-mono flex-1 ${errors.key ? 'border-status-error-border' : ''}`}\n                  />\n                  {form.key && (\n                    <Button type=\"button\" onClick={handleCopyKey} variant=\"outline\" size=\"sm\" className=\"px-3\">\n                      {keyCopied ? (\n                        <Check className=\"w-4 h-4 text-status-success-text\" />\n                      ) : (\n                        <Copy className=\"w-4 h-4\" />\n                      )}\n                    </Button>\n                  )}\n                </div>\n                {errors.key && <p className=\"text-body-xs text-status-error-text\">{errors.key}</p>}\n                <p className=\"text-body-xs text-text-tertiary\">\n                  {isEdit\n                    ? 'Key cannot be changed. Use this key in your workflows to push data.'\n                    : 'Auto-generated from name. This key will be used by workflows to push data.'}\n                </p>\n              </div>\n\n              {/* Description field */}\n              <div className=\"space-y-2\">\n                <Label htmlFor=\"description\">Description</Label>\n                <Textarea\n                  id=\"description\"\n                  value={form.description}\n                  onChange={handleDescriptionChange}\n                  placeholder=\"Describe what data this sink stores...\"\n                  rows={2}\n                  className=\"resize-none\"\n                />\n              </div>\n            </CardContent>\n          </GlassCard>\n\n          {/* Configuration */}\n          <Card>\n            <CardHeader className=\"pb-4\">\n              <div className=\"flex items-center gap-3\">\n                <div className=\"w-8 h-8 rounded-full bg-action-primary-bg/10 flex items-center justify-center\">\n                  <Settings className=\"w-4 h-4 text-action-primary-bg\" />\n                </div>\n                <div>\n                  <CardTitle className=\"text-base\">Configuration</CardTitle>\n                  <p className=\"text-xs text-text-secondary mt-0.5\">Cache and refresh settings</p>\n                </div>\n              </div>\n            </CardHeader>\n            <CardContent className=\"space-y-5\">\n              {/* Cache TTL */}\n              <div className=\"space-y-2\">\n                <Label>Cache Duration</Label>\n                <CacheTTLSelector value={form.ttl} onChange={handleTTLChange} />\n                <p className=\"text-body-xs text-text-tertiary\">\n                  How long cached data remains valid before requiring refresh.\n                </p>\n              </div>\n\n              {/* Refresh Type */}\n              <RefreshTypeSelector value={form.refresh} onChange={handleRefreshChange} />\n            </CardContent>\n          </Card>\n\n          {/* Data Payload */}\n          <Card>\n            <CardHeader className=\"pb-4\">\n              <div className=\"flex items-center justify-between\">\n                <div className=\"flex items-center gap-3\">\n                  <div className=\"w-8 h-8 rounded-full bg-action-primary-bg/10 flex items-center justify-center\">\n                    <Database className=\"w-4 h-4 text-action-primary-bg\" />\n                  </div>\n                  <div>\n                    <CardTitle className=\"text-base\">Data Payload</CardTitle>\n                    <p className=\"text-xs text-text-secondary mt-0.5\">\n                      {isEdit ? 'Edit the JSON data stored in this DataSink' : 'Optional initial data (JSON format)'}\n                    </p>\n                  </div>\n                </div>\n                <Button type=\"button\" onClick={handleFormatData} variant=\"outline\" size=\"sm\">\n                  Format JSON\n                </Button>\n              </div>\n            </CardHeader>\n            <CardContent>\n              <div className=\"space-y-2\">\n                <Textarea\n                  value={form.data}\n                  onChange={handleDataChange}\n                  placeholder='{\"key\": \"value\"}'\n                  rows={10}\n                  className={`font-mono text-xs resize-y ${errors.data ? 'border-status-error-border' : ''}`}\n                />\n                {errors.data && <p className=\"text-body-xs text-status-error-text\">{errors.data}</p>}\n                <p className=\"text-body-xs text-text-tertiary\">\n                  Enter valid JSON data. This data will be stored and can be accessed by widgets via parsers.\n                </p>\n              </div>\n            </CardContent>\n          </Card>\n\n          {/* Data Preview - Only show for existing DataSinks */}\n          {isEdit && existingDataSink && (\n            <Card>\n              <CardHeader className=\"pb-4\">\n                <div className=\"flex items-center justify-between\">\n                  <div className=\"flex items-center gap-3\">\n                    <div className=\"w-8 h-8 rounded-full bg-action-primary-bg/10 flex items-center justify-center\">\n                      <Eye className=\"w-4 h-4 text-action-primary-bg\" />\n                    </div>\n                    <div>\n                      <CardTitle className=\"text-base\">Data Preview</CardTitle>\n                      <p className=\"text-xs text-text-secondary mt-0.5\">Preview the first 20 records</p>\n                    </div>\n                  </div>\n                  <Button\n                    type=\"button\"\n                    onClick={handleShowData}\n                    variant=\"outline\"\n                    size=\"sm\"\n                    disabled={isLoadingPreview}\n                  >\n                    {isLoadingPreview ? (\n                      <>\n                        <Loader2 className=\"w-4 h-4 mr-2 animate-spin\" />\n                        Loading...\n                      </>\n                    ) : (\n                      <>\n                        <Eye className=\"w-4 h-4 mr-2\" />\n                        Show Data\n                      </>\n                    )}\n                  </Button>\n                </div>\n              </CardHeader>\n              {(previewData || previewError) && (\n                <CardContent>\n                  {previewError ? (\n                    <div className=\"p-4 bg-status-error-bg/10 border border-status-error-border/30 rounded-md\">\n                      <p className=\"text-sm text-status-error-text\">{previewError}</p>\n                    </div>\n                  ) : previewData && previewData.length > 0 ? (\n                    <pre className=\"p-4 bg-bg-sunken rounded-md overflow-auto max-h-[300px] text-xs font-mono\">\n                      {JSON.stringify(previewData, null, 2)}\n                    </pre>\n                  ) : (\n                    <IllustratedEmptyState\n                      illustration=\"empty-generic\"\n                      title=\"No data available yet\"\n                      description=\"Connect a workflow to this sink's key to start pushing data.\"\n                    />\n                  )}\n                </CardContent>\n              )}\n            </Card>\n          )}\n\n          {/* Submit */}\n          <div className=\"flex items-center justify-end gap-4 pt-4\">\n            <Button type=\"button\" onClick={handleBack} variant=\"secondary\">\n              Cancel\n            </Button>\n            <Button type=\"submit\" disabled={!isFormValid || isSaving} variant=\"default\">\n              {isSaving ? (\n                <>\n                  <Loader2 className=\"w-4 h-4 mr-2 animate-spin\" />\n                  Saving...\n                </>\n              ) : (\n                <>\n                  <Save className=\"w-4 h-4 mr-2\" />\n                  {isEdit ? 'Save Changes' : 'Create DataSink'}\n                </>\n              )}\n            </Button>\n          </div>\n        </form>\n\n        {/* Info Box for New DataSinks */}\n        {!isEdit && (\n          <div className=\"mt-6 p-4 bg-bg-sunken rounded-lg border border-border-default\">\n            <h3 className=\"text-sm font-medium text-text-primary mb-2\">What&apos;s Next?</h3>\n            <ol className=\"list-decimal list-inside text-xs text-text-secondary space-y-1\">\n              <li>Create this DataSink to get your unique key</li>\n              <li>\n                Go to <strong>Workflows</strong> and create a FluidGrids workflow\n              </li>\n              <li>Use the unique key in your workflow to push data to this DataSink</li>\n              <li>\n                Create <strong>Parsers</strong> to transform the data using JQ or JSONata\n              </li>\n            </ol>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n});\n\nexport default DataSinkBuilderPage;\n"],"mappings":"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"}
+{"version":3,"file":"DataSinkBuilderPage.js","names":[],"sources":["../../../src/bigconsole/pages/DataSinkBuilderPage.tsx"],"sourcesContent":["/**\n * DataSink Builder Page\n *\n * Simplified page for creating and editing DataSinks.\n * DataSinks are now standalone - workflows push data to them via unique keys.\n * Required fields: name, key\n */\n\nimport { memo, useState, useMemo, useEffect, useCallback } from 'react';\nimport { useParams } from 'react-router';\nimport { useAppNavigate } from '../contexts';\nimport { isNative, nativeCopyText, nativeToast } from '../../utils/nativeBridge';\nimport { useDataSinkOperations } from '../hooks/useDataSinkOperations';\nimport { CacheTTLSelector } from '../components/datasink/CacheTTLSelector';\nimport { RefreshTypeSelector } from '../components/datasink/RefreshTypeSelector';\nimport type { CreateDataSinkInput, UpdateDataSinkInput, DataSinkRefreshType } from '../types';\n\n// fe-libs UI components\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { Input } from '@burdenoff/fe-libs/ui';\nimport { Textarea } from '@burdenoff/fe-libs/ui';\nimport { Label } from '@burdenoff/fe-libs/ui';\nimport { Card, CardContent, CardHeader, CardTitle } from '@burdenoff/fe-libs/ui';\nimport { GlassCard, IllustratedEmptyState, PagePurpose } from '@burdenoff/fe-libs/ui';\n\n// Lucide icons\nimport { ArrowLeft, Save, Loader2, AlertCircle, Database, Settings, Eye, Copy, Check } from 'lucide-react';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface RefreshConfig {\n  type: 'manual' | 'scheduled';\n  schedule?: {\n    cron: string;\n    timezone: string;\n  };\n}\n\ninterface FormState {\n  name: string;\n  key: string;\n  description: string;\n  ttl: number;\n  refresh: RefreshConfig;\n  data: string; // JSON string for data payload\n}\n\ninterface FormErrors {\n  name?: string;\n  key?: string;\n  data?: string;\n}\n\n// ============================================================================\n// HELPERS\n// ============================================================================\n\n/**\n * Generate a key from name (slug format)\n */\nfunction generateKey(name: string): string {\n  return name\n    .toLowerCase()\n    .replace(/[^a-z0-9]+/g, '_')\n    .replace(/^_+|_+$/g, '')\n    .substring(0, 64);\n}\n\n/**\n * Validate form data\n */\nfunction validateForm(form: FormState): FormErrors {\n  const errors: FormErrors = {};\n\n  if (!form.name.trim()) {\n    errors.name = 'Name is required';\n  } else if (form.name.length < 2) {\n    errors.name = 'Name must be at least 2 characters';\n  } else if (form.name.length > 100) {\n    errors.name = 'Name must be less than 100 characters';\n  }\n\n  if (!form.key.trim()) {\n    errors.key = 'Key is required';\n  } else if (!/^[a-z0-9_]+$/.test(form.key)) {\n    errors.key = 'Key can only contain lowercase letters, numbers, and underscores';\n  } else if (form.key.length > 64) {\n    errors.key = 'Key must be less than 64 characters';\n  }\n\n  // Validate JSON data if provided\n  if (form.data && form.data.trim()) {\n    try {\n      JSON.parse(form.data);\n    } catch {\n      errors.data = 'Invalid JSON format';\n    }\n  }\n\n  return errors;\n}\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const DataSinkBuilderPage = memo(function DataSinkBuilderPage() {\n  const { dataSinkId } = useParams<{ dataSinkId?: string }>();\n  const navigate = useAppNavigate();\n\n  const isEdit = dataSinkId !== 'new' && !!dataSinkId;\n\n  // Form state\n  const [form, setForm] = useState<FormState>({\n    name: '',\n    key: '',\n    description: '',\n    ttl: 300, // 5 minutes default\n    refresh: {\n      type: 'manual',\n    },\n    data: '{}', // Default empty JSON object\n  });\n  const [errors, setErrors] = useState<FormErrors>({});\n  const [keyManuallyEdited, setKeyManuallyEdited] = useState(false);\n  const [isSaving, setIsSaving] = useState(false);\n  const [submitError, setSubmitError] = useState<string | null>(null);\n  const [keyCopied, setKeyCopied] = useState(false);\n\n  // Data preview state\n  const [isLoadingPreview, setIsLoadingPreview] = useState(false);\n  const [previewData, setPreviewData] = useState<unknown[] | null>(null);\n  const [previewError, setPreviewError] = useState<string | null>(null);\n\n  // Operations\n  const { loading, error, dataSinks, fetchDataSink, createDataSink, updateDataSink, getDataSinkData } =\n    useDataSinkOperations({\n      skipFetch: true,\n    });\n\n  // Get existing data sink if editing\n  const existingDataSink = isEdit ? dataSinks.find((ds) => ds.id === dataSinkId) : null;\n\n  // Load existing data sink for editing\n  useEffect(() => {\n    if (isEdit && dataSinkId && !existingDataSink) {\n      fetchDataSink(dataSinkId);\n    }\n  }, [isEdit, dataSinkId, existingDataSink, fetchDataSink]);\n\n  // Track if form has been initialized\n  const [formInitialized, setFormInitialized] = useState(false);\n\n  // Populate form with existing data when editing (only once)\n  useEffect(() => {\n    if (existingDataSink && !formInitialized) {\n      // Format existing data as pretty JSON string\n      let dataString = '';\n      if (existingDataSink.data) {\n        try {\n          // Check if data is already a string (JSON string from API)\n          if (typeof existingDataSink.data === 'string') {\n            // Parse and re-stringify to ensure proper formatting\n            const parsed = JSON.parse(existingDataSink.data);\n            dataString = JSON.stringify(parsed, null, 2);\n          } else {\n            // It's an object, just stringify it\n            dataString = JSON.stringify(existingDataSink.data, null, 2);\n          }\n        } catch {\n          // If parsing fails, use as-is if string, otherwise empty\n          dataString = typeof existingDataSink.data === 'string' ? existingDataSink.data : '';\n        }\n      }\n\n      setForm({\n        name: existingDataSink.name || '',\n        key: existingDataSink.key || '',\n        description: existingDataSink.description || '',\n        ttl: existingDataSink.ttl || 300,\n        refresh: existingDataSink.refresh\n          ? {\n              type: existingDataSink.refresh.type === 'scheduled' ? 'scheduled' : 'manual',\n              schedule: existingDataSink.refresh.schedule\n                ? {\n                    cron: existingDataSink.refresh.schedule.cron,\n                    timezone: existingDataSink.refresh.schedule.timezone,\n                  }\n                : undefined,\n            }\n          : { type: 'manual' },\n        data: dataString,\n      });\n      setKeyManuallyEdited(true); // Don't auto-generate key when editing\n      setFormInitialized(true); // Mark as initialized\n      setErrors({}); // Clear any errors\n    }\n  }, [existingDataSink, formInitialized]);\n\n  // Auto-generate key from name\n  const handleNameChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const name = e.target.value;\n      setForm((prev) => ({\n        ...prev,\n        name,\n        key: keyManuallyEdited ? prev.key : generateKey(name),\n      }));\n      setErrors((prev) => ({ ...prev, name: undefined }));\n    },\n    [keyManuallyEdited]\n  );\n\n  // Handle key change\n  const handleKeyChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n    const key = e.target.value.toLowerCase().replace(/[^a-z0-9_]/g, '');\n    setForm((prev) => ({ ...prev, key }));\n    setKeyManuallyEdited(true);\n    setErrors((prev) => ({ ...prev, key: undefined }));\n  }, []);\n\n  // Handle description change\n  const handleDescriptionChange = useCallback((e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    setForm((prev) => ({ ...prev, description: e.target.value }));\n  }, []);\n\n  // Handle TTL change\n  const handleTTLChange = useCallback((ttl: number | null) => {\n    setForm((prev) => ({ ...prev, ttl: ttl || 0 }));\n  }, []);\n\n  // Handle refresh config change\n  const handleRefreshChange = useCallback((config: RefreshConfig) => {\n    setForm((prev) => ({ ...prev, refresh: config }));\n  }, []);\n\n  // Handle data change\n  const handleDataChange = useCallback((e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    setForm((prev) => ({ ...prev, data: e.target.value }));\n    setErrors((prev) => ({ ...prev, data: undefined }));\n  }, []);\n\n  // Format JSON data\n  const handleFormatData = useCallback(() => {\n    try {\n      const parsed = JSON.parse(form.data);\n      setForm((prev) => ({ ...prev, data: JSON.stringify(parsed, null, 2) }));\n      setErrors((prev) => ({ ...prev, data: undefined }));\n    } catch {\n      setErrors((prev) => ({ ...prev, data: 'Invalid JSON format' }));\n    }\n  }, [form.data]);\n\n  // Copy key to clipboard\n  const handleCopyKey = useCallback(async () => {\n    if (form.key) {\n      await nativeCopyText(form.key);\n      setKeyCopied(true);\n      if (isNative()) void nativeToast('Key copied');\n      setTimeout(() => setKeyCopied(false), 2000);\n    }\n  }, [form.key]);\n\n  // Handle back navigation\n  const handleBack = useCallback(() => {\n    navigate('/datasinks');\n  }, [navigate]);\n\n  // Load data preview\n  const handleShowData = useCallback(async () => {\n    if (!isEdit || !existingDataSink) return;\n\n    setIsLoadingPreview(true);\n    setPreviewError(null);\n\n    try {\n      const result = await getDataSinkData({ key: existingDataSink.key });\n      if (result?.raw) {\n        // Get first 20 items if it's an array, otherwise wrap in array\n        const data = Array.isArray(result.raw) ? result.raw.slice(0, 20) : [result.raw];\n        setPreviewData(data);\n      } else {\n        setPreviewData([]);\n      }\n    } catch (err) {\n      setPreviewError(err instanceof Error ? err.message : 'Failed to load data');\n    } finally {\n      setIsLoadingPreview(false);\n    }\n  }, [isEdit, existingDataSink, getDataSinkData]);\n\n  // Handle form submission\n  const handleSubmit = useCallback(\n    async (e: React.FormEvent) => {\n      e.preventDefault();\n      setSubmitError(null);\n\n      // Validate form\n      const validationErrors = validateForm(form);\n      if (Object.keys(validationErrors).length > 0) {\n        setErrors(validationErrors);\n        return;\n      }\n\n      setIsSaving(true);\n      try {\n        // Parse data JSON\n        let parsedData: Record<string, unknown> = {};\n        if (form.data && form.data.trim()) {\n          try {\n            parsedData = JSON.parse(form.data) as Record<string, unknown>;\n          } catch {\n            setErrors((prev) => ({ ...prev, data: 'Invalid JSON format' }));\n            setIsSaving(false);\n            return;\n          }\n        }\n\n        if (isEdit && existingDataSink) {\n          // Update existing\n          const input: UpdateDataSinkInput = {\n            id: existingDataSink.id,\n            version: existingDataSink.version,\n            name: form.name,\n            description: form.description || undefined,\n            ttl: form.ttl,\n            refresh: {\n              type: form.refresh.type as DataSinkRefreshType,\n              schedule: form.refresh.schedule,\n            },\n            data: parsedData, // Include data in update\n          };\n          const result = await updateDataSink(input);\n          if (!result) {\n            throw new Error('Failed to update DataSink');\n          }\n        } else {\n          // Create new - simplified flow (standalone DataSinks)\n          const input: CreateDataSinkInput = {\n            key: form.key,\n            name: form.name,\n            description: form.description || undefined,\n            ttl: form.ttl,\n            refresh: {\n              type: form.refresh.type as DataSinkRefreshType,\n              schedule: form.refresh.schedule,\n            },\n            data: parsedData, // Include data in create\n          };\n          const result = await createDataSink(input);\n          if (!result) {\n            throw new Error('Failed to create DataSink');\n          }\n        }\n        navigate('/datasinks');\n      } catch (err) {\n        setSubmitError(err instanceof Error ? err.message : 'Failed to save DataSink');\n      } finally {\n        setIsSaving(false);\n      }\n    },\n    [form, isEdit, existingDataSink, createDataSink, updateDataSink, navigate]\n  );\n\n  // Check if form is valid\n  const isFormValid = useMemo(() => {\n    const nameValid = form.name.trim().length >= 2;\n    const keyValid = form.key.trim().length > 0;\n\n    // Check JSON validity if data is provided\n    let dataValid = true;\n    if (form.data && form.data.trim()) {\n      try {\n        JSON.parse(form.data);\n      } catch {\n        dataValid = false;\n      }\n    }\n\n    return nameValid && keyValid && dataValid;\n  }, [form.name, form.key, form.data]);\n\n  // Loading state\n  if (loading && isEdit) {\n    return (\n      <div className=\"flex items-center justify-center min-h-[400px]\">\n        <Loader2 className=\"w-8 h-8 text-text-secondary animate-spin\" />\n      </div>\n    );\n  }\n\n  // Error state\n  if (error) {\n    return (\n      <div className=\"flex items-center justify-center min-h-[400px] p-card-padding\">\n        <div className=\"text-center\">\n          <AlertCircle className=\"w-12 h-12 text-status-error-text mx-auto mb-4\" />\n          <p className=\"text-status-error-text text-body-sm font-medium mb-2\">Failed to load DataSink</p>\n          <p className=\"text-text-tertiary text-body-xs\">{error.message}</p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"min-h-screen bg-bg-canvas\">\n      <div className=\"max-w-3xl mx-auto p-card-padding\">\n        {/* Header */}\n        <div className=\"mb-6\">\n          <Button onClick={handleBack} variant=\"ghost\" size=\"sm\" className=\"mb-4\">\n            <ArrowLeft className=\"w-4 h-4 mr-2\" />\n            Back to DataSinks\n          </Button>\n          <h1 className=\"text-heading-h1 font-bold text-text-primary\">\n            {isEdit ? 'Edit DataSink' : 'Create DataSink'}\n          </h1>\n          <p className=\"text-body-sm text-text-secondary mt-1\">\n            {isEdit\n              ? 'Update the DataSink configuration.'\n              : 'Create a new DataSink to store and cache data. Use the unique key to connect workflows.'}\n          </p>\n        </div>\n\n        {/* Error Alert */}\n        {submitError && (\n          <div className=\"mb-6 p-4 bg-status-error-bg/10 border border-status-error-border/30 rounded-lg flex items-start gap-3\">\n            <AlertCircle className=\"w-5 h-5 text-status-error-text flex-shrink-0 mt-0.5\" />\n            <div>\n              <p className=\"text-sm font-medium text-status-error-text\">Failed to save DataSink</p>\n              <p className=\"text-xs text-status-error-text/80 mt-1\">{submitError}</p>\n            </div>\n          </div>\n        )}\n\n        <PagePurpose className=\"mb-6\">\n          A data sink is the named, structured store your dashboards read from. Give it a unique key, configure how long\n          data is cached and how it refreshes, then point a workflow at that key to push data in. Get the basics right\n          here and everything downstream connects to it.\n        </PagePurpose>\n\n        {/* Form */}\n        <form onSubmit={handleSubmit} className=\"space-y-6\">\n          {/* Basic Information — primary emphasis zone */}\n          <GlassCard treatment=\"glass\" glow>\n            <CardHeader className=\"pb-4\">\n              <div className=\"flex items-center gap-3\">\n                <div className=\"w-8 h-8 rounded-full bg-action-primary-bg/10 flex items-center justify-center\">\n                  <Database className=\"w-4 h-4 text-action-primary-bg\" />\n                </div>\n                <div>\n                  <CardTitle className=\"text-base\">Basic Information</CardTitle>\n                  <p className=\"text-xs text-text-secondary mt-0.5\">Essential details for your DataSink</p>\n                </div>\n              </div>\n            </CardHeader>\n            <CardContent className=\"space-y-5\">\n              {/* Name field */}\n              <div className=\"space-y-2\">\n                <Label htmlFor=\"name\">\n                  Name <span className=\"text-status-error-text\">*</span>\n                </Label>\n                <Input\n                  id=\"name\"\n                  type=\"text\"\n                  value={form.name}\n                  onChange={handleNameChange}\n                  placeholder=\"e.g., Sales Metrics\"\n                  className={errors.name ? 'border-status-error-border' : ''}\n                />\n                {errors.name && <p className=\"text-body-xs text-status-error-text\">{errors.name}</p>}\n              </div>\n\n              {/* Key field */}\n              <div className=\"space-y-2\">\n                <Label htmlFor=\"key\">\n                  Unique Key <span className=\"text-status-error-text\">*</span>\n                </Label>\n                <div className=\"flex gap-2\">\n                  <Input\n                    id=\"key\"\n                    type=\"text\"\n                    value={form.key}\n                    onChange={handleKeyChange}\n                    placeholder=\"sales_metrics\"\n                    disabled={isEdit}\n                    className={`font-mono flex-1 ${errors.key ? 'border-status-error-border' : ''}`}\n                  />\n                  {form.key && (\n                    <Button type=\"button\" onClick={handleCopyKey} variant=\"outline\" size=\"sm\" className=\"px-3\">\n                      {keyCopied ? (\n                        <Check className=\"w-4 h-4 text-status-success-text\" />\n                      ) : (\n                        <Copy className=\"w-4 h-4\" />\n                      )}\n                    </Button>\n                  )}\n                </div>\n                {errors.key && <p className=\"text-body-xs text-status-error-text\">{errors.key}</p>}\n                <p className=\"text-body-xs text-text-tertiary\">\n                  {isEdit\n                    ? 'Key cannot be changed. Use this key in your workflows to push data.'\n                    : 'Auto-generated from name. This key will be used by workflows to push data.'}\n                </p>\n              </div>\n\n              {/* Description field */}\n              <div className=\"space-y-2\">\n                <Label htmlFor=\"description\">Description</Label>\n                <Textarea\n                  id=\"description\"\n                  value={form.description}\n                  onChange={handleDescriptionChange}\n                  placeholder=\"Describe what data this sink stores...\"\n                  rows={2}\n                  className=\"resize-none\"\n                />\n              </div>\n            </CardContent>\n          </GlassCard>\n\n          {/* Configuration */}\n          <Card>\n            <CardHeader className=\"pb-4\">\n              <div className=\"flex items-center gap-3\">\n                <div className=\"w-8 h-8 rounded-full bg-action-primary-bg/10 flex items-center justify-center\">\n                  <Settings className=\"w-4 h-4 text-action-primary-bg\" />\n                </div>\n                <div>\n                  <CardTitle className=\"text-base\">Configuration</CardTitle>\n                  <p className=\"text-xs text-text-secondary mt-0.5\">Cache and refresh settings</p>\n                </div>\n              </div>\n            </CardHeader>\n            <CardContent className=\"space-y-5\">\n              {/* Cache TTL */}\n              <div className=\"space-y-2\">\n                <Label>Cache Duration</Label>\n                <CacheTTLSelector value={form.ttl} onChange={handleTTLChange} />\n                <p className=\"text-body-xs text-text-tertiary\">\n                  How long cached data remains valid before requiring refresh.\n                </p>\n              </div>\n\n              {/* Refresh Type */}\n              <RefreshTypeSelector value={form.refresh} onChange={handleRefreshChange} />\n            </CardContent>\n          </Card>\n\n          {/* Data Payload */}\n          <Card>\n            <CardHeader className=\"pb-4\">\n              <div className=\"flex items-center justify-between\">\n                <div className=\"flex items-center gap-3\">\n                  <div className=\"w-8 h-8 rounded-full bg-action-primary-bg/10 flex items-center justify-center\">\n                    <Database className=\"w-4 h-4 text-action-primary-bg\" />\n                  </div>\n                  <div>\n                    <CardTitle className=\"text-base\">Data Payload</CardTitle>\n                    <p className=\"text-xs text-text-secondary mt-0.5\">\n                      {isEdit ? 'Edit the JSON data stored in this DataSink' : 'Optional initial data (JSON format)'}\n                    </p>\n                  </div>\n                </div>\n                <Button type=\"button\" onClick={handleFormatData} variant=\"outline\" size=\"sm\">\n                  Format JSON\n                </Button>\n              </div>\n            </CardHeader>\n            <CardContent>\n              <div className=\"space-y-2\">\n                <Textarea\n                  value={form.data}\n                  onChange={handleDataChange}\n                  placeholder='{\"key\": \"value\"}'\n                  rows={10}\n                  className={`font-mono text-xs resize-y ${errors.data ? 'border-status-error-border' : ''}`}\n                />\n                {errors.data && <p className=\"text-body-xs text-status-error-text\">{errors.data}</p>}\n                <p className=\"text-body-xs text-text-tertiary\">\n                  Enter valid JSON data. This data will be stored and can be accessed by widgets via parsers.\n                </p>\n              </div>\n            </CardContent>\n          </Card>\n\n          {/* Data Preview - Only show for existing DataSinks */}\n          {isEdit && existingDataSink && (\n            <Card>\n              <CardHeader className=\"pb-4\">\n                <div className=\"flex items-center justify-between\">\n                  <div className=\"flex items-center gap-3\">\n                    <div className=\"w-8 h-8 rounded-full bg-action-primary-bg/10 flex items-center justify-center\">\n                      <Eye className=\"w-4 h-4 text-action-primary-bg\" />\n                    </div>\n                    <div>\n                      <CardTitle className=\"text-base\">Data Preview</CardTitle>\n                      <p className=\"text-xs text-text-secondary mt-0.5\">Preview the first 20 records</p>\n                    </div>\n                  </div>\n                  <Button\n                    type=\"button\"\n                    onClick={handleShowData}\n                    variant=\"outline\"\n                    size=\"sm\"\n                    disabled={isLoadingPreview}\n                  >\n                    {isLoadingPreview ? (\n                      <>\n                        <Loader2 className=\"w-4 h-4 mr-2 animate-spin\" />\n                        Loading...\n                      </>\n                    ) : (\n                      <>\n                        <Eye className=\"w-4 h-4 mr-2\" />\n                        Show Data\n                      </>\n                    )}\n                  </Button>\n                </div>\n              </CardHeader>\n              {(previewData || previewError) && (\n                <CardContent>\n                  {previewError ? (\n                    <div className=\"p-4 bg-status-error-bg/10 border border-status-error-border/30 rounded-md\">\n                      <p className=\"text-sm text-status-error-text\">{previewError}</p>\n                    </div>\n                  ) : previewData && previewData.length > 0 ? (\n                    <pre className=\"p-4 bg-bg-sunken rounded-md overflow-auto max-h-[300px] text-xs font-mono\">\n                      {JSON.stringify(previewData, null, 2)}\n                    </pre>\n                  ) : (\n                    <IllustratedEmptyState\n                      illustration=\"empty-generic\"\n                      title=\"No data available yet\"\n                      description=\"Connect a workflow to this sink's key to start pushing data.\"\n                    />\n                  )}\n                </CardContent>\n              )}\n            </Card>\n          )}\n\n          {/* Submit */}\n          <div className=\"flex items-center justify-end gap-4 pt-4\">\n            <Button type=\"button\" onClick={handleBack} variant=\"secondary\">\n              Cancel\n            </Button>\n            <Button type=\"submit\" disabled={!isFormValid || isSaving} variant=\"default\">\n              {isSaving ? (\n                <>\n                  <Loader2 className=\"w-4 h-4 mr-2 animate-spin\" />\n                  Saving...\n                </>\n              ) : (\n                <>\n                  <Save className=\"w-4 h-4 mr-2\" />\n                  {isEdit ? 'Save Changes' : 'Create DataSink'}\n                </>\n              )}\n            </Button>\n          </div>\n        </form>\n\n        {/* Info Box for New DataSinks */}\n        {!isEdit && (\n          <div className=\"mt-6 p-4 bg-bg-sunken rounded-lg border border-border-default\">\n            <h3 className=\"text-sm font-medium text-text-primary mb-2\">What&apos;s Next?</h3>\n            <ol className=\"list-decimal list-inside text-xs text-text-secondary space-y-1\">\n              <li>Create this DataSink to get your unique key</li>\n              <li>\n                Go to <strong>Workflows</strong> and create a FluidGrids workflow\n              </li>\n              <li>Use the unique key in your workflow to push data to this DataSink</li>\n              <li>\n                Create <strong>Parsers</strong> to transform the data using JQ or JSONata\n              </li>\n            </ol>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n});\n\nexport default DataSinkBuilderPage;\n"],"mappings":"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"}

package/dist/bigconsole/pages/DataSinkViewPage.js

@@ -12,7 +12,7 @@ import ae from "../components/datasink/LinkedParsersPanel.js";
 import oe from "../components/datasink/WorkflowStatusPanel.js";
 import se from "../components/datasink/ExportDataSinkDialog.js";
 import { memo as s, useCallback as c, useEffect as ce, useState as l } from "react";
-import { useParams as le } from "react-router-dom";
+import { useParams as le } from "react-router";
 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";
 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";
 import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";