@hotmeshio/long-tail 0.17.0 → 0.17.1

package/dashboard/dist/assets/{index-Bf4IPu7I.js.map → index-CRxbF5vt.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index-Bf4IPu7I.js","sources":["../../src/pages/admin/streams/StreamMessagesPage.tsx"],"sourcesContent":["import { useState, useMemo, useEffect } from 'react';\nimport { X, MessageSquare } from 'lucide-react';\nimport { SlidePanel, SlidePanelViews } from '../../../components/common/layout/SlidePanel';\nimport { useStreamMessages, type StreamMessage } from '../../../api/stream-messages';\nimport { useFilterParams } from '../../../hooks/useFilterParams';\nimport { useNamespace } from '../../../hooks/useNamespace';\nimport { buildApiPath } from '../../../lib/api-path';\nimport { DataTable, type Column } from '../../../components/common/data/DataTable';\nimport { StickyPagination } from '../../../components/common/data/StickyPagination';\nimport { FilterBar, FilterSelect, FilterInput } from '../../../components/common/data/FilterBar';\nimport { DateValue } from '../../../components/common/display/DateValue';\nimport { PageHeader } from '../../../components/common/layout/PageHeader';\nimport { ListToolbar } from '../../../components/common/data/ListToolbar';\nimport { StreamMessageDetail } from './StreamMessageDetail';\nimport { STATUS_DOT, STATUS_LABEL, STATUS_OPTIONS, SOURCE_OPTIONS, SOURCE_BADGE } from './constants';\n\nfunction truncateMiddle(str: string, max: number): string {\n  if (str.length <= max) return str;\n  const half = Math.floor((max - 1) / 2);\n  return `${str.slice(0, half)}…${str.slice(-half)}`;\n}\n\nexport function StreamMessagesPage() {\n  const { namespace, available } = useNamespace('namespace');\n\n  const { filters, setFilter, pagination, sort, setSort } = useFilterParams({\n    filters: { namespace: '', source: 'worker', status: '', stream_name: '', msg_type: '', topic: '', workflow_name: '', jid: '', aid: '' },\n  });\n\n  const [selected, setSelected] = useState<StreamMessage | null>(null);\n\n  const namespaceOptions = useMemo(\n    () => available.map((id) => ({ value: id, label: id })),\n    [available],\n  );\n\n  const { data, isLoading, refetch, isFetching } = useStreamMessages({\n    namespace: filters.namespace || namespace,\n    source: (filters.source as 'engine' | 'worker') || 'worker',\n    limit: pagination.pageSize,\n    offset: pagination.offset,\n    sort_by: sort.sort_by || 'created_at',\n    order: sort.order || 'desc',\n    status: (filters.status as any) || undefined,\n    stream_name: filters.stream_name || undefined,\n    msg_type: filters.msg_type || undefined,\n    topic: filters.topic || undefined,\n    workflow_name: filters.workflow_name || undefined,\n    jid: filters.jid || undefined,\n    aid: filters.aid || undefined,\n  });\n\n  const messages = data?.messages ?? [];\n  const total = data?.total ?? 0;\n\n  const activeMessage = useMemo(() => {\n    if (!selected) return null;\n    return messages.find((m) => m.id === selected.id && m.source === selected.source) ?? selected;\n  }, [messages, selected]);\n\n  const panelOpen = !!activeMessage;\n\n  // Hold the last message through the panel's closing animation so the detail\n  // content stays rendered while the panel slides shut.\n  const [lastMessage, setLastMessage] = useState<StreamMessage | null>(null);\n  useEffect(() => {\n    if (activeMessage) setLastMessage(activeMessage);\n  }, [activeMessage]);\n  const displayMessage = activeMessage ?? lastMessage;\n\n  // Status and type live as the dot and the detail panel — the row itself\n  // stays one flexible stream column plus fixed narrow facts, so the table\n  // shrinks with the container (same shape as the executions list).\n  const columns: Column<StreamMessage>[] = [\n    {\n      key: 'stream_name',\n      label: 'Stream',\n      sortable: true,\n      render: (row) => (\n        <div className=\"flex items-center gap-2 min-w-0\">\n          <span\n            className={`w-2.5 h-2.5 shrink-0 rounded-full dot-ring ${STATUS_DOT[row.status]}`}\n            title={STATUS_LABEL[row.status]}\n          />\n          <span className=\"font-mono text-xs text-text-secondary truncate\" title={row.stream_name}>\n            {row.stream_name}\n          </span>\n        </div>\n      ),\n    },\n    {\n      key: 'source',\n      label: 'Source',\n      render: (row) => <span className={SOURCE_BADGE}>{row.source}</span>,\n      className: 'w-24',\n    },\n    {\n      key: 'created_at',\n      label: 'Created',\n      sortable: true,\n      render: (row) => <DateValue date={row.created_at} format=\"relative\" className=\"text-xs text-text-secondary whitespace-nowrap\" />,\n      className: 'w-32',\n    },\n    {\n      key: 'reserved_at',\n      label: 'Reserved',\n      render: (row) => row.reserved_at\n        ? <DateValue date={row.reserved_at} format=\"relative\" className=\"text-xs text-text-secondary whitespace-nowrap\" />\n        : <span className=\"text-xs text-text-tertiary\">—</span>,\n      className: 'w-32',\n    },\n    {\n      key: 'expired_at',\n      label: 'Processed',\n      render: (row) => row.expired_at\n        ? <DateValue date={row.expired_at} format=\"relative\" className=\"text-xs text-text-secondary whitespace-nowrap\" />\n        : <span className=\"text-xs text-text-tertiary\">—</span>,\n      className: 'w-32',\n    },\n    {\n      key: 'priority',\n      label: 'Pri',\n      sortable: true,\n      render: (row) => <span className=\"text-xs text-text-secondary\">{row.priority}</span>,\n      className: 'w-14 text-right',\n    },\n    {\n      key: 'retry_attempt',\n      label: 'Retries',\n      render: (row) => (\n        <span className=\"text-xs text-text-secondary whitespace-nowrap\">\n          {row.retry_attempt}/{row.max_retry_attempts}\n        </span>\n      ),\n      className: 'w-20',\n    },\n  ];\n\n  return (\n    // Master-list flow beside a full-height panel: the left column is a plain\n    // page-scrolling list (FilterBar and table headers stick against the main\n    // scroll, exactly like the executions list). The panel column spans the\n    // page height; its sticky viewport stays pinned with its own scroll.\n    // Negative margins let the panel span the full middle row; the left\n    // column re-adds those gutters for its own content.\n    <div className=\"flex items-stretch min-w-0 -mt-10 -mr-10 -mb-16\">\n      <div className=\"flex-1 min-w-0 pt-10 pr-10\">\n        <PageHeader title=\"Messages\" docsHash=\"#docs:dashboard.md:messages\" />\n\n        <FilterBar actions={\n        <ListToolbar\n          onRefresh={() => refetch()}\n          isFetching={isFetching}\n          apiPath={buildApiPath('/controlplane/stream-messages', {\n            namespace: filters.namespace || namespace,\n            source: filters.source || 'worker',\n            limit: pagination.pageSize,\n            offset: pagination.offset,\n            sort_by: sort.sort_by || 'created_at',\n            order: sort.order || 'desc',\n            status: filters.status || undefined,\n            stream_name: filters.stream_name || undefined,\n            msg_type: filters.msg_type || undefined,\n            topic: filters.topic || undefined,\n            workflow_name: filters.workflow_name || undefined,\n            jid: filters.jid || undefined,\n            aid: filters.aid || undefined,\n          })}\n        />\n      }>\n        <FilterSelect\n          label=\"Namespace\"\n          value={filters.namespace}\n          onChange={(v) => setFilter('namespace', v)}\n          options={namespaceOptions}\n          required\n        />\n        <FilterSelect\n          label=\"Source\"\n          value={filters.source}\n          onChange={(v) => setFilter('source', v)}\n          options={SOURCE_OPTIONS}\n          required\n        />\n        <FilterSelect\n          label=\"Status\"\n          value={filters.status}\n          onChange={(v) => setFilter('status', v)}\n          options={STATUS_OPTIONS}\n        />\n        <FilterInput\n          label=\"Stream\"\n          value={filters.stream_name}\n          onChange={(v) => setFilter('stream_name', v)}\n          placeholder=\"Filter by stream name…\"\n        />\n        <FilterInput\n          label=\"Job ID\"\n          value={filters.jid}\n          onChange={(v) => setFilter('jid', v)}\n          placeholder=\"Filter by jid…\"\n        />\n        {/* Active dimension filter pills — inline in the sticky bar */}\n        {[\n          { key: 'topic', label: 'Topic', value: filters.topic },\n          { key: 'workflow_name', label: 'Workflow', value: filters.workflow_name },\n          { key: 'aid', label: 'Activity', value: filters.aid },\n          { key: 'msg_type', label: 'Type', value: filters.msg_type },\n        ].filter((f) => f.value).map((f) => (\n          <button\n            key={f.key}\n            onClick={() => setFilter(f.key as any, '')}\n            className=\"inline-flex items-center gap-1 px-2 py-0.5 text-2xs font-mono rounded-full bg-accent/15 text-accent hover:bg-accent/25 transition-colors\"\n            title={`Clear ${f.label} filter: ${f.value}`}\n          >\n            {f.label}: {truncateMiddle(f.value, 12)}\n            <X className=\"w-2.5 h-2.5\" />\n          </button>\n        ))}\n      </FilterBar>\n\n        <DataTable\n          columns={columns}\n          data={messages}\n          keyFn={(row) => `${row.source}:${row.id}`}\n          isLoading={isLoading}\n          emptyMessage=\"No stream messages found\"\n          onRowClick={(row) => setSelected(row)}\n          activeRowKey={activeMessage ? `${activeMessage.source}:${activeMessage.id}` : null}\n          sort={sort}\n          onSort={setSort}\n          layout=\"fixed\"\n        />\n\n        {/* Direct child of the tall column so sticky works; its -mx-10 fills\n            the column's pr-10, ending flush at the panel's edge. */}\n        <StickyPagination\n          page={pagination.page}\n          totalPages={pagination.totalPages(total)}\n          onPageChange={pagination.setPage}\n          total={total}\n          pageSize={pagination.pageSize}\n          onPageSizeChange={pagination.setPageSize}\n        />\n      </div>\n\n      {/* Detail panel — spans the page height; the sticky viewport keeps the\n          chrome pinned to the visible area with its own scroll. */}\n      <SlidePanel open={panelOpen} width={416} className=\"self-stretch\">\n        <div className=\"h-full pl-4\">\n          <SlidePanelViews\n            views={[{\n              id: 'detail',\n              icon: MessageSquare,\n              label: 'Message Detail',\n              content: displayMessage ? (\n                <StreamMessageDetail\n                  message={displayMessage}\n                  filters={{\n                    onFilterStatus: (v) => setFilter('status', v),\n                    onFilterStreamName: (v) => setFilter('stream_name', v),\n                    onFilterMsgType: (v) => setFilter('msg_type', v),\n                    onFilterTopic: (v) => setFilter('topic', v),\n                    onFilterWorkflow: (v) => setFilter('workflow_name', v),\n                    onFilterJid: (v) => setFilter('jid', v),\n                    onFilterAid: (v) => setFilter('aid', v),\n                  }}\n                />\n              ) : null,\n            }]}\n            activeId=\"detail\"\n            onViewChange={() => {}}\n            onClose={() => setSelected(null)}\n            stickyClassName=\"sticky top-0 z-10 h-[calc(100vh-5.25rem)] pt-9\"\n          />\n        </div>\n      </SlidePanel>\n    </div>\n  );\n}\n"],"names":["truncateMiddle","str","max","half","StreamMessagesPage","namespace","available","useNamespace","filters","setFilter","pagination","sort","setSort","useFilterParams","selected","setSelected","useState","namespaceOptions","useMemo","id","data","isLoading","refetch","isFetching","useStreamMessages","messages","total","activeMessage","m","panelOpen","lastMessage","setLastMessage","useEffect","displayMessage","columns","row","jsxs","jsx","STATUS_DOT","STATUS_LABEL","SOURCE_BADGE","DateValue","PageHeader","FilterBar","ListToolbar","buildApiPath","FilterSelect","v","SOURCE_OPTIONS","STATUS_OPTIONS","FilterInput","f","X","DataTable","StickyPagination","SlidePanel","SlidePanelViews","MessageSquare","StreamMessageDetail"],"mappings":"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"}
+{"version":3,"file":"index-CRxbF5vt.js","sources":["../../src/pages/admin/streams/StreamMessagesPage.tsx"],"sourcesContent":["import { useState, useMemo, useEffect } from 'react';\nimport { X, MessageSquare } from 'lucide-react';\nimport { SlidePanel, SlidePanelViews } from '../../../components/common/layout/SlidePanel';\nimport { useStreamMessages, type StreamMessage } from '../../../api/stream-messages';\nimport { useFilterParams } from '../../../hooks/useFilterParams';\nimport { useNamespace } from '../../../hooks/useNamespace';\nimport { buildApiPath } from '../../../lib/api-path';\nimport { DataTable, type Column } from '../../../components/common/data/DataTable';\nimport { StickyPagination } from '../../../components/common/data/StickyPagination';\nimport { FilterBar, FilterSelect, FilterInput } from '../../../components/common/data/FilterBar';\nimport { DateValue } from '../../../components/common/display/DateValue';\nimport { PageHeader } from '../../../components/common/layout/PageHeader';\nimport { ListToolbar } from '../../../components/common/data/ListToolbar';\nimport { StreamMessageDetail } from './StreamMessageDetail';\nimport { STATUS_DOT, STATUS_LABEL, STATUS_OPTIONS, SOURCE_OPTIONS, SOURCE_BADGE } from './constants';\n\nfunction truncateMiddle(str: string, max: number): string {\n  if (str.length <= max) return str;\n  const half = Math.floor((max - 1) / 2);\n  return `${str.slice(0, half)}…${str.slice(-half)}`;\n}\n\nexport function StreamMessagesPage() {\n  const { namespace, available } = useNamespace('namespace');\n\n  const { filters, setFilter, pagination, sort, setSort } = useFilterParams({\n    filters: { namespace: '', source: 'worker', status: '', stream_name: '', msg_type: '', topic: '', workflow_name: '', jid: '', aid: '' },\n  });\n\n  const [selected, setSelected] = useState<StreamMessage | null>(null);\n\n  const namespaceOptions = useMemo(\n    () => available.map((id) => ({ value: id, label: id })),\n    [available],\n  );\n\n  const { data, isLoading, refetch, isFetching } = useStreamMessages({\n    namespace: filters.namespace || namespace,\n    source: (filters.source as 'engine' | 'worker') || 'worker',\n    limit: pagination.pageSize,\n    offset: pagination.offset,\n    sort_by: sort.sort_by || 'created_at',\n    order: sort.order || 'desc',\n    status: (filters.status as any) || undefined,\n    stream_name: filters.stream_name || undefined,\n    msg_type: filters.msg_type || undefined,\n    topic: filters.topic || undefined,\n    workflow_name: filters.workflow_name || undefined,\n    jid: filters.jid || undefined,\n    aid: filters.aid || undefined,\n  });\n\n  const messages = data?.messages ?? [];\n  const total = data?.total ?? 0;\n\n  const activeMessage = useMemo(() => {\n    if (!selected) return null;\n    return messages.find((m) => m.id === selected.id && m.source === selected.source) ?? selected;\n  }, [messages, selected]);\n\n  const panelOpen = !!activeMessage;\n\n  // Hold the last message through the panel's closing animation so the detail\n  // content stays rendered while the panel slides shut.\n  const [lastMessage, setLastMessage] = useState<StreamMessage | null>(null);\n  useEffect(() => {\n    if (activeMessage) setLastMessage(activeMessage);\n  }, [activeMessage]);\n  const displayMessage = activeMessage ?? lastMessage;\n\n  // Status and type live as the dot and the detail panel — the row itself\n  // stays one flexible stream column plus fixed narrow facts, so the table\n  // shrinks with the container (same shape as the executions list).\n  const columns: Column<StreamMessage>[] = [\n    {\n      key: 'stream_name',\n      label: 'Stream',\n      sortable: true,\n      render: (row) => (\n        <div className=\"flex items-center gap-2 min-w-0\">\n          <span\n            className={`w-2.5 h-2.5 shrink-0 rounded-full dot-ring ${STATUS_DOT[row.status]}`}\n            title={STATUS_LABEL[row.status]}\n          />\n          <span className=\"font-mono text-xs text-text-secondary truncate\" title={row.stream_name}>\n            {row.stream_name}\n          </span>\n        </div>\n      ),\n    },\n    {\n      key: 'source',\n      label: 'Source',\n      render: (row) => <span className={SOURCE_BADGE}>{row.source}</span>,\n      className: 'w-24',\n    },\n    {\n      key: 'created_at',\n      label: 'Created',\n      sortable: true,\n      render: (row) => <DateValue date={row.created_at} format=\"relative\" className=\"text-xs text-text-secondary whitespace-nowrap\" />,\n      className: 'w-32',\n    },\n    {\n      key: 'reserved_at',\n      label: 'Reserved',\n      render: (row) => row.reserved_at\n        ? <DateValue date={row.reserved_at} format=\"relative\" className=\"text-xs text-text-secondary whitespace-nowrap\" />\n        : <span className=\"text-xs text-text-tertiary\">—</span>,\n      className: 'w-32',\n    },\n    {\n      key: 'expired_at',\n      label: 'Processed',\n      render: (row) => row.expired_at\n        ? <DateValue date={row.expired_at} format=\"relative\" className=\"text-xs text-text-secondary whitespace-nowrap\" />\n        : <span className=\"text-xs text-text-tertiary\">—</span>,\n      className: 'w-32',\n    },\n    {\n      key: 'priority',\n      label: 'Pri',\n      sortable: true,\n      render: (row) => <span className=\"text-xs text-text-secondary\">{row.priority}</span>,\n      className: 'w-14 text-right',\n    },\n    {\n      key: 'retry_attempt',\n      label: 'Retries',\n      render: (row) => (\n        <span className=\"text-xs text-text-secondary whitespace-nowrap\">\n          {row.retry_attempt}/{row.max_retry_attempts}\n        </span>\n      ),\n      className: 'w-20',\n    },\n  ];\n\n  return (\n    // Master-list flow beside a full-height panel: the left column is a plain\n    // page-scrolling list (FilterBar and table headers stick against the main\n    // scroll, exactly like the executions list). The panel column spans the\n    // page height; its sticky viewport stays pinned with its own scroll.\n    // Negative margins let the panel span the full middle row; the left\n    // column re-adds those gutters for its own content.\n    <div className=\"flex items-stretch min-w-0 -mt-10 -mr-10 -mb-16\">\n      <div className=\"flex-1 min-w-0 pt-10 pr-10\">\n        <PageHeader title=\"Messages\" docsHash=\"#docs:dashboard.md:messages\" />\n\n        <FilterBar actions={\n        <ListToolbar\n          onRefresh={() => refetch()}\n          isFetching={isFetching}\n          apiPath={buildApiPath('/controlplane/stream-messages', {\n            namespace: filters.namespace || namespace,\n            source: filters.source || 'worker',\n            limit: pagination.pageSize,\n            offset: pagination.offset,\n            sort_by: sort.sort_by || 'created_at',\n            order: sort.order || 'desc',\n            status: filters.status || undefined,\n            stream_name: filters.stream_name || undefined,\n            msg_type: filters.msg_type || undefined,\n            topic: filters.topic || undefined,\n            workflow_name: filters.workflow_name || undefined,\n            jid: filters.jid || undefined,\n            aid: filters.aid || undefined,\n          })}\n        />\n      }>\n        <FilterSelect\n          label=\"Namespace\"\n          value={filters.namespace}\n          onChange={(v) => setFilter('namespace', v)}\n          options={namespaceOptions}\n          required\n        />\n        <FilterSelect\n          label=\"Source\"\n          value={filters.source}\n          onChange={(v) => setFilter('source', v)}\n          options={SOURCE_OPTIONS}\n          required\n        />\n        <FilterSelect\n          label=\"Status\"\n          value={filters.status}\n          onChange={(v) => setFilter('status', v)}\n          options={STATUS_OPTIONS}\n        />\n        <FilterInput\n          label=\"Stream\"\n          value={filters.stream_name}\n          onChange={(v) => setFilter('stream_name', v)}\n          placeholder=\"Filter by stream name…\"\n        />\n        <FilterInput\n          label=\"Job ID\"\n          value={filters.jid}\n          onChange={(v) => setFilter('jid', v)}\n          placeholder=\"Filter by jid…\"\n        />\n        {/* Active dimension filter pills — inline in the sticky bar */}\n        {[\n          { key: 'topic', label: 'Topic', value: filters.topic },\n          { key: 'workflow_name', label: 'Workflow', value: filters.workflow_name },\n          { key: 'aid', label: 'Activity', value: filters.aid },\n          { key: 'msg_type', label: 'Type', value: filters.msg_type },\n        ].filter((f) => f.value).map((f) => (\n          <button\n            key={f.key}\n            onClick={() => setFilter(f.key as any, '')}\n            className=\"inline-flex items-center gap-1 px-2 py-0.5 text-2xs font-mono rounded-full bg-accent/15 text-accent hover:bg-accent/25 transition-colors\"\n            title={`Clear ${f.label} filter: ${f.value}`}\n          >\n            {f.label}: {truncateMiddle(f.value, 12)}\n            <X className=\"w-2.5 h-2.5\" />\n          </button>\n        ))}\n      </FilterBar>\n\n        <DataTable\n          columns={columns}\n          data={messages}\n          keyFn={(row) => `${row.source}:${row.id}`}\n          isLoading={isLoading}\n          emptyMessage=\"No stream messages found\"\n          onRowClick={(row) => setSelected(row)}\n          activeRowKey={activeMessage ? `${activeMessage.source}:${activeMessage.id}` : null}\n          sort={sort}\n          onSort={setSort}\n          layout=\"fixed\"\n        />\n\n        {/* Direct child of the tall column so sticky works; its -mx-10 fills\n            the column's pr-10, ending flush at the panel's edge. */}\n        <StickyPagination\n          page={pagination.page}\n          totalPages={pagination.totalPages(total)}\n          onPageChange={pagination.setPage}\n          total={total}\n          pageSize={pagination.pageSize}\n          onPageSizeChange={pagination.setPageSize}\n        />\n      </div>\n\n      {/* Detail panel — spans the page height; the sticky viewport keeps the\n          chrome pinned to the visible area with its own scroll. */}\n      <SlidePanel open={panelOpen} width={416} className=\"self-stretch\">\n        <div className=\"h-full pl-4\">\n          <SlidePanelViews\n            views={[{\n              id: 'detail',\n              icon: MessageSquare,\n              label: 'Message Detail',\n              content: displayMessage ? (\n                <StreamMessageDetail\n                  message={displayMessage}\n                  filters={{\n                    onFilterStatus: (v) => setFilter('status', v),\n                    onFilterStreamName: (v) => setFilter('stream_name', v),\n                    onFilterMsgType: (v) => setFilter('msg_type', v),\n                    onFilterTopic: (v) => setFilter('topic', v),\n                    onFilterWorkflow: (v) => setFilter('workflow_name', v),\n                    onFilterJid: (v) => setFilter('jid', v),\n                    onFilterAid: (v) => setFilter('aid', v),\n                  }}\n                />\n              ) : null,\n            }]}\n            activeId=\"detail\"\n            onViewChange={() => {}}\n            onClose={() => setSelected(null)}\n            stickyClassName=\"sticky top-0 z-10 h-[calc(100vh-5.25rem)] pt-9\"\n          />\n        </div>\n      </SlidePanel>\n    </div>\n  );\n}\n"],"names":["truncateMiddle","str","max","half","StreamMessagesPage","namespace","available","useNamespace","filters","setFilter","pagination","sort","setSort","useFilterParams","selected","setSelected","useState","namespaceOptions","useMemo","id","data","isLoading","refetch","isFetching","useStreamMessages","messages","total","activeMessage","m","panelOpen","lastMessage","setLastMessage","useEffect","displayMessage","columns","row","jsxs","jsx","STATUS_DOT","STATUS_LABEL","SOURCE_BADGE","DateValue","PageHeader","FilterBar","ListToolbar","buildApiPath","FilterSelect","v","SOURCE_OPTIONS","STATUS_OPTIONS","FilterInput","f","X","DataTable","StickyPagination","SlidePanel","SlidePanelViews","MessageSquare","StreamMessageDetail"],"mappings":"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"}