@burdenoff/microfe-channel 2026.608.1 → 2026.624.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (31) hide show
  1. package/dist/channel/components/AdapterCredentialsForm.js +11 -11
  2. package/dist/channel/components/AdapterCredentialsForm.js.map +1 -1
  3. package/dist/channel/modules/channels/pages/ChannelDashboardPage.js +53 -53
  4. package/dist/channel/modules/channels/pages/ChannelDashboardPage.js.map +1 -1
  5. package/dist/channel/modules/channels/pages/ChannelDetailsPage.js +78 -78
  6. package/dist/channel/modules/channels/pages/ChannelDetailsPage.js.map +1 -1
  7. package/dist/channel/modules/channels/pages/ChannelSettingsPage.js +26 -26
  8. package/dist/channel/modules/channels/pages/ChannelSettingsPage.js.map +1 -1
  9. package/dist/channel/modules/channels/pages/ChannelUsersPage.js +32 -32
  10. package/dist/channel/modules/channels/pages/ChannelUsersPage.js.map +1 -1
  11. package/dist/channel/modules/channels/pages/ChannelsListPage.js +41 -41
  12. package/dist/channel/modules/channels/pages/ChannelsListPage.js.map +1 -1
  13. package/dist/channel/modules/channels/pages/ConnectionDetailsPage.js +30 -30
  14. package/dist/channel/modules/channels/pages/ConnectionDetailsPage.js.map +1 -1
  15. package/dist/channel/modules/channels/pages/ConnectionsListPage.js +29 -29
  16. package/dist/channel/modules/channels/pages/ConnectionsListPage.js.map +1 -1
  17. package/dist/channel/modules/channels/pages/CreateChannelPage.js +28 -28
  18. package/dist/channel/modules/channels/pages/CreateChannelPage.js.map +1 -1
  19. package/dist/channel/modules/channels/pages/CreateConnectionPage.js +8 -8
  20. package/dist/channel/modules/channels/pages/CreateConnectionPage.js.map +1 -1
  21. package/dist/channel/modules/channels/pages/DeliveryHistoryPage.js +28 -28
  22. package/dist/channel/modules/channels/pages/DeliveryHistoryPage.js.map +1 -1
  23. package/dist/channel/modules/channels/pages/EditChannelPage.js +25 -25
  24. package/dist/channel/modules/channels/pages/EditChannelPage.js.map +1 -1
  25. package/dist/channel/modules/channels/pages/EditConnectionPage.js +4 -4
  26. package/dist/channel/modules/channels/pages/EditConnectionPage.js.map +1 -1
  27. package/dist/channel/modules/channels/pages/SendMessagePage.js +27 -27
  28. package/dist/channel/modules/channels/pages/SendMessagePage.js.map +1 -1
  29. package/dist/channel/modules/channels/pages/WebhookEventsPage.js +29 -29
  30. package/dist/channel/modules/channels/pages/WebhookEventsPage.js.map +1 -1
  31. package/package.json +1 -1
@@ -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-dom';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\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 { useChannel as useChannelContext } from '../../../providers/ChannelProvider';\nimport { useChannels } from '../../../hooks/useChannels';\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';\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 { t } = useI18n();\n const tr = (key: string, fallback: string): string => {\n const value = t(key);\n return value === key ? fallback : value;\n };\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 ? `Delivery failed: ${errorDetail}`\n : 'Delivery failed'\n : undefined,\n };\n }\n return {\n recipientId: recipient.id,\n success: false,\n error: result.error?.message || 'Failed to send notification',\n };\n } catch (err: unknown) {\n return {\n recipientId: recipient.id,\n success: false,\n error: err instanceof Error ? err.message : 'Failed to send notification',\n };\n }\n })\n );\n\n setResults(deliveryResults);\n } catch (err: unknown) {\n const message = err instanceof Error ? err.message : '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-background\">\n {/* Header */}\n <div className=\"border-b bg-card\">\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-muted 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-muted-foreground\">\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\">\n {results === null ? (\n <div className=\"space-y-6\">\n {/* Error Alert */}\n {error && (\n <div className=\"p-4 rounded-lg bg-destructive/10 border border-destructive/20 flex items-center gap-3\">\n <AlertCircle className=\"size-5 text-destructive shrink-0\" />\n <p className=\"text-sm text-destructive\">{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-primary text-primary-foreground border-primary'\n : 'bg-card hover:bg-muted border-border'\n }`}\n >\n <Icon className=\"size-4 \" />\n <span className=\"text-sm\">{p}</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=\"p-4 rounded-lg border border-dashed text-center\">\n <p className=\"text-sm text-muted-foreground\">\n No {platform} channels configured.\n <button\n type=\"button\"\n onClick={() => navigate('./create')}\n className=\"text-primary hover:underline ml-1\"\n >\n Create one\n </button>\n </p>\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-background 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={platform === 'EMAIL' ? 'email@example.com' : '+1234567890'}\n type=\"text\"\n value={newAddress}\n onChange={(e) => setNewAddress(e.target.value)}\n placeholder={platform === 'EMAIL' ? 'email@example.com' : '+1234567890'}\n className=\"flex-1 px-4 py-2 rounded-lg border bg-background 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-background 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-primary text-primary-foreground hover:bg-primary/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 <div className=\"border rounded-lg divide-y\">\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-muted-foreground\">{r.name}</p>}\n </div>\n <button\n type=\"button\"\n onClick={() => removeRecipient(r.id)}\n className=\"p-1 hover:bg-muted rounded transition-colors\"\n >\n <X className=\"size-4 text-muted-foreground\" />\n </button>\n </div>\n ))}\n </div>\n ) : (\n <p className=\"text-sm text-muted-foreground text-center py-4\">\n {tr('channel.noRecipientsYet', 'No recipients added yet')}\n </p>\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=\"Subject\"\n type=\"text\"\n value={subject}\n onChange={(e) => setSubject(e.target.value)}\n placeholder=\"Subject\"\n className=\"w-full px-4 py-2 rounded-lg border bg-background focus:outline-none focus:ring-2 focus:ring-primary\"\n />\n )}\n\n <textarea\n aria-label=\"Enter your message...\"\n value={body}\n onChange={(e) => setBody(e.target.value)}\n placeholder=\"Enter your message...\"\n rows={6}\n className=\"w-full px-4 py-2 rounded-lg border bg-background focus:outline-none focus:ring-2 focus:ring-primary resize-none\"\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 NotificationPriority.Low,\n NotificationPriority.Medium,\n NotificationPriority.High,\n NotificationPriority.Urgent,\n ] as const\n ).map((p) => (\n <button\n type=\"button\"\n key={p}\n onClick={() => setPriority(p)}\n className={`px-4 py-2 rounded-lg border text-sm transition-all ${\n priority === p\n ? 'bg-primary text-primary-foreground border-primary'\n : 'bg-card hover:bg-muted border-border'\n }`}\n >\n {p}\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-primary text-primary-foreground hover:bg-primary/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 <div className=\"p-4 rounded-lg border 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-muted-foreground\">\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-muted transition-colors\"\n >\n {tr('channel.sendAnother', 'Send Another')}\n </button>\n </div>\n\n {/* Results List */}\n <div className=\"border rounded-lg divide-y\">\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-muted-foreground\">{recipient.name}</p>\n )}\n {result.messageId && (\n <p className=\"text-xs text-muted-foreground font-mono\">\n {result.messageId}\n </p>\n )}\n {result.error && <p className=\"text-xs text-destructive\">{result.error}</p>}\n </div>\n {result.success ? (\n <CheckCircle2 className=\"size-5 text-status-success-text\" />\n ) : (\n <XCircle className=\"size-5 text-destructive\" />\n )}\n </div>\n );\n })}\n </div>\n </div>\n )}\n </div>\n </div>\n </PermissionGuard>\n );\n}\n"],"mappings":"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"}
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-dom';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\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 { useChannel as useChannelContext } from '../../../providers/ChannelProvider';\nimport { useChannels } from '../../../hooks/useChannels';\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';\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 { t } = useI18n();\n const tr = (key: string, fallback: string): string => {\n const value = t(key);\n return value === key ? fallback : value;\n };\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 ? `Delivery failed: ${errorDetail}`\n : 'Delivery failed'\n : undefined,\n };\n }\n return {\n recipientId: recipient.id,\n success: false,\n error: result.error?.message || 'Failed to send notification',\n };\n } catch (err: unknown) {\n return {\n recipientId: recipient.id,\n success: false,\n error: err instanceof Error ? err.message : 'Failed to send notification',\n };\n }\n })\n );\n\n setResults(deliveryResults);\n } catch (err: unknown) {\n const message = err instanceof Error ? err.message : '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\">\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\">{p}</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=\"p-4 rounded-lg border border-dashed text-center\">\n <p className=\"text-sm text-text-secondary\">\n No {platform} channels configured.\n <button\n type=\"button\"\n onClick={() => navigate('./create')}\n className=\"text-primary hover:underline ml-1\"\n >\n Create one\n </button>\n </p>\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={platform === 'EMAIL' ? 'email@example.com' : '+1234567890'}\n type=\"text\"\n value={newAddress}\n onChange={(e) => setNewAddress(e.target.value)}\n placeholder={platform === 'EMAIL' ? 'email@example.com' : '+1234567890'}\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 <div className=\"border rounded-lg divide-y\">\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 </div>\n ) : (\n <p className=\"text-sm text-text-secondary text-center py-4\">\n {tr('channel.noRecipientsYet', 'No recipients added yet')}\n </p>\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=\"Subject\"\n type=\"text\"\n value={subject}\n onChange={(e) => setSubject(e.target.value)}\n placeholder=\"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 <textarea\n aria-label=\"Enter your message...\"\n value={body}\n onChange={(e) => setBody(e.target.value)}\n placeholder=\"Enter your message...\"\n rows={6}\n className=\"w-full px-4 py-2 rounded-lg border bg-bg-surface focus:outline-none focus:ring-2 focus:ring-primary resize-none\"\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 NotificationPriority.Low,\n NotificationPriority.Medium,\n NotificationPriority.High,\n NotificationPriority.Urgent,\n ] as const\n ).map((p) => (\n <button\n type=\"button\"\n key={p}\n onClick={() => setPriority(p)}\n className={`px-4 py-2 rounded-lg border text-sm transition-all ${\n priority === p\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 {p}\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 <div className=\"p-4 rounded-lg border 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 </div>\n\n {/* Results List */}\n <div className=\"border rounded-lg divide-y\">\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 && <p className=\"text-xs text-status-error-text\">{result.error}</p>}\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 </div>\n </div>\n )}\n </div>\n </div>\n </PermissionGuard>\n );\n}\n"],"mappings":";;;;;;;;;;;;;AA8DA,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,IAAa,EACxB,EAAE,gBAAa,GAAa,EAC5B,EAAE,mBAAgB,cAAW,qBAAkB,GAAmB,EAClE,EAAE,SAAM,GAAS,EACjB,KAAM,GAAa,MAA6B;EACpD,IAAM,IAAQ,EAAE,EAAI;AACpB,SAAO,MAAU,IAAM,IAAW;IAO9B,CAAC,GAAkB,EAAE,SAAS,OAAe,EAA4B,EAAE,QAHlE,EAAuB,GAAe,GAAW,EAAe,EAGU,CAAC,EAGpF,CAAC,GAAmB,KAAwB,EAAS,GAAG,EACxD,CAAC,GAAU,KAAe,EAA0B,QAA2B,EAG/E,CAAC,GAAY,KAAiB,EAAsB,EAAE,CAAC,EACvD,IAAqB,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,KAAe,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,KAAe,QAAkB;AACrC,MAAI,CAAC,EAAW,MAAM,CAAE;EAExB,IAAM,IAAuB;GAC3B,IAAI,KAAK,EAAE,EAAmB;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,EAAoB,QACnB;AAgFP,KA7E0C,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,oBAAoB,MACpB,oBACF,KAAA;OACL;;AAEH,YAAO;MACL,aAAa,EAAU;MACvB,SAAS;MACT,OAAO,EAAO,OAAO,WAAW;MACjC;aACM,GAAc;AACrB,YAAO;MACL,aAAa,EAAU;MACvB,SAAS;MACT,OAAO,aAAe,QAAQ,EAAI,UAAU;MAC7C;;KAEH,CACH,CAE0B;WACpB,GAAc;AAErB,KADgB,aAAe,QAAQ,EAAI,UAAU,yBACpC;;IAIf,IAAe,GAAS,QAAQ,MAAM,EAAE,QAAQ,CAAC,UAAU,GAC3D,IAAY,GAAS,QAAQ,MAAM,CAAC,EAAE,QAAQ,CAAC,UAAU;AAE/D,QACE,kBAAC,GAAD;EAAiB,YAAY,EAAoB;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,GAAD,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;cACZ,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,EAAY,EAAE,EACd,EAAqB,GAAG;;UAE1B,WAAW,sEATI,MAAa,IAWtB,iEACA;oBAVR,CAaE,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAC5B,kBAAC,QAAD;WAAM,WAAU;qBAAW;WAAS,CAAA,CAC7B;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,KAAD;SAAG,WAAU;mBAAb;UAA2C;UACrC;UAAS;UACb,kBAAC,UAAD;WACE,MAAK;WACL,eAAe,EAAS,WAAW;WACnC,WAAU;qBACX;WAEQ,CAAA;UACP;;QACA,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,cAAY,MAAa,UAAU,sBAAsB;WACzD,MAAK;WACL,OAAO;WACP,WAAW,MAAM,EAAc,EAAE,OAAO,MAAM;WAC9C,aAAa,MAAa,UAAU,sBAAsB;WAC1D,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,OAAD;SAAK,WAAU;mBACZ,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,IAAD,EAAG,WAAU,8BAA+B,CAAA;WACrC,CAAA,CACL;YAZI,EAAE,GAYN,CACN;SACE,CAAA,GAEN,kBAAC,KAAD;SAAG,WAAU;mBACV,EAAG,2BAA2B,0BAA0B;SACvD,CAAA;QAEF;;MAGN,kBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,kBAAC,SAAD;SAAO,WAAU;mBAAjB,CACG,EAAG,0BAA0B,kBAAkB,EAAC,KAC3C;;QAEP,MAAa,WACZ,kBAAC,SAAD;SACE,cAAW;SACX,MAAK;SACL,OAAO;SACP,WAAW,MAAM,EAAW,EAAE,OAAO,MAAM;SAC3C,aAAY;SACZ,WAAU;SACV,CAAA;QAGJ,kBAAC,YAAD;SACE,cAAW;SACX,OAAO;SACP,WAAW,MAAM,EAAQ,EAAE,OAAO,MAAM;SACxC,aAAY;SACZ,MAAM;SACN,WAAU;SACV,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,EAAqB;SACrB,EAAqB;SACrB,EAAqB;SACrB,EAAqB;SACtB,CACD,KAAK,MACL,kBAAC,UAAD;SACE,MAAK;SAEL,eAAe,EAAY,EAAE;SAC7B,WAAW,sDACT,MAAa,IACT,iEACA;mBAGL;SACM,EATF,EASE,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,GAAD,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,OAAD;MAAK,WAAU;gBAAf,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,CACL;SAGN,kBAAC,OAAD;MAAK,WAAU;gBACZ,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,SAAS,kBAAC,KAAD;UAAG,WAAU;oBAAkC,EAAO;UAAU,CAAA;SAC7E,EAAA,CAAA,EACL,EAAO,UACN,kBAAC,GAAD,EAAc,WAAU,mCAAoC,CAAA,GAE5D,kBAAC,IAAD,EAAS,WAAU,iCAAkC,CAAA,CAEnD;UAlBI,EAAO,YAkBX;QAER;MACE,CAAA,CACF;;IAEJ,CAAA,CACF;;EACU,CAAA"}
@@ -14,7 +14,7 @@ import { Fragment as w, jsx as T, jsxs as E } from "react/jsx-runtime";
14
14
  var D = {
15
15
  PENDING: {
16
16
  label: "Pending",
17
- color: "text-muted-foreground bg-muted",
17
+ color: "text-text-secondary bg-bg-sunken",
18
18
  icon: _
19
19
  },
20
20
  PROCESSING: {
@@ -144,16 +144,16 @@ function O() {
144
144
  type: "button",
145
145
  onClick: () => _(`/channels/${h}`),
146
146
  "aria-label": O("channel.backToChannel", "Back to channel"),
147
- className: "p-2 text-muted-foreground hover:text-foreground hover:bg-muted rounded-lg transition-colors",
147
+ className: "p-2 text-text-secondary hover:text-text-primary hover:bg-bg-sunken rounded-lg transition-colors",
148
148
  children: /* @__PURE__ */ T(m, {
149
149
  size: 20,
150
150
  "aria-hidden": "true"
151
151
  })
152
152
  }), /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("h1", {
153
- className: "text-xl sm:text-2xl font-bold text-foreground",
153
+ className: "text-xl sm:text-2xl font-bold text-text-primary",
154
154
  children: O("channel.webhookEvents", "Webhook Events")
155
155
  }), /* @__PURE__ */ E("p", {
156
- className: "text-sm text-muted-foreground mt-1",
156
+ className: "text-sm text-text-secondary mt-1",
157
157
  children: [G.name, " - Event history"]
158
158
  })] })]
159
159
  }), /* @__PURE__ */ E("div", {
@@ -162,7 +162,7 @@ function O() {
162
162
  /* @__PURE__ */ E("select", {
163
163
  value: L,
164
164
  onChange: (e) => R(Number(e.target.value)),
165
- className: "px-3 py-2 text-sm bg-surface border border-border rounded-lg focus:outline-none focus:ring-2 focus:ring-action-primary-bg/50 text-foreground",
165
+ 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
166
  children: [
167
167
  /* @__PURE__ */ T("option", {
168
168
  value: 10,
@@ -186,7 +186,7 @@ function O() {
186
186
  type: "button",
187
187
  onClick: () => void Y(V[U]),
188
188
  disabled: N,
189
- className: "flex items-center gap-2 px-4 py-2 text-sm font-medium text-muted-foreground hover:text-foreground hover:bg-muted rounded-lg transition-colors disabled:opacity-50",
189
+ className: "flex items-center gap-2 px-4 py-2 text-sm font-medium text-text-secondary hover:text-text-primary hover:bg-bg-sunken rounded-lg transition-colors disabled:opacity-50",
190
190
  children: [/* @__PURE__ */ T(S, {
191
191
  size: 16,
192
192
  className: N ? "animate-spin" : ""
@@ -198,7 +198,7 @@ function O() {
198
198
  type: "button",
199
199
  onClick: () => void A(),
200
200
  disabled: j,
201
- className: "flex items-center gap-2 px-4 py-2 text-sm font-medium text-fg border border-border hover:bg-bg-elevated rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
201
+ className: "flex items-center gap-2 px-4 py-2 text-sm font-medium text-fg border border-border-subtle hover:bg-bg-elevated rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
202
202
  title: O("channel.exportCSV", "Export to CSV"),
203
203
  children: [j ? /* @__PURE__ */ T(x, {
204
204
  size: 16,
@@ -220,43 +220,43 @@ function O() {
220
220
  })]
221
221
  }),
222
222
  /* @__PURE__ */ T("div", {
223
- className: "p-4 bg-surface border border-border rounded-lg",
223
+ className: "p-4 bg-surface border border-border-subtle rounded-lg",
224
224
  children: /* @__PURE__ */ T("p", {
225
- className: "text-sm text-muted-foreground",
225
+ className: "text-sm text-text-secondary",
226
226
  children: "Webhook events show all incoming webhooks received by this channel. Data is retained for 7 days."
227
227
  })
228
228
  }),
229
229
  /* @__PURE__ */ T("div", {
230
- className: "bg-surface border border-border rounded-lg overflow-hidden",
230
+ className: "bg-surface border border-border-subtle rounded-lg overflow-hidden",
231
231
  children: /* @__PURE__ */ T("div", {
232
232
  className: "overflow-x-auto min-w-full",
233
233
  children: /* @__PURE__ */ E("table", {
234
234
  className: "w-full min-w-[600px]",
235
235
  children: [/* @__PURE__ */ T("thead", {
236
- className: "bg-muted/50 border-b border-border",
236
+ className: "bg-bg-sunken/50 border-b border-border-subtle",
237
237
  children: /* @__PURE__ */ E("tr", { children: [
238
238
  /* @__PURE__ */ T("th", {
239
- className: "px-4 py-3 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider",
239
+ className: "px-4 py-3 text-left text-xs font-medium text-text-secondary uppercase tracking-wider",
240
240
  children: O("channel.status", "Status")
241
241
  }),
242
242
  /* @__PURE__ */ T("th", {
243
- className: "px-4 py-3 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider",
243
+ className: "px-4 py-3 text-left text-xs font-medium text-text-secondary uppercase tracking-wider",
244
244
  children: O("channel.eventType", "Event Type")
245
245
  }),
246
246
  /* @__PURE__ */ T("th", {
247
- className: "px-4 py-3 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider",
247
+ className: "px-4 py-3 text-left text-xs font-medium text-text-secondary uppercase tracking-wider",
248
248
  children: O("channel.duplicate", "Duplicate")
249
249
  }),
250
250
  /* @__PURE__ */ T("th", {
251
- className: "px-4 py-3 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider",
251
+ className: "px-4 py-3 text-left text-xs font-medium text-text-secondary uppercase tracking-wider",
252
252
  children: O("channel.processedAt", "Processed At")
253
253
  }),
254
254
  /* @__PURE__ */ T("th", {
255
- className: "px-4 py-3 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider",
255
+ className: "px-4 py-3 text-left text-xs font-medium text-text-secondary uppercase tracking-wider",
256
256
  children: O("channel.error", "Error")
257
257
  }),
258
258
  /* @__PURE__ */ T("th", {
259
- className: "px-4 py-3 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider",
259
+ className: "px-4 py-3 text-left text-xs font-medium text-text-secondary uppercase tracking-wider",
260
260
  children: O("channel.actions", "Actions")
261
261
  })
262
262
  ] })
@@ -264,12 +264,12 @@ function O() {
264
264
  className: "divide-y divide-border",
265
265
  children: F.length === 0 ? /* @__PURE__ */ T("tr", { children: /* @__PURE__ */ T("td", {
266
266
  colSpan: 6,
267
- className: "px-4 py-8 text-center text-muted-foreground",
267
+ className: "px-4 py-8 text-center text-text-secondary",
268
268
  children: O("channel.noWebhookEventsFound", "No webhook events found")
269
269
  }) }) : F.map((e) => {
270
270
  let t = le(e.status), n = t.icon, r = re === e.id;
271
271
  return /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ E("tr", {
272
- className: "hover:bg-muted/30 transition-colors",
272
+ className: "hover:bg-bg-sunken/30 transition-colors",
273
273
  children: [
274
274
  /* @__PURE__ */ T("td", {
275
275
  className: "px-4 py-3",
@@ -285,7 +285,7 @@ function O() {
285
285
  })
286
286
  }),
287
287
  /* @__PURE__ */ T("td", {
288
- className: "px-4 py-3 text-sm font-mono text-foreground",
288
+ className: "px-4 py-3 text-sm font-mono text-text-primary",
289
289
  children: e.eventType
290
290
  }),
291
291
  /* @__PURE__ */ T("td", {
@@ -294,12 +294,12 @@ function O() {
294
294
  className: "text-xs text-status-warning-text bg-status-warning-bg-subtle px-2 py-1 rounded",
295
295
  children: "Duplicate"
296
296
  }) : /* @__PURE__ */ T("span", {
297
- className: "text-xs text-muted-foreground",
297
+ className: "text-xs text-text-secondary",
298
298
  children: "No"
299
299
  })
300
300
  }),
301
301
  /* @__PURE__ */ T("td", {
302
- className: "px-4 py-3 text-sm text-muted-foreground",
302
+ className: "px-4 py-3 text-sm text-text-secondary",
303
303
  children: e.processedAt ? new Date(e.processedAt).toLocaleString() : "-"
304
304
  }),
305
305
  /* @__PURE__ */ T("td", {
@@ -313,7 +313,7 @@ function O() {
313
313
  onClick: () => ie(r ? null : e.id),
314
314
  "aria-label": r ? O("channel.hidePayload", "Hide payload") : O("channel.viewPayload", "View payload"),
315
315
  "aria-expanded": r,
316
- className: "p-1 text-muted-foreground hover:text-foreground hover:bg-muted rounded transition-colors",
316
+ className: "p-1 text-text-secondary hover:text-text-primary hover:bg-bg-sunken rounded transition-colors",
317
317
  children: T(r ? b : y, {
318
318
  size: 16,
319
319
  "aria-hidden": "true"
@@ -323,14 +323,14 @@ function O() {
323
323
  ]
324
324
  }, e.id), r && /* @__PURE__ */ T("tr", { children: /* @__PURE__ */ T("td", {
325
325
  colSpan: 6,
326
- className: "px-4 py-3 bg-muted/30",
326
+ className: "px-4 py-3 bg-bg-sunken/30",
327
327
  children: /* @__PURE__ */ E("div", {
328
328
  className: "text-xs",
329
329
  children: [/* @__PURE__ */ E("p", {
330
- className: "text-muted-foreground mb-1",
330
+ className: "text-text-secondary mb-1",
331
331
  children: [O("channel.payload", "Payload"), ":"]
332
332
  }), /* @__PURE__ */ T("pre", {
333
- className: "bg-surface p-2 rounded border border-border overflow-auto",
333
+ className: "bg-surface p-2 rounded border border-border-subtle overflow-auto",
334
334
  children: JSON.stringify(e.payload, null, 2)
335
335
  })]
336
336
  })
@@ -343,7 +343,7 @@ function O() {
343
343
  /* @__PURE__ */ E("div", {
344
344
  className: "flex items-center justify-between",
345
345
  children: [/* @__PURE__ */ T("p", {
346
- className: "text-sm text-muted-foreground",
346
+ className: "text-sm text-text-secondary",
347
347
  children: z > 0 && /* @__PURE__ */ E(w, { children: [
348
348
  O("channel.page", "Page"),
349
349
  " ",
@@ -365,13 +365,13 @@ function O() {
365
365
  type: "button",
366
366
  onClick: oe,
367
367
  disabled: !ce || N,
368
- className: "flex items-center gap-1 px-3 py-1.5 text-sm border border-border rounded-lg hover:bg-muted transition-colors disabled:opacity-40 disabled:cursor-not-allowed",
368
+ 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",
369
369
  children: [/* @__PURE__ */ T(g, { size: 16 }), O("channel.previous", "Previous")]
370
370
  }), /* @__PURE__ */ E("button", {
371
371
  type: "button",
372
372
  onClick: () => void ae(),
373
373
  disabled: !se || N,
374
- className: "flex items-center gap-1 px-3 py-1.5 text-sm border border-border rounded-lg hover:bg-muted transition-colors disabled:opacity-40 disabled:cursor-not-allowed",
374
+ 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",
375
375
  children: [O("channel.next", "Next"), /* @__PURE__ */ T(ee, { size: 16 })]
376
376
  })]
377
377
  })]
@@ -1 +1 @@
1
- {"version":3,"file":"WebhookEventsPage.js","names":[],"sources":["../../../../../src/channel/modules/channels/pages/WebhookEventsPage.tsx"],"sourcesContent":["/**\n * Webhook Events Page\n *\n * Displays webhook event history for a specific channel\n */\n\nimport { useState, useEffect, useCallback, useRef } from 'react';\nimport { useParams, useNavigate } from 'react-router-dom';\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 Eye,\n EyeOff,\n Download,\n ChevronLeft,\n ChevronRight,\n} from 'lucide-react';\nimport { useChannel, type WebhookEvent as WebhookEventType } from '../../../hooks/useChannels';\nimport type { WebhookProcessingStatus } from '../../../hooks/useChannels';\nimport { useChannel as useChannelContext } from '../../../providers/ChannelProvider';\nimport { PermissionGuard } from '../../../components/PermissionGuard';\nimport { CHANNEL_PERMISSIONS } from '../../../constants/permissions';\nimport { emitShellEvent } from '../../../utils/shellBridge';\nimport {\n WEBHOOK_RECEIVED_SUBSCRIPTION,\n useChannelSubscription,\n} from '../../../hooks/useChannelSubscription';\nimport { useExportWebhookEvents } from '../hooks/useExport';\n\nconst STATUS_CONFIG: Record<\n WebhookProcessingStatus,\n { label: string; color: string; icon: typeof CheckCircle2 }\n> = {\n PENDING: { label: 'Pending', color: 'text-muted-foreground bg-muted', icon: Clock },\n PROCESSING: {\n label: 'Processing',\n color: 'text-accent-primary bg-accent-primary/10',\n icon: RefreshCw,\n },\n COMPLETED: {\n label: 'Completed',\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 IGNORED: {\n label: 'Ignored',\n color: 'text-status-warning-text bg-status-warning-bg-subtle',\n icon: EyeOff,\n },\n};\n\nexport function WebhookEventsPage() {\n const { channelId } = useParams<{ channelId: string }>();\n const navigate = useNavigate();\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: exportWebhooks,\n isExporting: isExportingWebhooks,\n exportError: exportWebhooksError,\n } = useExportWebhookEvents(organizationId ?? undefined, channelId);\n const [isLoadingEvents, setIsLoadingEvents] = useState(true);\n const [events, setEvents] = useState<WebhookEventType[]>([]);\n const [expandedEvent, setExpandedEvent] = useState<string | null>(null);\n const [limit, setLimit] = useState(25);\n const [total, setTotal] = useState(0);\n const [cursorStack, setCursorStack] = useState<(string | undefined)[]>([undefined]);\n const [currentPageIdx, setCurrentPageIdx] = useState(0);\n\n const { channel, isLoading, error, fetchWebhookEvents } = useChannel(channelId);\n\n const loadEvents = useCallback(\n async (cursor?: string) => {\n if (!channelId) return;\n setIsLoadingEvents(true);\n try {\n const result = await fetchWebhookEvents(limit, cursor);\n setEvents(result.items);\n setTotal(result.total);\n return result.nextCursor;\n } finally {\n setIsLoadingEvents(false);\n }\n },\n [channelId, fetchWebhookEvents, limit]\n );\n\n // Keep refs current after every render so pagination and subscription callbacks\n // always call the latest function/value without those variables in deps.\n const loadEventsRef = useRef(loadEvents);\n const cursorStackRef = useRef(cursorStack);\n const currentPageIdxRef = useRef(currentPageIdx);\n useEffect(() => {\n loadEventsRef.current = loadEvents;\n cursorStackRef.current = cursorStack;\n currentPageIdxRef.current = currentPageIdx;\n });\n // Tracks whether the [limit] effect has already fired on mount so the\n // [currentPageIdx] effect skips its first run (avoiding a double load).\n const isFirstPageRender = useRef(true);\n\n // Reset cursor stack and reload whenever page size changes (also fires on mount).\n useEffect(() => {\n void Promise.resolve().then(() => {\n setCursorStack([undefined]);\n setCurrentPageIdx(0);\n void loadEventsRef.current(undefined);\n });\n }, [limit]);\n\n // Navigate to a specific page; skip the very first render to avoid\n // a duplicate load alongside the [limit] effect above.\n useEffect(() => {\n if (isFirstPageRender.current) {\n isFirstPageRender.current = false;\n return;\n }\n void Promise.resolve().then(() =>\n loadEventsRef.current(cursorStackRef.current[currentPageIdx])\n );\n }, [currentPageIdx]);\n\n const handleNextPage = useCallback(async () => {\n const nextCursor = await loadEvents(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, loadEvents]);\n\n const handlePrevPage = useCallback(() => {\n const prevIdx = currentPageIdx - 1;\n setCurrentPageIdx(prevIdx);\n void loadEvents(cursorStack[prevIdx]);\n }, [cursorStack, currentPageIdx, loadEvents]);\n\n const hasNextPage = events.length === limit;\n const hasPrevPage = currentPageIdx > 0;\n\n // Real-time webhook stream. Subscribes when the gateway exposes\n // `webhookReceived`; otherwise polls every 60s as a graceful fallback.\n useChannelSubscription({\n query: WEBHOOK_RECEIVED_SUBSCRIPTION,\n variables: { channelId },\n operationName: 'WebhookReceived',\n enabled: Boolean(channelId),\n onData: useCallback(() => {\n emitShellEvent('webhook.received', { channelId });\n void loadEventsRef.current(cursorStackRef.current[currentPageIdxRef.current]);\n }, [channelId]),\n pollFn: useCallback(() => {\n void loadEventsRef.current(cursorStackRef.current[currentPageIdxRef.current]);\n }, []),\n pollIntervalMs: 60_000,\n });\n\n const getStatusConfig = (status: WebhookProcessingStatus) => {\n return STATUS_CONFIG[status] || STATUS_CONFIG.PENDING;\n };\n\n // Loading state (only show full-screen for initial channel load)\n if (isLoading) {\n return (\n <div className=\"flex items-center justify-center min-h-screen\">\n <Loader2 size={32} className=\"animate-spin text-accent-primary\" />\n </div>\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_WEBHOOK_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-muted-foreground hover:text-foreground hover:bg-muted 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-foreground\">\n {tr('channel.webhookEvents', 'Webhook Events')}\n </h1>\n <p className=\"text-sm text-muted-foreground mt-1\">{channel.name} - Event history</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 rounded-lg focus:outline-none focus:ring-2 focus:ring-action-primary-bg/50 text-foreground\"\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 <button\n type=\"button\"\n onClick={() => void loadEvents(cursorStack[currentPageIdx])}\n disabled={isLoadingEvents}\n className=\"flex items-center gap-2 px-4 py-2 text-sm font-medium text-muted-foreground hover:text-foreground hover:bg-muted rounded-lg transition-colors disabled:opacity-50\"\n >\n <RefreshCw size={16} className={isLoadingEvents ? 'animate-spin' : ''} />\n {tr('channel.refresh', 'Refresh')}\n </button>\n <PermissionGuard permission={CHANNEL_PERMISSIONS.CHANNEL_WEBHOOK_EXPORT}>\n <button\n type=\"button\"\n onClick={() => void exportWebhooks()}\n disabled={isExportingWebhooks}\n className=\"flex items-center gap-2 px-4 py-2 text-sm font-medium text-fg border border-border hover:bg-bg-elevated rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed\"\n title={tr('channel.exportCSV', 'Export to CSV')}\n >\n {isExportingWebhooks ? (\n <Loader2 size={16} className=\"animate-spin\" />\n ) : (\n <Download size={16} />\n )}\n {tr('channel.export', 'Export')}\n </button>\n </PermissionGuard>\n </div>\n </div>\n\n {/* Export Error Banner */}\n {exportWebhooksError && (\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\">{exportWebhooksError}</p>\n </div>\n )}\n\n {/* Info Banner */}\n <div className=\"p-4 bg-surface border border-border rounded-lg\">\n <p className=\"text-sm text-muted-foreground\">\n Webhook events show all incoming webhooks received by this channel. Data is retained for\n 7 days.\n </p>\n </div>\n\n {/* Events List */}\n <div className=\"bg-surface border border-border rounded-lg overflow-hidden\">\n <div className=\"overflow-x-auto min-w-full\">\n <table className=\"w-full min-w-[600px]\">\n <thead className=\"bg-muted/50 border-b border-border\">\n <tr>\n <th className=\"px-4 py-3 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider\">\n {tr('channel.status', 'Status')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider\">\n {tr('channel.eventType', 'Event Type')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider\">\n {tr('channel.duplicate', 'Duplicate')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider\">\n {tr('channel.processedAt', 'Processed At')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider\">\n {tr('channel.error', 'Error')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider\">\n {tr('channel.actions', 'Actions')}\n </th>\n </tr>\n </thead>\n <tbody className=\"divide-y divide-border\">\n {events.length === 0 ? (\n <tr>\n <td colSpan={6} className=\"px-4 py-8 text-center text-muted-foreground\">\n {tr('channel.noWebhookEventsFound', 'No webhook events found')}\n </td>\n </tr>\n ) : (\n events.map((event) => {\n const statusConfig = getStatusConfig(event.status as WebhookProcessingStatus);\n const StatusIcon = statusConfig.icon;\n const isExpanded = expandedEvent === event.id;\n return (\n <>\n <tr key={event.id} className=\"hover:bg-muted/30 transition-colors\">\n <td className=\"px-4 py-3\">\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 </td>\n <td className=\"px-4 py-3 text-sm font-mono text-foreground\">\n {event.eventType}\n </td>\n <td className=\"px-4 py-3\">\n {event.isDuplicate ? (\n <span className=\"text-xs text-status-warning-text bg-status-warning-bg-subtle px-2 py-1 rounded\">\n Duplicate\n </span>\n ) : (\n <span className=\"text-xs text-muted-foreground\">No</span>\n )}\n </td>\n <td className=\"px-4 py-3 text-sm text-muted-foreground\">\n {event.processedAt ? new Date(event.processedAt).toLocaleString() : '-'}\n </td>\n <td className=\"px-4 py-3 text-sm text-status-error-text max-w-xs truncate\">\n {event.errorMessage || '-'}\n </td>\n <td className=\"px-4 py-3\">\n <button\n type=\"button\"\n onClick={() => setExpandedEvent(isExpanded ? null : event.id)}\n aria-label={\n isExpanded\n ? tr('channel.hidePayload', 'Hide payload')\n : tr('channel.viewPayload', 'View payload')\n }\n aria-expanded={isExpanded}\n className=\"p-1 text-muted-foreground hover:text-foreground hover:bg-muted rounded transition-colors\"\n >\n {isExpanded ? (\n <EyeOff size={16} aria-hidden=\"true\" />\n ) : (\n <Eye size={16} aria-hidden=\"true\" />\n )}\n </button>\n </td>\n </tr>\n {isExpanded && (\n <tr key={`${event.id}-payload`}>\n <td colSpan={6} className=\"px-4 py-3 bg-muted/30\">\n <div className=\"text-xs\">\n <p className=\"text-muted-foreground mb-1\">\n {tr('channel.payload', 'Payload')}:\n </p>\n <pre className=\"bg-surface p-2 rounded border border-border overflow-auto\">\n {JSON.stringify(event.payload, null, 2)}\n </pre>\n </div>\n </td>\n </tr>\n )}\n </>\n );\n })\n )}\n </tbody>\n </table>\n </div>\n </div>\n\n {/* Pagination footer */}\n <div className=\"flex items-center justify-between\">\n <p className=\"text-sm text-muted-foreground\">\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 || isLoadingEvents}\n className=\"flex items-center gap-1 px-3 py-1.5 text-sm border border-border rounded-lg hover:bg-muted 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 || isLoadingEvents}\n className=\"flex items-center gap-1 px-3 py-1.5 text-sm border border-border rounded-lg hover:bg-muted 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":"WebhookEventsPage.js","names":[],"sources":["../../../../../src/channel/modules/channels/pages/WebhookEventsPage.tsx"],"sourcesContent":["/**\n * Webhook Events Page\n *\n * Displays webhook event history for a specific channel\n */\n\nimport { useState, useEffect, useCallback, useRef } from 'react';\nimport { useParams, useNavigate } from 'react-router-dom';\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 Eye,\n EyeOff,\n Download,\n ChevronLeft,\n ChevronRight,\n} from 'lucide-react';\nimport { useChannel, type WebhookEvent as WebhookEventType } from '../../../hooks/useChannels';\nimport type { WebhookProcessingStatus } from '../../../hooks/useChannels';\nimport { useChannel as useChannelContext } from '../../../providers/ChannelProvider';\nimport { PermissionGuard } from '../../../components/PermissionGuard';\nimport { CHANNEL_PERMISSIONS } from '../../../constants/permissions';\nimport { emitShellEvent } from '../../../utils/shellBridge';\nimport {\n WEBHOOK_RECEIVED_SUBSCRIPTION,\n useChannelSubscription,\n} from '../../../hooks/useChannelSubscription';\nimport { useExportWebhookEvents } from '../hooks/useExport';\n\nconst STATUS_CONFIG: Record<\n WebhookProcessingStatus,\n { label: string; color: string; icon: typeof CheckCircle2 }\n> = {\n PENDING: { label: 'Pending', color: 'text-text-secondary bg-bg-sunken', icon: Clock },\n PROCESSING: {\n label: 'Processing',\n color: 'text-accent-primary bg-accent-primary/10',\n icon: RefreshCw,\n },\n COMPLETED: {\n label: 'Completed',\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 IGNORED: {\n label: 'Ignored',\n color: 'text-status-warning-text bg-status-warning-bg-subtle',\n icon: EyeOff,\n },\n};\n\nexport function WebhookEventsPage() {\n const { channelId } = useParams<{ channelId: string }>();\n const navigate = useNavigate();\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: exportWebhooks,\n isExporting: isExportingWebhooks,\n exportError: exportWebhooksError,\n } = useExportWebhookEvents(organizationId ?? undefined, channelId);\n const [isLoadingEvents, setIsLoadingEvents] = useState(true);\n const [events, setEvents] = useState<WebhookEventType[]>([]);\n const [expandedEvent, setExpandedEvent] = useState<string | null>(null);\n const [limit, setLimit] = useState(25);\n const [total, setTotal] = useState(0);\n const [cursorStack, setCursorStack] = useState<(string | undefined)[]>([undefined]);\n const [currentPageIdx, setCurrentPageIdx] = useState(0);\n\n const { channel, isLoading, error, fetchWebhookEvents } = useChannel(channelId);\n\n const loadEvents = useCallback(\n async (cursor?: string) => {\n if (!channelId) return;\n setIsLoadingEvents(true);\n try {\n const result = await fetchWebhookEvents(limit, cursor);\n setEvents(result.items);\n setTotal(result.total);\n return result.nextCursor;\n } finally {\n setIsLoadingEvents(false);\n }\n },\n [channelId, fetchWebhookEvents, limit]\n );\n\n // Keep refs current after every render so pagination and subscription callbacks\n // always call the latest function/value without those variables in deps.\n const loadEventsRef = useRef(loadEvents);\n const cursorStackRef = useRef(cursorStack);\n const currentPageIdxRef = useRef(currentPageIdx);\n useEffect(() => {\n loadEventsRef.current = loadEvents;\n cursorStackRef.current = cursorStack;\n currentPageIdxRef.current = currentPageIdx;\n });\n // Tracks whether the [limit] effect has already fired on mount so the\n // [currentPageIdx] effect skips its first run (avoiding a double load).\n const isFirstPageRender = useRef(true);\n\n // Reset cursor stack and reload whenever page size changes (also fires on mount).\n useEffect(() => {\n void Promise.resolve().then(() => {\n setCursorStack([undefined]);\n setCurrentPageIdx(0);\n void loadEventsRef.current(undefined);\n });\n }, [limit]);\n\n // Navigate to a specific page; skip the very first render to avoid\n // a duplicate load alongside the [limit] effect above.\n useEffect(() => {\n if (isFirstPageRender.current) {\n isFirstPageRender.current = false;\n return;\n }\n void Promise.resolve().then(() =>\n loadEventsRef.current(cursorStackRef.current[currentPageIdx])\n );\n }, [currentPageIdx]);\n\n const handleNextPage = useCallback(async () => {\n const nextCursor = await loadEvents(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, loadEvents]);\n\n const handlePrevPage = useCallback(() => {\n const prevIdx = currentPageIdx - 1;\n setCurrentPageIdx(prevIdx);\n void loadEvents(cursorStack[prevIdx]);\n }, [cursorStack, currentPageIdx, loadEvents]);\n\n const hasNextPage = events.length === limit;\n const hasPrevPage = currentPageIdx > 0;\n\n // Real-time webhook stream. Subscribes when the gateway exposes\n // `webhookReceived`; otherwise polls every 60s as a graceful fallback.\n useChannelSubscription({\n query: WEBHOOK_RECEIVED_SUBSCRIPTION,\n variables: { channelId },\n operationName: 'WebhookReceived',\n enabled: Boolean(channelId),\n onData: useCallback(() => {\n emitShellEvent('webhook.received', { channelId });\n void loadEventsRef.current(cursorStackRef.current[currentPageIdxRef.current]);\n }, [channelId]),\n pollFn: useCallback(() => {\n void loadEventsRef.current(cursorStackRef.current[currentPageIdxRef.current]);\n }, []),\n pollIntervalMs: 60_000,\n });\n\n const getStatusConfig = (status: WebhookProcessingStatus) => {\n return STATUS_CONFIG[status] || STATUS_CONFIG.PENDING;\n };\n\n // Loading state (only show full-screen for initial channel load)\n if (isLoading) {\n return (\n <div className=\"flex items-center justify-center min-h-screen\">\n <Loader2 size={32} className=\"animate-spin text-accent-primary\" />\n </div>\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_WEBHOOK_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.webhookEvents', 'Webhook Events')}\n </h1>\n <p className=\"text-sm text-text-secondary mt-1\">{channel.name} - Event history</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 <button\n type=\"button\"\n onClick={() => void loadEvents(cursorStack[currentPageIdx])}\n disabled={isLoadingEvents}\n className=\"flex items-center gap-2 px-4 py-2 text-sm font-medium text-text-secondary hover:text-text-primary hover:bg-bg-sunken rounded-lg transition-colors disabled:opacity-50\"\n >\n <RefreshCw size={16} className={isLoadingEvents ? 'animate-spin' : ''} />\n {tr('channel.refresh', 'Refresh')}\n </button>\n <PermissionGuard permission={CHANNEL_PERMISSIONS.CHANNEL_WEBHOOK_EXPORT}>\n <button\n type=\"button\"\n onClick={() => void exportWebhooks()}\n disabled={isExportingWebhooks}\n className=\"flex items-center gap-2 px-4 py-2 text-sm font-medium text-fg border border-border-subtle hover:bg-bg-elevated rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed\"\n title={tr('channel.exportCSV', 'Export to CSV')}\n >\n {isExportingWebhooks ? (\n <Loader2 size={16} className=\"animate-spin\" />\n ) : (\n <Download size={16} />\n )}\n {tr('channel.export', 'Export')}\n </button>\n </PermissionGuard>\n </div>\n </div>\n\n {/* Export Error Banner */}\n {exportWebhooksError && (\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\">{exportWebhooksError}</p>\n </div>\n )}\n\n {/* Info Banner */}\n <div className=\"p-4 bg-surface border border-border-subtle rounded-lg\">\n <p className=\"text-sm text-text-secondary\">\n Webhook events show all incoming webhooks received by this channel. Data is retained for\n 7 days.\n </p>\n </div>\n\n {/* Events List */}\n <div className=\"bg-surface border border-border-subtle rounded-lg overflow-hidden\">\n <div className=\"overflow-x-auto min-w-full\">\n <table className=\"w-full min-w-[600px]\">\n <thead className=\"bg-bg-sunken/50 border-b border-border-subtle\">\n <tr>\n <th className=\"px-4 py-3 text-left text-xs font-medium text-text-secondary uppercase tracking-wider\">\n {tr('channel.status', 'Status')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium text-text-secondary uppercase tracking-wider\">\n {tr('channel.eventType', 'Event Type')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium text-text-secondary uppercase tracking-wider\">\n {tr('channel.duplicate', 'Duplicate')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium text-text-secondary uppercase tracking-wider\">\n {tr('channel.processedAt', 'Processed At')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium text-text-secondary uppercase tracking-wider\">\n {tr('channel.error', 'Error')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium text-text-secondary uppercase tracking-wider\">\n {tr('channel.actions', 'Actions')}\n </th>\n </tr>\n </thead>\n <tbody className=\"divide-y divide-border\">\n {events.length === 0 ? (\n <tr>\n <td colSpan={6} className=\"px-4 py-8 text-center text-text-secondary\">\n {tr('channel.noWebhookEventsFound', 'No webhook events found')}\n </td>\n </tr>\n ) : (\n events.map((event) => {\n const statusConfig = getStatusConfig(event.status as WebhookProcessingStatus);\n const StatusIcon = statusConfig.icon;\n const isExpanded = expandedEvent === event.id;\n return (\n <>\n <tr key={event.id} className=\"hover:bg-bg-sunken/30 transition-colors\">\n <td className=\"px-4 py-3\">\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 </td>\n <td className=\"px-4 py-3 text-sm font-mono text-text-primary\">\n {event.eventType}\n </td>\n <td className=\"px-4 py-3\">\n {event.isDuplicate ? (\n <span className=\"text-xs text-status-warning-text bg-status-warning-bg-subtle px-2 py-1 rounded\">\n Duplicate\n </span>\n ) : (\n <span className=\"text-xs text-text-secondary\">No</span>\n )}\n </td>\n <td className=\"px-4 py-3 text-sm text-text-secondary\">\n {event.processedAt ? new Date(event.processedAt).toLocaleString() : '-'}\n </td>\n <td className=\"px-4 py-3 text-sm text-status-error-text max-w-xs truncate\">\n {event.errorMessage || '-'}\n </td>\n <td className=\"px-4 py-3\">\n <button\n type=\"button\"\n onClick={() => setExpandedEvent(isExpanded ? null : event.id)}\n aria-label={\n isExpanded\n ? tr('channel.hidePayload', 'Hide payload')\n : tr('channel.viewPayload', 'View payload')\n }\n aria-expanded={isExpanded}\n className=\"p-1 text-text-secondary hover:text-text-primary hover:bg-bg-sunken rounded transition-colors\"\n >\n {isExpanded ? (\n <EyeOff size={16} aria-hidden=\"true\" />\n ) : (\n <Eye size={16} aria-hidden=\"true\" />\n )}\n </button>\n </td>\n </tr>\n {isExpanded && (\n <tr key={`${event.id}-payload`}>\n <td colSpan={6} className=\"px-4 py-3 bg-bg-sunken/30\">\n <div className=\"text-xs\">\n <p className=\"text-text-secondary mb-1\">\n {tr('channel.payload', 'Payload')}:\n </p>\n <pre className=\"bg-surface p-2 rounded border border-border-subtle overflow-auto\">\n {JSON.stringify(event.payload, null, 2)}\n </pre>\n </div>\n </td>\n </tr>\n )}\n </>\n );\n })\n )}\n </tbody>\n </table>\n </div>\n </div>\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 || isLoadingEvents}\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 || isLoadingEvents}\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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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@burdenoff/microfe-channel",
3
- "version": "2026.608.1",
3
+ "version": "2026.624.1",
4
4
  "description": "Channel microfrontend for multi-channel communication management",
5
5
  "type": "module",
6
6
  "imports": {