@burdenoff/microfe-channel 2026.830.2 → 2026.1013.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/dist/channel/components/AdapterCredentialsForm.js +1 -1
  2. package/dist/channel/components/AdapterCredentialsForm.js.map +1 -1
  3. package/dist/channel/modules/channels/pages/ChannelDashboardPage.js +2 -2
  4. package/dist/channel/modules/channels/pages/ChannelDashboardPage.js.map +1 -1
  5. package/dist/channel/modules/channels/pages/ChannelSettingsPage.js +3 -3
  6. package/dist/channel/modules/channels/pages/ChannelSettingsPage.js.map +1 -1
  7. package/dist/channel/modules/channels/pages/ChannelUsersPage.js +1 -1
  8. package/dist/channel/modules/channels/pages/ChannelUsersPage.js.map +1 -1
  9. package/dist/channel/modules/channels/pages/ChannelsListPage.js +2 -2
  10. package/dist/channel/modules/channels/pages/ChannelsListPage.js.map +1 -1
  11. package/dist/channel/modules/channels/pages/ConnectionsListPage.js +2 -2
  12. package/dist/channel/modules/channels/pages/ConnectionsListPage.js.map +1 -1
  13. package/dist/channel/modules/channels/pages/CreateChannelPage.js +2 -2
  14. package/dist/channel/modules/channels/pages/CreateChannelPage.js.map +1 -1
  15. package/dist/channel/modules/channels/pages/CreateConnectionPage.js +2 -2
  16. package/dist/channel/modules/channels/pages/CreateConnectionPage.js.map +1 -1
  17. package/dist/channel/modules/channels/pages/DeliveryHistoryPage.js +1 -1
  18. package/dist/channel/modules/channels/pages/DeliveryHistoryPage.js.map +1 -1
  19. package/dist/channel/modules/channels/pages/EditChannelPage.js +3 -3
  20. package/dist/channel/modules/channels/pages/EditChannelPage.js.map +1 -1
  21. package/dist/channel/modules/channels/pages/SendMessagePage.js +1 -1
  22. package/dist/channel/modules/channels/pages/SendMessagePage.js.map +1 -1
  23. package/dist/channel/modules/channels/pages/WebhookEventsPage.js +1 -1
  24. package/dist/channel/modules/channels/pages/WebhookEventsPage.js.map +1 -1
  25. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"DeliveryHistoryPage.js","names":[],"sources":["../../../../../src/channel/modules/channels/pages/DeliveryHistoryPage.tsx"],"sourcesContent":["/**\n * Delivery History Page\n *\n * Displays message delivery attempts for a specific channel with retry capability\n */\n\nimport { useState, useEffect, useCallback, useRef } from 'react';\nimport { useParams, useNavigate } from 'react-router';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport {\n ArrowLeft,\n Loader2,\n AlertCircle,\n CheckCircle2,\n XCircle,\n Clock,\n RefreshCw,\n Send,\n RotateCcw,\n Download,\n ChevronLeft,\n ChevronRight,\n} from 'lucide-react';\nimport {\n CTAOverflowMenu,\n EmphasisPanel,\n ResponsiveTable,\n IllustratedEmptyState,\n PagePurpose,\n type ResponsiveTableColumn,\n} from '@burdenoff/fe-libs/ui';\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { useChannel, type DeliveryStatus, type DeliveryAttempt } from '../../../hooks/useChannels';\nimport { useChannel as useChannelContext } from '../../../providers/ChannelProvider';\nimport { PermissionGuard } from '../../../components/PermissionGuard';\nimport { CHANNEL_PERMISSIONS } from '../../../constants/permissions';\nimport { useExportDeliveryAttempts } from '../hooks/useExport';\n\nconst STATUS_CONFIG: Record<\n DeliveryStatus,\n { label: string; color: string; icon: typeof CheckCircle2 }\n> = {\n PENDING: { label: 'Pending', color: 'text-text-secondary bg-bg-sunken', icon: Clock },\n QUEUED: { label: 'Queued', color: 'text-accent-primary bg-accent-primary-subtle', icon: Clock },\n SENDING: { label: 'Sending', color: 'text-accent-primary bg-accent-primary/10', icon: Send },\n SENT: {\n label: 'Sent',\n color: 'text-status-success-text bg-status-success-bg-subtle',\n icon: CheckCircle2,\n },\n DELIVERED: {\n label: 'Delivered',\n color: 'text-status-success-text bg-status-success-bg-subtle',\n icon: CheckCircle2,\n },\n FAILED: {\n label: 'Failed',\n color: 'text-status-error-text bg-status-error-bg-subtle',\n icon: XCircle,\n },\n BOUNCED: {\n label: 'Bounced',\n color: 'text-status-warning-text bg-status-warning-bg-subtle',\n icon: AlertCircle,\n },\n REJECTED: {\n label: 'Rejected',\n color: 'text-status-error-text bg-status-error-bg-subtle',\n icon: XCircle,\n },\n RATE_LIMITED: {\n label: 'Rate Limited',\n color: 'text-status-warning-text bg-status-warning-bg-subtle',\n icon: Clock,\n },\n RETRYING: {\n label: 'Retrying',\n color: 'text-accent-primary bg-accent-primary/10',\n icon: RefreshCw,\n },\n OPENED: {\n label: 'Opened',\n color: 'text-status-success-text bg-status-success-bg-subtle',\n icon: CheckCircle2,\n },\n CLICKED: {\n label: 'Clicked',\n color: 'text-status-success-text bg-status-success-bg-subtle',\n icon: CheckCircle2,\n },\n};\n\nexport function DeliveryHistoryPage() {\n const { channelId } = useParams<{ channelId: string }>();\n const navigate = useNavigate();\n const { hasPermission } = usePermissions();\n const canExport = hasPermission(CHANNEL_PERMISSIONS.CHANNEL_DELIVERY_EXPORT);\n const { t } = useI18n();\n const tr = (key: string, fallback: string): string => {\n const value = t(key);\n return value === key ? fallback : value;\n };\n const { organizationId } = useChannelContext();\n const {\n triggerExport: exportDeliveries,\n isExporting: isExportingDeliveries,\n exportError: exportDeliveriesError,\n } = useExportDeliveryAttempts(organizationId ?? undefined, channelId);\n const [isLoadingAttempts, setIsLoadingAttempts] = useState(true);\n const [attempts, setAttempts] = useState<DeliveryAttempt[]>([]);\n const [retryingId, setRetryingId] = useState<string | null>(null);\n const [retryError, setRetryError] = useState<string | null>(null);\n const [limit, setLimit] = useState(25);\n const [total, setTotal] = useState(0);\n // Cursor stack: index 0 is always undefined (first page), subsequent entries are cursors\n const [cursorStack, setCursorStack] = useState<(string | undefined)[]>([undefined]);\n const [currentPageIdx, setCurrentPageIdx] = useState(0);\n\n const { channel, isLoading, error, fetchDeliveryAttempts, retryDelivery } = useChannel(channelId);\n\n const loadAttempts = useCallback(\n async (cursor?: string) => {\n if (!channelId) return;\n setIsLoadingAttempts(true);\n setRetryError(null);\n try {\n const result = await fetchDeliveryAttempts(limit, cursor);\n setAttempts(result.items);\n setTotal(result.total);\n return result.nextCursor;\n } finally {\n setIsLoadingAttempts(false);\n }\n },\n [channelId, fetchDeliveryAttempts, limit]\n );\n\n const loadAttemptsRef = useRef(loadAttempts);\n const cursorStackRef = useRef(cursorStack);\n useEffect(() => {\n loadAttemptsRef.current = loadAttempts;\n cursorStackRef.current = cursorStack;\n });\n const isFirstPageRender = useRef(true);\n\n useEffect(() => {\n void Promise.resolve().then(() => {\n setCursorStack([undefined]);\n setCurrentPageIdx(0);\n void loadAttemptsRef.current(undefined);\n });\n }, [limit]);\n\n useEffect(() => {\n if (isFirstPageRender.current) {\n isFirstPageRender.current = false;\n return;\n }\n void Promise.resolve().then(() =>\n loadAttemptsRef.current(cursorStackRef.current[currentPageIdx])\n );\n }, [currentPageIdx]);\n\n // Poll for delivery attempt updates every 60 s on first page only\n useEffect(() => {\n if (!channelId || currentPageIdx !== 0) return;\n const timer = setInterval(() => {\n void loadAttempts(undefined);\n }, 60_000);\n return () => clearInterval(timer);\n }, [channelId, currentPageIdx, loadAttempts]);\n\n const handleNextPage = useCallback(async () => {\n const nextCursor = await loadAttempts(cursorStack[currentPageIdx]);\n if (nextCursor) {\n setCursorStack((prev) => {\n const next = [...prev];\n if (!next[currentPageIdx + 1]) {\n next[currentPageIdx + 1] = nextCursor;\n }\n return next;\n });\n }\n setCurrentPageIdx((p) => p + 1);\n }, [cursorStack, currentPageIdx, loadAttempts]);\n\n const handlePrevPage = useCallback(() => {\n const prevIdx = currentPageIdx - 1;\n setCurrentPageIdx(prevIdx);\n void loadAttempts(cursorStack[prevIdx]);\n }, [cursorStack, currentPageIdx, loadAttempts]);\n\n const hasNextPage = attempts.length === limit;\n const hasPrevPage = currentPageIdx > 0;\n\n const handleRetry = async (attemptId: string) => {\n setRetryingId(attemptId);\n setRetryError(null);\n try {\n const result = await retryDelivery(attemptId);\n if (!result.success) {\n setRetryError(result.error || 'Retry failed');\n } else {\n await loadAttempts(cursorStack[currentPageIdx]);\n }\n } finally {\n setRetryingId(null);\n }\n };\n\n const getStatusConfig = (status: DeliveryStatus) => {\n return STATUS_CONFIG[status] || STATUS_CONFIG.PENDING;\n };\n\n const deliveryColumns: ResponsiveTableColumn<DeliveryAttempt>[] = [\n {\n key: 'status',\n header: tr('channel.status', 'Status'),\n priority: 'primary',\n cell: (delivery) => {\n const statusConfig = getStatusConfig(delivery.status as DeliveryStatus);\n const StatusIcon = statusConfig.icon;\n return (\n <div className=\"flex items-center gap-2\">\n <StatusIcon size={14} className={statusConfig.color.split(' ')[0]} />\n <span className={`text-sm font-medium ${statusConfig.color}`}>\n {statusConfig.label}\n </span>\n </div>\n );\n },\n },\n {\n key: 'content',\n header: tr('channel.content', 'Content'),\n priority: 'primary',\n cellClassName: 'text-sm text-text-primary truncate max-w-xs',\n cell: (delivery) => delivery.content,\n },\n {\n key: 'sentAt',\n header: tr('channel.sentAt', 'Sent At'),\n priority: 'secondary',\n cellClassName: 'text-sm text-text-secondary',\n cell: (delivery) => (delivery.sentAt ? new Date(delivery.sentAt).toLocaleString() : '-'),\n },\n {\n key: 'retries',\n header: tr('channel.retries', 'Retries'),\n priority: 'secondary',\n cellClassName: 'text-sm text-text-secondary tabular-nums',\n cell: (delivery) => delivery.retryCount,\n },\n {\n key: 'error',\n header: tr('channel.error', 'Error'),\n priority: 'secondary',\n cellClassName: 'text-sm text-status-error-text max-w-xs truncate',\n cell: (delivery) => delivery.errorMessage || '-',\n },\n {\n key: 'actions',\n header: tr('channel.actions', 'Actions'),\n priority: 'secondary',\n cell: (delivery) => {\n const canRetry =\n delivery.status === 'FAILED' ||\n delivery.status === 'BOUNCED' ||\n delivery.status === 'REJECTED';\n if (!canRetry) return null;\n return (\n <PermissionGuard permission={CHANNEL_PERMISSIONS.CHANNEL_DELIVERY_EXECUTE}>\n <button\n type=\"button\"\n onClick={() => handleRetry(delivery.id)}\n disabled={retryingId === delivery.id}\n className=\"flex items-center gap-1 px-2 py-1 text-xs font-medium text-accent-primary hover:bg-accent-primary/10 rounded transition-colors disabled:opacity-50\"\n title={tr('channel.retryDelivery', 'Retry this delivery')}\n >\n <RotateCcw size={12} className={retryingId === delivery.id ? 'animate-spin' : ''} />\n {retryingId === delivery.id\n ? tr('channel.retrying', 'Retrying...')\n : tr('channel.retry', 'Retry')}\n </button>\n </PermissionGuard>\n );\n },\n },\n ];\n\n // Loading state\n if (isLoading) {\n return (\n <output\n className=\"flex items-center justify-center min-h-screen\"\n aria-label={tr('channel.loading', 'Loading')}\n >\n <Loader2 size={32} className=\"animate-spin text-accent-primary\" aria-hidden=\"true\" />\n </output>\n );\n }\n\n // Error state\n if (error || !channel) {\n return (\n <div className=\"p-6\">\n <div className=\"flex items-center gap-3 p-4 bg-status-error-bg-subtle border border-status-error-border rounded-lg\">\n <AlertCircle size={20} className=\"text-status-error-text\" />\n <div>\n <p className=\"text-sm font-medium text-status-error-text\">\n {error || 'Channel not found'}\n </p>\n </div>\n <button\n type=\"button\"\n onClick={() => navigate(`/channels/${channelId}`)}\n className=\"ml-auto px-3 py-1 text-sm text-status-error-text hover:bg-status-error-bg-subtle rounded transition-colors\"\n >\n Go Back\n </button>\n </div>\n </div>\n );\n }\n\n return (\n <PermissionGuard permission={CHANNEL_PERMISSIONS.CHANNEL_DELIVERY_READ}>\n <div className=\"space-y-6 p-3 sm:p-6\">\n {/* Header */}\n <div className=\"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between\">\n <div className=\"flex items-center gap-3\">\n <button\n type=\"button\"\n onClick={() => navigate(`/channels/${channelId}`)}\n aria-label={tr('channel.backToChannel', 'Back to channel')}\n className=\"p-2 text-text-secondary hover:text-text-primary hover:bg-bg-sunken rounded-lg transition-colors\"\n >\n <ArrowLeft size={20} aria-hidden=\"true\" />\n </button>\n <div>\n <h1 className=\"text-xl sm:text-2xl font-bold text-text-primary\">\n {tr('channel.deliveryHistory', 'Delivery History')}\n </h1>\n <p className=\"text-sm text-text-secondary mt-1\">\n {channel.name} - Message deliveries\n </p>\n </div>\n </div>\n <div className=\"flex items-center gap-3\">\n <select\n value={limit}\n onChange={(e) => setLimit(Number(e.target.value))}\n className=\"px-3 py-2 text-sm bg-surface border border-border-subtle rounded-lg focus:outline-none focus:ring-2 focus:ring-action-primary-bg/50 text-text-primary\"\n >\n <option value={10}>10 results</option>\n <option value={25}>25 results</option>\n <option value={50}>50 results</option>\n <option value={100}>100 results</option>\n </select>\n <CTAOverflowMenu\n actions={[\n {\n label: tr('channel.refresh', 'Refresh'),\n icon: (\n <RefreshCw\n size={16}\n className={isLoadingAttempts ? 'animate-spin' : ''}\n aria-hidden=\"true\"\n />\n ),\n disabled: isLoadingAttempts,\n onSelect: () => void loadAttempts(cursorStack[currentPageIdx]),\n },\n ...(canExport\n ? [\n {\n label: tr('channel.export', 'Export'),\n icon: isExportingDeliveries ? (\n <Loader2 size={16} className=\"animate-spin\" aria-hidden=\"true\" />\n ) : (\n <Download size={16} aria-hidden=\"true\" />\n ),\n disabled: isExportingDeliveries,\n onSelect: () => void exportDeliveries(),\n },\n ]\n : []),\n ]}\n />\n </div>\n </div>\n\n {/* Export Error Banner */}\n {exportDeliveriesError && (\n <div className=\"p-4 bg-status-error-bg-subtle border border-status-error-border rounded-lg flex items-center gap-3\">\n <AlertCircle size={20} className=\"text-status-error-text\" />\n <p className=\"text-sm text-status-error-text flex-1\">{exportDeliveriesError}</p>\n </div>\n )}\n\n {/* Error Banner */}\n {retryError && (\n <div className=\"p-4 bg-status-error-bg-subtle border border-status-error-border rounded-lg flex items-center gap-3\">\n <AlertCircle size={20} className=\"text-status-error-text\" />\n <p className=\"text-sm text-status-error-text flex-1\">{retryError}</p>\n <button\n type=\"button\"\n onClick={() => setRetryError(null)}\n className=\"text-status-error-text hover:text-status-error-text\"\n >\n {tr('channel.dismiss', 'Dismiss')}\n </button>\n </div>\n )}\n\n {/* Page purpose */}\n <PagePurpose icon={<Send size={15} aria-hidden=\"true\" />}>\n {tr(\n 'channel.deliveryHistoryPurpose',\n 'A per-message audit trail of everything this channel has tried to send — sent, delivered, opened, bounced or failed — with the error returned by the provider. Use it to confirm a notification actually went out, to debug why a delivery failed, and to retry failed attempts one by one. Records are kept for 7 days.'\n )}\n </PagePurpose>\n\n {/* Emphasis — delivery total summary */}\n <EmphasisPanel className=\"flex items-center gap-3 p-4\">\n <span className=\"rounded-lg bg-accent-orange/10 p-2\">\n <Send size={18} className=\"text-accent-orange\" aria-hidden=\"true\" />\n </span>\n <div>\n <p className=\"text-sm font-semibold text-text-primary\">\n {total}{' '}\n {total === 1\n ? tr('channel.deliveryAttemptSingular', 'delivery attempt')\n : tr('channel.deliveryAttemptsPlural', 'delivery attempts')}\n </p>\n <p className=\"text-sm text-text-secondary\">\n {tr(\n 'channel.deliveryHistoryBannerHint',\n 'All message attempts sent through this channel, retained for 7 days. Retry any failed delivery to attempt sending again.'\n )}\n </p>\n </div>\n </EmphasisPanel>\n\n {/* Deliveries List */}\n {isLoadingAttempts ? (\n <div className=\"bg-surface border border-border-seam rounded-lg px-4 py-12 text-center\">\n <Loader2 size={24} className=\"animate-spin text-accent-primary mx-auto\" />\n <p className=\"text-sm text-text-secondary mt-2\">Loading delivery attempts…</p>\n </div>\n ) : (\n <ResponsiveTable\n columns={deliveryColumns}\n data={attempts}\n rowKey={(delivery) => delivery.id}\n className=\"bg-surface border border-border-seam rounded-lg\"\n emptyState={\n <IllustratedEmptyState\n illustration=\"empty-notifications\"\n title={tr('channel.noDeliveryAttempts', 'No delivery attempts yet')}\n description={tr(\n 'channel.sendMessageToSeeHistory',\n 'Send a message through this channel to see delivery history'\n )}\n />\n }\n />\n )}\n\n {/* Pagination footer */}\n <div className=\"flex items-center justify-between\">\n <p className=\"text-sm text-text-secondary\">\n {total > 0 && (\n <>\n {tr('channel.page', 'Page')}{' '}\n <span className=\"font-medium\">{currentPageIdx + 1}</span>\n {' · '}\n {tr('channel.totalRecords', 'Total')}: <span className=\"font-medium\">{total}</span>\n </>\n )}\n </p>\n <div className=\"flex items-center gap-2\">\n <button\n type=\"button\"\n onClick={handlePrevPage}\n disabled={!hasPrevPage || isLoadingAttempts}\n className=\"flex items-center gap-1 px-3 py-1.5 text-sm border border-border-subtle rounded-lg hover:bg-bg-sunken transition-colors disabled:opacity-40 disabled:cursor-not-allowed\"\n >\n <ChevronLeft size={16} />\n {tr('channel.previous', 'Previous')}\n </button>\n <button\n type=\"button\"\n onClick={() => void handleNextPage()}\n disabled={!hasNextPage || isLoadingAttempts}\n className=\"flex items-center gap-1 px-3 py-1.5 text-sm border border-border-subtle rounded-lg hover:bg-bg-sunken transition-colors disabled:opacity-40 disabled:cursor-not-allowed\"\n >\n {tr('channel.next', 'Next')}\n <ChevronRight size={16} />\n </button>\n </div>\n </div>\n </div>\n </PermissionGuard>\n );\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"DeliveryHistoryPage.js","names":[],"sources":["../../../../../src/channel/modules/channels/pages/DeliveryHistoryPage.tsx"],"sourcesContent":["/**\n * Delivery History Page\n *\n * Displays message delivery attempts for a specific channel with retry capability\n */\n\nimport { useState, useEffect, useCallback, useRef } from 'react';\nimport { useParams, useNavigate } from 'react-router';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport {\n ArrowLeft,\n Loader2,\n AlertCircle,\n CheckCircle2,\n XCircle,\n Clock,\n RefreshCw,\n Send,\n RotateCcw,\n Download,\n ChevronLeft,\n ChevronRight,\n} from 'lucide-react';\nimport {\n CTAOverflowMenu,\n EmphasisPanel,\n ResponsiveTable,\n IllustratedEmptyState,\n PagePurpose,\n type ResponsiveTableColumn,\n} from '@burdenoff/fe-libs/ui';\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { useChannel, type DeliveryStatus, type DeliveryAttempt } from '../../../hooks/useChannels';\nimport { useChannel as useChannelContext } from '../../../providers/ChannelProvider';\nimport { PermissionGuard } from '../../../components/PermissionGuard';\nimport { CHANNEL_PERMISSIONS } from '../../../constants/permissions';\nimport { useExportDeliveryAttempts } from '../hooks/useExport';\n\nconst STATUS_CONFIG: Record<\n DeliveryStatus,\n { label: string; color: string; icon: typeof CheckCircle2 }\n> = {\n PENDING: { label: 'Pending', color: 'text-text-secondary bg-bg-sunken', icon: Clock },\n QUEUED: { label: 'Queued', color: 'text-accent-primary bg-accent-primary-subtle', icon: Clock },\n SENDING: { label: 'Sending', color: 'text-accent-primary bg-accent-primary/10', icon: Send },\n SENT: {\n label: 'Sent',\n color: 'text-status-success-text bg-status-success-bg-subtle',\n icon: CheckCircle2,\n },\n DELIVERED: {\n label: 'Delivered',\n color: 'text-status-success-text bg-status-success-bg-subtle',\n icon: CheckCircle2,\n },\n FAILED: {\n label: 'Failed',\n color: 'text-status-error-text bg-status-error-bg-subtle',\n icon: XCircle,\n },\n BOUNCED: {\n label: 'Bounced',\n color: 'text-status-warning-text bg-status-warning-bg-subtle',\n icon: AlertCircle,\n },\n REJECTED: {\n label: 'Rejected',\n color: 'text-status-error-text bg-status-error-bg-subtle',\n icon: XCircle,\n },\n RATE_LIMITED: {\n label: 'Rate Limited',\n color: 'text-status-warning-text bg-status-warning-bg-subtle',\n icon: Clock,\n },\n RETRYING: {\n label: 'Retrying',\n color: 'text-accent-primary bg-accent-primary/10',\n icon: RefreshCw,\n },\n OPENED: {\n label: 'Opened',\n color: 'text-status-success-text bg-status-success-bg-subtle',\n icon: CheckCircle2,\n },\n CLICKED: {\n label: 'Clicked',\n color: 'text-status-success-text bg-status-success-bg-subtle',\n icon: CheckCircle2,\n },\n};\n\nexport function DeliveryHistoryPage() {\n const { channelId } = useParams<{ channelId: string }>();\n const navigate = useNavigate();\n const { hasPermission } = usePermissions();\n const canExport = hasPermission(CHANNEL_PERMISSIONS.CHANNEL_DELIVERY_EXPORT);\n const { t } = useI18n();\n const tr = (key: string, fallback: string): string => {\n const value = t(key);\n return value === key ? fallback : value;\n };\n const { organizationId } = useChannelContext();\n const {\n triggerExport: exportDeliveries,\n isExporting: isExportingDeliveries,\n exportError: exportDeliveriesError,\n } = useExportDeliveryAttempts(organizationId ?? undefined, channelId);\n const [isLoadingAttempts, setIsLoadingAttempts] = useState(true);\n const [attempts, setAttempts] = useState<DeliveryAttempt[]>([]);\n const [retryingId, setRetryingId] = useState<string | null>(null);\n const [retryError, setRetryError] = useState<string | null>(null);\n const [limit, setLimit] = useState(25);\n const [total, setTotal] = useState(0);\n // Cursor stack: index 0 is always undefined (first page), subsequent entries are cursors\n const [cursorStack, setCursorStack] = useState<(string | undefined)[]>([undefined]);\n const [currentPageIdx, setCurrentPageIdx] = useState(0);\n\n const { channel, isLoading, error, fetchDeliveryAttempts, retryDelivery } = useChannel(channelId);\n\n const loadAttempts = useCallback(\n async (cursor?: string) => {\n if (!channelId) return;\n setIsLoadingAttempts(true);\n setRetryError(null);\n try {\n const result = await fetchDeliveryAttempts(limit, cursor);\n setAttempts(result.items);\n setTotal(result.total);\n return result.nextCursor;\n } finally {\n setIsLoadingAttempts(false);\n }\n },\n [channelId, fetchDeliveryAttempts, limit]\n );\n\n const loadAttemptsRef = useRef(loadAttempts);\n const cursorStackRef = useRef(cursorStack);\n useEffect(() => {\n loadAttemptsRef.current = loadAttempts;\n cursorStackRef.current = cursorStack;\n });\n const isFirstPageRender = useRef(true);\n\n useEffect(() => {\n void Promise.resolve().then(() => {\n setCursorStack([undefined]);\n setCurrentPageIdx(0);\n void loadAttemptsRef.current(undefined);\n });\n }, [limit]);\n\n useEffect(() => {\n if (isFirstPageRender.current) {\n isFirstPageRender.current = false;\n return;\n }\n void Promise.resolve().then(() =>\n loadAttemptsRef.current(cursorStackRef.current[currentPageIdx])\n );\n }, [currentPageIdx]);\n\n // Poll for delivery attempt updates every 60 s on first page only\n useEffect(() => {\n if (!channelId || currentPageIdx !== 0) return;\n const timer = setInterval(() => {\n void loadAttempts(undefined);\n }, 60_000);\n return () => clearInterval(timer);\n }, [channelId, currentPageIdx, loadAttempts]);\n\n const handleNextPage = useCallback(async () => {\n const nextCursor = await loadAttempts(cursorStack[currentPageIdx]);\n if (nextCursor) {\n setCursorStack((prev) => {\n const next = [...prev];\n if (!next[currentPageIdx + 1]) {\n next[currentPageIdx + 1] = nextCursor;\n }\n return next;\n });\n }\n setCurrentPageIdx((p) => p + 1);\n }, [cursorStack, currentPageIdx, loadAttempts]);\n\n const handlePrevPage = useCallback(() => {\n const prevIdx = currentPageIdx - 1;\n setCurrentPageIdx(prevIdx);\n void loadAttempts(cursorStack[prevIdx]);\n }, [cursorStack, currentPageIdx, loadAttempts]);\n\n const hasNextPage = attempts.length === limit;\n const hasPrevPage = currentPageIdx > 0;\n\n const handleRetry = async (attemptId: string) => {\n setRetryingId(attemptId);\n setRetryError(null);\n try {\n const result = await retryDelivery(attemptId);\n if (!result.success) {\n setRetryError(result.error || 'Retry failed');\n } else {\n await loadAttempts(cursorStack[currentPageIdx]);\n }\n } finally {\n setRetryingId(null);\n }\n };\n\n const getStatusConfig = (status: DeliveryStatus) => {\n return STATUS_CONFIG[status] || STATUS_CONFIG.PENDING;\n };\n\n const deliveryColumns: ResponsiveTableColumn<DeliveryAttempt>[] = [\n {\n key: 'status',\n header: tr('channel.status', 'Status'),\n priority: 'primary',\n cell: (delivery) => {\n const statusConfig = getStatusConfig(delivery.status as DeliveryStatus);\n const StatusIcon = statusConfig.icon;\n return (\n <div className=\"flex items-center gap-2\">\n <StatusIcon size={14} className={statusConfig.color.split(' ')[0]} />\n <span className={`text-sm font-medium ${statusConfig.color}`}>\n {statusConfig.label}\n </span>\n </div>\n );\n },\n },\n {\n key: 'content',\n header: tr('channel.content', 'Content'),\n priority: 'primary',\n cellClassName: 'text-sm text-text-primary truncate max-w-xs',\n cell: (delivery) => delivery.content,\n },\n {\n key: 'sentAt',\n header: tr('channel.sentAt', 'Sent At'),\n priority: 'secondary',\n cellClassName: 'text-sm text-text-secondary',\n cell: (delivery) => (delivery.sentAt ? new Date(delivery.sentAt).toLocaleString() : '-'),\n },\n {\n key: 'retries',\n header: tr('channel.retries', 'Retries'),\n priority: 'secondary',\n cellClassName: 'text-sm text-text-secondary tabular-nums',\n cell: (delivery) => delivery.retryCount,\n },\n {\n key: 'error',\n header: tr('channel.error', 'Error'),\n priority: 'secondary',\n cellClassName: 'text-sm text-status-error-text max-w-xs truncate',\n cell: (delivery) => delivery.errorMessage || '-',\n },\n {\n key: 'actions',\n header: tr('channel.actions', 'Actions'),\n priority: 'secondary',\n cell: (delivery) => {\n const canRetry =\n delivery.status === 'FAILED' ||\n delivery.status === 'BOUNCED' ||\n delivery.status === 'REJECTED';\n if (!canRetry) return null;\n return (\n <PermissionGuard permission={CHANNEL_PERMISSIONS.CHANNEL_DELIVERY_EXECUTE}>\n <button\n type=\"button\"\n onClick={() => handleRetry(delivery.id)}\n disabled={retryingId === delivery.id}\n className=\"flex items-center gap-1 px-2 py-1 text-xs font-medium text-accent-primary hover:bg-accent-primary/10 rounded transition-colors disabled:opacity-50\"\n title={tr('channel.retryDelivery', 'Retry this delivery')}\n >\n <RotateCcw size={12} className={retryingId === delivery.id ? 'animate-spin' : ''} />\n {retryingId === delivery.id\n ? tr('channel.retrying', 'Retrying...')\n : tr('channel.retry', 'Retry')}\n </button>\n </PermissionGuard>\n );\n },\n },\n ];\n\n // Loading state\n if (isLoading) {\n return (\n <output\n className=\"flex items-center justify-center min-h-screen\"\n aria-label={tr('channel.loading', 'Loading')}\n >\n <Loader2 size={32} className=\"animate-spin text-accent-primary\" aria-hidden=\"true\" />\n </output>\n );\n }\n\n // Error state\n if (error || !channel) {\n return (\n <div className=\"p-6\">\n <div className=\"flex items-center gap-3 p-4 bg-status-error-bg-subtle border border-status-error-border rounded-lg\">\n <AlertCircle size={20} className=\"text-status-error-text\" />\n <div>\n <p className=\"text-sm font-medium text-status-error-text\">\n {error || 'Channel not found'}\n </p>\n </div>\n <button\n type=\"button\"\n onClick={() => navigate(`/channels/${channelId}`)}\n className=\"ml-auto px-3 py-1 text-sm text-status-error-text hover:bg-status-error-bg-subtle rounded transition-colors\"\n >\n Go Back\n </button>\n </div>\n </div>\n );\n }\n\n return (\n <PermissionGuard permission={CHANNEL_PERMISSIONS.CHANNEL_DELIVERY_READ}>\n <div className=\"space-y-6 p-3 sm:p-6\">\n {/* Header */}\n <div className=\"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between\">\n <div className=\"flex items-center gap-3\">\n <button\n type=\"button\"\n onClick={() => navigate(`/channels/${channelId}`)}\n aria-label={tr('channel.backToChannel', 'Back to channel')}\n className=\"p-2 text-text-secondary hover:text-text-primary hover:bg-bg-sunken rounded-lg transition-colors\"\n >\n <ArrowLeft size={20} aria-hidden=\"true\" />\n </button>\n <div>\n <h1 className=\"text-xl sm:text-2xl font-bold text-text-primary\">\n {tr('channel.deliveryHistory', 'Delivery History')}\n </h1>\n <p className=\"text-sm text-text-secondary mt-1\">\n {channel.name} - Message deliveries\n </p>\n </div>\n </div>\n <div className=\"flex items-center gap-3\">\n <select\n value={limit}\n onChange={(e) => setLimit(Number(e.target.value))}\n className=\"px-3 py-2 text-sm bg-surface border border-border-subtle rounded-lg focus:outline-none focus:ring-2 focus:ring-action-primary-bg/50 text-text-primary scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary\"\n >\n <option value={10}>10 results</option>\n <option value={25}>25 results</option>\n <option value={50}>50 results</option>\n <option value={100}>100 results</option>\n </select>\n <CTAOverflowMenu\n actions={[\n {\n label: tr('channel.refresh', 'Refresh'),\n icon: (\n <RefreshCw\n size={16}\n className={isLoadingAttempts ? 'animate-spin' : ''}\n aria-hidden=\"true\"\n />\n ),\n disabled: isLoadingAttempts,\n onSelect: () => void loadAttempts(cursorStack[currentPageIdx]),\n },\n ...(canExport\n ? [\n {\n label: tr('channel.export', 'Export'),\n icon: isExportingDeliveries ? (\n <Loader2 size={16} className=\"animate-spin\" aria-hidden=\"true\" />\n ) : (\n <Download size={16} aria-hidden=\"true\" />\n ),\n disabled: isExportingDeliveries,\n onSelect: () => void exportDeliveries(),\n },\n ]\n : []),\n ]}\n />\n </div>\n </div>\n\n {/* Export Error Banner */}\n {exportDeliveriesError && (\n <div className=\"p-4 bg-status-error-bg-subtle border border-status-error-border rounded-lg flex items-center gap-3\">\n <AlertCircle size={20} className=\"text-status-error-text\" />\n <p className=\"text-sm text-status-error-text flex-1\">{exportDeliveriesError}</p>\n </div>\n )}\n\n {/* Error Banner */}\n {retryError && (\n <div className=\"p-4 bg-status-error-bg-subtle border border-status-error-border rounded-lg flex items-center gap-3\">\n <AlertCircle size={20} className=\"text-status-error-text\" />\n <p className=\"text-sm text-status-error-text flex-1\">{retryError}</p>\n <button\n type=\"button\"\n onClick={() => setRetryError(null)}\n className=\"text-status-error-text hover:text-status-error-text\"\n >\n {tr('channel.dismiss', 'Dismiss')}\n </button>\n </div>\n )}\n\n {/* Page purpose */}\n <PagePurpose icon={<Send size={15} aria-hidden=\"true\" />}>\n {tr(\n 'channel.deliveryHistoryPurpose',\n 'A per-message audit trail of everything this channel has tried to send — sent, delivered, opened, bounced or failed — with the error returned by the provider. Use it to confirm a notification actually went out, to debug why a delivery failed, and to retry failed attempts one by one. Records are kept for 7 days.'\n )}\n </PagePurpose>\n\n {/* Emphasis — delivery total summary */}\n <EmphasisPanel className=\"flex items-center gap-3 p-4\">\n <span className=\"rounded-lg bg-accent-orange/10 p-2\">\n <Send size={18} className=\"text-accent-orange\" aria-hidden=\"true\" />\n </span>\n <div>\n <p className=\"text-sm font-semibold text-text-primary\">\n {total}{' '}\n {total === 1\n ? tr('channel.deliveryAttemptSingular', 'delivery attempt')\n : tr('channel.deliveryAttemptsPlural', 'delivery attempts')}\n </p>\n <p className=\"text-sm text-text-secondary\">\n {tr(\n 'channel.deliveryHistoryBannerHint',\n 'All message attempts sent through this channel, retained for 7 days. Retry any failed delivery to attempt sending again.'\n )}\n </p>\n </div>\n </EmphasisPanel>\n\n {/* Deliveries List */}\n {isLoadingAttempts ? (\n <div className=\"bg-surface border border-border-seam rounded-lg px-4 py-12 text-center\">\n <Loader2 size={24} className=\"animate-spin text-accent-primary mx-auto\" />\n <p className=\"text-sm text-text-secondary mt-2\">Loading delivery attempts…</p>\n </div>\n ) : (\n <ResponsiveTable\n columns={deliveryColumns}\n data={attempts}\n rowKey={(delivery) => delivery.id}\n className=\"bg-surface border border-border-seam rounded-lg\"\n emptyState={\n <IllustratedEmptyState\n illustration=\"empty-notifications\"\n title={tr('channel.noDeliveryAttempts', 'No delivery attempts yet')}\n description={tr(\n 'channel.sendMessageToSeeHistory',\n 'Send a message through this channel to see delivery history'\n )}\n />\n }\n />\n )}\n\n {/* Pagination footer */}\n <div className=\"flex items-center justify-between\">\n <p className=\"text-sm text-text-secondary\">\n {total > 0 && (\n <>\n {tr('channel.page', 'Page')}{' '}\n <span className=\"font-medium\">{currentPageIdx + 1}</span>\n {' · '}\n {tr('channel.totalRecords', 'Total')}: <span className=\"font-medium\">{total}</span>\n </>\n )}\n </p>\n <div className=\"flex items-center gap-2\">\n <button\n type=\"button\"\n onClick={handlePrevPage}\n disabled={!hasPrevPage || isLoadingAttempts}\n className=\"flex items-center gap-1 px-3 py-1.5 text-sm border border-border-subtle rounded-lg hover:bg-bg-sunken transition-colors disabled:opacity-40 disabled:cursor-not-allowed\"\n >\n <ChevronLeft size={16} />\n {tr('channel.previous', 'Previous')}\n </button>\n <button\n type=\"button\"\n onClick={() => void handleNextPage()}\n disabled={!hasNextPage || isLoadingAttempts}\n className=\"flex items-center gap-1 px-3 py-1.5 text-sm border border-border-subtle rounded-lg hover:bg-bg-sunken transition-colors disabled:opacity-40 disabled:cursor-not-allowed\"\n >\n {tr('channel.next', 'Next')}\n <ChevronRight size={16} />\n </button>\n </div>\n </div>\n </div>\n </PermissionGuard>\n );\n}\n"],"mappings":"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"}
@@ -378,7 +378,7 @@ function E() {
378
378
  }), /* @__PURE__ */ w("select", {
379
379
  value: R,
380
380
  onChange: (e) => z(e.target.value),
381
- className: "w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary",
381
+ className: "w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary",
382
382
  children: $.adapters.map((e) => /* @__PURE__ */ w("option", {
383
383
  value: e.value,
384
384
  children: j(e.labelKey, e.labelFallback)
@@ -397,7 +397,7 @@ function E() {
397
397
  /* @__PURE__ */ w("select", {
398
398
  value: B,
399
399
  onChange: (e) => V(Number(e.target.value)),
400
- className: "w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary",
400
+ className: "w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary",
401
401
  children: N.map((e) => /* @__PURE__ */ w("option", {
402
402
  value: e.value,
403
403
  children: e.label
@@ -416,7 +416,7 @@ function E() {
416
416
  }), /* @__PURE__ */ T("select", {
417
417
  value: H,
418
418
  onChange: (e) => U(e.target.value),
419
- className: "w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary",
419
+ className: "w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary",
420
420
  children: [
421
421
  /* @__PURE__ */ w("option", {
422
422
  value: "INACTIVE",
@@ -1 +1 @@
1
- {"version":3,"file":"EditChannelPage.js","names":[],"sources":["../../../../../src/channel/modules/channels/pages/EditChannelPage.tsx"],"sourcesContent":["/**\n * Edit Channel Page\n *\n * Allows editing an existing channel's configuration.\n * Uses the same form structure as CreateChannelPage but pre-fills existing values.\n */\n\nimport { useState, useEffect, useRef, useMemo } from 'react';\nimport { useNavigate, useParams } from 'react-router';\nimport { useTr } from '../../../hooks/useTr';\nimport {\n ArrowLeft,\n Save,\n Loader2,\n AlertCircle,\n Mail,\n Smartphone,\n Bell,\n Inbox,\n MessageSquare,\n Hash,\n Users,\n MessageCircle,\n Send,\n Trash2,\n} from 'lucide-react';\nimport { useChannel, useChannels } from '../../../hooks/useChannels';\nimport {\n type ChannelPlatform,\n type AdapterType,\n type ChannelStatus,\n type UpdateChannelInput,\n} from '../../../hooks/useChannels';\nimport { EmphasisPanel, GlassCard, PagePurpose } from '@burdenoff/fe-libs/ui';\nimport { nativeImpact, nativeNotify } from '../../../../utils/nativeBridge';\nimport { PermissionGuard } from '../../../components/PermissionGuard';\nimport { CHANNEL_PERMISSIONS } from '../../../constants/permissions';\nimport { MarkdownEditor } from '../../../components/MarkdownEditor';\n\ntype PlatformOption = {\n value: ChannelPlatform;\n labelKey: string;\n labelFallback: string;\n descriptionKey: string;\n descriptionFallback: string;\n icon: typeof Mail;\n color: string;\n adapters: { value: AdapterType; labelKey: string; labelFallback: string }[];\n};\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport function EditChannelPage() {\n const navigate = useNavigate();\n const { channelId } = useParams<{ channelId: string }>();\n const { channel, isLoading, error } = useChannel(channelId!);\n const { updateChannel, deleteChannel } = useChannels();\n const tr = useTr();\n\n const PLATFORM_OPTIONS: PlatformOption[] = useMemo(\n () => [\n {\n value: 'EMAIL',\n labelKey: 'channel.platformLabel.email',\n labelFallback: 'Email',\n descriptionKey: 'channel.platformDescription.emailDescription',\n descriptionFallback: 'Send emails via various providers',\n icon: Mail,\n color: 'text-status-info-text bg-status-info-bg-subtle border-status-info-border',\n adapters: [\n { value: 'AWS_SES', labelKey: 'channel.adapter.awsSes', labelFallback: 'AWS SES' },\n { value: 'MAILGUN', labelKey: 'channel.adapter.mailgun', labelFallback: 'Mailgun' },\n { value: 'POSTMARK', labelKey: 'channel.adapter.postmark', labelFallback: 'Postmark' },\n { value: 'MANDRILL', labelKey: 'channel.adapter.mandrill', labelFallback: 'Mandrill' },\n { value: 'RESEND', labelKey: 'channel.adapter.resend', labelFallback: 'Resend' },\n {\n value: 'AZURE_ACS',\n labelKey: 'channel.adapter.azureAcs',\n labelFallback: 'Azure Communication Services',\n },\n { value: 'SMTP', labelKey: 'channel.adapter.smtp', labelFallback: 'Custom SMTP' },\n ],\n },\n {\n value: 'SMS',\n labelKey: 'channel.platformLabel.sms',\n labelFallback: 'SMS',\n descriptionKey: 'channel.platformDescription.smsDescription',\n descriptionFallback: 'Send text messages',\n icon: Smartphone,\n color:\n 'text-status-success-text bg-status-success-bg-subtle border-status-success-border/30',\n adapters: [\n { value: 'TWILIO_SMS', labelKey: 'channel.adapter.twilio', labelFallback: 'Twilio' },\n { value: 'AWS_SNS', labelKey: 'channel.adapter.awsSns', labelFallback: 'AWS SNS' },\n { value: 'VONAGE', labelKey: 'channel.adapter.vonage', labelFallback: 'Vonage' },\n { value: 'PLIVO', labelKey: 'channel.adapter.plivo', labelFallback: 'Plivo' },\n {\n value: 'MESSAGEBIRD',\n labelKey: 'channel.adapter.messagebird',\n labelFallback: 'MessageBird',\n },\n { value: 'INFOBIP', labelKey: 'channel.adapter.infobip', labelFallback: 'Infobip' },\n ],\n },\n {\n value: 'PUSH',\n labelKey: 'channel.platformLabel.push',\n labelFallback: 'Push',\n descriptionKey: 'channel.platformDescription.pushDescription',\n descriptionFallback: 'Mobile & web push',\n icon: Bell,\n color: 'text-accent-purple bg-accent-purple-subtle border-accent-purple/30',\n adapters: [\n {\n value: 'FCM',\n labelKey: 'channel.adapter.fcm',\n labelFallback: 'Firebase Cloud Messaging',\n },\n {\n value: 'APNS',\n labelKey: 'channel.adapter.apns',\n labelFallback: 'Apple Push Notification Service',\n },\n { value: 'ONESIGNAL', labelKey: 'channel.adapter.onesignal', labelFallback: 'OneSignal' },\n { value: 'EXPO', labelKey: 'channel.adapter.expo', labelFallback: 'Expo Push' },\n ],\n },\n {\n value: 'INAPP',\n labelKey: 'channel.platformLabel.inApp',\n labelFallback: 'In-App',\n descriptionKey: 'channel.platformDescription.inAppDescription',\n descriptionFallback: 'Internal in-app notifications',\n icon: Inbox,\n color:\n 'text-status-warning-text bg-status-warning-bg-subtle border-status-warning-border/30',\n adapters: [\n {\n value: 'INAPP_NATIVE',\n labelKey: 'channel.adapter.inAppNative',\n labelFallback: 'Native In-App',\n },\n ],\n },\n {\n value: 'WHATSAPP',\n labelKey: 'channel.platformLabel.whatsapp',\n labelFallback: 'WhatsApp',\n descriptionKey: 'channel.platformDescription.whatsappDescription',\n descriptionFallback: 'WhatsApp Business messaging',\n icon: MessageSquare,\n color:\n 'text-status-success-text bg-status-success-bg-subtle border-status-success-border/30',\n adapters: [\n {\n value: 'WHATSAPP_CLOUD',\n labelKey: 'channel.adapter.whatsappCloud',\n labelFallback: 'WhatsApp Cloud API',\n },\n {\n value: 'WHATSAPP_TWILIO',\n labelKey: 'channel.adapter.whatsappTwilio',\n labelFallback: 'WhatsApp via Twilio',\n },\n ],\n },\n {\n value: 'SLACK',\n labelKey: 'channel.platformLabel.slack',\n labelFallback: 'Slack',\n descriptionKey: 'channel.platformDescription.slackDescription',\n descriptionFallback: 'Slack bot & channels',\n icon: Hash,\n color: 'text-accent-purple bg-accent-purple-subtle border-accent-purple/30',\n adapters: [\n { value: 'SLACK_BOT', labelKey: 'channel.adapter.slackBot', labelFallback: 'Slack Bot' },\n ],\n },\n {\n value: 'TEAMS',\n labelKey: 'channel.platformLabel.teams',\n labelFallback: 'Teams',\n descriptionKey: 'channel.platformDescription.teamsDescription',\n descriptionFallback: 'Microsoft Teams',\n icon: Users,\n color: 'text-status-info-text bg-status-info-bg-subtle border-status-info-border',\n adapters: [\n { value: 'TEAMS_BOT', labelKey: 'channel.adapter.teamsBot', labelFallback: 'Teams Bot' },\n ],\n },\n {\n value: 'DISCORD',\n labelKey: 'channel.platformLabel.discord',\n labelFallback: 'Discord',\n descriptionKey: 'channel.platformDescription.discordDescription',\n descriptionFallback: 'Discord bots & webhooks',\n icon: MessageCircle,\n color: 'text-accent-indigo bg-accent-indigo-subtle border-accent-indigo/30',\n adapters: [\n {\n value: 'DISCORD_BOT',\n labelKey: 'channel.adapter.discordBot',\n labelFallback: 'Discord Bot',\n },\n ],\n },\n {\n value: 'WEBCHAT',\n labelKey: 'channel.platformLabel.webchat',\n labelFallback: 'Webchat',\n descriptionKey: 'channel.platformDescription.webchatDescription',\n descriptionFallback: 'Website live chat',\n icon: MessageSquare,\n color: 'text-accent-teal bg-accent-teal-subtle border-accent-teal/30',\n adapters: [\n {\n value: 'WEBCHAT_NATIVE',\n labelKey: 'channel.adapter.webchatNative',\n labelFallback: 'Native Webchat',\n },\n ],\n },\n {\n value: 'WEBHOOK',\n labelKey: 'channel.platformLabel.webhook',\n labelFallback: 'Webhook',\n descriptionKey: 'channel.platformDescription.webhookDescription',\n descriptionFallback: 'Generic HTTP webhook',\n icon: Send,\n color: 'text-text-secondary bg-bg-sunken/50 border-border-subtle',\n adapters: [\n {\n value: 'WEBHOOK_HTTP',\n labelKey: 'channel.adapter.webhookHttp',\n labelFallback: 'HTTP Webhook',\n },\n ],\n },\n ],\n []\n );\n\n const PRIORITY_OPTIONS = useMemo(\n () => [\n { value: 0, label: tr('channel.priorityLabel.lowest', '0 - Lowest') },\n { value: 1, label: tr('channel.priorityLabel.low', '1 - Low') },\n { value: 2, label: tr('channel.priorityLabel.normal', '2 - Normal') },\n { value: 3, label: tr('channel.priorityLabel.high', '3 - High') },\n { value: 4, label: tr('channel.priorityLabel.highest', '4 - Highest') },\n ],\n [tr]\n );\n\n // Form state\n const [name, setName] = useState('');\n const [description, setDescription] = useState('');\n const [adapterType, setAdapterType] = useState<AdapterType>('AWS_SES');\n const [priority, setPriority] = useState(2);\n const [status, setStatus] = useState<ChannelStatus>('INACTIVE');\n\n // UI state\n const [isSaving, setIsSaving] = useState(false);\n const [isDeleting, setIsDeleting] = useState(false);\n const [saveError, setSaveError] = useState<string | null>(null);\n const [deleteConfirm, setDeleteConfirm] = useState(false);\n\n // Load channel data into form — guard against re-initialization and defer\n // the state update to a microtask so setState does not run synchronously\n // inside the effect body (react-hooks/set-state-in-effect).\n const loadedChannelIdRef = useRef<string | null>(null);\n useEffect(() => {\n if (channel && channel.id !== loadedChannelIdRef.current) {\n loadedChannelIdRef.current = channel.id;\n void Promise.resolve().then(() => {\n setName(channel.name || '');\n setDescription(channel.description || '');\n setAdapterType((channel.adapterType || 'AWS_SES') as AdapterType);\n setPriority(channel.priority || 2);\n setStatus((channel.status || 'INACTIVE') as ChannelStatus);\n });\n }\n }, [channel]);\n\n // Update adapter options when platform changes\n const currentPlatform = (channel?.platform || 'EMAIL') as ChannelPlatform;\n const selectedPlatform = PLATFORM_OPTIONS.find((p) => p.value === currentPlatform);\n\n const handleSave = async () => {\n if (!channelId) return;\n\n if (!name.trim()) {\n setSaveError(tr('channel.validation.nameRequired', 'Channel name is required'));\n return;\n }\n\n setIsSaving(true);\n setSaveError(null);\n\n try {\n const input: UpdateChannelInput = {\n name: name.trim(),\n description: description.trim() || undefined,\n adapterType,\n priority,\n status,\n };\n\n const result = await updateChannel(channelId, input);\n if (result) {\n navigate(`/channels/${channelId}`);\n } else {\n setSaveError(tr('channel.updateFailed', 'Failed to update channel'));\n }\n } catch (err: unknown) {\n const message =\n err instanceof Error ? err.message : tr('channel.updateFailed', 'Failed to update channel');\n setSaveError(message);\n } finally {\n setIsSaving(false);\n }\n };\n\n const handleDelete = async () => {\n if (!channelId || !deleteConfirm) return;\n void nativeImpact('medium');\n\n setIsDeleting(true);\n try {\n const success = await deleteChannel(channelId);\n if (success) {\n void nativeNotify('success');\n navigate('../list');\n } else {\n void nativeNotify('error');\n }\n } catch (err: unknown) {\n void nativeNotify('error');\n const message =\n err instanceof Error ? err.message : tr('channel.deleteFailed', 'Failed to delete channel');\n setSaveError(message);\n setIsDeleting(false);\n }\n };\n\n if (isLoading) {\n return (\n <div className=\"flex items-center justify-center min-h-screen\">\n <Loader2 className=\"size-8 animate-spin text-text-secondary\" />\n </div>\n );\n }\n\n if (error || !channel) {\n return (\n <div className=\"flex flex-col items-center justify-center min-h-screen gap-4\">\n <AlertCircle className=\"size-12 text-status-error-text\" />\n <h1 className=\"text-xl font-semibold\">\n {tr('channel.channelNotFound', 'Channel not found')}\n </h1>\n <button\n type=\"button\"\n onClick={() => navigate('../list')}\n className=\"text-primary hover:underline\"\n >\n {tr('channel.backToChannels', 'Back to channels')}\n </button>\n </div>\n );\n }\n\n return (\n <PermissionGuard permission={CHANNEL_PERMISSIONS.CHANNEL_UPDATE}>\n <div className=\"min-h-screen bg-bg-surface\">\n {/* Header */}\n <div className=\"border-b bg-bg-surface\">\n <div className=\"container mx-auto px-6 py-4\">\n <div className=\"flex items-center gap-4\">\n <button\n type=\"button\"\n onClick={() => navigate(`/channels/${channelId}`)}\n className=\"p-2 hover:bg-bg-sunken rounded-lg transition-colors\"\n >\n <ArrowLeft className=\"size-5 \" />\n </button>\n <div>\n <h1 className=\"text-2xl font-bold\">{tr('channel.editChannel', 'Edit Channel')}</h1>\n <p className=\"text-sm text-text-secondary\">\n {tr('channel.updateChannelConfig', 'Update channel configuration')}\n </p>\n </div>\n </div>\n </div>\n </div>\n\n {/* Form */}\n <div className=\"container mx-auto px-6 py-8 max-w-2xl\">\n <div className=\"space-y-6\">\n {/* Page purpose */}\n <PagePurpose icon={<Save size={15} aria-hidden=\"true\" />}>\n {tr(\n 'channel.editChannelPurpose',\n \"Change how this channel behaves — its name, description, priority and status. The platform and provider stay fixed (they define what the channel is); to swap credentials use the channel's connection instead. Use this to rename a channel, bump its priority, or temporarily deactivate it without deleting it.\"\n )}\n </PagePurpose>\n\n {/* Error Alert */}\n {saveError && (\n <div className=\"p-4 rounded-lg bg-status-error-bg/10 border border-status-error-border/20 flex items-center gap-3\">\n <AlertCircle className=\"size-5 text-status-error-text shrink-0\" />\n <p className=\"text-sm text-status-error-text\">{saveError}</p>\n </div>\n )}\n\n {/* Channel Info (read-only) */}\n <GlassCard treatment=\"insight\" className=\"p-4 border-border-seam space-y-2\">\n <div className=\"flex items-center gap-2\">\n {selectedPlatform && (\n <>\n {(() => {\n const Icon = selectedPlatform.icon;\n return <Icon className=\"size-5 text-text-secondary\" />;\n })()}\n <span className=\"font-medium\">\n {tr(selectedPlatform.labelKey, selectedPlatform.labelFallback)}\n </span>\n </>\n )}\n </div>\n <p className=\"text-sm text-text-secondary\">\n {tr(\n 'channel.platformLockedHint',\n 'Platform cannot be changed after channel creation. Create a new channel to use a different platform.'\n )}\n </p>\n </GlassCard>\n\n {/* Channel fields — the editable core of this page */}\n <EmphasisPanel className=\"p-5 space-y-6\">\n {/* Name */}\n <div className=\"space-y-2\">\n <label className=\"text-sm font-medium\">\n {tr('channel.channelName', 'Channel Name')} *\n </label>\n <input\n aria-label={tr(\n 'channel.editNamePlaceholder',\n 'e.g., Production Email, Customer SMS'\n )}\n type=\"text\"\n value={name}\n onChange={(e) => setName(e.target.value)}\n placeholder={tr(\n 'channel.editNamePlaceholder',\n 'e.g., Production Email, Customer SMS'\n )}\n className=\"w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary\"\n />\n </div>\n\n {/* Description */}\n <div className=\"space-y-2\">\n <label htmlFor=\"channel-edit-description\" className=\"text-sm font-medium\">\n {tr('channel.description', 'Description')}\n </label>\n <MarkdownEditor\n id=\"channel-edit-description\"\n value={description}\n onChange={setDescription}\n aria-label={tr(\n 'channel.editDescriptionPlaceholder',\n 'Optional description for this channel'\n )}\n placeholder={tr(\n 'channel.editDescriptionPlaceholder',\n 'Optional description for this channel'\n )}\n rows={3}\n />\n </div>\n\n {/* Adapter Type */}\n {selectedPlatform && (\n <div className=\"space-y-2\">\n <label className=\"text-sm font-medium\">\n {tr('channel.adapterProvider', 'Adapter / Provider')}\n </label>\n <select\n value={adapterType}\n onChange={(e) => setAdapterType(e.target.value as AdapterType)}\n className=\"w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary\"\n >\n {selectedPlatform.adapters.map((adapter) => (\n <option key={adapter.value} value={adapter.value}>\n {tr(adapter.labelKey, adapter.labelFallback)}\n </option>\n ))}\n </select>\n </div>\n )}\n\n {/* Priority & Status */}\n <div className=\"grid grid-cols-2 gap-4\">\n <div className=\"space-y-2\">\n <label className=\"text-sm font-medium\">\n {tr('channel.priority', 'Priority')}\n </label>\n <select\n value={priority}\n onChange={(e) => setPriority(Number(e.target.value))}\n className=\"w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary\"\n >\n {PRIORITY_OPTIONS.map((option) => (\n <option key={option.value} value={option.value}>\n {option.label}\n </option>\n ))}\n </select>\n <p className=\"text-xs text-text-secondary\">\n {tr(\n 'channel.priorityFailoverHint',\n 'Higher priority channels are used first in failover'\n )}\n </p>\n </div>\n\n <div className=\"space-y-2\">\n <label className=\"text-sm font-medium\">{tr('channel.status', 'Status')}</label>\n <select\n value={status}\n onChange={(e) => setStatus(e.target.value as ChannelStatus)}\n className=\"w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary\"\n >\n <option value=\"INACTIVE\">\n {tr('channel.statusLabel.inactive', 'Inactive')}\n </option>\n <option value=\"ACTIVE\">{tr('channel.statusLabel.active', 'Active')}</option>\n <option value=\"SUSPENDED\">\n {tr('channel.statusLabel.suspended', 'Suspended')}\n </option>\n </select>\n </div>\n </div>\n </EmphasisPanel>\n\n {/* Actions */}\n <div className=\"flex items-center justify-between pt-6 border-t\">\n {/* Delete */}\n <div>\n {!deleteConfirm ? (\n <PermissionGuard permission={CHANNEL_PERMISSIONS.CHANNEL_DELETE}>\n <button\n type=\"button\"\n onClick={() => setDeleteConfirm(true)}\n className=\"px-4 py-2 text-sm text-status-error-text hover:bg-status-error-bg/10 rounded-lg transition-colors flex items-center gap-2\"\n >\n <Trash2 className=\"size-4 \" />\n {tr('channel.deleteChannel', 'Delete Channel')}\n </button>\n </PermissionGuard>\n ) : (\n <div className=\"flex items-center gap-2\">\n <span className=\"text-sm text-text-secondary\">\n {tr('channel.confirmDelete', 'Confirm delete?')}\n </span>\n <button\n type=\"button\"\n onClick={handleDelete}\n disabled={isDeleting}\n className=\"px-4 py-2 text-sm bg-status-error-bg text-status-error-text rounded-lg hover:bg-status-error-bg/90 transition-colors flex items-center gap-2\"\n >\n {isDeleting ? (\n <Loader2 className=\"size-4 animate-spin\" />\n ) : (\n <Trash2 className=\"size-4 \" />\n )}\n {tr('channel.delete', 'Delete')}\n </button>\n <button\n type=\"button\"\n onClick={() => setDeleteConfirm(false)}\n className=\"px-4 py-2 text-sm text-text-secondary hover:bg-bg-sunken rounded-lg transition-colors\"\n >\n {tr('channel.cancel', 'Cancel')}\n </button>\n </div>\n )}\n </div>\n\n {/* Save */}\n <div className=\"flex items-center gap-3\">\n <button\n type=\"button\"\n onClick={() => navigate(`/channels/${channelId}`)}\n className=\"px-4 py-2 text-sm text-text-secondary hover:bg-bg-sunken rounded-lg transition-colors\"\n >\n {tr('channel.cancel', 'Cancel')}\n </button>\n <button\n type=\"button\"\n onClick={handleSave}\n disabled={isSaving || !name.trim()}\n className=\"px-6 py-2 text-sm bg-action-primary-bg text-action-primary-text rounded-lg hover:bg-action-primary-bg/90 transition-colors flex items-center gap-2 disabled:opacity-50\"\n >\n {isSaving ? (\n <Loader2 className=\"size-4 animate-spin\" />\n ) : (\n <Save className=\"size-4 \" />\n )}\n {tr('channel.saveChanges', 'Save Changes')}\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </PermissionGuard>\n );\n}\n"],"mappings":";;;;;;;;;;;;AAsDA,SAAgB,IAAkB;CAChC,IAAM,IAAW,GAAa,EACxB,EAAE,iBAAc,GAAkC,EAClD,EAAE,YAAS,eAAW,cAAU,EAAW,EAAW,EACtD,EAAE,kBAAe,qBAAkB,GAAa,EAChD,IAAK,GAAO,EAEZ,IAAqC,QACnC;EACJ;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU;IACR;KAAE,OAAO;KAAW,UAAU;KAA0B,eAAe;KAAW;IAClF;KAAE,OAAO;KAAW,UAAU;KAA2B,eAAe;KAAW;IACnF;KAAE,OAAO;KAAY,UAAU;KAA4B,eAAe;KAAY;IACtF;KAAE,OAAO;KAAY,UAAU;KAA4B,eAAe;KAAY;IACtF;KAAE,OAAO;KAAU,UAAU;KAA0B,eAAe;KAAU;IAChF;KACE,OAAO;KACP,UAAU;KACV,eAAe;KAChB;IACD;KAAE,OAAO;KAAQ,UAAU;KAAwB,eAAe;KAAe;IAClF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OACE;GACF,UAAU;IACR;KAAE,OAAO;KAAc,UAAU;KAA0B,eAAe;KAAU;IACpF;KAAE,OAAO;KAAW,UAAU;KAA0B,eAAe;KAAW;IAClF;KAAE,OAAO;KAAU,UAAU;KAA0B,eAAe;KAAU;IAChF;KAAE,OAAO;KAAS,UAAU;KAAyB,eAAe;KAAS;IAC7E;KACE,OAAO;KACP,UAAU;KACV,eAAe;KAChB;IACD;KAAE,OAAO;KAAW,UAAU;KAA2B,eAAe;KAAW;IACpF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU;IACR;KACE,OAAO;KACP,UAAU;KACV,eAAe;KAChB;IACD;KACE,OAAO;KACP,UAAU;KACV,eAAe;KAChB;IACD;KAAE,OAAO;KAAa,UAAU;KAA6B,eAAe;KAAa;IACzF;KAAE,OAAO;KAAQ,UAAU;KAAwB,eAAe;KAAa;IAChF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OACE;GACF,UAAU,CACR;IACE,OAAO;IACP,UAAU;IACV,eAAe;IAChB,CACF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OACE;GACF,UAAU,CACR;IACE,OAAO;IACP,UAAU;IACV,eAAe;IAChB,EACD;IACE,OAAO;IACP,UAAU;IACV,eAAe;IAChB,CACF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU,CACR;IAAE,OAAO;IAAa,UAAU;IAA4B,eAAe;IAAa,CACzF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU,CACR;IAAE,OAAO;IAAa,UAAU;IAA4B,eAAe;IAAa,CACzF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU,CACR;IACE,OAAO;IACP,UAAU;IACV,eAAe;IAChB,CACF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU,CACR;IACE,OAAO;IACP,UAAU;IACV,eAAe;IAChB,CACF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU,CACR;IACE,OAAO;IACP,UAAU;IACV,eAAe;IAChB,CACF;GACF;EACF,EACD,EAAE,CACH,EAEK,IAAmB,QACjB;EACJ;GAAE,OAAO;GAAG,OAAO,EAAG,gCAAgC,aAAa;GAAE;EACrE;GAAE,OAAO;GAAG,OAAO,EAAG,6BAA6B,UAAU;GAAE;EAC/D;GAAE,OAAO;GAAG,OAAO,EAAG,gCAAgC,aAAa;GAA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"}
1
+ {"version":3,"file":"EditChannelPage.js","names":[],"sources":["../../../../../src/channel/modules/channels/pages/EditChannelPage.tsx"],"sourcesContent":["/**\n * Edit Channel Page\n *\n * Allows editing an existing channel's configuration.\n * Uses the same form structure as CreateChannelPage but pre-fills existing values.\n */\n\nimport { useState, useEffect, useRef, useMemo } from 'react';\nimport { useNavigate, useParams } from 'react-router';\nimport { useTr } from '../../../hooks/useTr';\nimport {\n ArrowLeft,\n Save,\n Loader2,\n AlertCircle,\n Mail,\n Smartphone,\n Bell,\n Inbox,\n MessageSquare,\n Hash,\n Users,\n MessageCircle,\n Send,\n Trash2,\n} from 'lucide-react';\nimport { useChannel, useChannels } from '../../../hooks/useChannels';\nimport {\n type ChannelPlatform,\n type AdapterType,\n type ChannelStatus,\n type UpdateChannelInput,\n} from '../../../hooks/useChannels';\nimport { EmphasisPanel, GlassCard, PagePurpose } from '@burdenoff/fe-libs/ui';\nimport { nativeImpact, nativeNotify } from '../../../../utils/nativeBridge';\nimport { PermissionGuard } from '../../../components/PermissionGuard';\nimport { CHANNEL_PERMISSIONS } from '../../../constants/permissions';\nimport { MarkdownEditor } from '../../../components/MarkdownEditor';\n\ntype PlatformOption = {\n value: ChannelPlatform;\n labelKey: string;\n labelFallback: string;\n descriptionKey: string;\n descriptionFallback: string;\n icon: typeof Mail;\n color: string;\n adapters: { value: AdapterType; labelKey: string; labelFallback: string }[];\n};\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport function EditChannelPage() {\n const navigate = useNavigate();\n const { channelId } = useParams<{ channelId: string }>();\n const { channel, isLoading, error } = useChannel(channelId!);\n const { updateChannel, deleteChannel } = useChannels();\n const tr = useTr();\n\n const PLATFORM_OPTIONS: PlatformOption[] = useMemo(\n () => [\n {\n value: 'EMAIL',\n labelKey: 'channel.platformLabel.email',\n labelFallback: 'Email',\n descriptionKey: 'channel.platformDescription.emailDescription',\n descriptionFallback: 'Send emails via various providers',\n icon: Mail,\n color: 'text-status-info-text bg-status-info-bg-subtle border-status-info-border',\n adapters: [\n { value: 'AWS_SES', labelKey: 'channel.adapter.awsSes', labelFallback: 'AWS SES' },\n { value: 'MAILGUN', labelKey: 'channel.adapter.mailgun', labelFallback: 'Mailgun' },\n { value: 'POSTMARK', labelKey: 'channel.adapter.postmark', labelFallback: 'Postmark' },\n { value: 'MANDRILL', labelKey: 'channel.adapter.mandrill', labelFallback: 'Mandrill' },\n { value: 'RESEND', labelKey: 'channel.adapter.resend', labelFallback: 'Resend' },\n {\n value: 'AZURE_ACS',\n labelKey: 'channel.adapter.azureAcs',\n labelFallback: 'Azure Communication Services',\n },\n { value: 'SMTP', labelKey: 'channel.adapter.smtp', labelFallback: 'Custom SMTP' },\n ],\n },\n {\n value: 'SMS',\n labelKey: 'channel.platformLabel.sms',\n labelFallback: 'SMS',\n descriptionKey: 'channel.platformDescription.smsDescription',\n descriptionFallback: 'Send text messages',\n icon: Smartphone,\n color:\n 'text-status-success-text bg-status-success-bg-subtle border-status-success-border/30',\n adapters: [\n { value: 'TWILIO_SMS', labelKey: 'channel.adapter.twilio', labelFallback: 'Twilio' },\n { value: 'AWS_SNS', labelKey: 'channel.adapter.awsSns', labelFallback: 'AWS SNS' },\n { value: 'VONAGE', labelKey: 'channel.adapter.vonage', labelFallback: 'Vonage' },\n { value: 'PLIVO', labelKey: 'channel.adapter.plivo', labelFallback: 'Plivo' },\n {\n value: 'MESSAGEBIRD',\n labelKey: 'channel.adapter.messagebird',\n labelFallback: 'MessageBird',\n },\n { value: 'INFOBIP', labelKey: 'channel.adapter.infobip', labelFallback: 'Infobip' },\n ],\n },\n {\n value: 'PUSH',\n labelKey: 'channel.platformLabel.push',\n labelFallback: 'Push',\n descriptionKey: 'channel.platformDescription.pushDescription',\n descriptionFallback: 'Mobile & web push',\n icon: Bell,\n color: 'text-accent-purple bg-accent-purple-subtle border-accent-purple/30',\n adapters: [\n {\n value: 'FCM',\n labelKey: 'channel.adapter.fcm',\n labelFallback: 'Firebase Cloud Messaging',\n },\n {\n value: 'APNS',\n labelKey: 'channel.adapter.apns',\n labelFallback: 'Apple Push Notification Service',\n },\n { value: 'ONESIGNAL', labelKey: 'channel.adapter.onesignal', labelFallback: 'OneSignal' },\n { value: 'EXPO', labelKey: 'channel.adapter.expo', labelFallback: 'Expo Push' },\n ],\n },\n {\n value: 'INAPP',\n labelKey: 'channel.platformLabel.inApp',\n labelFallback: 'In-App',\n descriptionKey: 'channel.platformDescription.inAppDescription',\n descriptionFallback: 'Internal in-app notifications',\n icon: Inbox,\n color:\n 'text-status-warning-text bg-status-warning-bg-subtle border-status-warning-border/30',\n adapters: [\n {\n value: 'INAPP_NATIVE',\n labelKey: 'channel.adapter.inAppNative',\n labelFallback: 'Native In-App',\n },\n ],\n },\n {\n value: 'WHATSAPP',\n labelKey: 'channel.platformLabel.whatsapp',\n labelFallback: 'WhatsApp',\n descriptionKey: 'channel.platformDescription.whatsappDescription',\n descriptionFallback: 'WhatsApp Business messaging',\n icon: MessageSquare,\n color:\n 'text-status-success-text bg-status-success-bg-subtle border-status-success-border/30',\n adapters: [\n {\n value: 'WHATSAPP_CLOUD',\n labelKey: 'channel.adapter.whatsappCloud',\n labelFallback: 'WhatsApp Cloud API',\n },\n {\n value: 'WHATSAPP_TWILIO',\n labelKey: 'channel.adapter.whatsappTwilio',\n labelFallback: 'WhatsApp via Twilio',\n },\n ],\n },\n {\n value: 'SLACK',\n labelKey: 'channel.platformLabel.slack',\n labelFallback: 'Slack',\n descriptionKey: 'channel.platformDescription.slackDescription',\n descriptionFallback: 'Slack bot & channels',\n icon: Hash,\n color: 'text-accent-purple bg-accent-purple-subtle border-accent-purple/30',\n adapters: [\n { value: 'SLACK_BOT', labelKey: 'channel.adapter.slackBot', labelFallback: 'Slack Bot' },\n ],\n },\n {\n value: 'TEAMS',\n labelKey: 'channel.platformLabel.teams',\n labelFallback: 'Teams',\n descriptionKey: 'channel.platformDescription.teamsDescription',\n descriptionFallback: 'Microsoft Teams',\n icon: Users,\n color: 'text-status-info-text bg-status-info-bg-subtle border-status-info-border',\n adapters: [\n { value: 'TEAMS_BOT', labelKey: 'channel.adapter.teamsBot', labelFallback: 'Teams Bot' },\n ],\n },\n {\n value: 'DISCORD',\n labelKey: 'channel.platformLabel.discord',\n labelFallback: 'Discord',\n descriptionKey: 'channel.platformDescription.discordDescription',\n descriptionFallback: 'Discord bots & webhooks',\n icon: MessageCircle,\n color: 'text-accent-indigo bg-accent-indigo-subtle border-accent-indigo/30',\n adapters: [\n {\n value: 'DISCORD_BOT',\n labelKey: 'channel.adapter.discordBot',\n labelFallback: 'Discord Bot',\n },\n ],\n },\n {\n value: 'WEBCHAT',\n labelKey: 'channel.platformLabel.webchat',\n labelFallback: 'Webchat',\n descriptionKey: 'channel.platformDescription.webchatDescription',\n descriptionFallback: 'Website live chat',\n icon: MessageSquare,\n color: 'text-accent-teal bg-accent-teal-subtle border-accent-teal/30',\n adapters: [\n {\n value: 'WEBCHAT_NATIVE',\n labelKey: 'channel.adapter.webchatNative',\n labelFallback: 'Native Webchat',\n },\n ],\n },\n {\n value: 'WEBHOOK',\n labelKey: 'channel.platformLabel.webhook',\n labelFallback: 'Webhook',\n descriptionKey: 'channel.platformDescription.webhookDescription',\n descriptionFallback: 'Generic HTTP webhook',\n icon: Send,\n color: 'text-text-secondary bg-bg-sunken/50 border-border-subtle',\n adapters: [\n {\n value: 'WEBHOOK_HTTP',\n labelKey: 'channel.adapter.webhookHttp',\n labelFallback: 'HTTP Webhook',\n },\n ],\n },\n ],\n []\n );\n\n const PRIORITY_OPTIONS = useMemo(\n () => [\n { value: 0, label: tr('channel.priorityLabel.lowest', '0 - Lowest') },\n { value: 1, label: tr('channel.priorityLabel.low', '1 - Low') },\n { value: 2, label: tr('channel.priorityLabel.normal', '2 - Normal') },\n { value: 3, label: tr('channel.priorityLabel.high', '3 - High') },\n { value: 4, label: tr('channel.priorityLabel.highest', '4 - Highest') },\n ],\n [tr]\n );\n\n // Form state\n const [name, setName] = useState('');\n const [description, setDescription] = useState('');\n const [adapterType, setAdapterType] = useState<AdapterType>('AWS_SES');\n const [priority, setPriority] = useState(2);\n const [status, setStatus] = useState<ChannelStatus>('INACTIVE');\n\n // UI state\n const [isSaving, setIsSaving] = useState(false);\n const [isDeleting, setIsDeleting] = useState(false);\n const [saveError, setSaveError] = useState<string | null>(null);\n const [deleteConfirm, setDeleteConfirm] = useState(false);\n\n // Load channel data into form — guard against re-initialization and defer\n // the state update to a microtask so setState does not run synchronously\n // inside the effect body (react-hooks/set-state-in-effect).\n const loadedChannelIdRef = useRef<string | null>(null);\n useEffect(() => {\n if (channel && channel.id !== loadedChannelIdRef.current) {\n loadedChannelIdRef.current = channel.id;\n void Promise.resolve().then(() => {\n setName(channel.name || '');\n setDescription(channel.description || '');\n setAdapterType((channel.adapterType || 'AWS_SES') as AdapterType);\n setPriority(channel.priority || 2);\n setStatus((channel.status || 'INACTIVE') as ChannelStatus);\n });\n }\n }, [channel]);\n\n // Update adapter options when platform changes\n const currentPlatform = (channel?.platform || 'EMAIL') as ChannelPlatform;\n const selectedPlatform = PLATFORM_OPTIONS.find((p) => p.value === currentPlatform);\n\n const handleSave = async () => {\n if (!channelId) return;\n\n if (!name.trim()) {\n setSaveError(tr('channel.validation.nameRequired', 'Channel name is required'));\n return;\n }\n\n setIsSaving(true);\n setSaveError(null);\n\n try {\n const input: UpdateChannelInput = {\n name: name.trim(),\n description: description.trim() || undefined,\n adapterType,\n priority,\n status,\n };\n\n const result = await updateChannel(channelId, input);\n if (result) {\n navigate(`/channels/${channelId}`);\n } else {\n setSaveError(tr('channel.updateFailed', 'Failed to update channel'));\n }\n } catch (err: unknown) {\n const message =\n err instanceof Error ? err.message : tr('channel.updateFailed', 'Failed to update channel');\n setSaveError(message);\n } finally {\n setIsSaving(false);\n }\n };\n\n const handleDelete = async () => {\n if (!channelId || !deleteConfirm) return;\n void nativeImpact('medium');\n\n setIsDeleting(true);\n try {\n const success = await deleteChannel(channelId);\n if (success) {\n void nativeNotify('success');\n navigate('../list');\n } else {\n void nativeNotify('error');\n }\n } catch (err: unknown) {\n void nativeNotify('error');\n const message =\n err instanceof Error ? err.message : tr('channel.deleteFailed', 'Failed to delete channel');\n setSaveError(message);\n setIsDeleting(false);\n }\n };\n\n if (isLoading) {\n return (\n <div className=\"flex items-center justify-center min-h-screen\">\n <Loader2 className=\"size-8 animate-spin text-text-secondary\" />\n </div>\n );\n }\n\n if (error || !channel) {\n return (\n <div className=\"flex flex-col items-center justify-center min-h-screen gap-4\">\n <AlertCircle className=\"size-12 text-status-error-text\" />\n <h1 className=\"text-xl font-semibold\">\n {tr('channel.channelNotFound', 'Channel not found')}\n </h1>\n <button\n type=\"button\"\n onClick={() => navigate('../list')}\n className=\"text-primary hover:underline\"\n >\n {tr('channel.backToChannels', 'Back to channels')}\n </button>\n </div>\n );\n }\n\n return (\n <PermissionGuard permission={CHANNEL_PERMISSIONS.CHANNEL_UPDATE}>\n <div className=\"min-h-screen bg-bg-surface\">\n {/* Header */}\n <div className=\"border-b bg-bg-surface\">\n <div className=\"container mx-auto px-6 py-4\">\n <div className=\"flex items-center gap-4\">\n <button\n type=\"button\"\n onClick={() => navigate(`/channels/${channelId}`)}\n className=\"p-2 hover:bg-bg-sunken rounded-lg transition-colors\"\n >\n <ArrowLeft className=\"size-5 \" />\n </button>\n <div>\n <h1 className=\"text-2xl font-bold\">{tr('channel.editChannel', 'Edit Channel')}</h1>\n <p className=\"text-sm text-text-secondary\">\n {tr('channel.updateChannelConfig', 'Update channel configuration')}\n </p>\n </div>\n </div>\n </div>\n </div>\n\n {/* Form */}\n <div className=\"container mx-auto px-6 py-8 max-w-2xl\">\n <div className=\"space-y-6\">\n {/* Page purpose */}\n <PagePurpose icon={<Save size={15} aria-hidden=\"true\" />}>\n {tr(\n 'channel.editChannelPurpose',\n \"Change how this channel behaves — its name, description, priority and status. The platform and provider stay fixed (they define what the channel is); to swap credentials use the channel's connection instead. Use this to rename a channel, bump its priority, or temporarily deactivate it without deleting it.\"\n )}\n </PagePurpose>\n\n {/* Error Alert */}\n {saveError && (\n <div className=\"p-4 rounded-lg bg-status-error-bg/10 border border-status-error-border/20 flex items-center gap-3\">\n <AlertCircle className=\"size-5 text-status-error-text shrink-0\" />\n <p className=\"text-sm text-status-error-text\">{saveError}</p>\n </div>\n )}\n\n {/* Channel Info (read-only) */}\n <GlassCard treatment=\"insight\" className=\"p-4 border-border-seam space-y-2\">\n <div className=\"flex items-center gap-2\">\n {selectedPlatform && (\n <>\n {(() => {\n const Icon = selectedPlatform.icon;\n return <Icon className=\"size-5 text-text-secondary\" />;\n })()}\n <span className=\"font-medium\">\n {tr(selectedPlatform.labelKey, selectedPlatform.labelFallback)}\n </span>\n </>\n )}\n </div>\n <p className=\"text-sm text-text-secondary\">\n {tr(\n 'channel.platformLockedHint',\n 'Platform cannot be changed after channel creation. Create a new channel to use a different platform.'\n )}\n </p>\n </GlassCard>\n\n {/* Channel fields — the editable core of this page */}\n <EmphasisPanel className=\"p-5 space-y-6\">\n {/* Name */}\n <div className=\"space-y-2\">\n <label className=\"text-sm font-medium\">\n {tr('channel.channelName', 'Channel Name')} *\n </label>\n <input\n aria-label={tr(\n 'channel.editNamePlaceholder',\n 'e.g., Production Email, Customer SMS'\n )}\n type=\"text\"\n value={name}\n onChange={(e) => setName(e.target.value)}\n placeholder={tr(\n 'channel.editNamePlaceholder',\n 'e.g., Production Email, Customer SMS'\n )}\n className=\"w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary\"\n />\n </div>\n\n {/* Description */}\n <div className=\"space-y-2\">\n <label htmlFor=\"channel-edit-description\" className=\"text-sm font-medium\">\n {tr('channel.description', 'Description')}\n </label>\n <MarkdownEditor\n id=\"channel-edit-description\"\n value={description}\n onChange={setDescription}\n aria-label={tr(\n 'channel.editDescriptionPlaceholder',\n 'Optional description for this channel'\n )}\n placeholder={tr(\n 'channel.editDescriptionPlaceholder',\n 'Optional description for this channel'\n )}\n rows={3}\n />\n </div>\n\n {/* Adapter Type */}\n {selectedPlatform && (\n <div className=\"space-y-2\">\n <label className=\"text-sm font-medium\">\n {tr('channel.adapterProvider', 'Adapter / Provider')}\n </label>\n <select\n value={adapterType}\n onChange={(e) => setAdapterType(e.target.value as AdapterType)}\n className=\"w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary\"\n >\n {selectedPlatform.adapters.map((adapter) => (\n <option key={adapter.value} value={adapter.value}>\n {tr(adapter.labelKey, adapter.labelFallback)}\n </option>\n ))}\n </select>\n </div>\n )}\n\n {/* Priority & Status */}\n <div className=\"grid grid-cols-2 gap-4\">\n <div className=\"space-y-2\">\n <label className=\"text-sm font-medium\">\n {tr('channel.priority', 'Priority')}\n </label>\n <select\n value={priority}\n onChange={(e) => setPriority(Number(e.target.value))}\n className=\"w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary\"\n >\n {PRIORITY_OPTIONS.map((option) => (\n <option key={option.value} value={option.value}>\n {option.label}\n </option>\n ))}\n </select>\n <p className=\"text-xs text-text-secondary\">\n {tr(\n 'channel.priorityFailoverHint',\n 'Higher priority channels are used first in failover'\n )}\n </p>\n </div>\n\n <div className=\"space-y-2\">\n <label className=\"text-sm font-medium\">{tr('channel.status', 'Status')}</label>\n <select\n value={status}\n onChange={(e) => setStatus(e.target.value as ChannelStatus)}\n className=\"w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary\"\n >\n <option value=\"INACTIVE\">\n {tr('channel.statusLabel.inactive', 'Inactive')}\n </option>\n <option value=\"ACTIVE\">{tr('channel.statusLabel.active', 'Active')}</option>\n <option value=\"SUSPENDED\">\n {tr('channel.statusLabel.suspended', 'Suspended')}\n </option>\n </select>\n </div>\n </div>\n </EmphasisPanel>\n\n {/* Actions */}\n <div className=\"flex items-center justify-between pt-6 border-t\">\n {/* Delete */}\n <div>\n {!deleteConfirm ? (\n <PermissionGuard permission={CHANNEL_PERMISSIONS.CHANNEL_DELETE}>\n <button\n type=\"button\"\n onClick={() => setDeleteConfirm(true)}\n className=\"px-4 py-2 text-sm text-status-error-text hover:bg-status-error-bg/10 rounded-lg transition-colors flex items-center gap-2\"\n >\n <Trash2 className=\"size-4 \" />\n {tr('channel.deleteChannel', 'Delete Channel')}\n </button>\n </PermissionGuard>\n ) : (\n <div className=\"flex items-center gap-2\">\n <span className=\"text-sm text-text-secondary\">\n {tr('channel.confirmDelete', 'Confirm delete?')}\n </span>\n <button\n type=\"button\"\n onClick={handleDelete}\n disabled={isDeleting}\n className=\"px-4 py-2 text-sm bg-status-error-bg text-status-error-text rounded-lg hover:bg-status-error-bg/90 transition-colors flex items-center gap-2\"\n >\n {isDeleting ? (\n <Loader2 className=\"size-4 animate-spin\" />\n ) : (\n <Trash2 className=\"size-4 \" />\n )}\n {tr('channel.delete', 'Delete')}\n </button>\n <button\n type=\"button\"\n onClick={() => setDeleteConfirm(false)}\n className=\"px-4 py-2 text-sm text-text-secondary hover:bg-bg-sunken rounded-lg transition-colors\"\n >\n {tr('channel.cancel', 'Cancel')}\n </button>\n </div>\n )}\n </div>\n\n {/* Save */}\n <div className=\"flex items-center gap-3\">\n <button\n type=\"button\"\n onClick={() => navigate(`/channels/${channelId}`)}\n className=\"px-4 py-2 text-sm text-text-secondary hover:bg-bg-sunken rounded-lg transition-colors\"\n >\n {tr('channel.cancel', 'Cancel')}\n </button>\n <button\n type=\"button\"\n onClick={handleSave}\n disabled={isSaving || !name.trim()}\n className=\"px-6 py-2 text-sm bg-action-primary-bg text-action-primary-text rounded-lg hover:bg-action-primary-bg/90 transition-colors flex items-center gap-2 disabled:opacity-50\"\n >\n {isSaving ? (\n <Loader2 className=\"size-4 animate-spin\" />\n ) : (\n <Save className=\"size-4 \" />\n )}\n {tr('channel.saveChanges', 'Save Changes')}\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </PermissionGuard>\n );\n}\n"],"mappings":";;;;;;;;;;;;AAsDA,SAAgB,IAAkB;CAChC,IAAM,IAAW,GAAa,EACxB,EAAE,iBAAc,GAAkC,EAClD,EAAE,YAAS,eAAW,cAAU,EAAW,EAAW,EACtD,EAAE,kBAAe,qBAAkB,GAAa,EAChD,IAAK,GAAO,EAEZ,IAAqC,QACnC;EACJ;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU;IACR;KAAE,OAAO;KAAW,UAAU;KAA0B,eAAe;KAAW;IAClF;KAAE,OAAO;KAAW,UAAU;KAA2B,eAAe;KAAW;IACnF;KAAE,OAAO;KAAY,UAAU;KAA4B,eAAe;KAAY;IACtF;KAAE,OAAO;KAAY,UAAU;KAA4B,eAAe;KAAY;IACtF;KAAE,OAAO;KAAU,UAAU;KAA0B,eAAe;KAAU;IAChF;KACE,OAAO;KACP,UAAU;KACV,eAAe;KAChB;IACD;KAAE,OAAO;KAAQ,UAAU;KAAwB,eAAe;KAAe;IAClF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OACE;GACF,UAAU;IACR;KAAE,OAAO;KAAc,UAAU;KAA0B,eAAe;KAAU;IACpF;KAAE,OAAO;KAAW,UAAU;KAA0B,eAAe;KAAW;IAClF;KAAE,OAAO;KAAU,UAAU;KAA0B,eAAe;KAAU;IAChF;KAAE,OAAO;KAAS,UAAU;KAAyB,eAAe;KAAS;IAC7E;KACE,OAAO;KACP,UAAU;KACV,eAAe;KAChB;IACD;KAAE,OAAO;KAAW,UAAU;KAA2B,eAAe;KAAW;IACpF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU;IACR;KACE,OAAO;KACP,UAAU;KACV,eAAe;KAChB;IACD;KACE,OAAO;KACP,UAAU;KACV,eAAe;KAChB;IACD;KAAE,OAAO;KAAa,UAAU;KAA6B,eAAe;KAAa;IACzF;KAAE,OAAO;KAAQ,UAAU;KAAwB,eAAe;KAAa;IAChF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OACE;GACF,UAAU,CACR;IACE,OAAO;IACP,UAAU;IACV,eAAe;IAChB,CACF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OACE;GACF,UAAU,CACR;IACE,OAAO;IACP,UAAU;IACV,eAAe;IAChB,EACD;IACE,OAAO;IACP,UAAU;IACV,eAAe;IAChB,CACF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU,CACR;IAAE,OAAO;IAAa,UAAU;IAA4B,eAAe;IAAa,CACzF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU,CACR;IAAE,OAAO;IAAa,UAAU;IAA4B,eAAe;IAAa,CACzF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU,CACR;IACE,OAAO;IACP,UAAU;IACV,eAAe;IAChB,CACF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU,CACR;IACE,OAAO;IACP,UAAU;IACV,eAAe;IAChB,CACF;GACF;EACD;GACE,OAAO;GACP,UAAU;GACV,eAAe;GACf,gBAAgB;GAChB,qBAAqB;GACrB,MAAM;GACN,OAAO;GACP,UAAU,CACR;IACE,OAAO;IACP,UAAU;IACV,eAAe;IAChB,CACF;GACF;EACF,EACD,EAAE,CACH,EAEK,IAAmB,QACjB;EACJ;GAAE,OAAO;GAAG,OAAO,EAAG,gCAAgC,aAAa;GAAE;EACrE;GAAE,OAAO;GAAG,OAAO,EAAG,6BAA6B,UAAU;GAAE;EAC/D;GAAE,OAAO;GAAG,OAAO,EAAG,gCAAgC,aAAa;GAA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"}
@@ -220,7 +220,7 @@ function j() {
220
220
  }) : /* @__PURE__ */ E("select", {
221
221
  value: M,
222
222
  onChange: (e) => N(e.target.value),
223
- className: "w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary",
223
+ className: "w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary",
224
224
  children: [/* @__PURE__ */ T("option", {
225
225
  value: "",
226
226
  children: y("channel.selectChannel", "Select a channel...")
@@ -1 +1 @@
1
- {"version":3,"file":"SendMessagePage.js","names":[],"sources":["../../../../../src/channel/modules/channels/pages/SendMessagePage.tsx"],"sourcesContent":["/**\n * Send Message Page\n *\n * UI for sending notifications/messages through channels.\n * Supports single and bulk delivery with recipient management.\n */\n\nimport { useState, useCallback, useRef } from 'react';\nimport { useNavigate } from 'react-router';\nimport { useTr } from '../../../hooks/useTr';\nimport {\n ArrowLeft,\n Send,\n Loader2,\n AlertCircle,\n CheckCircle2,\n XCircle,\n Plus,\n X,\n Mail,\n Smartphone,\n Bell,\n MessageSquare,\n Hash,\n Users,\n MessageCircle,\n} from 'lucide-react';\nimport {\n EmphasisPanel,\n GlassCard,\n IllustratedEmptyState,\n PagePurpose,\n} from '@burdenoff/fe-libs/ui';\nimport { useChannel as useChannelContext } from '../../../providers/ChannelProvider';\nimport { useChannels } from '../../../hooks/useChannels';\nimport { PLATFORM_I18N, translateLabel } from '../i18n';\nimport { getGlobalChannelClient } from '../../../graphql/global-client';\nimport { useSendNotificationMutation } from '../../../../generated/global-operations';\nimport {\n ChannelPlatform,\n NotificationChannel,\n NotificationPriority,\n RecipientInput,\n TriggerNotificationInput,\n} from '../../../../generated/global-types';\nimport { PermissionGuard } from '../../../components/PermissionGuard';\nimport { CHANNEL_PERMISSIONS } from '../../../constants/permissions';\nimport { MarkdownEditor } from '../../../components/MarkdownEditor';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface Recipient {\n id: string;\n address: string;\n name?: string;\n}\n\ninterface DeliveryResult {\n recipientId: string;\n success: boolean;\n messageId?: string;\n error?: string;\n}\n\n// ============================================================================\n// PLATFORM CONFIG\n// ============================================================================\n\nconst PLATFORM_ICONS: Record<string, typeof Mail> = {\n EMAIL: Mail,\n SMS: Smartphone,\n PUSH: Bell,\n WHATSAPP: MessageSquare,\n SLACK: Hash,\n TEAMS: Users,\n DISCORD: MessageCircle,\n INAPP: Bell,\n WEBCHAT: MessageSquare,\n WEBHOOK: Send,\n};\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport function SendMessagePage() {\n const navigate = useNavigate();\n const { channels } = useChannels();\n const { organizationId, authToken, apiGatewayUrl } = useChannelContext();\n const tr = useTr();\n\n // Get Apollo client for notification mutations\n const client = getGlobalChannelClient(apiGatewayUrl, authToken, organizationId);\n\n // Send notification via notification-svc (which calls channel-svc with service actor)\n const [sendNotification, { loading: isSending }] = useSendNotificationMutation({ client });\n\n // Channel selection\n const [selectedChannelId, setSelectedChannelId] = useState('');\n const [platform, setPlatform] = useState<ChannelPlatform>('EMAIL' as ChannelPlatform);\n\n // Recipients\n const [recipients, setRecipients] = useState<Recipient[]>([]);\n const recipientIdCounter = useRef(0);\n const [newAddress, setNewAddress] = useState('');\n const [newName, setNewName] = useState('');\n\n // Message content\n const [subject, setSubject] = useState('');\n const [body, setBody] = useState('');\n const [priority, setPriority] = useState<NotificationPriority>(NotificationPriority.Medium);\n\n // UI state\n const [results, setResults] = useState<DeliveryResult[] | null>(null);\n const [error, setError] = useState<string | null>(null);\n\n // Filter channels by platform\n const filteredChannels = channels.filter((ch) => ch.platform === platform);\n\n // Add recipient\n const addRecipient = useCallback(() => {\n if (!newAddress.trim()) return;\n\n const recipient: Recipient = {\n id: `r-${++recipientIdCounter.current}`,\n address: newAddress.trim(),\n name: newName.trim() || undefined,\n };\n\n setRecipients((prev) => [...prev, recipient]);\n setNewAddress('');\n setNewName('');\n }, [newAddress, newName]);\n\n // Remove recipient\n const removeRecipient = useCallback((id: string) => {\n setRecipients((prev) => prev.filter((r) => r.id !== id));\n }, []);\n\n // Clear results and reset\n const handleReset = useCallback(() => {\n setResults(null);\n setError(null);\n setSubject('');\n setBody('');\n setRecipients([]);\n }, []);\n\n // Send message via notification-svc (which handles service actor auth to channel-svc)\n const handleSend = async () => {\n if (!selectedChannelId) {\n setError(tr('channel.validation.selectChannel', 'Please select a channel'));\n return;\n }\n\n if (recipients.length === 0) {\n setError(tr('channel.validation.addRecipient', 'Please add at least one recipient'));\n return;\n }\n\n if (!body.trim()) {\n setError(tr('channel.validation.enterMessage', 'Please enter a message'));\n return;\n }\n\n setError(null);\n setResults(null);\n\n try {\n // Find the selected channel to get platform and connection info\n const selectedChannel = channels.find((ch) => ch.id === selectedChannelId);\n if (!selectedChannel) {\n setError(tr('channel.error.channelNotFound', 'Selected channel not found'));\n return;\n }\n\n // Map ChannelPlatform to NotificationChannel\n // Most platforms have the same name (EMAIL, SMS, PUSH, etc.)\n // ChannelPlatform uses 'INAPP' but there's no INAPP in ChannelPlatform enum\n // (only in PLATFORM_ICONS). We check using string literal.\n const platformStr = platform as string;\n const notificationChannel =\n platformStr === 'INAPP'\n ? NotificationChannel.InApp\n : (platform as unknown as NotificationChannel);\n\n // Send to each recipient in parallel via notification-svc\n const deliveryResults: DeliveryResult[] = await Promise.all(\n recipients.map(async (recipient): Promise<DeliveryResult> => {\n // Build recipient input for notification-svc\n const recipientInput: RecipientInput = {};\n switch (platform) {\n case 'EMAIL':\n recipientInput.email = recipient.address;\n break;\n case 'SMS':\n case 'WHATSAPP':\n recipientInput.phoneNumber = recipient.address;\n break;\n case 'PUSH':\n recipientInput.pushToken = recipient.address;\n break;\n case 'SLACK':\n recipientInput.slackUserId = recipient.address;\n break;\n case 'TEAMS':\n recipientInput.teamsUserId = recipient.address;\n break;\n case 'WEBHOOK':\n recipientInput.webhookUrl = recipient.address;\n break;\n default:\n recipientInput.email = recipient.address;\n }\n\n // Build TriggerNotificationInput - creates notification AND triggers delivery\n const triggerInput: TriggerNotificationInput = {\n channelId: selectedChannel.id,\n platform: notificationChannel,\n notification: {\n body: body,\n channel: notificationChannel,\n recipient: recipientInput,\n subject: platform === 'EMAIL' ? subject : undefined,\n priority: priority,\n },\n };\n\n try {\n const result = await sendNotification({ variables: { input: triggerInput } });\n\n if (result.data?.triggerNotification) {\n const notification = result.data.triggerNotification;\n // deliveryStatus is null at trigger time (async delivery hasn't completed yet).\n // Use triggerStatus + status to determine immediate send success.\n const failed =\n notification.status === 'FAILED' || notification.triggerStatus === 'FAILED';\n const errorDetail = notification.errorMessage || notification.errorCode;\n return {\n recipientId: recipient.id,\n success: !failed,\n messageId: notification.id,\n error: failed\n ? errorDetail\n ? tr('channel.deliveryFailedWithDetail', 'Delivery failed: {{detail}}', {\n detail: errorDetail,\n })\n : tr('channel.deliveryFailed', 'Delivery failed')\n : undefined,\n };\n }\n return {\n recipientId: recipient.id,\n success: false,\n error:\n result.error?.message ||\n tr('channel.sendNotificationFailed', 'Failed to send notification'),\n };\n } catch (err: unknown) {\n return {\n recipientId: recipient.id,\n success: false,\n error:\n err instanceof Error\n ? err.message\n : tr('channel.sendNotificationFailed', 'Failed to send notification'),\n };\n }\n })\n );\n\n setResults(deliveryResults);\n } catch (err: unknown) {\n const message =\n err instanceof Error\n ? err.message\n : tr('channel.messageSendFailed', 'Failed to send message');\n setError(message);\n }\n };\n\n const successCount = results?.filter((r) => r.success).length ?? 0;\n const failCount = results?.filter((r) => !r.success).length ?? 0;\n\n return (\n <PermissionGuard permission={CHANNEL_PERMISSIONS.CHANNEL_DELIVERY_SEND}>\n <div className=\"min-h-screen bg-bg-surface\">\n {/* Header */}\n <div className=\"border-b bg-bg-surface\">\n <div className=\"container mx-auto px-6 py-4\">\n <div className=\"flex items-center gap-4\">\n <button\n type=\"button\"\n onClick={() => navigate('/channels/list')}\n className=\"p-2 hover:bg-bg-sunken rounded-lg transition-colors\"\n >\n <ArrowLeft className=\"size-5 \" />\n </button>\n <div>\n <h1 className=\"text-2xl font-bold\">{tr('channel.sendMessage', 'Send Message')}</h1>\n <p className=\"text-sm text-text-secondary\">\n {tr(\n 'channel.sendMessageSubtitle',\n 'Send notifications through configured channels'\n )}\n </p>\n </div>\n </div>\n </div>\n </div>\n\n {/* Content */}\n <div className=\"container mx-auto px-6 py-8 max-w-3xl space-y-6\">\n <PagePurpose icon={<Send size={15} aria-hidden=\"true\" />}>\n {tr(\n 'channel.sendMessagePurpose',\n 'Compose and fire off a one-off notification through any configured channel — handy for testing a freshly set-up channel, sending a quick announcement, or reproducing a delivery problem. Pick the platform and channel, add one or more recipients, write your message, and send; you will get a per-recipient success/failure breakdown so you know exactly what got through.'\n )}\n </PagePurpose>\n\n {results === null ? (\n <div className=\"space-y-6\">\n {/* Error Alert */}\n {error && (\n <div className=\"p-4 rounded-lg bg-status-error-bg/10 border border-status-error-border/20 flex items-center gap-3\">\n <AlertCircle className=\"size-5 text-status-error-text shrink-0\" />\n <p className=\"text-sm text-status-error-text\">{error}</p>\n </div>\n )}\n\n {/* Platform Selection */}\n <div className=\"space-y-3\">\n <label className=\"text-sm font-medium\">{tr('channel.platform', 'Platform')}</label>\n <div className=\"flex flex-wrap gap-2\">\n {(\n [\n 'EMAIL',\n 'SMS',\n 'PUSH',\n 'WHATSAPP',\n 'SLACK',\n 'TEAMS',\n 'WEBHOOK',\n ] as ChannelPlatform[]\n ).map((p) => {\n const Icon = PLATFORM_ICONS[p] || Send;\n const isSelected = platform === p;\n return (\n <button\n type=\"button\"\n key={p}\n onClick={() => {\n setPlatform(p);\n setSelectedChannelId('');\n }}\n className={`px-4 py-2 rounded-lg border flex items-center gap-2 transition-all ${\n isSelected\n ? 'bg-action-primary-bg text-action-primary-text border-primary'\n : 'bg-bg-surface hover:bg-bg-sunken border-border-subtle'\n }`}\n >\n <Icon className=\"size-4 \" />\n <span className=\"text-sm\">{translateLabel(p, PLATFORM_I18N, tr)}</span>\n </button>\n );\n })}\n </div>\n </div>\n\n {/* Channel Selection */}\n <div className=\"space-y-2\">\n <label className=\"text-sm font-medium\">{tr('channel.channel', 'Channel')} *</label>\n {filteredChannels.length === 0 ? (\n <div className=\"rounded-lg border border-dashed\">\n <IllustratedEmptyState\n illustration=\"empty-data\"\n title={tr(\n 'channel.noPlatformChannels',\n 'No {{platform}} channels configured',\n { platform: translateLabel(platform, PLATFORM_I18N, tr) }\n )}\n description={tr(\n 'channel.noPlatformChannelsHint',\n 'Create a channel for this platform to be able to send through it.'\n )}\n action={\n <button\n type=\"button\"\n onClick={() => navigate('./create')}\n className=\"inline-flex items-center gap-2 rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg-hover\"\n >\n <Plus className=\"size-4\" aria-hidden=\"true\" />\n {tr('channel.createChannel', 'Create Channel')}\n </button>\n }\n />\n </div>\n ) : (\n <select\n value={selectedChannelId}\n onChange={(e) => setSelectedChannelId(e.target.value)}\n className=\"w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary\"\n >\n <option value=\"\">{tr('channel.selectChannel', 'Select a channel...')}</option>\n {filteredChannels.map((ch) => (\n <option key={ch.id} value={ch.id}>\n {ch.name} ({ch.adapterType})\n </option>\n ))}\n </select>\n )}\n </div>\n\n {/* Recipients */}\n <div className=\"space-y-3\">\n <label className=\"text-sm font-medium\">\n {tr('channel.recipients', 'Recipients')}\n </label>\n\n {/* Add recipient form */}\n <div className=\"flex gap-2\">\n <input\n aria-label={\n platform === 'EMAIL'\n ? tr('channel.recipientPlaceholder.email', 'email@example.com')\n : tr('channel.recipientPlaceholder.phone', '+1234567890')\n }\n type=\"text\"\n value={newAddress}\n onChange={(e) => setNewAddress(e.target.value)}\n placeholder={\n platform === 'EMAIL'\n ? tr('channel.recipientPlaceholder.email', 'email@example.com')\n : tr('channel.recipientPlaceholder.phone', '+1234567890')\n }\n className=\"flex-1 px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary\"\n />\n <input\n aria-label={tr('channel.nameOptional', 'Name (optional)')}\n type=\"text\"\n value={newName}\n onChange={(e) => setNewName(e.target.value)}\n placeholder={tr('channel.nameOptional', 'Name (optional)')}\n className=\"w-full sm:w-48 px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary\"\n />\n <button\n type=\"button\"\n onClick={addRecipient}\n disabled={!newAddress.trim()}\n className=\"px-4 py-2 rounded-lg bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg/90 transition-colors disabled:opacity-50 flex items-center gap-2\"\n >\n <Plus className=\"size-4 \" />\n {tr('channel.add', 'Add')}\n </button>\n </div>\n\n {/* recipient list */}\n {recipients.length > 0 ? (\n <GlassCard\n treatment=\"plain\"\n className=\"border-border-seam rounded-lg p-0 divide-y divide-[var(--color-border-seam)] overflow-hidden\"\n >\n {recipients.map((r) => (\n <div key={r.id} className=\"p-3 flex items-center justify-between\">\n <div>\n <p className=\"text-sm font-medium\">{r.address}</p>\n {r.name && <p className=\"text-xs text-text-secondary\">{r.name}</p>}\n </div>\n <button\n type=\"button\"\n onClick={() => removeRecipient(r.id)}\n className=\"p-1 hover:bg-bg-sunken rounded transition-colors\"\n >\n <X className=\"size-4 text-text-secondary\" />\n </button>\n </div>\n ))}\n </GlassCard>\n ) : (\n <IllustratedEmptyState\n illustration=\"empty-people\"\n title={tr('channel.noRecipientsYet', 'No recipients added yet')}\n description={tr(\n 'channel.addRecipientsHint',\n 'Add one or more recipients above to send this message to.'\n )}\n />\n )}\n </div>\n\n {/* Message Content */}\n <div className=\"space-y-3\">\n <label className=\"text-sm font-medium\">\n {tr('channel.messageContent', 'Message Content')} *\n </label>\n\n {platform === 'EMAIL' && (\n <input\n aria-label={tr('channel.subject', 'Subject')}\n type=\"text\"\n value={subject}\n onChange={(e) => setSubject(e.target.value)}\n placeholder={tr('channel.subject', 'Subject')}\n className=\"w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary\"\n />\n )}\n\n <MarkdownEditor\n value={body}\n onChange={setBody}\n aria-label={tr('channel.messagePlaceholder', 'Enter your message...')}\n placeholder={tr('channel.messagePlaceholder', 'Enter your message...')}\n rows={6}\n />\n </div>\n\n {/* Priority */}\n <div className=\"space-y-2\">\n <label className=\"text-sm font-medium\">{tr('channel.priority', 'Priority')}</label>\n <div className=\"flex gap-2\">\n {(\n [\n {\n value: NotificationPriority.Low,\n key: 'channel.priorityLabel.low',\n fallback: 'Low',\n },\n {\n value: NotificationPriority.Medium,\n key: 'channel.priorityLabel.normal',\n fallback: 'Medium',\n },\n {\n value: NotificationPriority.High,\n key: 'channel.priorityLabel.high',\n fallback: 'High',\n },\n {\n value: NotificationPriority.Urgent,\n key: 'channel.priorityLabel.urgent',\n fallback: 'Urgent',\n },\n ] as const\n ).map((p) => (\n <button\n type=\"button\"\n key={p.value}\n onClick={() => setPriority(p.value)}\n className={`px-4 py-2 rounded-lg border text-sm transition-all ${\n priority === p.value\n ? 'bg-action-primary-bg text-action-primary-text border-primary'\n : 'bg-bg-surface hover:bg-bg-sunken border-border-subtle'\n }`}\n >\n {tr(p.key, p.fallback)}\n </button>\n ))}\n </div>\n </div>\n\n {/* Send Button */}\n <div className=\"flex justify-end pt-4\">\n <button\n type=\"button\"\n onClick={handleSend}\n disabled={\n isSending || !selectedChannelId || recipients.length === 0 || !body.trim()\n }\n className=\"px-6 py-3 rounded-lg bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg/90 transition-colors disabled:opacity-50 flex items-center gap-2\"\n >\n {isSending ? (\n <>\n <Loader2 className=\"size-5 animate-spin\" />\n {tr('channel.sending', 'Sending...')}\n </>\n ) : (\n <>\n <Send className=\"size-5 \" />\n {tr('channel.sendTo', 'Send to')} {recipients.length}{' '}\n {recipients.length !== 1\n ? tr('channel.recipients', 'recipients')\n : tr('channel.recipient', 'recipient')}\n </>\n )}\n </button>\n </div>\n </div>\n ) : (\n /* Results View */\n <div className=\"space-y-6\">\n {/* Summary */}\n <EmphasisPanel className=\"p-4 flex items-center justify-between\">\n <div className=\"flex items-center gap-4\">\n {failCount === 0 ? (\n <CheckCircle2 className=\"size-8 text-status-success-text\" />\n ) : (\n <AlertCircle className=\"size-8 text-status-warning-text\" />\n )}\n <div>\n <h2 className=\"text-lg font-semibold\">\n {failCount === 0\n ? tr('channel.allMessagesSent', 'All messages sent!')\n : `${successCount} of ${recipients.length} sent`}\n </h2>\n <p className=\"text-sm text-text-secondary\">\n {successCount} {tr('channel.successful', 'successful')}, {failCount}{' '}\n {tr('channel.failed', 'failed')}\n </p>\n </div>\n </div>\n <button\n type=\"button\"\n onClick={handleReset}\n className=\"px-4 py-2 rounded-lg border hover:bg-bg-sunken transition-colors\"\n >\n {tr('channel.sendAnother', 'Send Another')}\n </button>\n </EmphasisPanel>\n\n {/* Results List */}\n <GlassCard\n treatment=\"plain\"\n className=\"border-border-seam rounded-lg p-0 divide-y divide-[var(--color-border-seam)] overflow-hidden\"\n >\n {results.map((result) => {\n const recipient = recipients.find((r) => r.id === result.recipientId);\n return (\n <div key={result.recipientId} className=\"p-4 flex items-center justify-between\">\n <div>\n <p className=\"text-sm font-medium\">{recipient?.address}</p>\n {recipient?.name && (\n <p className=\"text-xs text-text-secondary\">{recipient.name}</p>\n )}\n {result.messageId && (\n <p className=\"text-xs text-text-secondary font-mono\">\n {result.messageId}\n </p>\n )}\n {result.error && (\n <p className=\"text-xs text-status-error-text\">{result.error}</p>\n )}\n </div>\n {result.success ? (\n <CheckCircle2 className=\"size-5 text-status-success-text\" />\n ) : (\n <XCircle className=\"size-5 text-status-error-text\" />\n )}\n </div>\n );\n })}\n </GlassCard>\n </div>\n )}\n </div>\n </div>\n </PermissionGuard>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAsEA,IAAM,IAA8C;CAClD,OAAO;CACP,KAAK;CACL,MAAM;CACN,UAAU;CACV,OAAO;CACP,OAAO;CACP,SAAS;CACT,OAAO;CACP,SAAS;CACT,SAAS;CACV;AAMD,SAAgB,IAAkB;CAChC,IAAM,IAAW,GAAa,EACxB,EAAE,gBAAa,GAAa,EAC5B,EAAE,mBAAgB,cAAW,qBAAkB,GAAmB,EAClE,IAAK,GAAO,EAMZ,CAAC,GAAkB,EAAE,SAAS,OAAe,EAA4B,EAAE,QAHlE,EAAuB,GAAe,GAAW,EAAe,EAGU,CAAC,EAGpF,CAAC,GAAmB,KAAwB,EAAS,GAAG,EACxD,CAAC,GAAU,MAAe,EAA0B,QAA2B,EAG/E,CAAC,GAAY,KAAiB,EAAsB,EAAE,CAAC,EACvD,KAAqB,GAAO,EAAE,EAC9B,CAAC,GAAY,KAAiB,EAAS,GAAG,EAC1C,CAAC,GAAS,KAAc,EAAS,GAAG,EAGpC,CAAC,GAAS,KAAc,EAAS,GAAG,EACpC,CAAC,GAAM,KAAW,EAAS,GAAG,EAC9B,CAAC,GAAU,MAAe,EAA+B,EAAqB,OAAO,EAGrF,CAAC,GAAS,KAAc,EAAkC,KAAK,EAC/D,CAAC,GAAO,KAAY,EAAwB,KAAK,EAGjD,IAAmB,EAAS,QAAQ,MAAO,EAAG,aAAa,EAAS,EAGpE,IAAe,QAAkB;AACrC,MAAI,CAAC,EAAW,MAAM,CAAE;EAExB,IAAM,IAAuB;GAC3B,IAAI,KAAK,EAAE,GAAmB;GAC9B,SAAS,EAAW,MAAM;GAC1B,MAAM,EAAQ,MAAM,IAAI,KAAA;GACzB;AAID,EAFA,GAAe,MAAS,CAAC,GAAG,GAAM,EAAU,CAAC,EAC7C,EAAc,GAAG,EACjB,EAAW,GAAG;IACb,CAAC,GAAY,EAAQ,CAAC,EAGnB,KAAkB,GAAa,MAAe;AAClD,KAAe,MAAS,EAAK,QAAQ,MAAM,EAAE,OAAO,EAAG,CAAC;IACvD,EAAE,CAAC,EAGA,KAAc,QAAkB;AAKpC,EAJA,EAAW,KAAK,EAChB,EAAS,KAAK,EACd,EAAW,GAAG,EACd,EAAQ,GAAG,EACX,EAAc,EAAE,CAAC;IAChB,EAAE,CAAC,EAGA,KAAa,YAAY;AAC7B,MAAI,CAAC,GAAmB;AACtB,KAAS,EAAG,oCAAoC,0BAA0B,CAAC;AAC3E;;AAGF,MAAI,EAAW,WAAW,GAAG;AAC3B,KAAS,EAAG,mCAAmC,oCAAoC,CAAC;AACpF;;AAGF,MAAI,CAAC,EAAK,MAAM,EAAE;AAChB,KAAS,EAAG,mCAAmC,yBAAyB,CAAC;AACzE;;AAIF,EADA,EAAS,KAAK,EACd,EAAW,KAAK;AAEhB,MAAI;GAEF,IAAM,IAAkB,EAAS,MAAM,MAAO,EAAG,OAAO,EAAkB;AAC1E,OAAI,CAAC,GAAiB;AACpB,MAAS,EAAG,iCAAiC,6BAA6B,CAAC;AAC3E;;GAQF,IAAM,IADc,MAEF,UACZ,GAAoB,QACnB;AAuFP,KApF0C,MAAM,QAAQ,IACtD,EAAW,IAAI,OAAO,MAAuC;IAE3D,IAAM,IAAiC,EAAE;AACzC,YAAQ,GAAR;KACE,KAAK;AACH,QAAe,QAAQ,EAAU;AACjC;KACF,KAAK;KACL,KAAK;AACH,QAAe,cAAc,EAAU;AACvC;KACF,KAAK;AACH,QAAe,YAAY,EAAU;AACrC;KACF,KAAK;AACH,QAAe,cAAc,EAAU;AACvC;KACF,KAAK;AACH,QAAe,cAAc,EAAU;AACvC;KACF,KAAK;AACH,QAAe,aAAa,EAAU;AACtC;KACF,QACE,GAAe,QAAQ,EAAU;;IAIrC,IAAM,IAAyC;KAC7C,WAAW,EAAgB;KAC3B,UAAU;KACV,cAAc;MACN;MACN,SAAS;MACT,WAAW;MACX,SAAS,MAAa,UAAU,IAAU,KAAA;MAChC;MACX;KACF;AAED,QAAI;KACF,IAAM,IAAS,MAAM,EAAiB,EAAE,WAAW,EAAE,OAAO,GAAc,EAAE,CAAC;AAE7E,SAAI,EAAO,MAAM,qBAAqB;MACpC,IAAM,IAAe,EAAO,KAAK,qBAG3B,IACJ,EAAa,WAAW,YAAY,EAAa,kBAAkB,UAC/D,IAAc,EAAa,gBAAgB,EAAa;AAC9D,aAAO;OACL,aAAa,EAAU;OACvB,SAAS,CAAC;OACV,WAAW,EAAa;OACxB,OAAO,IACH,IACE,EAAG,oCAAoC,+BAA+B,EACpE,QAAQ,GACT,CAAC,GACF,EAAG,0BAA0B,kBAAkB,GACjD,KAAA;OACL;;AAEH,YAAO;MACL,aAAa,EAAU;MACvB,SAAS;MACT,OACE,EAAO,OAAO,WACd,EAAG,kCAAkC,8BAA8B;MACtE;aACM,GAAc;AACrB,YAAO;MACL,aAAa,EAAU;MACvB,SAAS;MACT,OACE,aAAe,QACX,EAAI,UACJ,EAAG,kCAAkC,8BAA8B;MAC1E;;KAEH,CACH,CAE0B;WACpB,GAAc;AAKrB,KAHE,aAAe,QACX,EAAI,UACJ,EAAG,6BAA6B,yBAAyB,CAC9C;;IAIf,IAAe,GAAS,QAAQ,MAAM,EAAE,QAAQ,CAAC,UAAU,GAC3D,IAAY,GAAS,QAAQ,MAAM,CAAC,EAAE,QAAQ,CAAC,UAAU;AAE/D,QACE,kBAAC,IAAD;EAAiB,YAAY,GAAoB;YAC/C,kBAAC,OAAD;GAAK,WAAU;aAAf,CAEE,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,UAAD;OACE,MAAK;OACL,eAAe,EAAS,iBAAiB;OACzC,WAAU;iBAEV,kBAAC,IAAD,EAAW,WAAU,WAAY,CAAA;OAC1B,CAAA,EACT,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,MAAD;OAAI,WAAU;iBAAsB,EAAG,uBAAuB,eAAe;OAAM,CAAA,EACnF,kBAAC,KAAD;OAAG,WAAU;iBACV,EACC,+BACA,iDACD;OACC,CAAA,CACA,EAAA,CAAA,CACF;;KACF,CAAA;IACF,CAAA,EAGN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,GAAD;KAAa,MAAM,kBAAC,GAAD;MAAM,MAAM;MAAI,eAAY;MAAS,CAAA;eACrD,EACC,8BACA,kXACD;KACW,CAAA,EAEb,MAAY,OACX,kBAAC,OAAD;KAAK,WAAU;eAAf;MAEG,KACC,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,GAAD,EAAa,WAAU,0CAA2C,CAAA,EAClE,kBAAC,KAAD;QAAG,WAAU;kBAAkC;QAAU,CAAA,CACrD;;MAIR,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,SAAD;QAAO,WAAU;kBAAuB,EAAG,oBAAoB,WAAW;QAAS,CAAA,EACnF,kBAAC,OAAD;QAAK,WAAU;kBAEX;SACE;SACA;SACA;SACA;SACA;SACA;SACA;SACD,CACD,KAAK,MAAM;SACX,IAAM,IAAO,EAAe,MAAM;AAElC,gBACE,kBAAC,UAAD;UACE,MAAK;UAEL,eAAe;AAEb,WADA,GAAY,EAAE,EACd,EAAqB,GAAG;;UAE1B,WAAW,sEATI,MAAa,IAWtB,iEACA;oBAVR,CAaE,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAC5B,kBAAC,QAAD;WAAM,WAAU;qBAAW,EAAe,GAAG,GAAe,EAAG;WAAQ,CAAA,CAChE;YAbF,EAaE;UAEX;QACE,CAAA,CACF;;MAGN,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,SAAD;QAAO,WAAU;kBAAjB,CAAwC,EAAG,mBAAmB,UAAU,EAAC,KAAU;WAClF,EAAiB,WAAW,IAC3B,kBAAC,OAAD;QAAK,WAAU;kBACb,kBAAC,GAAD;SACE,cAAa;SACb,OAAO,EACL,8BACA,uCACA,EAAE,UAAU,EAAe,GAAU,GAAe,EAAG,EAAE,CAC1D;SACD,aAAa,EACX,kCACA,oEACD;SACD,QACE,kBAAC,UAAD;UACE,MAAK;UACL,eAAe,EAAS,WAAW;UACnC,WAAU;oBAHZ,CAKE,kBAAC,GAAD;WAAM,WAAU;WAAS,eAAY;WAAS,CAAA,EAC7C,EAAG,yBAAyB,iBAAiB,CACvC;;SAEX,CAAA;QACE,CAAA,GAEN,kBAAC,UAAD;QACE,OAAO;QACP,WAAW,MAAM,EAAqB,EAAE,OAAO,MAAM;QACrD,WAAU;kBAHZ,CAKE,kBAAC,UAAD;SAAQ,OAAM;mBAAI,EAAG,yBAAyB,sBAAsB;SAAU,CAAA,EAC7E,EAAiB,KAAK,MACrB,kBAAC,UAAD;SAAoB,OAAO,EAAG;mBAA9B;UACG,EAAG;UAAK;UAAG,EAAG;UAAY;UACpB;WAFI,EAAG,GAEP,CACT,CACK;UAEP;;MAGN,kBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,kBAAC,SAAD;SAAO,WAAU;mBACd,EAAG,sBAAsB,aAAa;SACjC,CAAA;QAGR,kBAAC,OAAD;SAAK,WAAU;mBAAf;UACE,kBAAC,SAAD;WACE,cACE,MAAa,UACT,EAAG,sCAAsC,oBAAoB,GAC7D,EAAG,sCAAsC,cAAc;WAE7D,MAAK;WACL,OAAO;WACP,WAAW,MAAM,EAAc,EAAE,OAAO,MAAM;WAC9C,aACE,MAAa,UACT,EAAG,sCAAsC,oBAAoB,GAC7D,EAAG,sCAAsC,cAAc;WAE7D,WAAU;WACV,CAAA;UACF,kBAAC,SAAD;WACE,cAAY,EAAG,wBAAwB,kBAAkB;WACzD,MAAK;WACL,OAAO;WACP,WAAW,MAAM,EAAW,EAAE,OAAO,MAAM;WAC3C,aAAa,EAAG,wBAAwB,kBAAkB;WAC1D,WAAU;WACV,CAAA;UACF,kBAAC,UAAD;WACE,MAAK;WACL,SAAS;WACT,UAAU,CAAC,EAAW,MAAM;WAC5B,WAAU;qBAJZ,CAME,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAC3B,EAAG,eAAe,MAAM,CAClB;;UACL;;QAGL,EAAW,SAAS,IACnB,kBAAC,GAAD;SACE,WAAU;SACV,WAAU;mBAET,EAAW,KAAK,MACf,kBAAC,OAAD;UAAgB,WAAU;oBAA1B,CACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,KAAD;WAAG,WAAU;qBAAuB,EAAE;WAAY,CAAA,EACjD,EAAE,QAAQ,kBAAC,KAAD;WAAG,WAAU;qBAA+B,EAAE;WAAS,CAAA,CAC9D,EAAA,CAAA,EACN,kBAAC,UAAD;WACE,MAAK;WACL,eAAe,GAAgB,EAAE,GAAG;WACpC,WAAU;qBAEV,kBAAC,GAAD,EAAG,WAAU,8BAA+B,CAAA;WACrC,CAAA,CACL;YAZI,EAAE,GAYN,CACN;SACQ,CAAA,GAEZ,kBAAC,GAAD;SACE,cAAa;SACb,OAAO,EAAG,2BAA2B,0BAA0B;SAC/D,aAAa,EACX,6BACA,4DACD;SACD,CAAA;QAEA;;MAGN,kBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,kBAAC,SAAD;SAAO,WAAU;mBAAjB,CACG,EAAG,0BAA0B,kBAAkB,EAAC,KAC3C;;QAEP,MAAa,WACZ,kBAAC,SAAD;SACE,cAAY,EAAG,mBAAmB,UAAU;SAC5C,MAAK;SACL,OAAO;SACP,WAAW,MAAM,EAAW,EAAE,OAAO,MAAM;SAC3C,aAAa,EAAG,mBAAmB,UAAU;SAC7C,WAAU;SACV,CAAA;QAGJ,kBAAC,IAAD;SACE,OAAO;SACP,UAAU;SACV,cAAY,EAAG,8BAA8B,wBAAwB;SACrE,aAAa,EAAG,8BAA8B,wBAAwB;SACtE,MAAM;SACN,CAAA;QACE;;MAGN,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,SAAD;QAAO,WAAU;kBAAuB,EAAG,oBAAoB,WAAW;QAAS,CAAA,EACnF,kBAAC,OAAD;QAAK,WAAU;kBAEX;SACE;UACE,OAAO,EAAqB;UAC5B,KAAK;UACL,UAAU;UACX;SACD;UACE,OAAO,EAAqB;UAC5B,KAAK;UACL,UAAU;UACX;SACD;UACE,OAAO,EAAqB;UAC5B,KAAK;UACL,UAAU;UACX;SACD;UACE,OAAO,EAAqB;UAC5B,KAAK;UACL,UAAU;UACX;SACF,CACD,KAAK,MACL,kBAAC,UAAD;SACE,MAAK;SAEL,eAAe,GAAY,EAAE,MAAM;SACnC,WAAW,sDACT,MAAa,EAAE,QACX,iEACA;mBAGL,EAAG,EAAE,KAAK,EAAE,SAAS;SACf,EATF,EAAE,MASA,CACT;QACE,CAAA,CACF;;MAGN,kBAAC,OAAD;OAAK,WAAU;iBACb,kBAAC,UAAD;QACE,MAAK;QACL,SAAS;QACT,UACE,KAAa,CAAC,KAAqB,EAAW,WAAW,KAAK,CAAC,EAAK,MAAM;QAE5E,WAAU;kBAET,IACC,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,IAAD,EAAS,WAAU,uBAAwB,CAAA,EAC1C,EAAG,mBAAmB,aAAa,CACnC,EAAA,CAAA,GAEH,kBAAA,GAAA,EAAA,UAAA;SACE,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA;SAC3B,EAAG,kBAAkB,UAAU;SAAC;SAAE,EAAW;SAAQ;SACrD,EAAW,WAAW,IAEnB,EAAG,qBAAqB,YAAY,GADpC,EAAG,sBAAsB,aAAa;SAEzC,EAAA,CAAA;QAEE,CAAA;OACL,CAAA;MACF;SAGN,kBAAC,OAAD;KAAK,WAAU;eAAf,CAEE,kBAAC,IAAD;MAAe,WAAU;gBAAzB,CACE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACG,MAAc,IACb,kBAAC,GAAD,EAAc,WAAU,mCAAoC,CAAA,GAE5D,kBAAC,GAAD,EAAa,WAAU,mCAAoC,CAAA,EAE7D,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,MAAD;QAAI,WAAU;kBACX,MAAc,IACX,EAAG,2BAA2B,qBAAqB,GACnD,GAAG,EAAa,MAAM,EAAW,OAAO;QACzC,CAAA,EACL,kBAAC,KAAD;QAAG,WAAU;kBAAb;SACG;SAAa;SAAE,EAAG,sBAAsB,aAAa;SAAC;SAAG;SAAW;SACpE,EAAG,kBAAkB,SAAS;SAC7B;UACA,EAAA,CAAA,CACF;UACN,kBAAC,UAAD;OACE,MAAK;OACL,SAAS;OACT,WAAU;iBAET,EAAG,uBAAuB,eAAe;OACnC,CAAA,CACK;SAGhB,kBAAC,GAAD;MACE,WAAU;MACV,WAAU;gBAET,EAAQ,KAAK,MAAW;OACvB,IAAM,IAAY,EAAW,MAAM,MAAM,EAAE,OAAO,EAAO,YAAY;AACrE,cACE,kBAAC,OAAD;QAA8B,WAAU;kBAAxC,CACE,kBAAC,OAAD,EAAA,UAAA;SACE,kBAAC,KAAD;UAAG,WAAU;oBAAuB,GAAW;UAAY,CAAA;SAC1D,GAAW,QACV,kBAAC,KAAD;UAAG,WAAU;oBAA+B,EAAU;UAAS,CAAA;SAEhE,EAAO,aACN,kBAAC,KAAD;UAAG,WAAU;oBACV,EAAO;UACN,CAAA;SAEL,EAAO,SACN,kBAAC,KAAD;UAAG,WAAU;oBAAkC,EAAO;UAAU,CAAA;SAE9D,EAAA,CAAA,EACL,EAAO,UACN,kBAAC,GAAD,EAAc,WAAU,mCAAoC,CAAA,GAE5D,kBAAC,GAAD,EAAS,WAAU,iCAAkC,CAAA,CAEnD;UApBI,EAAO,YAoBX;QAER;MACQ,CAAA,CACR;OAEJ;MACF;;EACU,CAAA"}
1
+ {"version":3,"file":"SendMessagePage.js","names":[],"sources":["../../../../../src/channel/modules/channels/pages/SendMessagePage.tsx"],"sourcesContent":["/**\n * Send Message Page\n *\n * UI for sending notifications/messages through channels.\n * Supports single and bulk delivery with recipient management.\n */\n\nimport { useState, useCallback, useRef } from 'react';\nimport { useNavigate } from 'react-router';\nimport { useTr } from '../../../hooks/useTr';\nimport {\n ArrowLeft,\n Send,\n Loader2,\n AlertCircle,\n CheckCircle2,\n XCircle,\n Plus,\n X,\n Mail,\n Smartphone,\n Bell,\n MessageSquare,\n Hash,\n Users,\n MessageCircle,\n} from 'lucide-react';\nimport {\n EmphasisPanel,\n GlassCard,\n IllustratedEmptyState,\n PagePurpose,\n} from '@burdenoff/fe-libs/ui';\nimport { useChannel as useChannelContext } from '../../../providers/ChannelProvider';\nimport { useChannels } from '../../../hooks/useChannels';\nimport { PLATFORM_I18N, translateLabel } from '../i18n';\nimport { getGlobalChannelClient } from '../../../graphql/global-client';\nimport { useSendNotificationMutation } from '../../../../generated/global-operations';\nimport {\n ChannelPlatform,\n NotificationChannel,\n NotificationPriority,\n RecipientInput,\n TriggerNotificationInput,\n} from '../../../../generated/global-types';\nimport { PermissionGuard } from '../../../components/PermissionGuard';\nimport { CHANNEL_PERMISSIONS } from '../../../constants/permissions';\nimport { MarkdownEditor } from '../../../components/MarkdownEditor';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface Recipient {\n id: string;\n address: string;\n name?: string;\n}\n\ninterface DeliveryResult {\n recipientId: string;\n success: boolean;\n messageId?: string;\n error?: string;\n}\n\n// ============================================================================\n// PLATFORM CONFIG\n// ============================================================================\n\nconst PLATFORM_ICONS: Record<string, typeof Mail> = {\n EMAIL: Mail,\n SMS: Smartphone,\n PUSH: Bell,\n WHATSAPP: MessageSquare,\n SLACK: Hash,\n TEAMS: Users,\n DISCORD: MessageCircle,\n INAPP: Bell,\n WEBCHAT: MessageSquare,\n WEBHOOK: Send,\n};\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport function SendMessagePage() {\n const navigate = useNavigate();\n const { channels } = useChannels();\n const { organizationId, authToken, apiGatewayUrl } = useChannelContext();\n const tr = useTr();\n\n // Get Apollo client for notification mutations\n const client = getGlobalChannelClient(apiGatewayUrl, authToken, organizationId);\n\n // Send notification via notification-svc (which calls channel-svc with service actor)\n const [sendNotification, { loading: isSending }] = useSendNotificationMutation({ client });\n\n // Channel selection\n const [selectedChannelId, setSelectedChannelId] = useState('');\n const [platform, setPlatform] = useState<ChannelPlatform>('EMAIL' as ChannelPlatform);\n\n // Recipients\n const [recipients, setRecipients] = useState<Recipient[]>([]);\n const recipientIdCounter = useRef(0);\n const [newAddress, setNewAddress] = useState('');\n const [newName, setNewName] = useState('');\n\n // Message content\n const [subject, setSubject] = useState('');\n const [body, setBody] = useState('');\n const [priority, setPriority] = useState<NotificationPriority>(NotificationPriority.Medium);\n\n // UI state\n const [results, setResults] = useState<DeliveryResult[] | null>(null);\n const [error, setError] = useState<string | null>(null);\n\n // Filter channels by platform\n const filteredChannels = channels.filter((ch) => ch.platform === platform);\n\n // Add recipient\n const addRecipient = useCallback(() => {\n if (!newAddress.trim()) return;\n\n const recipient: Recipient = {\n id: `r-${++recipientIdCounter.current}`,\n address: newAddress.trim(),\n name: newName.trim() || undefined,\n };\n\n setRecipients((prev) => [...prev, recipient]);\n setNewAddress('');\n setNewName('');\n }, [newAddress, newName]);\n\n // Remove recipient\n const removeRecipient = useCallback((id: string) => {\n setRecipients((prev) => prev.filter((r) => r.id !== id));\n }, []);\n\n // Clear results and reset\n const handleReset = useCallback(() => {\n setResults(null);\n setError(null);\n setSubject('');\n setBody('');\n setRecipients([]);\n }, []);\n\n // Send message via notification-svc (which handles service actor auth to channel-svc)\n const handleSend = async () => {\n if (!selectedChannelId) {\n setError(tr('channel.validation.selectChannel', 'Please select a channel'));\n return;\n }\n\n if (recipients.length === 0) {\n setError(tr('channel.validation.addRecipient', 'Please add at least one recipient'));\n return;\n }\n\n if (!body.trim()) {\n setError(tr('channel.validation.enterMessage', 'Please enter a message'));\n return;\n }\n\n setError(null);\n setResults(null);\n\n try {\n // Find the selected channel to get platform and connection info\n const selectedChannel = channels.find((ch) => ch.id === selectedChannelId);\n if (!selectedChannel) {\n setError(tr('channel.error.channelNotFound', 'Selected channel not found'));\n return;\n }\n\n // Map ChannelPlatform to NotificationChannel\n // Most platforms have the same name (EMAIL, SMS, PUSH, etc.)\n // ChannelPlatform uses 'INAPP' but there's no INAPP in ChannelPlatform enum\n // (only in PLATFORM_ICONS). We check using string literal.\n const platformStr = platform as string;\n const notificationChannel =\n platformStr === 'INAPP'\n ? NotificationChannel.InApp\n : (platform as unknown as NotificationChannel);\n\n // Send to each recipient in parallel via notification-svc\n const deliveryResults: DeliveryResult[] = await Promise.all(\n recipients.map(async (recipient): Promise<DeliveryResult> => {\n // Build recipient input for notification-svc\n const recipientInput: RecipientInput = {};\n switch (platform) {\n case 'EMAIL':\n recipientInput.email = recipient.address;\n break;\n case 'SMS':\n case 'WHATSAPP':\n recipientInput.phoneNumber = recipient.address;\n break;\n case 'PUSH':\n recipientInput.pushToken = recipient.address;\n break;\n case 'SLACK':\n recipientInput.slackUserId = recipient.address;\n break;\n case 'TEAMS':\n recipientInput.teamsUserId = recipient.address;\n break;\n case 'WEBHOOK':\n recipientInput.webhookUrl = recipient.address;\n break;\n default:\n recipientInput.email = recipient.address;\n }\n\n // Build TriggerNotificationInput - creates notification AND triggers delivery\n const triggerInput: TriggerNotificationInput = {\n channelId: selectedChannel.id,\n platform: notificationChannel,\n notification: {\n body: body,\n channel: notificationChannel,\n recipient: recipientInput,\n subject: platform === 'EMAIL' ? subject : undefined,\n priority: priority,\n },\n };\n\n try {\n const result = await sendNotification({ variables: { input: triggerInput } });\n\n if (result.data?.triggerNotification) {\n const notification = result.data.triggerNotification;\n // deliveryStatus is null at trigger time (async delivery hasn't completed yet).\n // Use triggerStatus + status to determine immediate send success.\n const failed =\n notification.status === 'FAILED' || notification.triggerStatus === 'FAILED';\n const errorDetail = notification.errorMessage || notification.errorCode;\n return {\n recipientId: recipient.id,\n success: !failed,\n messageId: notification.id,\n error: failed\n ? errorDetail\n ? tr('channel.deliveryFailedWithDetail', 'Delivery failed: {{detail}}', {\n detail: errorDetail,\n })\n : tr('channel.deliveryFailed', 'Delivery failed')\n : undefined,\n };\n }\n return {\n recipientId: recipient.id,\n success: false,\n error:\n result.error?.message ||\n tr('channel.sendNotificationFailed', 'Failed to send notification'),\n };\n } catch (err: unknown) {\n return {\n recipientId: recipient.id,\n success: false,\n error:\n err instanceof Error\n ? err.message\n : tr('channel.sendNotificationFailed', 'Failed to send notification'),\n };\n }\n })\n );\n\n setResults(deliveryResults);\n } catch (err: unknown) {\n const message =\n err instanceof Error\n ? err.message\n : tr('channel.messageSendFailed', 'Failed to send message');\n setError(message);\n }\n };\n\n const successCount = results?.filter((r) => r.success).length ?? 0;\n const failCount = results?.filter((r) => !r.success).length ?? 0;\n\n return (\n <PermissionGuard permission={CHANNEL_PERMISSIONS.CHANNEL_DELIVERY_SEND}>\n <div className=\"min-h-screen bg-bg-surface\">\n {/* Header */}\n <div className=\"border-b bg-bg-surface\">\n <div className=\"container mx-auto px-6 py-4\">\n <div className=\"flex items-center gap-4\">\n <button\n type=\"button\"\n onClick={() => navigate('/channels/list')}\n className=\"p-2 hover:bg-bg-sunken rounded-lg transition-colors\"\n >\n <ArrowLeft className=\"size-5 \" />\n </button>\n <div>\n <h1 className=\"text-2xl font-bold\">{tr('channel.sendMessage', 'Send Message')}</h1>\n <p className=\"text-sm text-text-secondary\">\n {tr(\n 'channel.sendMessageSubtitle',\n 'Send notifications through configured channels'\n )}\n </p>\n </div>\n </div>\n </div>\n </div>\n\n {/* Content */}\n <div className=\"container mx-auto px-6 py-8 max-w-3xl space-y-6\">\n <PagePurpose icon={<Send size={15} aria-hidden=\"true\" />}>\n {tr(\n 'channel.sendMessagePurpose',\n 'Compose and fire off a one-off notification through any configured channel — handy for testing a freshly set-up channel, sending a quick announcement, or reproducing a delivery problem. Pick the platform and channel, add one or more recipients, write your message, and send; you will get a per-recipient success/failure breakdown so you know exactly what got through.'\n )}\n </PagePurpose>\n\n {results === null ? (\n <div className=\"space-y-6\">\n {/* Error Alert */}\n {error && (\n <div className=\"p-4 rounded-lg bg-status-error-bg/10 border border-status-error-border/20 flex items-center gap-3\">\n <AlertCircle className=\"size-5 text-status-error-text shrink-0\" />\n <p className=\"text-sm text-status-error-text\">{error}</p>\n </div>\n )}\n\n {/* Platform Selection */}\n <div className=\"space-y-3\">\n <label className=\"text-sm font-medium\">{tr('channel.platform', 'Platform')}</label>\n <div className=\"flex flex-wrap gap-2\">\n {(\n [\n 'EMAIL',\n 'SMS',\n 'PUSH',\n 'WHATSAPP',\n 'SLACK',\n 'TEAMS',\n 'WEBHOOK',\n ] as ChannelPlatform[]\n ).map((p) => {\n const Icon = PLATFORM_ICONS[p] || Send;\n const isSelected = platform === p;\n return (\n <button\n type=\"button\"\n key={p}\n onClick={() => {\n setPlatform(p);\n setSelectedChannelId('');\n }}\n className={`px-4 py-2 rounded-lg border flex items-center gap-2 transition-all ${\n isSelected\n ? 'bg-action-primary-bg text-action-primary-text border-primary'\n : 'bg-bg-surface hover:bg-bg-sunken border-border-subtle'\n }`}\n >\n <Icon className=\"size-4 \" />\n <span className=\"text-sm\">{translateLabel(p, PLATFORM_I18N, tr)}</span>\n </button>\n );\n })}\n </div>\n </div>\n\n {/* Channel Selection */}\n <div className=\"space-y-2\">\n <label className=\"text-sm font-medium\">{tr('channel.channel', 'Channel')} *</label>\n {filteredChannels.length === 0 ? (\n <div className=\"rounded-lg border border-dashed\">\n <IllustratedEmptyState\n illustration=\"empty-data\"\n title={tr(\n 'channel.noPlatformChannels',\n 'No {{platform}} channels configured',\n { platform: translateLabel(platform, PLATFORM_I18N, tr) }\n )}\n description={tr(\n 'channel.noPlatformChannelsHint',\n 'Create a channel for this platform to be able to send through it.'\n )}\n action={\n <button\n type=\"button\"\n onClick={() => navigate('./create')}\n className=\"inline-flex items-center gap-2 rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg-hover\"\n >\n <Plus className=\"size-4\" aria-hidden=\"true\" />\n {tr('channel.createChannel', 'Create Channel')}\n </button>\n }\n />\n </div>\n ) : (\n <select\n value={selectedChannelId}\n onChange={(e) => setSelectedChannelId(e.target.value)}\n className=\"w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary\"\n >\n <option value=\"\">{tr('channel.selectChannel', 'Select a channel...')}</option>\n {filteredChannels.map((ch) => (\n <option key={ch.id} value={ch.id}>\n {ch.name} ({ch.adapterType})\n </option>\n ))}\n </select>\n )}\n </div>\n\n {/* Recipients */}\n <div className=\"space-y-3\">\n <label className=\"text-sm font-medium\">\n {tr('channel.recipients', 'Recipients')}\n </label>\n\n {/* Add recipient form */}\n <div className=\"flex gap-2\">\n <input\n aria-label={\n platform === 'EMAIL'\n ? tr('channel.recipientPlaceholder.email', 'email@example.com')\n : tr('channel.recipientPlaceholder.phone', '+1234567890')\n }\n type=\"text\"\n value={newAddress}\n onChange={(e) => setNewAddress(e.target.value)}\n placeholder={\n platform === 'EMAIL'\n ? tr('channel.recipientPlaceholder.email', 'email@example.com')\n : tr('channel.recipientPlaceholder.phone', '+1234567890')\n }\n className=\"flex-1 px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary\"\n />\n <input\n aria-label={tr('channel.nameOptional', 'Name (optional)')}\n type=\"text\"\n value={newName}\n onChange={(e) => setNewName(e.target.value)}\n placeholder={tr('channel.nameOptional', 'Name (optional)')}\n className=\"w-full sm:w-48 px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary\"\n />\n <button\n type=\"button\"\n onClick={addRecipient}\n disabled={!newAddress.trim()}\n className=\"px-4 py-2 rounded-lg bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg/90 transition-colors disabled:opacity-50 flex items-center gap-2\"\n >\n <Plus className=\"size-4 \" />\n {tr('channel.add', 'Add')}\n </button>\n </div>\n\n {/* recipient list */}\n {recipients.length > 0 ? (\n <GlassCard\n treatment=\"plain\"\n className=\"border-border-seam rounded-lg p-0 divide-y divide-[var(--color-border-seam)] overflow-hidden\"\n >\n {recipients.map((r) => (\n <div key={r.id} className=\"p-3 flex items-center justify-between\">\n <div>\n <p className=\"text-sm font-medium\">{r.address}</p>\n {r.name && <p className=\"text-xs text-text-secondary\">{r.name}</p>}\n </div>\n <button\n type=\"button\"\n onClick={() => removeRecipient(r.id)}\n className=\"p-1 hover:bg-bg-sunken rounded transition-colors\"\n >\n <X className=\"size-4 text-text-secondary\" />\n </button>\n </div>\n ))}\n </GlassCard>\n ) : (\n <IllustratedEmptyState\n illustration=\"empty-people\"\n title={tr('channel.noRecipientsYet', 'No recipients added yet')}\n description={tr(\n 'channel.addRecipientsHint',\n 'Add one or more recipients above to send this message to.'\n )}\n />\n )}\n </div>\n\n {/* Message Content */}\n <div className=\"space-y-3\">\n <label className=\"text-sm font-medium\">\n {tr('channel.messageContent', 'Message Content')} *\n </label>\n\n {platform === 'EMAIL' && (\n <input\n aria-label={tr('channel.subject', 'Subject')}\n type=\"text\"\n value={subject}\n onChange={(e) => setSubject(e.target.value)}\n placeholder={tr('channel.subject', 'Subject')}\n className=\"w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary\"\n />\n )}\n\n <MarkdownEditor\n value={body}\n onChange={setBody}\n aria-label={tr('channel.messagePlaceholder', 'Enter your message...')}\n placeholder={tr('channel.messagePlaceholder', 'Enter your message...')}\n rows={6}\n />\n </div>\n\n {/* Priority */}\n <div className=\"space-y-2\">\n <label className=\"text-sm font-medium\">{tr('channel.priority', 'Priority')}</label>\n <div className=\"flex gap-2\">\n {(\n [\n {\n value: NotificationPriority.Low,\n key: 'channel.priorityLabel.low',\n fallback: 'Low',\n },\n {\n value: NotificationPriority.Medium,\n key: 'channel.priorityLabel.normal',\n fallback: 'Medium',\n },\n {\n value: NotificationPriority.High,\n key: 'channel.priorityLabel.high',\n fallback: 'High',\n },\n {\n value: NotificationPriority.Urgent,\n key: 'channel.priorityLabel.urgent',\n fallback: 'Urgent',\n },\n ] as const\n ).map((p) => (\n <button\n type=\"button\"\n key={p.value}\n onClick={() => setPriority(p.value)}\n className={`px-4 py-2 rounded-lg border text-sm transition-all ${\n priority === p.value\n ? 'bg-action-primary-bg text-action-primary-text border-primary'\n : 'bg-bg-surface hover:bg-bg-sunken border-border-subtle'\n }`}\n >\n {tr(p.key, p.fallback)}\n </button>\n ))}\n </div>\n </div>\n\n {/* Send Button */}\n <div className=\"flex justify-end pt-4\">\n <button\n type=\"button\"\n onClick={handleSend}\n disabled={\n isSending || !selectedChannelId || recipients.length === 0 || !body.trim()\n }\n className=\"px-6 py-3 rounded-lg bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg/90 transition-colors disabled:opacity-50 flex items-center gap-2\"\n >\n {isSending ? (\n <>\n <Loader2 className=\"size-5 animate-spin\" />\n {tr('channel.sending', 'Sending...')}\n </>\n ) : (\n <>\n <Send className=\"size-5 \" />\n {tr('channel.sendTo', 'Send to')} {recipients.length}{' '}\n {recipients.length !== 1\n ? tr('channel.recipients', 'recipients')\n : tr('channel.recipient', 'recipient')}\n </>\n )}\n </button>\n </div>\n </div>\n ) : (\n /* Results View */\n <div className=\"space-y-6\">\n {/* Summary */}\n <EmphasisPanel className=\"p-4 flex items-center justify-between\">\n <div className=\"flex items-center gap-4\">\n {failCount === 0 ? (\n <CheckCircle2 className=\"size-8 text-status-success-text\" />\n ) : (\n <AlertCircle className=\"size-8 text-status-warning-text\" />\n )}\n <div>\n <h2 className=\"text-lg font-semibold\">\n {failCount === 0\n ? tr('channel.allMessagesSent', 'All messages sent!')\n : `${successCount} of ${recipients.length} sent`}\n </h2>\n <p className=\"text-sm text-text-secondary\">\n {successCount} {tr('channel.successful', 'successful')}, {failCount}{' '}\n {tr('channel.failed', 'failed')}\n </p>\n </div>\n </div>\n <button\n type=\"button\"\n onClick={handleReset}\n className=\"px-4 py-2 rounded-lg border hover:bg-bg-sunken transition-colors\"\n >\n {tr('channel.sendAnother', 'Send Another')}\n </button>\n </EmphasisPanel>\n\n {/* Results List */}\n <GlassCard\n treatment=\"plain\"\n className=\"border-border-seam rounded-lg p-0 divide-y divide-[var(--color-border-seam)] overflow-hidden\"\n >\n {results.map((result) => {\n const recipient = recipients.find((r) => r.id === result.recipientId);\n return (\n <div key={result.recipientId} className=\"p-4 flex items-center justify-between\">\n <div>\n <p className=\"text-sm font-medium\">{recipient?.address}</p>\n {recipient?.name && (\n <p className=\"text-xs text-text-secondary\">{recipient.name}</p>\n )}\n {result.messageId && (\n <p className=\"text-xs text-text-secondary font-mono\">\n {result.messageId}\n </p>\n )}\n {result.error && (\n <p className=\"text-xs text-status-error-text\">{result.error}</p>\n )}\n </div>\n {result.success ? (\n <CheckCircle2 className=\"size-5 text-status-success-text\" />\n ) : (\n <XCircle className=\"size-5 text-status-error-text\" />\n )}\n </div>\n );\n })}\n </GlassCard>\n </div>\n )}\n </div>\n </div>\n </PermissionGuard>\n );\n}\n"],"mappings":"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"}
@@ -163,7 +163,7 @@ function O() {
163
163
  children: [/* @__PURE__ */ T("select", {
164
164
  value: z,
165
165
  onChange: (e) => B(Number(e.target.value)),
166
- className: "px-3 py-2 text-sm bg-surface border border-border-subtle rounded-lg focus:outline-none focus:ring-2 focus:ring-action-primary-bg/50 text-text-primary",
166
+ className: "px-3 py-2 text-sm bg-surface border border-border-subtle rounded-lg focus:outline-none focus:ring-2 focus:ring-action-primary-bg/50 text-text-primary scheme-normal dark:scheme-dark [&_option]:bg-bg-surface [&_option]:text-text-primary",
167
167
  children: [
168
168
  /* @__PURE__ */ w("option", {
169
169
  value: 10,