@devicai/ui 0.57.0 → 0.59.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +186 -0
- package/dist/cjs/api/assistantInfo.js.map +1 -1
- package/dist/cjs/api/client.js +17 -1
- package/dist/cjs/api/client.js.map +1 -1
- package/dist/cjs/api/types.js.map +1 -1
- package/dist/cjs/components/AICommandBar/AICommandBar.js +12 -8
- package/dist/cjs/components/AICommandBar/AICommandBar.js.map +1 -1
- package/dist/cjs/components/AICommandBar/useAICommandBar.js +12 -6
- package/dist/cjs/components/AICommandBar/useAICommandBar.js.map +1 -1
- package/dist/cjs/components/AIElementWrapper/AIElementWrapper.js +19 -15
- package/dist/cjs/components/AIElementWrapper/AIElementWrapper.js.map +1 -1
- package/dist/cjs/components/AIElementWrapper/activeWrapperRegistry.js.map +1 -1
- package/dist/cjs/components/AIElementWrapper/useAIElementWrapper.js +12 -6
- package/dist/cjs/components/AIElementWrapper/useAIElementWrapper.js.map +1 -1
- package/dist/cjs/components/AIGenerationButton/AIGenerationButton.js +13 -7
- package/dist/cjs/components/AIGenerationButton/AIGenerationButton.js.map +1 -1
- package/dist/cjs/components/AIGenerationButton/useAIGenerationButton.js +11 -5
- package/dist/cjs/components/AIGenerationButton/useAIGenerationButton.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/ChatDrawer.js +28 -13
- package/dist/cjs/components/ChatDrawer/ChatDrawer.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/ChatInput.js +21 -15
- package/dist/cjs/components/ChatDrawer/ChatInput.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/ChatMessages.js +54 -13
- package/dist/cjs/components/ChatDrawer/ChatMessages.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/CompactionWidget.js +13 -4
- package/dist/cjs/components/ChatDrawer/CompactionWidget.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/ConversationSelector.js +6 -4
- package/dist/cjs/components/ChatDrawer/ConversationSelector.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/ErrorBoundary.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/GuardrailNotice.js +40 -0
- package/dist/cjs/components/ChatDrawer/GuardrailNotice.js.map +1 -0
- package/dist/cjs/components/ChatDrawer/HandoffSubagentWidget.js +3 -1
- package/dist/cjs/components/ChatDrawer/HandoffSubagentWidget.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/LimitBanner.js +19 -9
- package/dist/cjs/components/ChatDrawer/LimitBanner.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/QueueNotice.js +19 -7
- package/dist/cjs/components/ChatDrawer/QueueNotice.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/RecalledMemoriesWidget.js +17 -5
- package/dist/cjs/components/ChatDrawer/RecalledMemoriesWidget.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/ReferenceChip.js +3 -1
- package/dist/cjs/components/ChatDrawer/ReferenceChip.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/ToolTimeline.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/UsageBar.js +23 -18
- package/dist/cjs/components/ChatDrawer/UsageBar.js.map +1 -1
- package/dist/cjs/components/ChatDrawer/pastedText.js.map +1 -1
- package/dist/cjs/components/CoreMemoryModal/CoreMemoryModal.js +20 -9
- package/dist/cjs/components/CoreMemoryModal/CoreMemoryModal.js.map +1 -1
- package/dist/cjs/components/Feedback/FeedbackModal.js +5 -1
- package/dist/cjs/components/Feedback/FeedbackModal.js.map +1 -1
- package/dist/cjs/components/Feedback/MessageActions.js +3 -1
- package/dist/cjs/components/Feedback/MessageActions.js.map +1 -1
- package/dist/cjs/components/IntegrationsModal/ConnectFieldsForm.js +12 -8
- package/dist/cjs/components/IntegrationsModal/ConnectFieldsForm.js.map +1 -1
- package/dist/cjs/components/IntegrationsModal/IntegrationLogo.js.map +1 -1
- package/dist/cjs/components/IntegrationsModal/IntegrationsHint.js +5 -3
- package/dist/cjs/components/IntegrationsModal/IntegrationsHint.js.map +1 -1
- package/dist/cjs/components/IntegrationsModal/IntegrationsLauncher.js +12 -3
- package/dist/cjs/components/IntegrationsModal/IntegrationsLauncher.js.map +1 -1
- package/dist/cjs/components/IntegrationsModal/IntegrationsModal.js.map +1 -1
- package/dist/cjs/components/IntegrationsModal/IntegrationsPanel.js +34 -24
- package/dist/cjs/components/IntegrationsModal/IntegrationsPanel.js.map +1 -1
- package/dist/cjs/components/IntegrationsModal/IntegrationsToggle.js +15 -6
- package/dist/cjs/components/IntegrationsModal/IntegrationsToggle.js.map +1 -1
- package/dist/cjs/components/IntegrationsModal/McpConnectForm.js +15 -7
- package/dist/cjs/components/IntegrationsModal/McpConnectForm.js.map +1 -1
- package/dist/cjs/components/IntegrationsModal/McpServersSection.js +32 -19
- package/dist/cjs/components/IntegrationsModal/McpServersSection.js.map +1 -1
- package/dist/cjs/components/IntegrationsModal/integrationChoice.js.map +1 -1
- package/dist/cjs/components/IntegrationsModal/useIntegrations.js +3 -1
- package/dist/cjs/components/IntegrationsModal/useIntegrations.js.map +1 -1
- package/dist/cjs/components/IntegrationsModal/useTenantMcp.js +3 -1
- package/dist/cjs/components/IntegrationsModal/useTenantMcp.js.map +1 -1
- package/dist/cjs/components/ThreadStateTag/ThreadStateTag.js +63 -40
- package/dist/cjs/components/ThreadStateTag/ThreadStateTag.js.map +1 -1
- package/dist/cjs/components/theme.js.map +1 -1
- package/dist/cjs/hooks/useDevicChat.js +21 -7
- package/dist/cjs/hooks/useDevicChat.js.map +1 -1
- package/dist/cjs/hooks/useModelInterface.js.map +1 -1
- package/dist/cjs/hooks/usePolling.js +117 -7
- package/dist/cjs/hooks/usePolling.js.map +1 -1
- package/dist/cjs/hooks/useSpeechRecording.js +8 -4
- package/dist/cjs/hooks/useSpeechRecording.js.map +1 -1
- package/dist/cjs/i18n/translate.js +48 -0
- package/dist/cjs/i18n/translate.js.map +1 -0
- package/dist/cjs/i18n/useTranslations.js +57 -0
- package/dist/cjs/i18n/useTranslations.js.map +1 -0
- package/dist/cjs/index.js +11 -0
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/provider/DevicContext.js.map +1 -1
- package/dist/cjs/provider/DevicProvider.js +5 -1
- package/dist/cjs/provider/DevicProvider.js.map +1 -1
- package/dist/cjs/provider/sharedSession.js.map +1 -1
- package/dist/cjs/styles.css +1 -1
- package/dist/cjs/utils/avatar.js.map +1 -1
- package/dist/cjs/utils/consumeChatStream.js +44 -0
- package/dist/cjs/utils/consumeChatStream.js.map +1 -0
- package/dist/cjs/utils/index.js.map +1 -1
- package/dist/cjs/utils/logger.js.map +1 -1
- package/dist/cjs/utils/toolGroups.js.map +1 -1
- package/dist/esm/api/assistantInfo.js.map +1 -1
- package/dist/esm/api/client.d.ts +5 -1
- package/dist/esm/api/client.js +17 -1
- package/dist/esm/api/client.js.map +1 -1
- package/dist/esm/api/types.d.ts +12 -1
- package/dist/esm/api/types.js.map +1 -1
- package/dist/esm/components/AICommandBar/AICommandBar.js +13 -9
- package/dist/esm/components/AICommandBar/AICommandBar.js.map +1 -1
- package/dist/esm/components/AICommandBar/AICommandBar.types.d.ts +16 -0
- package/dist/esm/components/AICommandBar/useAICommandBar.d.ts +2 -0
- package/dist/esm/components/AICommandBar/useAICommandBar.js +13 -7
- package/dist/esm/components/AICommandBar/useAICommandBar.js.map +1 -1
- package/dist/esm/components/AIElementWrapper/AIElementWrapper.js +19 -15
- package/dist/esm/components/AIElementWrapper/AIElementWrapper.js.map +1 -1
- package/dist/esm/components/AIElementWrapper/AIElementWrapper.types.d.ts +16 -0
- package/dist/esm/components/AIElementWrapper/activeWrapperRegistry.js.map +1 -1
- package/dist/esm/components/AIElementWrapper/useAIElementWrapper.d.ts +2 -0
- package/dist/esm/components/AIElementWrapper/useAIElementWrapper.js +13 -7
- package/dist/esm/components/AIElementWrapper/useAIElementWrapper.js.map +1 -1
- package/dist/esm/components/AIGenerationButton/AIGenerationButton.js +14 -8
- package/dist/esm/components/AIGenerationButton/AIGenerationButton.js.map +1 -1
- package/dist/esm/components/AIGenerationButton/AIGenerationButton.types.d.ts +16 -0
- package/dist/esm/components/AIGenerationButton/useAIGenerationButton.d.ts +2 -0
- package/dist/esm/components/AIGenerationButton/useAIGenerationButton.js +12 -6
- package/dist/esm/components/AIGenerationButton/useAIGenerationButton.js.map +1 -1
- package/dist/esm/components/ChatDrawer/ChatDrawer.js +29 -14
- package/dist/esm/components/ChatDrawer/ChatDrawer.js.map +1 -1
- package/dist/esm/components/ChatDrawer/ChatDrawer.types.d.ts +41 -0
- package/dist/esm/components/ChatDrawer/ChatInput.js +21 -15
- package/dist/esm/components/ChatDrawer/ChatInput.js.map +1 -1
- package/dist/esm/components/ChatDrawer/ChatMessages.d.ts +1 -1
- package/dist/esm/components/ChatDrawer/ChatMessages.js +54 -13
- package/dist/esm/components/ChatDrawer/ChatMessages.js.map +1 -1
- package/dist/esm/components/ChatDrawer/CompactionWidget.js +13 -4
- package/dist/esm/components/ChatDrawer/CompactionWidget.js.map +1 -1
- package/dist/esm/components/ChatDrawer/ConversationSelector.js +6 -4
- package/dist/esm/components/ChatDrawer/ConversationSelector.js.map +1 -1
- package/dist/esm/components/ChatDrawer/ErrorBoundary.js.map +1 -1
- package/dist/esm/components/ChatDrawer/GuardrailNotice.d.ts +36 -0
- package/dist/esm/components/ChatDrawer/GuardrailNotice.js +38 -0
- package/dist/esm/components/ChatDrawer/GuardrailNotice.js.map +1 -0
- package/dist/esm/components/ChatDrawer/HandoffSubagentWidget.js +3 -1
- package/dist/esm/components/ChatDrawer/HandoffSubagentWidget.js.map +1 -1
- package/dist/esm/components/ChatDrawer/LimitBanner.js +19 -9
- package/dist/esm/components/ChatDrawer/LimitBanner.js.map +1 -1
- package/dist/esm/components/ChatDrawer/QueueNotice.js +19 -7
- package/dist/esm/components/ChatDrawer/QueueNotice.js.map +1 -1
- package/dist/esm/components/ChatDrawer/RecalledMemoriesWidget.js +17 -5
- package/dist/esm/components/ChatDrawer/RecalledMemoriesWidget.js.map +1 -1
- package/dist/esm/components/ChatDrawer/ReferenceChip.js +3 -1
- package/dist/esm/components/ChatDrawer/ReferenceChip.js.map +1 -1
- package/dist/esm/components/ChatDrawer/ToolTimeline.js.map +1 -1
- package/dist/esm/components/ChatDrawer/UsageBar.js +23 -18
- package/dist/esm/components/ChatDrawer/UsageBar.js.map +1 -1
- package/dist/esm/components/ChatDrawer/index.d.ts +2 -0
- package/dist/esm/components/ChatDrawer/pastedText.js.map +1 -1
- package/dist/esm/components/CoreMemoryModal/CoreMemoryModal.js +20 -9
- package/dist/esm/components/CoreMemoryModal/CoreMemoryModal.js.map +1 -1
- package/dist/esm/components/Feedback/FeedbackModal.js +5 -1
- package/dist/esm/components/Feedback/FeedbackModal.js.map +1 -1
- package/dist/esm/components/Feedback/MessageActions.js +3 -1
- package/dist/esm/components/Feedback/MessageActions.js.map +1 -1
- package/dist/esm/components/IntegrationsModal/ConnectFieldsForm.js +12 -8
- package/dist/esm/components/IntegrationsModal/ConnectFieldsForm.js.map +1 -1
- package/dist/esm/components/IntegrationsModal/IntegrationLogo.js.map +1 -1
- package/dist/esm/components/IntegrationsModal/IntegrationsHint.js +5 -3
- package/dist/esm/components/IntegrationsModal/IntegrationsHint.js.map +1 -1
- package/dist/esm/components/IntegrationsModal/IntegrationsLauncher.js +12 -3
- package/dist/esm/components/IntegrationsModal/IntegrationsLauncher.js.map +1 -1
- package/dist/esm/components/IntegrationsModal/IntegrationsModal.js.map +1 -1
- package/dist/esm/components/IntegrationsModal/IntegrationsPanel.d.ts +1 -1
- package/dist/esm/components/IntegrationsModal/IntegrationsPanel.js +34 -24
- package/dist/esm/components/IntegrationsModal/IntegrationsPanel.js.map +1 -1
- package/dist/esm/components/IntegrationsModal/IntegrationsToggle.d.ts +1 -1
- package/dist/esm/components/IntegrationsModal/IntegrationsToggle.js +15 -6
- package/dist/esm/components/IntegrationsModal/IntegrationsToggle.js.map +1 -1
- package/dist/esm/components/IntegrationsModal/McpConnectForm.js +15 -7
- package/dist/esm/components/IntegrationsModal/McpConnectForm.js.map +1 -1
- package/dist/esm/components/IntegrationsModal/McpServersSection.js +32 -19
- package/dist/esm/components/IntegrationsModal/McpServersSection.js.map +1 -1
- package/dist/esm/components/IntegrationsModal/integrationChoice.js.map +1 -1
- package/dist/esm/components/IntegrationsModal/useIntegrations.js +3 -1
- package/dist/esm/components/IntegrationsModal/useIntegrations.js.map +1 -1
- package/dist/esm/components/IntegrationsModal/useTenantMcp.js +3 -1
- package/dist/esm/components/IntegrationsModal/useTenantMcp.js.map +1 -1
- package/dist/esm/components/ThreadStateTag/ThreadStateTag.js +63 -40
- package/dist/esm/components/ThreadStateTag/ThreadStateTag.js.map +1 -1
- package/dist/esm/components/theme.js.map +1 -1
- package/dist/esm/hooks/index.d.ts +1 -1
- package/dist/esm/hooks/useDevicChat.d.ts +6 -0
- package/dist/esm/hooks/useDevicChat.js +23 -9
- package/dist/esm/hooks/useDevicChat.js.map +1 -1
- package/dist/esm/hooks/useModelInterface.js.map +1 -1
- package/dist/esm/hooks/usePolling.d.ts +35 -0
- package/dist/esm/hooks/usePolling.js +114 -8
- package/dist/esm/hooks/usePolling.js.map +1 -1
- package/dist/esm/hooks/useSpeechRecording.js +8 -4
- package/dist/esm/hooks/useSpeechRecording.js.map +1 -1
- package/dist/esm/i18n/index.d.ts +4 -0
- package/dist/esm/i18n/translate.d.ts +23 -0
- package/dist/esm/i18n/translate.js +43 -0
- package/dist/esm/i18n/translate.js.map +1 -0
- package/dist/esm/i18n/types.d.ts +27 -0
- package/dist/esm/i18n/useTranslations.d.ts +32 -0
- package/dist/esm/i18n/useTranslations.js +53 -0
- package/dist/esm/i18n/useTranslations.js.map +1 -0
- package/dist/esm/index.d.ts +4 -2
- package/dist/esm/index.js +3 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/provider/DevicContext.js.map +1 -1
- package/dist/esm/provider/DevicProvider.d.ts +1 -1
- package/dist/esm/provider/DevicProvider.js +5 -1
- package/dist/esm/provider/DevicProvider.js.map +1 -1
- package/dist/esm/provider/sharedSession.js.map +1 -1
- package/dist/esm/provider/types.d.ts +51 -0
- package/dist/esm/styles.css +1 -1
- package/dist/esm/utils/avatar.js.map +1 -1
- package/dist/esm/utils/consumeChatStream.d.ts +6 -0
- package/dist/esm/utils/consumeChatStream.js +42 -0
- package/dist/esm/utils/consumeChatStream.js.map +1 -0
- package/dist/esm/utils/index.js.map +1 -1
- package/dist/esm/utils/logger.js.map +1 -1
- package/dist/esm/utils/toolGroups.js.map +1 -1
- package/package.json +3 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CoreMemoryModal.js","sources":["../../../../../src/components/CoreMemoryModal/CoreMemoryModal.tsx"],"sourcesContent":["import {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type JSX,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { DevicApiClient } from \"../../api/client\";\nimport type { CoreMemoryEntry, CoreMemoryLimits } from \"../../api/types\";\nimport { useOptionalDevicContext } from \"../../provider\";\nimport { themeVars, type DevicTheme } from \"../theme\";\nimport \"./CoreMemoryModal.css\";\n\n/** Canonical sections of the core tier, in display order. */\nconst SECTIONS = [\"persona\", \"instructions\", \"decisions\", \"profile\"] as const;\n\n/**\n * Every piece of text the modal shows, so a host can render it in its own\n * language. Any subset can be given; the rest keeps the English default.\n */\nexport interface CoreMemoryLabels {\n /** Modal title; the drawer also uses it for its brain button tooltip. */\n title: string;\n /** Accessible name of the close button. */\n close: string;\n loading: string;\n /** Shown when the assistant has no core memory tier enabled. */\n disabled: string;\n /** Shown when the bucket holds no entries yet. */\n empty: string;\n /** Tooltip of the pin mark. */\n pinned: string;\n edit: string;\n remove: string;\n save: string;\n cancel: string;\n /** Confirms the composer. */\n add: string;\n /** Opens the composer. */\n addMemory: string;\n /** Composer placeholder. */\n placeholder: string;\n /** Footer; `{count}`, `{max}` and `{chars}` are replaced. */\n footer: string;\n /** Display names of the sections, by section key. */\n sections: Record<string, string>;\n}\n\nexport const DEFAULT_CORE_MEMORY_LABELS: CoreMemoryLabels = {\n title: \"Assistant memory\",\n close: \"Close\",\n loading: \"Loading memory…\",\n disabled: \"Memory is not enabled for this assistant.\",\n empty:\n \"Nothing remembered yet. What the assistant learns and is told to keep will appear here.\",\n pinned: \"Pinned: always kept, never changed by the assistant\",\n edit: \"Edit\",\n remove: \"Remove\",\n save: \"Save\",\n cancel: \"Cancel\",\n add: \"Add\",\n addMemory: \"+ Add memory\",\n placeholder: \"Something the assistant should always remember…\",\n footer: \"{count}/{max} entries · up to {chars} characters each\",\n sections: {\n persona: \"persona\",\n instructions: \"instructions\",\n decisions: \"decisions\",\n profile: \"profile\",\n },\n};\n\nconst fillTemplate = (template: string, values: Record<string, string>) =>\n template.replace(/\\{(\\w+)\\}/g, (_, key: string) => values[key] ?? \"\");\n\nexport interface CoreMemoryModalProps {\n /** Whether the modal is visible. */\n isOpen: boolean;\n onClose: () => void;\n /** Assistant whose memory bucket is shown. */\n assistantId: string;\n /** Tenant of the end user (falls back to the provider's tenantId). */\n tenantId?: string;\n /** Subtenant of the end user (falls back to the provider's subtenantId). */\n subtenantId?: string;\n /** API key override (falls back to the provider's). */\n apiKey?: string;\n /** Base URL override (falls back to the provider's). */\n baseUrl?: string;\n /**\n * Let the user add, edit and remove entries. Set false for a read-only\n * view of what the assistant remembers.\n * @default true\n */\n editable?: boolean;\n /**\n * Modal title. @default \"Assistant memory\"\n * @deprecated Prefer `labels.title`; kept so existing hosts keep working.\n */\n title?: string;\n /** Texts of the modal, for a host that renders it in its own language. */\n labels?: Partial<CoreMemoryLabels>;\n /**\n * Colours and font. Same names as the drawer's style options, and the drawer\n * passes its own down — a dialog opening in the default light palette over a\n * themed application is the one thing this must not do.\n */\n theme?: DevicTheme;\n}\n\nfunction BrainIcon(): JSX.Element {\n return (\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n >\n <path d=\"M9.5 2a2.5 2.5 0 0 0-2.45 2A3.5 3.5 0 0 0 4.6 8.6 3.5 3.5 0 0 0 3 11.5c0 1.1.5 2.08 1.29 2.73A3.5 3.5 0 0 0 7 20a3 3 0 0 0 5-2.24V4.5A2.5 2.5 0 0 0 9.5 2Z\" />\n <path d=\"M14.5 2a2.5 2.5 0 0 1 2.45 2 3.5 3.5 0 0 1 2.45 4.6A3.5 3.5 0 0 1 21 11.5a3.49 3.49 0 0 1-1.29 2.73A3.5 3.5 0 0 1 17 20a3 3 0 0 1-5-2.24V4.5A2.5 2.5 0 0 1 14.5 2Z\" />\n </svg>\n );\n}\n\nfunction PinIcon(): JSX.Element {\n return (\n <svg\n width=\"11\"\n height=\"11\"\n viewBox=\"0 0 24 24\"\n fill=\"currentColor\"\n stroke=\"none\"\n aria-hidden=\"true\"\n >\n <path d=\"M16 3a1 1 0 0 1 .97 1.243l-1.2 4.8 3.937 3.938A1 1 0 0 1 19 14.688V15a1 1 0 0 1-1 1h-5v6l-1 1-1-1v-6H6a1 1 0 0 1-1-1v-.312a1 1 0 0 1 .293-.707L9.23 9.043l-1.2-4.8A1 1 0 0 1 9 3h7Z\" />\n </svg>\n );\n}\n\n/**\n * Modal showing — and, when `editable`, managing — the core memory of an\n * assistant for a tenant/subtenant combination: the standing entries\n * (persona, instructions, decisions, profile) injected into every prompt of\n * the bucket the assistant resolves there. Lets the end user see and control\n * what the assistant permanently remembers about them.\n *\n * Backed by the public memory API (`/api/v1/memory/assistants/:id/core`);\n * the API key needs that endpoint allowed.\n */\nexport function CoreMemoryModal({\n isOpen,\n onClose,\n assistantId,\n tenantId,\n subtenantId,\n apiKey,\n baseUrl,\n editable = true,\n title,\n labels,\n theme,\n}: CoreMemoryModalProps): JSX.Element | null {\n const l = useMemo<CoreMemoryLabels>(\n () => ({\n ...DEFAULT_CORE_MEMORY_LABELS,\n ...labels,\n title: labels?.title ?? title ?? DEFAULT_CORE_MEMORY_LABELS.title,\n sections: {\n ...DEFAULT_CORE_MEMORY_LABELS.sections,\n ...labels?.sections,\n },\n }),\n [labels, title]\n );\n const context = useOptionalDevicContext();\n const resolvedBaseUrl = baseUrl || context?.baseUrl || \"https://api.devic.ai\";\n const resolvedTenantId = tenantId || context?.tenantId;\n const resolvedSubtenantId = subtenantId || context?.subtenantId;\n\n const resolvedApiKey = apiKey || context?.apiKey;\n const resolvedTenantSession = context?.getTenantSession;\n const onSessionExpired = context?.onSessionExpired;\n\n const client = useMemo(\n () =>\n resolvedApiKey || resolvedTenantSession\n ? new DevicApiClient({\n apiKey: resolvedApiKey,\n baseUrl: resolvedBaseUrl,\n getTenantSession: resolvedTenantSession,\n onSessionExpired,\n })\n : null,\n [resolvedApiKey, resolvedTenantSession, resolvedBaseUrl]\n );\n\n const [loading, setLoading] = useState(false);\n const [enabled, setEnabled] = useState(true);\n const [entries, setEntries] = useState<CoreMemoryEntry[]>([]);\n const [limits, setLimits] = useState<CoreMemoryLimits | null>(null);\n const [error, setError] = useState<string | null>(null);\n const [saving, setSaving] = useState(false);\n\n // Inline composer / editor state\n const [composerOpen, setComposerOpen] = useState(false);\n const [composerSection, setComposerSection] = useState<string>(\"profile\");\n const [composerText, setComposerText] = useState(\"\");\n const [editingId, setEditingId] = useState<number | null>(null);\n const [editingText, setEditingText] = useState(\"\");\n\n const scopeOptions = useMemo(\n () => ({\n tenantId: resolvedTenantId || undefined,\n subtenantId: resolvedSubtenantId || undefined,\n }),\n [resolvedTenantId, resolvedSubtenantId]\n );\n\n const refresh = useCallback(async () => {\n if (!client) {\n setError(\"API key not configured\");\n return;\n }\n setLoading(true);\n setError(null);\n try {\n const list = await client.getCoreMemory(assistantId, scopeOptions);\n setEnabled(list.enabled);\n setEntries(list.entries);\n setLimits(list.limits ?? null);\n } catch (err) {\n setError(err instanceof Error ? err.message : String(err));\n } finally {\n setLoading(false);\n }\n }, [client, assistantId, scopeOptions]);\n\n // Fetch on every open (memory may have changed since the last look).\n const wasOpenRef = useRef(false);\n useEffect(() => {\n if (isOpen && !wasOpenRef.current) {\n setComposerOpen(false);\n setComposerText(\"\");\n setEditingId(null);\n void refresh();\n }\n wasOpenRef.current = isOpen;\n }, [isOpen, refresh]);\n\n // Escape closes\n useEffect(() => {\n if (!isOpen) return;\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") onClose();\n };\n document.addEventListener(\"keydown\", onKey);\n return () => document.removeEventListener(\"keydown\", onKey);\n }, [isOpen, onClose]);\n\n const runWrite = useCallback(\n async (write: () => Promise<unknown>) => {\n setSaving(true);\n setError(null);\n try {\n await write();\n await refresh();\n return true;\n } catch (err) {\n setError(err instanceof Error ? err.message : String(err));\n return false;\n } finally {\n setSaving(false);\n }\n },\n [refresh]\n );\n\n const handleAdd = async () => {\n if (!client || !composerText.trim()) return;\n const ok = await runWrite(() =>\n client.addCoreMemoryEntry(\n assistantId,\n { content: composerText.trim(), section: composerSection },\n scopeOptions\n )\n );\n if (ok) {\n setComposerOpen(false);\n setComposerText(\"\");\n }\n };\n\n const handleSaveEdit = async (entry: CoreMemoryEntry) => {\n if (!client || !editingText.trim()) return;\n const ok = await runWrite(() =>\n client.updateCoreMemoryEntry(\n assistantId,\n entry.id,\n { content: editingText.trim() },\n scopeOptions\n )\n );\n if (ok) setEditingId(null);\n };\n\n const handleRemove = async (entry: CoreMemoryEntry) => {\n if (!client) return;\n await runWrite(() =>\n client.deleteCoreMemoryEntry(assistantId, entry.id, scopeOptions)\n );\n };\n\n if (!isOpen) return null;\n\n // Group entries by section, canonical sections first.\n const sections: Array<{ name: string; entries: CoreMemoryEntry[] }> = [];\n const bySection = new Map<string, CoreMemoryEntry[]>();\n for (const entry of entries) {\n const list = bySection.get(entry.section);\n if (list) list.push(entry);\n else bySection.set(entry.section, [entry]);\n }\n for (const name of SECTIONS) {\n const list = bySection.get(name);\n if (list) {\n sections.push({ name, entries: list });\n bySection.delete(name);\n }\n }\n for (const [name, list] of bySection) sections.push({ name, entries: list });\n\n return createPortal(\n // The variables go on the overlay: a portal inherits nothing from the\n // drawer that opened it, so without this the dialog ignores the theme.\n <div\n className=\"devic-cm-overlay\"\n style={themeVars(theme)}\n onClick={onClose}\n >\n <div\n className=\"devic-cm-modal\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={l.title}\n onClick={(e) => e.stopPropagation()}\n >\n <div className=\"devic-cm-header\">\n <h3 className=\"devic-cm-title\">\n <BrainIcon />\n {l.title}\n </h3>\n <button\n className=\"devic-cm-close\"\n onClick={onClose}\n type=\"button\"\n aria-label={l.close}\n >\n ×\n </button>\n </div>\n\n <div className=\"devic-cm-body\">\n {error && <div className=\"devic-cm-error\">{error}</div>}\n\n {loading ? (\n <div className=\"devic-cm-loading\">{l.loading}</div>\n ) : !enabled ? (\n <div className=\"devic-cm-empty\">{l.disabled}</div>\n ) : entries.length === 0 && !composerOpen ? (\n <div className=\"devic-cm-empty\">{l.empty}</div>\n ) : (\n sections.map((section) => (\n <div key={section.name} className=\"devic-cm-section\">\n <div className=\"devic-cm-section-title\">\n {l.sections[section.name] ?? section.name}\n </div>\n {section.entries.map((entry) => (\n <div key={entry.id} className=\"devic-cm-entry\">\n {editingId === entry.id ? (\n <div className=\"devic-cm-editor\">\n <textarea\n className=\"devic-cm-textarea\"\n value={editingText}\n maxLength={limits?.maxEntryChars || undefined}\n onChange={(e) => setEditingText(e.target.value)}\n disabled={saving}\n autoFocus\n />\n <div className=\"devic-cm-editor-actions\">\n <button\n type=\"button\"\n className=\"devic-cm-btn devic-cm-btn-primary\"\n onClick={() => handleSaveEdit(entry)}\n disabled={saving || !editingText.trim()}\n >\n {l.save}\n </button>\n <button\n type=\"button\"\n className=\"devic-cm-btn\"\n onClick={() => setEditingId(null)}\n disabled={saving}\n >\n {l.cancel}\n </button>\n </div>\n </div>\n ) : (\n <>\n <div className=\"devic-cm-entry-content\">\n {entry.pinned && (\n <span\n className=\"devic-cm-pin\"\n title={l.pinned}\n >\n <PinIcon />\n </span>\n )}\n <span>{entry.content}</span>\n </div>\n {editable && (\n <div className=\"devic-cm-entry-actions\">\n <button\n type=\"button\"\n className=\"devic-cm-btn devic-cm-btn-small\"\n onClick={() => {\n setEditingId(entry.id);\n setEditingText(entry.content);\n }}\n disabled={saving}\n >\n {l.edit}\n </button>\n <button\n type=\"button\"\n className=\"devic-cm-btn devic-cm-btn-small devic-cm-btn-danger\"\n onClick={() => handleRemove(entry)}\n disabled={saving}\n >\n {l.remove}\n </button>\n </div>\n )}\n </>\n )}\n </div>\n ))}\n </div>\n ))\n )}\n\n {editable && enabled && !loading && (\n <div className=\"devic-cm-composer\">\n {composerOpen ? (\n <>\n <div className=\"devic-cm-composer-row\">\n <select\n className=\"devic-cm-select\"\n value={composerSection}\n onChange={(e) => setComposerSection(e.target.value)}\n disabled={saving}\n >\n {SECTIONS.map((s) => (\n <option key={s} value={s}>\n {l.sections[s] ?? s}\n </option>\n ))}\n </select>\n </div>\n <textarea\n className=\"devic-cm-textarea\"\n placeholder={l.placeholder}\n value={composerText}\n maxLength={limits?.maxEntryChars || undefined}\n onChange={(e) => setComposerText(e.target.value)}\n disabled={saving}\n autoFocus\n />\n <div className=\"devic-cm-editor-actions\">\n <button\n type=\"button\"\n className=\"devic-cm-btn devic-cm-btn-primary\"\n onClick={handleAdd}\n disabled={saving || !composerText.trim()}\n >\n {l.add}\n </button>\n <button\n type=\"button\"\n className=\"devic-cm-btn\"\n onClick={() => {\n setComposerOpen(false);\n setComposerText(\"\");\n }}\n disabled={saving}\n >\n {l.cancel}\n </button>\n </div>\n </>\n ) : (\n <button\n type=\"button\"\n className=\"devic-cm-btn\"\n onClick={() => setComposerOpen(true)}\n disabled={saving}\n >\n {l.addMemory}\n </button>\n )}\n </div>\n )}\n </div>\n\n {limits && enabled && (\n <div className=\"devic-cm-footer\">\n {fillTemplate(l.footer, {\n count: String(entries.length),\n max: String(limits.maxEntries),\n chars: String(limits.maxEntryChars),\n })}\n </div>\n )}\n </div>\n </div>,\n document.body\n );\n}\n\nexport default CoreMemoryModal;\n"],"names":["_jsxs","_jsx","theme","useMemo","useOptionalDevicContext","client","DevicApiClient","useState","useCallback","useRef","useEffect","createPortal","themeVars","_Fragment"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"CoreMemoryModal.js","sources":["../../../../../src/components/CoreMemoryModal/CoreMemoryModal.tsx"],"sourcesContent":["import {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type JSX,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { DevicApiClient } from \"../../api/client\";\nimport type { CoreMemoryEntry, CoreMemoryLimits } from \"../../api/types\";\nimport { useOptionalDevicContext } from \"../../provider\";\nimport { themeVars, type DevicTheme } from \"../theme\";\nimport { useTranslations } from \"../../i18n\";\nimport \"./CoreMemoryModal.css\";\n\n/** Canonical sections of the core tier, in display order. */\nconst SECTIONS = [\"persona\", \"instructions\", \"decisions\", \"profile\"] as const;\n\n/**\n * Every piece of text the modal shows, so a host can render it in its own\n * language. Any subset can be given; the rest keeps the English default.\n */\nexport interface CoreMemoryLabels {\n /** Modal title; the drawer also uses it for its brain button tooltip. */\n title: string;\n /** Accessible name of the close button. */\n close: string;\n loading: string;\n /** Shown when the assistant has no core memory tier enabled. */\n disabled: string;\n /** Shown when the bucket holds no entries yet. */\n empty: string;\n /** Tooltip of the pin mark. */\n pinned: string;\n edit: string;\n remove: string;\n save: string;\n cancel: string;\n /** Confirms the composer. */\n add: string;\n /** Opens the composer. */\n addMemory: string;\n /** Composer placeholder. */\n placeholder: string;\n /** Footer; `{count}`, `{max}` and `{chars}` are replaced. */\n footer: string;\n /** Display names of the sections, by section key. */\n sections: Record<string, string>;\n}\n\nexport const DEFAULT_CORE_MEMORY_LABELS: CoreMemoryLabels = {\n title: \"Assistant memory\",\n close: \"Close\",\n loading: \"Loading memory…\",\n disabled: \"Memory is not enabled for this assistant.\",\n empty:\n \"Nothing remembered yet. What the assistant learns and is told to keep will appear here.\",\n pinned: \"Pinned: always kept, never changed by the assistant\",\n edit: \"Edit\",\n remove: \"Remove\",\n save: \"Save\",\n cancel: \"Cancel\",\n add: \"Add\",\n addMemory: \"+ Add memory\",\n placeholder: \"Something the assistant should always remember…\",\n footer: \"{count}/{max} entries · up to {chars} characters each\",\n sections: {\n persona: \"persona\",\n instructions: \"instructions\",\n decisions: \"decisions\",\n profile: \"profile\",\n },\n};\n\nconst fillTemplate = (template: string, values: Record<string, string>) =>\n template.replace(/\\{(\\w+)\\}/g, (_, key: string) => values[key] ?? \"\");\n\nexport interface CoreMemoryModalProps {\n /** Whether the modal is visible. */\n isOpen: boolean;\n onClose: () => void;\n /** Assistant whose memory bucket is shown. */\n assistantId: string;\n /** Tenant of the end user (falls back to the provider's tenantId). */\n tenantId?: string;\n /** Subtenant of the end user (falls back to the provider's subtenantId). */\n subtenantId?: string;\n /** API key override (falls back to the provider's). */\n apiKey?: string;\n /** Base URL override (falls back to the provider's). */\n baseUrl?: string;\n /**\n * Let the user add, edit and remove entries. Set false for a read-only\n * view of what the assistant remembers.\n * @default true\n */\n editable?: boolean;\n /**\n * Modal title. @default \"Assistant memory\"\n * @deprecated Prefer `labels.title`; kept so existing hosts keep working.\n */\n title?: string;\n /** Texts of the modal, for a host that renders it in its own language. */\n labels?: Partial<CoreMemoryLabels>;\n /**\n * Colours and font. Same names as the drawer's style options, and the drawer\n * passes its own down — a dialog opening in the default light palette over a\n * themed application is the one thing this must not do.\n */\n theme?: DevicTheme;\n}\n\nfunction BrainIcon(): JSX.Element {\n return (\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n >\n <path d=\"M9.5 2a2.5 2.5 0 0 0-2.45 2A3.5 3.5 0 0 0 4.6 8.6 3.5 3.5 0 0 0 3 11.5c0 1.1.5 2.08 1.29 2.73A3.5 3.5 0 0 0 7 20a3 3 0 0 0 5-2.24V4.5A2.5 2.5 0 0 0 9.5 2Z\" />\n <path d=\"M14.5 2a2.5 2.5 0 0 1 2.45 2 3.5 3.5 0 0 1 2.45 4.6A3.5 3.5 0 0 1 21 11.5a3.49 3.49 0 0 1-1.29 2.73A3.5 3.5 0 0 1 17 20a3 3 0 0 1-5-2.24V4.5A2.5 2.5 0 0 1 14.5 2Z\" />\n </svg>\n );\n}\n\nfunction PinIcon(): JSX.Element {\n return (\n <svg\n width=\"11\"\n height=\"11\"\n viewBox=\"0 0 24 24\"\n fill=\"currentColor\"\n stroke=\"none\"\n aria-hidden=\"true\"\n >\n <path d=\"M16 3a1 1 0 0 1 .97 1.243l-1.2 4.8 3.937 3.938A1 1 0 0 1 19 14.688V15a1 1 0 0 1-1 1h-5v6l-1 1-1-1v-6H6a1 1 0 0 1-1-1v-.312a1 1 0 0 1 .293-.707L9.23 9.043l-1.2-4.8A1 1 0 0 1 9 3h7Z\" />\n </svg>\n );\n}\n\n/**\n * Modal showing — and, when `editable`, managing — the core memory of an\n * assistant for a tenant/subtenant combination: the standing entries\n * (persona, instructions, decisions, profile) injected into every prompt of\n * the bucket the assistant resolves there. Lets the end user see and control\n * what the assistant permanently remembers about them.\n *\n * Backed by the public memory API (`/api/v1/memory/assistants/:id/core`);\n * the API key needs that endpoint allowed.\n */\nexport function CoreMemoryModal({\n isOpen,\n onClose,\n assistantId,\n tenantId,\n subtenantId,\n apiKey,\n baseUrl,\n editable = true,\n title,\n labels,\n theme,\n}: CoreMemoryModalProps): JSX.Element | null {\n const t = useTranslations();\n // Three layers, narrowest first: the `labels` this host passed, then the\n // dictionary, then English. `labels` stays authoritative — a host that\n // already spells this dialog out itself must not have it changed underneath\n // by a page-wide dictionary.\n const l = useMemo<CoreMemoryLabels>(() => {\n const translated = Object.fromEntries(\n Object.entries(DEFAULT_CORE_MEMORY_LABELS)\n .filter(([, value]) => typeof value === \"string\")\n .map(([key, value]) => [key, t(value as string)])\n ) as Omit<CoreMemoryLabels, \"sections\">;\n return {\n ...translated,\n ...labels,\n title: labels?.title ?? title ?? t(DEFAULT_CORE_MEMORY_LABELS.title),\n sections: {\n ...Object.fromEntries(\n Object.entries(DEFAULT_CORE_MEMORY_LABELS.sections).map(\n ([key, value]) => [key, t(value)]\n )\n ),\n ...labels?.sections,\n },\n };\n }, [labels, title, t]);\n const context = useOptionalDevicContext();\n const resolvedBaseUrl = baseUrl || context?.baseUrl || \"https://api.devic.ai\";\n const resolvedTenantId = tenantId || context?.tenantId;\n const resolvedSubtenantId = subtenantId || context?.subtenantId;\n\n const resolvedApiKey = apiKey || context?.apiKey;\n const resolvedTenantSession = context?.getTenantSession;\n const onSessionExpired = context?.onSessionExpired;\n\n const client = useMemo(\n () =>\n resolvedApiKey || resolvedTenantSession\n ? new DevicApiClient({\n apiKey: resolvedApiKey,\n baseUrl: resolvedBaseUrl,\n getTenantSession: resolvedTenantSession,\n onSessionExpired,\n })\n : null,\n [resolvedApiKey, resolvedTenantSession, resolvedBaseUrl]\n );\n\n const [loading, setLoading] = useState(false);\n const [enabled, setEnabled] = useState(true);\n const [entries, setEntries] = useState<CoreMemoryEntry[]>([]);\n const [limits, setLimits] = useState<CoreMemoryLimits | null>(null);\n const [error, setError] = useState<string | null>(null);\n const [saving, setSaving] = useState(false);\n\n // Inline composer / editor state\n const [composerOpen, setComposerOpen] = useState(false);\n const [composerSection, setComposerSection] = useState<string>(\"profile\");\n const [composerText, setComposerText] = useState(\"\");\n const [editingId, setEditingId] = useState<number | null>(null);\n const [editingText, setEditingText] = useState(\"\");\n\n const scopeOptions = useMemo(\n () => ({\n tenantId: resolvedTenantId || undefined,\n subtenantId: resolvedSubtenantId || undefined,\n }),\n [resolvedTenantId, resolvedSubtenantId]\n );\n\n const refresh = useCallback(async () => {\n if (!client) {\n setError(\"API key not configured\");\n return;\n }\n setLoading(true);\n setError(null);\n try {\n const list = await client.getCoreMemory(assistantId, scopeOptions);\n setEnabled(list.enabled);\n setEntries(list.entries);\n setLimits(list.limits ?? null);\n } catch (err) {\n setError(err instanceof Error ? err.message : String(err));\n } finally {\n setLoading(false);\n }\n }, [client, assistantId, scopeOptions]);\n\n // Fetch on every open (memory may have changed since the last look).\n const wasOpenRef = useRef(false);\n useEffect(() => {\n if (isOpen && !wasOpenRef.current) {\n setComposerOpen(false);\n setComposerText(\"\");\n setEditingId(null);\n void refresh();\n }\n wasOpenRef.current = isOpen;\n }, [isOpen, refresh]);\n\n // Escape closes\n useEffect(() => {\n if (!isOpen) return;\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") onClose();\n };\n document.addEventListener(\"keydown\", onKey);\n return () => document.removeEventListener(\"keydown\", onKey);\n }, [isOpen, onClose]);\n\n const runWrite = useCallback(\n async (write: () => Promise<unknown>) => {\n setSaving(true);\n setError(null);\n try {\n await write();\n await refresh();\n return true;\n } catch (err) {\n setError(err instanceof Error ? err.message : String(err));\n return false;\n } finally {\n setSaving(false);\n }\n },\n [refresh]\n );\n\n const handleAdd = async () => {\n if (!client || !composerText.trim()) return;\n const ok = await runWrite(() =>\n client.addCoreMemoryEntry(\n assistantId,\n { content: composerText.trim(), section: composerSection },\n scopeOptions\n )\n );\n if (ok) {\n setComposerOpen(false);\n setComposerText(\"\");\n }\n };\n\n const handleSaveEdit = async (entry: CoreMemoryEntry) => {\n if (!client || !editingText.trim()) return;\n const ok = await runWrite(() =>\n client.updateCoreMemoryEntry(\n assistantId,\n entry.id,\n { content: editingText.trim() },\n scopeOptions\n )\n );\n if (ok) setEditingId(null);\n };\n\n const handleRemove = async (entry: CoreMemoryEntry) => {\n if (!client) return;\n await runWrite(() =>\n client.deleteCoreMemoryEntry(assistantId, entry.id, scopeOptions)\n );\n };\n\n if (!isOpen) return null;\n\n // Group entries by section, canonical sections first.\n const sections: Array<{ name: string; entries: CoreMemoryEntry[] }> = [];\n const bySection = new Map<string, CoreMemoryEntry[]>();\n for (const entry of entries) {\n const list = bySection.get(entry.section);\n if (list) list.push(entry);\n else bySection.set(entry.section, [entry]);\n }\n for (const name of SECTIONS) {\n const list = bySection.get(name);\n if (list) {\n sections.push({ name, entries: list });\n bySection.delete(name);\n }\n }\n for (const [name, list] of bySection) sections.push({ name, entries: list });\n\n return createPortal(\n // The variables go on the overlay: a portal inherits nothing from the\n // drawer that opened it, so without this the dialog ignores the theme.\n <div\n className=\"devic-cm-overlay\"\n style={themeVars(theme)}\n onClick={onClose}\n >\n <div\n className=\"devic-cm-modal\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={l.title}\n onClick={(e) => e.stopPropagation()}\n >\n <div className=\"devic-cm-header\">\n <h3 className=\"devic-cm-title\">\n <BrainIcon />\n {l.title}\n </h3>\n <button\n className=\"devic-cm-close\"\n onClick={onClose}\n type=\"button\"\n aria-label={l.close}\n >\n ×\n </button>\n </div>\n\n <div className=\"devic-cm-body\">\n {error && <div className=\"devic-cm-error\">{error}</div>}\n\n {loading ? (\n <div className=\"devic-cm-loading\">{l.loading}</div>\n ) : !enabled ? (\n <div className=\"devic-cm-empty\">{l.disabled}</div>\n ) : entries.length === 0 && !composerOpen ? (\n <div className=\"devic-cm-empty\">{l.empty}</div>\n ) : (\n sections.map((section) => (\n <div key={section.name} className=\"devic-cm-section\">\n <div className=\"devic-cm-section-title\">\n {l.sections[section.name] ?? section.name}\n </div>\n {section.entries.map((entry) => (\n <div key={entry.id} className=\"devic-cm-entry\">\n {editingId === entry.id ? (\n <div className=\"devic-cm-editor\">\n <textarea\n className=\"devic-cm-textarea\"\n value={editingText}\n maxLength={limits?.maxEntryChars || undefined}\n onChange={(e) => setEditingText(e.target.value)}\n disabled={saving}\n autoFocus\n />\n <div className=\"devic-cm-editor-actions\">\n <button\n type=\"button\"\n className=\"devic-cm-btn devic-cm-btn-primary\"\n onClick={() => handleSaveEdit(entry)}\n disabled={saving || !editingText.trim()}\n >\n {l.save}\n </button>\n <button\n type=\"button\"\n className=\"devic-cm-btn\"\n onClick={() => setEditingId(null)}\n disabled={saving}\n >\n {l.cancel}\n </button>\n </div>\n </div>\n ) : (\n <>\n <div className=\"devic-cm-entry-content\">\n {entry.pinned && (\n <span\n className=\"devic-cm-pin\"\n title={l.pinned}\n >\n <PinIcon />\n </span>\n )}\n <span>{entry.content}</span>\n </div>\n {editable && (\n <div className=\"devic-cm-entry-actions\">\n <button\n type=\"button\"\n className=\"devic-cm-btn devic-cm-btn-small\"\n onClick={() => {\n setEditingId(entry.id);\n setEditingText(entry.content);\n }}\n disabled={saving}\n >\n {l.edit}\n </button>\n <button\n type=\"button\"\n className=\"devic-cm-btn devic-cm-btn-small devic-cm-btn-danger\"\n onClick={() => handleRemove(entry)}\n disabled={saving}\n >\n {l.remove}\n </button>\n </div>\n )}\n </>\n )}\n </div>\n ))}\n </div>\n ))\n )}\n\n {editable && enabled && !loading && (\n <div className=\"devic-cm-composer\">\n {composerOpen ? (\n <>\n <div className=\"devic-cm-composer-row\">\n <select\n className=\"devic-cm-select\"\n value={composerSection}\n onChange={(e) => setComposerSection(e.target.value)}\n disabled={saving}\n >\n {SECTIONS.map((s) => (\n <option key={s} value={s}>\n {l.sections[s] ?? s}\n </option>\n ))}\n </select>\n </div>\n <textarea\n className=\"devic-cm-textarea\"\n placeholder={l.placeholder}\n value={composerText}\n maxLength={limits?.maxEntryChars || undefined}\n onChange={(e) => setComposerText(e.target.value)}\n disabled={saving}\n autoFocus\n />\n <div className=\"devic-cm-editor-actions\">\n <button\n type=\"button\"\n className=\"devic-cm-btn devic-cm-btn-primary\"\n onClick={handleAdd}\n disabled={saving || !composerText.trim()}\n >\n {l.add}\n </button>\n <button\n type=\"button\"\n className=\"devic-cm-btn\"\n onClick={() => {\n setComposerOpen(false);\n setComposerText(\"\");\n }}\n disabled={saving}\n >\n {l.cancel}\n </button>\n </div>\n </>\n ) : (\n <button\n type=\"button\"\n className=\"devic-cm-btn\"\n onClick={() => setComposerOpen(true)}\n disabled={saving}\n >\n {l.addMemory}\n </button>\n )}\n </div>\n )}\n </div>\n\n {limits && enabled && (\n <div className=\"devic-cm-footer\">\n {fillTemplate(l.footer, {\n count: String(entries.length),\n max: String(limits.maxEntries),\n chars: String(limits.maxEntryChars),\n })}\n </div>\n )}\n </div>\n </div>,\n document.body\n );\n}\n\nexport default CoreMemoryModal;\n"],"names":["_jsxs","_jsx","theme","useTranslations","useMemo","useOptionalDevicContext","client","DevicApiClient","useState","useCallback","useRef","useEffect","createPortal","themeVars","_Fragment"],"mappings":"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"}
|
|
@@ -2,11 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
4
4
|
var React = require('react');
|
|
5
|
+
var useTranslations = require('../../i18n/useTranslations.js');
|
|
5
6
|
|
|
6
7
|
/**
|
|
7
8
|
* Modal for submitting feedback with optional comment
|
|
8
9
|
*/
|
|
9
10
|
function FeedbackModal({ isOpen, onClose, onSubmit, feedbackType, isSubmitting = false, theme, }) {
|
|
11
|
+
const t = useTranslations.useTranslations();
|
|
10
12
|
const [comment, setComment] = React.useState('');
|
|
11
13
|
const textareaRef = React.useRef(null);
|
|
12
14
|
const modalRef = React.useRef(null);
|
|
@@ -70,7 +72,9 @@ function FeedbackModal({ isOpen, onClose, onSubmit, feedbackType, isSubmitting =
|
|
|
70
72
|
onSubmit(comment);
|
|
71
73
|
}
|
|
72
74
|
};
|
|
73
|
-
return (jsxRuntime.jsx("div", { className: "devic-feedback-overlay", children: jsxRuntime.jsxs("div", { className: "devic-feedback-modal", ref: modalRef, style: modalStyle, children: [jsxRuntime.jsxs("div", { className: "devic-feedback-modal-header", children: [jsxRuntime.jsx("span", { className: "devic-feedback-modal-icon", children: feedbackType === 'positive' ? jsxRuntime.jsx(ThumbsUpIcon, { filled: true }) : jsxRuntime.jsx(ThumbsDownIcon, { filled: true }) }), jsxRuntime.jsx("span", { className: "devic-feedback-modal-title", children: feedbackType === 'positive'
|
|
75
|
+
return (jsxRuntime.jsx("div", { className: "devic-feedback-overlay", children: jsxRuntime.jsxs("div", { className: "devic-feedback-modal", ref: modalRef, style: modalStyle, children: [jsxRuntime.jsxs("div", { className: "devic-feedback-modal-header", children: [jsxRuntime.jsx("span", { className: "devic-feedback-modal-icon", children: feedbackType === 'positive' ? jsxRuntime.jsx(ThumbsUpIcon, { filled: true }) : jsxRuntime.jsx(ThumbsDownIcon, { filled: true }) }), jsxRuntime.jsx("span", { className: "devic-feedback-modal-title", children: feedbackType === 'positive'
|
|
76
|
+
? t('What did you like?')
|
|
77
|
+
: t('What could be improved?') }), jsxRuntime.jsx("button", { type: "button", className: "devic-feedback-modal-close", onClick: onClose, "aria-label": t('Close'), children: jsxRuntime.jsx(CloseIcon, {}) })] }), jsxRuntime.jsxs("form", { onSubmit: handleSubmit, children: [jsxRuntime.jsx("textarea", { ref: textareaRef, className: "devic-feedback-textarea", placeholder: t('Add a comment (optional)...'), value: comment, onChange: (e) => setComment(e.target.value), onKeyDown: handleKeyDown, rows: 3, disabled: isSubmitting }), jsxRuntime.jsxs("div", { className: "devic-feedback-modal-actions", children: [jsxRuntime.jsx("button", { type: "button", className: "devic-feedback-btn devic-feedback-btn--secondary", onClick: onClose, disabled: isSubmitting, children: t('Cancel') }), jsxRuntime.jsx("button", { type: "submit", className: "devic-feedback-btn devic-feedback-btn--primary", disabled: isSubmitting, children: isSubmitting ? t('Sending...') : t('Submit') })] })] })] }) }));
|
|
74
78
|
}
|
|
75
79
|
/* ── Icons ── */
|
|
76
80
|
function ThumbsUpIcon({ filled = false }) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeedbackModal.js","sources":["../../../../../src/components/Feedback/FeedbackModal.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef, useMemo } from 'react';\nimport type { FeedbackModalProps } from './Feedback.types';\n\n/**\n * Modal for submitting feedback with optional comment\n */\nexport function FeedbackModal({\n isOpen,\n onClose,\n onSubmit,\n feedbackType,\n isSubmitting = false,\n theme,\n}: FeedbackModalProps): JSX.Element | null {\n const [comment, setComment] = useState('');\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n const modalRef = useRef<HTMLDivElement>(null);\n\n // Build inline styles from theme\n const modalStyle = useMemo(() => {\n if (!theme) return undefined;\n return {\n '--devic-bg': theme.backgroundColor,\n '--devic-text': theme.textColor,\n '--devic-text-muted': theme.textMutedColor,\n '--devic-text-secondary': theme.textMutedColor,\n '--devic-bg-secondary': theme.secondaryBackgroundColor,\n '--devic-border': theme.borderColor,\n '--devic-primary': theme.primaryColor,\n '--devic-primary-hover': theme.primaryHoverColor,\n } as React.CSSProperties;\n }, [theme]);\n\n // Focus textarea when modal opens\n useEffect(() => {\n if (isOpen && textareaRef.current) {\n setTimeout(() => textareaRef.current?.focus(), 50);\n }\n }, [isOpen]);\n\n // Reset comment when modal closes\n useEffect(() => {\n if (!isOpen) {\n setComment('');\n }\n }, [isOpen]);\n\n // Handle click outside\n useEffect(() => {\n if (!isOpen) return;\n\n const handleClickOutside = (e: MouseEvent) => {\n if (modalRef.current && !modalRef.current.contains(e.target as Node)) {\n onClose();\n }\n };\n\n const handleEscape = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n onClose();\n }\n };\n\n document.addEventListener('mousedown', handleClickOutside);\n document.addEventListener('keydown', handleEscape);\n return () => {\n document.removeEventListener('mousedown', handleClickOutside);\n document.removeEventListener('keydown', handleEscape);\n };\n }, [isOpen, onClose]);\n\n if (!isOpen) return null;\n\n const handleSubmit = (e: React.FormEvent) => {\n e.preventDefault();\n onSubmit(comment);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {\n e.preventDefault();\n onSubmit(comment);\n }\n };\n\n return (\n <div className=\"devic-feedback-overlay\">\n <div className=\"devic-feedback-modal\" ref={modalRef} style={modalStyle}>\n <div className=\"devic-feedback-modal-header\">\n <span className=\"devic-feedback-modal-icon\">\n {feedbackType === 'positive' ? <ThumbsUpIcon filled /> : <ThumbsDownIcon filled />}\n </span>\n <span className=\"devic-feedback-modal-title\">\n {feedbackType === 'positive' ? 'What did you like?' : 'What could be improved?'}\n </span>\n <button\n type=\"button\"\n className=\"devic-feedback-modal-close\"\n onClick={onClose}\n aria-label=\"Close\"\n >\n <CloseIcon />\n </button>\n </div>\n\n <form onSubmit={handleSubmit}>\n <textarea\n ref={textareaRef}\n className=\"devic-feedback-textarea\"\n placeholder=\"Add a comment (optional)...\"\n value={comment}\n onChange={(e) => setComment(e.target.value)}\n onKeyDown={handleKeyDown}\n rows={3}\n disabled={isSubmitting}\n />\n\n <div className=\"devic-feedback-modal-actions\">\n <button\n type=\"button\"\n className=\"devic-feedback-btn devic-feedback-btn--secondary\"\n onClick={onClose}\n disabled={isSubmitting}\n >\n Cancel\n </button>\n <button\n type=\"submit\"\n className=\"devic-feedback-btn devic-feedback-btn--primary\"\n disabled={isSubmitting}\n >\n {isSubmitting ? 'Sending...' : 'Submit'}\n </button>\n </div>\n </form>\n </div>\n </div>\n );\n}\n\n/* ── Icons ── */\n\nfunction ThumbsUpIcon({ filled = false }: { filled?: boolean }): JSX.Element {\n return (\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill={filled ? 'currentColor' : 'none'}\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M7 10v12M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2h0a3.13 3.13 0 0 1 3 3.88Z\" />\n </svg>\n );\n}\n\nfunction ThumbsDownIcon({ filled = false }: { filled?: boolean }): JSX.Element {\n return (\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill={filled ? 'currentColor' : 'none'}\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M17 14V2M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22h0a3.13 3.13 0 0 1-3-3.88Z\" />\n </svg>\n );\n}\n\nfunction CloseIcon(): JSX.Element {\n return (\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n </svg>\n );\n}\n"],"names":["useState","useRef","useMemo","useEffect","_jsx","_jsxs"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"FeedbackModal.js","sources":["../../../../../src/components/Feedback/FeedbackModal.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef, useMemo } from 'react';\nimport type { FeedbackModalProps } from './Feedback.types';\nimport { useTranslations } from '../../i18n';\n\n/**\n * Modal for submitting feedback with optional comment\n */\nexport function FeedbackModal({\n isOpen,\n onClose,\n onSubmit,\n feedbackType,\n isSubmitting = false,\n theme,\n}: FeedbackModalProps): JSX.Element | null {\n const t = useTranslations();\n const [comment, setComment] = useState('');\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n const modalRef = useRef<HTMLDivElement>(null);\n\n // Build inline styles from theme\n const modalStyle = useMemo(() => {\n if (!theme) return undefined;\n return {\n '--devic-bg': theme.backgroundColor,\n '--devic-text': theme.textColor,\n '--devic-text-muted': theme.textMutedColor,\n '--devic-text-secondary': theme.textMutedColor,\n '--devic-bg-secondary': theme.secondaryBackgroundColor,\n '--devic-border': theme.borderColor,\n '--devic-primary': theme.primaryColor,\n '--devic-primary-hover': theme.primaryHoverColor,\n } as React.CSSProperties;\n }, [theme]);\n\n // Focus textarea when modal opens\n useEffect(() => {\n if (isOpen && textareaRef.current) {\n setTimeout(() => textareaRef.current?.focus(), 50);\n }\n }, [isOpen]);\n\n // Reset comment when modal closes\n useEffect(() => {\n if (!isOpen) {\n setComment('');\n }\n }, [isOpen]);\n\n // Handle click outside\n useEffect(() => {\n if (!isOpen) return;\n\n const handleClickOutside = (e: MouseEvent) => {\n if (modalRef.current && !modalRef.current.contains(e.target as Node)) {\n onClose();\n }\n };\n\n const handleEscape = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n onClose();\n }\n };\n\n document.addEventListener('mousedown', handleClickOutside);\n document.addEventListener('keydown', handleEscape);\n return () => {\n document.removeEventListener('mousedown', handleClickOutside);\n document.removeEventListener('keydown', handleEscape);\n };\n }, [isOpen, onClose]);\n\n if (!isOpen) return null;\n\n const handleSubmit = (e: React.FormEvent) => {\n e.preventDefault();\n onSubmit(comment);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {\n e.preventDefault();\n onSubmit(comment);\n }\n };\n\n return (\n <div className=\"devic-feedback-overlay\">\n <div className=\"devic-feedback-modal\" ref={modalRef} style={modalStyle}>\n <div className=\"devic-feedback-modal-header\">\n <span className=\"devic-feedback-modal-icon\">\n {feedbackType === 'positive' ? <ThumbsUpIcon filled /> : <ThumbsDownIcon filled />}\n </span>\n <span className=\"devic-feedback-modal-title\">\n {feedbackType === 'positive'\n ? t('What did you like?')\n : t('What could be improved?')}\n </span>\n <button\n type=\"button\"\n className=\"devic-feedback-modal-close\"\n onClick={onClose}\n aria-label={t('Close')}\n >\n <CloseIcon />\n </button>\n </div>\n\n <form onSubmit={handleSubmit}>\n <textarea\n ref={textareaRef}\n className=\"devic-feedback-textarea\"\n placeholder={t('Add a comment (optional)...')}\n value={comment}\n onChange={(e) => setComment(e.target.value)}\n onKeyDown={handleKeyDown}\n rows={3}\n disabled={isSubmitting}\n />\n\n <div className=\"devic-feedback-modal-actions\">\n <button\n type=\"button\"\n className=\"devic-feedback-btn devic-feedback-btn--secondary\"\n onClick={onClose}\n disabled={isSubmitting}\n >\n {t('Cancel')}\n </button>\n <button\n type=\"submit\"\n className=\"devic-feedback-btn devic-feedback-btn--primary\"\n disabled={isSubmitting}\n >\n {isSubmitting ? t('Sending...') : t('Submit')}\n </button>\n </div>\n </form>\n </div>\n </div>\n );\n}\n\n/* ── Icons ── */\n\nfunction ThumbsUpIcon({ filled = false }: { filled?: boolean }): JSX.Element {\n return (\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill={filled ? 'currentColor' : 'none'}\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M7 10v12M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2h0a3.13 3.13 0 0 1 3 3.88Z\" />\n </svg>\n );\n}\n\nfunction ThumbsDownIcon({ filled = false }: { filled?: boolean }): JSX.Element {\n return (\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill={filled ? 'currentColor' : 'none'}\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M17 14V2M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22h0a3.13 3.13 0 0 1-3-3.88Z\" />\n </svg>\n );\n}\n\nfunction CloseIcon(): JSX.Element {\n return (\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n </svg>\n );\n}\n"],"names":["useTranslations","useState","useRef","useMemo","useEffect","_jsx","_jsxs"],"mappings":"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"}
|
|
@@ -3,11 +3,13 @@
|
|
|
3
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var FeedbackModal = require('./FeedbackModal.js');
|
|
6
|
+
var useTranslations = require('../../i18n/useTranslations.js');
|
|
6
7
|
|
|
7
8
|
/**
|
|
8
9
|
* Action buttons for a message (copy, thumbs up, thumbs down)
|
|
9
10
|
*/
|
|
10
11
|
function MessageActions({ messageId, messageContent, currentFeedback = 'none', onFeedback, onCopy, showCopy = true, showFeedback = true, disabled = false, theme, }) {
|
|
12
|
+
const t = useTranslations.useTranslations();
|
|
11
13
|
const [feedbackState, setFeedbackState] = React.useState(currentFeedback);
|
|
12
14
|
const [modalOpen, setModalOpen] = React.useState(false);
|
|
13
15
|
const [pendingFeedbackType, setPendingFeedbackType] = React.useState('positive');
|
|
@@ -54,7 +56,7 @@ function MessageActions({ messageId, messageContent, currentFeedback = 'none', o
|
|
|
54
56
|
setIsSubmitting(false);
|
|
55
57
|
}
|
|
56
58
|
}, [messageId, pendingFeedbackType, onFeedback]);
|
|
57
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "devic-message-actions", style: containerStyle, children: [showCopy && messageContent && (jsxRuntime.jsx("button", { type: "button", className: `devic-action-btn ${copied ? 'devic-action-btn--active' : ''}`, onClick: handleCopy, disabled: disabled, title:
|
|
59
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "devic-message-actions", style: containerStyle, children: [showCopy && messageContent && (jsxRuntime.jsx("button", { type: "button", className: `devic-action-btn ${copied ? 'devic-action-btn--active' : ''}`, onClick: handleCopy, disabled: disabled, title: t('Copy to clipboard'), "aria-label": t('Copy to clipboard'), children: copied ? jsxRuntime.jsx(CheckIcon, {}) : jsxRuntime.jsx(CopyIcon, {}) })), showFeedback && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("button", { type: "button", className: `devic-action-btn ${feedbackState === 'positive' ? 'devic-action-btn--active devic-action-btn--positive' : ''}`, onClick: () => handleFeedbackClick('positive'), disabled: disabled, title: t('Good response'), "aria-label": t('Good response'), children: jsxRuntime.jsx(ThumbsUpIcon, { filled: feedbackState === 'positive' }) }), jsxRuntime.jsx("button", { type: "button", className: `devic-action-btn ${feedbackState === 'negative' ? 'devic-action-btn--active devic-action-btn--negative' : ''}`, onClick: () => handleFeedbackClick('negative'), disabled: disabled, title: t('Bad response'), "aria-label": t('Bad response'), children: jsxRuntime.jsx(ThumbsDownIcon, { filled: feedbackState === 'negative' }) })] }))] }), jsxRuntime.jsx(FeedbackModal.FeedbackModal, { isOpen: modalOpen, onClose: () => setModalOpen(false), onSubmit: handleModalSubmit, feedbackType: pendingFeedbackType, isSubmitting: isSubmitting, theme: theme })] }));
|
|
58
60
|
}
|
|
59
61
|
/* ── Icons ── */
|
|
60
62
|
function CopyIcon() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MessageActions.js","sources":["../../../../../src/components/Feedback/MessageActions.tsx"],"sourcesContent":["import React, { useState, useCallback, useMemo } from 'react';\nimport { FeedbackModal } from './FeedbackModal';\nimport type { MessageActionsProps, FeedbackState } from './Feedback.types';\n\n/**\n * Action buttons for a message (copy, thumbs up, thumbs down)\n */\nexport function MessageActions({\n messageId,\n messageContent,\n currentFeedback = 'none',\n onFeedback,\n onCopy,\n showCopy = true,\n showFeedback = true,\n disabled = false,\n theme,\n}: MessageActionsProps): JSX.Element {\n const [feedbackState, setFeedbackState] = useState<FeedbackState>(currentFeedback);\n const [modalOpen, setModalOpen] = useState(false);\n const [pendingFeedbackType, setPendingFeedbackType] = useState<'positive' | 'negative'>('positive');\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [copied, setCopied] = useState(false);\n\n // Build inline styles from theme for the actions container\n const containerStyle = useMemo(() => {\n if (!theme) return undefined;\n return {\n '--devic-bg-secondary': theme.secondaryBackgroundColor,\n '--devic-text-secondary': theme.textMutedColor,\n } as React.CSSProperties;\n }, [theme]);\n\n const handleCopy = useCallback(async () => {\n if (!messageContent) return;\n\n try {\n await navigator.clipboard.writeText(messageContent);\n setCopied(true);\n onCopy?.(messageContent);\n setTimeout(() => setCopied(false), 2000);\n } catch (err) {\n console.error('Failed to copy:', err);\n }\n }, [messageContent, onCopy]);\n\n const handleFeedbackClick = useCallback((type: 'positive' | 'negative') => {\n // If clicking the same feedback type that's already selected, toggle it off\n if ((type === 'positive' && feedbackState === 'positive') ||\n (type === 'negative' && feedbackState === 'negative')) {\n // Optionally could allow removal - for now we just open modal to change comment\n }\n\n setPendingFeedbackType(type);\n setModalOpen(true);\n }, [feedbackState]);\n\n const handleModalSubmit = useCallback(async (comment: string) => {\n setIsSubmitting(true);\n try {\n const isPositive = pendingFeedbackType === 'positive';\n await onFeedback?.(messageId, isPositive, comment || undefined);\n setFeedbackState(isPositive ? 'positive' : 'negative');\n setModalOpen(false);\n } catch (err) {\n console.error('Failed to submit feedback:', err);\n } finally {\n setIsSubmitting(false);\n }\n }, [messageId, pendingFeedbackType, onFeedback]);\n\n return (\n <>\n <div className=\"devic-message-actions\" style={containerStyle}>\n {showCopy && messageContent && (\n <button\n type=\"button\"\n className={`devic-action-btn ${copied ? 'devic-action-btn--active' : ''}`}\n onClick={handleCopy}\n disabled={disabled}\n title=\"Copy to clipboard\"\n aria-label=\"Copy to clipboard\"\n >\n {copied ? <CheckIcon /> : <CopyIcon />}\n </button>\n )}\n\n {showFeedback && (\n <>\n <button\n type=\"button\"\n className={`devic-action-btn ${feedbackState === 'positive' ? 'devic-action-btn--active devic-action-btn--positive' : ''}`}\n onClick={() => handleFeedbackClick('positive')}\n disabled={disabled}\n title=\"Good response\"\n aria-label=\"Good response\"\n >\n <ThumbsUpIcon filled={feedbackState === 'positive'} />\n </button>\n\n <button\n type=\"button\"\n className={`devic-action-btn ${feedbackState === 'negative' ? 'devic-action-btn--active devic-action-btn--negative' : ''}`}\n onClick={() => handleFeedbackClick('negative')}\n disabled={disabled}\n title=\"Bad response\"\n aria-label=\"Bad response\"\n >\n <ThumbsDownIcon filled={feedbackState === 'negative'} />\n </button>\n </>\n )}\n </div>\n\n <FeedbackModal\n isOpen={modalOpen}\n onClose={() => setModalOpen(false)}\n onSubmit={handleModalSubmit}\n feedbackType={pendingFeedbackType}\n isSubmitting={isSubmitting}\n theme={theme}\n />\n </>\n );\n}\n\n/* ── Icons ── */\n\nfunction CopyIcon(): JSX.Element {\n return (\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <rect x=\"9\" y=\"9\" width=\"13\" height=\"13\" rx=\"2\" ry=\"2\" />\n <path d=\"M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1\" />\n </svg>\n );\n}\n\nfunction CheckIcon(): JSX.Element {\n return (\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <polyline points=\"20,6 9,17 4,12\" />\n </svg>\n );\n}\n\nfunction ThumbsUpIcon({ filled = false }: { filled?: boolean }): JSX.Element {\n return (\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill={filled ? 'currentColor' : 'none'}\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M7 10v12M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2h0a3.13 3.13 0 0 1 3 3.88Z\" />\n </svg>\n );\n}\n\nfunction ThumbsDownIcon({ filled = false }: { filled?: boolean }): JSX.Element {\n return (\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill={filled ? 'currentColor' : 'none'}\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M17 14V2M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22h0a3.13 3.13 0 0 1-3-3.88Z\" />\n </svg>\n );\n}\n"],"names":["useState","useMemo","useCallback","_jsxs","_jsx","_Fragment","FeedbackModal"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MessageActions.js","sources":["../../../../../src/components/Feedback/MessageActions.tsx"],"sourcesContent":["import React, { useState, useCallback, useMemo } from 'react';\nimport { FeedbackModal } from './FeedbackModal';\nimport type { MessageActionsProps, FeedbackState } from './Feedback.types';\nimport { useTranslations } from '../../i18n';\n\n/**\n * Action buttons for a message (copy, thumbs up, thumbs down)\n */\nexport function MessageActions({\n messageId,\n messageContent,\n currentFeedback = 'none',\n onFeedback,\n onCopy,\n showCopy = true,\n showFeedback = true,\n disabled = false,\n theme,\n}: MessageActionsProps): JSX.Element {\n const t = useTranslations();\n const [feedbackState, setFeedbackState] = useState<FeedbackState>(currentFeedback);\n const [modalOpen, setModalOpen] = useState(false);\n const [pendingFeedbackType, setPendingFeedbackType] = useState<'positive' | 'negative'>('positive');\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [copied, setCopied] = useState(false);\n\n // Build inline styles from theme for the actions container\n const containerStyle = useMemo(() => {\n if (!theme) return undefined;\n return {\n '--devic-bg-secondary': theme.secondaryBackgroundColor,\n '--devic-text-secondary': theme.textMutedColor,\n } as React.CSSProperties;\n }, [theme]);\n\n const handleCopy = useCallback(async () => {\n if (!messageContent) return;\n\n try {\n await navigator.clipboard.writeText(messageContent);\n setCopied(true);\n onCopy?.(messageContent);\n setTimeout(() => setCopied(false), 2000);\n } catch (err) {\n console.error('Failed to copy:', err);\n }\n }, [messageContent, onCopy]);\n\n const handleFeedbackClick = useCallback((type: 'positive' | 'negative') => {\n // If clicking the same feedback type that's already selected, toggle it off\n if ((type === 'positive' && feedbackState === 'positive') ||\n (type === 'negative' && feedbackState === 'negative')) {\n // Optionally could allow removal - for now we just open modal to change comment\n }\n\n setPendingFeedbackType(type);\n setModalOpen(true);\n }, [feedbackState]);\n\n const handleModalSubmit = useCallback(async (comment: string) => {\n setIsSubmitting(true);\n try {\n const isPositive = pendingFeedbackType === 'positive';\n await onFeedback?.(messageId, isPositive, comment || undefined);\n setFeedbackState(isPositive ? 'positive' : 'negative');\n setModalOpen(false);\n } catch (err) {\n console.error('Failed to submit feedback:', err);\n } finally {\n setIsSubmitting(false);\n }\n }, [messageId, pendingFeedbackType, onFeedback]);\n\n return (\n <>\n <div className=\"devic-message-actions\" style={containerStyle}>\n {showCopy && messageContent && (\n <button\n type=\"button\"\n className={`devic-action-btn ${copied ? 'devic-action-btn--active' : ''}`}\n onClick={handleCopy}\n disabled={disabled}\n title={t('Copy to clipboard')}\n aria-label={t('Copy to clipboard')}\n >\n {copied ? <CheckIcon /> : <CopyIcon />}\n </button>\n )}\n\n {showFeedback && (\n <>\n <button\n type=\"button\"\n className={`devic-action-btn ${feedbackState === 'positive' ? 'devic-action-btn--active devic-action-btn--positive' : ''}`}\n onClick={() => handleFeedbackClick('positive')}\n disabled={disabled}\n title={t('Good response')}\n aria-label={t('Good response')}\n >\n <ThumbsUpIcon filled={feedbackState === 'positive'} />\n </button>\n\n <button\n type=\"button\"\n className={`devic-action-btn ${feedbackState === 'negative' ? 'devic-action-btn--active devic-action-btn--negative' : ''}`}\n onClick={() => handleFeedbackClick('negative')}\n disabled={disabled}\n title={t('Bad response')}\n aria-label={t('Bad response')}\n >\n <ThumbsDownIcon filled={feedbackState === 'negative'} />\n </button>\n </>\n )}\n </div>\n\n <FeedbackModal\n isOpen={modalOpen}\n onClose={() => setModalOpen(false)}\n onSubmit={handleModalSubmit}\n feedbackType={pendingFeedbackType}\n isSubmitting={isSubmitting}\n theme={theme}\n />\n </>\n );\n}\n\n/* ── Icons ── */\n\nfunction CopyIcon(): JSX.Element {\n return (\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <rect x=\"9\" y=\"9\" width=\"13\" height=\"13\" rx=\"2\" ry=\"2\" />\n <path d=\"M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1\" />\n </svg>\n );\n}\n\nfunction CheckIcon(): JSX.Element {\n return (\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <polyline points=\"20,6 9,17 4,12\" />\n </svg>\n );\n}\n\nfunction ThumbsUpIcon({ filled = false }: { filled?: boolean }): JSX.Element {\n return (\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill={filled ? 'currentColor' : 'none'}\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M7 10v12M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2h0a3.13 3.13 0 0 1 3 3.88Z\" />\n </svg>\n );\n}\n\nfunction ThumbsDownIcon({ filled = false }: { filled?: boolean }): JSX.Element {\n return (\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill={filled ? 'currentColor' : 'none'}\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M17 14V2M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22h0a3.13 3.13 0 0 1-3-3.88Z\" />\n </svg>\n );\n}\n"],"names":["useTranslations","useState","useMemo","useCallback","_jsxs","_Fragment","_jsx","FeedbackModal"],"mappings":"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"}
|
|
@@ -5,6 +5,7 @@ var React = require('react');
|
|
|
5
5
|
var reactDom = require('react-dom');
|
|
6
6
|
var theme = require('../theme.js');
|
|
7
7
|
var IntegrationLogo = require('./IntegrationLogo.js');
|
|
8
|
+
var useTranslations = require('../../i18n/useTranslations.js');
|
|
8
9
|
|
|
9
10
|
/** Whether a field belongs in the form, given the server's shortlist. */
|
|
10
11
|
function wanted(field, only) {
|
|
@@ -26,6 +27,7 @@ function wanted(field, only) {
|
|
|
26
27
|
* Values go straight into the connection and are never kept here.
|
|
27
28
|
*/
|
|
28
29
|
function ConnectFieldsForm({ integration, schemes, initialScheme, onlyFields, submitting, error, theme: theme$1, onCancel, onSubmit, }) {
|
|
30
|
+
const t = useTranslations.useTranslations();
|
|
29
31
|
const [mode, setMode] = React.useState(initialScheme ?? schemes[0]?.mode ?? "");
|
|
30
32
|
const [values, setValues] = React.useState({});
|
|
31
33
|
const [touched, setTouched] = React.useState(false);
|
|
@@ -50,23 +52,25 @@ function ConnectFieldsForm({ integration, schemes, initialScheme, onlyFields, su
|
|
|
50
52
|
}
|
|
51
53
|
onSubmit({ authScheme: scheme.mode, accountFields });
|
|
52
54
|
};
|
|
53
|
-
return reactDom.createPortal(jsxRuntime.jsx("div", { className: "devic-int-overlay devic-int-overlay-stacked", style: theme.themeVars(theme$1), "data-dark": theme.isDarkTheme(theme$1), onClick: onCancel, children: jsxRuntime.jsxs("form", { className: "devic-int-connect-dialog", role: "dialog", "aria-modal": "true", "aria-label":
|
|
54
|
-
?
|
|
55
|
-
|
|
55
|
+
return reactDom.createPortal(jsxRuntime.jsx("div", { className: "devic-int-overlay devic-int-overlay-stacked", style: theme.themeVars(theme$1), "data-dark": theme.isDarkTheme(theme$1), onClick: onCancel, children: jsxRuntime.jsxs("form", { className: "devic-int-connect-dialog", role: "dialog", "aria-modal": "true", "aria-label": t("Connect {app}", { app: integration.name }), onClick: (e) => e.stopPropagation(), onSubmit: handleSubmit, children: [jsxRuntime.jsxs("div", { className: "devic-int-connect-header", children: [jsxRuntime.jsx(IntegrationLogo.IntegrationLogo, { integration: integration }), jsxRuntime.jsxs("div", { className: "devic-int-connect-heading", children: [jsxRuntime.jsx("strong", { children: t("Connect {app}", { app: integration.name }) }), jsxRuntime.jsx("span", { children: scheme.redirect
|
|
56
|
+
? t("You'll be sent to {app} to finish authorising.", {
|
|
57
|
+
app: integration.name,
|
|
58
|
+
})
|
|
59
|
+
: t("Your credentials go straight to the app — only you can use this account.") })] }), jsxRuntime.jsx("button", { type: "button", className: "devic-int-close", onClick: onCancel, "aria-label": t("Close"), children: "\u00D7" })] }), jsxRuntime.jsxs("div", { className: "devic-int-connect-body", children: [error && jsxRuntime.jsx("div", { className: "devic-int-error", children: error }), schemes.length > 1 && (jsxRuntime.jsxs("label", { className: "devic-int-connect-field", children: [jsxRuntime.jsx("span", { className: "devic-int-connect-label", children: t("Connect with") }), jsxRuntime.jsx("select", { value: scheme.mode, onChange: (e) => {
|
|
56
60
|
setMode(e.target.value);
|
|
57
61
|
setValues({});
|
|
58
62
|
setTouched(false);
|
|
59
63
|
}, children: schemes.map((s) => (jsxRuntime.jsx("option", { value: s.mode, children: s.mode }, s.mode))) })] })), fields.map((field, index) => {
|
|
60
64
|
const invalid = touched && field.required && !valueOf(field).trim();
|
|
61
|
-
return (jsxRuntime.jsxs("label", { className: "devic-int-connect-field", children: [jsxRuntime.jsxs("span", { className: "devic-int-connect-label", children: [field.label, !field.required && jsxRuntime.
|
|
65
|
+
return (jsxRuntime.jsxs("label", { className: "devic-int-connect-field", children: [jsxRuntime.jsxs("span", { className: "devic-int-connect-label", children: [field.label, !field.required && jsxRuntime.jsxs("em", { children: [" ", t("(optional)")] })] }), jsxRuntime.jsx("input", { autoFocus: index === 0, type: field.secret ? "password" : "text", value: valueOf(field), onChange: (e) => setValues((prev) => ({
|
|
62
66
|
...prev,
|
|
63
67
|
[field.name]: e.target.value,
|
|
64
68
|
})), placeholder: field.default, autoComplete: field.secret ? "new-password" : "off", spellCheck: false, "aria-invalid": invalid || undefined, "data-invalid": invalid || undefined }), field.description && (jsxRuntime.jsx("small", { className: "devic-int-connect-hint", children: field.description }))] }, field.name));
|
|
65
|
-
}), scheme.guideUrl && (jsxRuntime.jsx("a", { className: "devic-int-connect-guide", href: scheme.guideUrl, target: "_blank", rel: "noopener noreferrer", children: "Where do I find this?" }))] }), jsxRuntime.jsxs("div", { className: "devic-int-connect-actions", children: [jsxRuntime.jsx("button", { type: "button", className: "devic-int-btn", onClick: onCancel, disabled: submitting, children: "Cancel" }), jsxRuntime.jsx("button", { type: "submit", className: "devic-int-btn devic-int-btn-primary", disabled: submitting, children: submitting
|
|
66
|
-
? "Connecting…"
|
|
69
|
+
}), scheme.guideUrl && (jsxRuntime.jsx("a", { className: "devic-int-connect-guide", href: scheme.guideUrl, target: "_blank", rel: "noopener noreferrer", children: t("Where do I find this?") }))] }), jsxRuntime.jsxs("div", { className: "devic-int-connect-actions", children: [jsxRuntime.jsx("button", { type: "button", className: "devic-int-btn", onClick: onCancel, disabled: submitting, children: t("Cancel") }), jsxRuntime.jsx("button", { type: "submit", className: "devic-int-btn devic-int-btn-primary", disabled: submitting, children: submitting
|
|
70
|
+
? t("Connecting…")
|
|
67
71
|
: scheme.redirect
|
|
68
|
-
? "Continue"
|
|
69
|
-
: "Connect" })] })] }) }), document.body);
|
|
72
|
+
? t("Continue")
|
|
73
|
+
: t("Connect") })] })] }) }), document.body);
|
|
70
74
|
}
|
|
71
75
|
|
|
72
76
|
exports.ConnectFieldsForm = ConnectFieldsForm;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConnectFieldsForm.js","sources":["../../../../../src/components/IntegrationsModal/ConnectFieldsForm.tsx"],"sourcesContent":["import { useMemo, useState, type FormEvent, type JSX } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport type {\n Integration,\n IntegrationAuthField,\n IntegrationAuthScheme,\n} from \"../../api/types\";\nimport { isDarkTheme, themeVars, type DevicTheme } from \"../theme\";\nimport { IntegrationLogo } from \"./IntegrationLogo\";\n\nexport interface ConnectFieldsFormProps {\n integration: Integration;\n /** Every way this app can be connected, from `GET /:app/auth`. */\n schemes: IntegrationAuthScheme[];\n /** The scheme to start on, when the server named one. */\n initialScheme?: string;\n /** Only these are asked for, when the server named what was missing. */\n onlyFields?: IntegrationAuthField[];\n submitting?: boolean;\n /** Failure from the last attempt, shown above the fields. */\n error?: string | null;\n /** Passed down from the dialog that opened this one. */\n theme?: DevicTheme;\n onCancel: () => void;\n onSubmit: (values: {\n authScheme: string;\n accountFields: Record<string, string>;\n }) => void;\n}\n\n/** Whether a field belongs in the form, given the server's shortlist. */\nfunction wanted(\n field: IntegrationAuthField,\n only?: IntegrationAuthField[]\n): boolean {\n return !only?.length || only.some((f) => f.name === field.name);\n}\n\n/**\n * The credentials an app asks the end user for.\n *\n * Most apps do not authenticate with credentials Devic holds — they take an\n * API key the user creates at the provider — so without this they cannot be\n * connected at all, no matter how many popups are opened.\n *\n * A dialog of its own rather than something inside the app's card: a provider\n * explains where to find a key in a paragraph, and three of those do not fit\n * in one column of a grid without turning into a stack of clipped text. The\n * fields are rendered from what the server describes, never from anything\n * per-app — there are hundreds of them.\n *\n * Values go straight into the connection and are never kept here.\n */\nexport function ConnectFieldsForm({\n integration,\n schemes,\n initialScheme,\n onlyFields,\n submitting,\n error,\n theme,\n onCancel,\n onSubmit,\n}: ConnectFieldsFormProps): JSX.Element | null {\n const [mode, setMode] = useState(initialScheme ?? schemes[0]?.mode ?? \"\");\n const [values, setValues] = useState<Record<string, string>>({});\n const [touched, setTouched] = useState(false);\n\n const scheme = useMemo(\n () => schemes.find((s) => s.mode === mode) ?? schemes[0],\n [schemes, mode]\n );\n\n const fields = useMemo(\n () => (scheme?.accountFields ?? []).filter((f) => wanted(f, onlyFields)),\n [scheme, onlyFields]\n );\n\n if (!scheme) return null;\n\n const valueOf = (field: IntegrationAuthField) =>\n values[field.name] ?? field.default ?? \"\";\n\n const missing = fields.filter((f) => f.required && !valueOf(f).trim());\n\n const handleSubmit = (event: FormEvent) => {\n event.preventDefault();\n setTouched(true);\n if (missing.length || submitting) return;\n\n // Only what this scheme declares, trimmed. A value left blank is left out\n // rather than sent empty: the provider would store it and fail later.\n const accountFields: Record<string, string> = {};\n for (const field of scheme.accountFields) {\n const value = valueOf(field).trim();\n if (value) accountFields[field.name] = value;\n }\n onSubmit({ authScheme: scheme.mode, accountFields });\n };\n\n return createPortal(\n <div\n className=\"devic-int-overlay devic-int-overlay-stacked\"\n style={themeVars(theme)}\n data-dark={isDarkTheme(theme)}\n onClick={onCancel}\n >\n <form\n className=\"devic-int-connect-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={`Connect ${integration.name}`}\n onClick={(e) => e.stopPropagation()}\n onSubmit={handleSubmit}\n >\n <div className=\"devic-int-connect-header\">\n <IntegrationLogo integration={integration} />\n <div className=\"devic-int-connect-heading\">\n <strong>Connect {integration.name}</strong>\n <span>\n {scheme.redirect\n ? `You'll be sent to ${integration.name} to finish authorising.`\n : \"Your credentials go straight to the app — only you can use this account.\"}\n </span>\n </div>\n <button\n type=\"button\"\n className=\"devic-int-close\"\n onClick={onCancel}\n aria-label=\"Close\"\n >\n ×\n </button>\n </div>\n\n <div className=\"devic-int-connect-body\">\n {error && <div className=\"devic-int-error\">{error}</div>}\n\n {/* Only when there is a real choice — a picker with one option is\n just another thing to read before typing a key. */}\n {schemes.length > 1 && (\n <label className=\"devic-int-connect-field\">\n <span className=\"devic-int-connect-label\">Connect with</span>\n <select\n value={scheme.mode}\n onChange={(e) => {\n setMode(e.target.value);\n setValues({});\n setTouched(false);\n }}\n >\n {schemes.map((s) => (\n <option key={s.mode} value={s.mode}>\n {s.mode}\n </option>\n ))}\n </select>\n </label>\n )}\n\n {fields.map((field, index) => {\n const invalid = touched && field.required && !valueOf(field).trim();\n return (\n <label key={field.name} className=\"devic-int-connect-field\">\n <span className=\"devic-int-connect-label\">\n {field.label}\n {!field.required && <em> (optional)</em>}\n </span>\n <input\n autoFocus={index === 0}\n type={field.secret ? \"password\" : \"text\"}\n value={valueOf(field)}\n onChange={(e) =>\n setValues((prev) => ({\n ...prev,\n [field.name]: e.target.value,\n }))\n }\n placeholder={field.default}\n autoComplete={field.secret ? \"new-password\" : \"off\"}\n spellCheck={false}\n aria-invalid={invalid || undefined}\n data-invalid={invalid || undefined}\n />\n {field.description && (\n <small className=\"devic-int-connect-hint\">\n {field.description}\n </small>\n )}\n </label>\n );\n })}\n\n {scheme.guideUrl && (\n <a\n className=\"devic-int-connect-guide\"\n href={scheme.guideUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n Where do I find this?\n </a>\n )}\n </div>\n\n <div className=\"devic-int-connect-actions\">\n <button\n type=\"button\"\n className=\"devic-int-btn\"\n onClick={onCancel}\n disabled={submitting}\n >\n Cancel\n </button>\n <button\n type=\"submit\"\n className=\"devic-int-btn devic-int-btn-primary\"\n disabled={submitting}\n >\n {submitting\n ? \"Connecting…\"\n : scheme.redirect\n ? \"Continue\"\n : \"Connect\"}\n </button>\n </div>\n </form>\n </div>,\n document.body\n );\n}\n"],"names":["theme","useState","useMemo","createPortal","_jsx","themeVars","isDarkTheme","_jsxs","IntegrationLogo"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ConnectFieldsForm.js","sources":["../../../../../src/components/IntegrationsModal/ConnectFieldsForm.tsx"],"sourcesContent":["import { useMemo, useState, type FormEvent, type JSX } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport type {\n Integration,\n IntegrationAuthField,\n IntegrationAuthScheme,\n} from \"../../api/types\";\nimport { isDarkTheme, themeVars, type DevicTheme } from \"../theme\";\nimport { IntegrationLogo } from \"./IntegrationLogo\";\nimport { useTranslations } from \"../../i18n\";\n\nexport interface ConnectFieldsFormProps {\n integration: Integration;\n /** Every way this app can be connected, from `GET /:app/auth`. */\n schemes: IntegrationAuthScheme[];\n /** The scheme to start on, when the server named one. */\n initialScheme?: string;\n /** Only these are asked for, when the server named what was missing. */\n onlyFields?: IntegrationAuthField[];\n submitting?: boolean;\n /** Failure from the last attempt, shown above the fields. */\n error?: string | null;\n /** Passed down from the dialog that opened this one. */\n theme?: DevicTheme;\n onCancel: () => void;\n onSubmit: (values: {\n authScheme: string;\n accountFields: Record<string, string>;\n }) => void;\n}\n\n/** Whether a field belongs in the form, given the server's shortlist. */\nfunction wanted(\n field: IntegrationAuthField,\n only?: IntegrationAuthField[]\n): boolean {\n return !only?.length || only.some((f) => f.name === field.name);\n}\n\n/**\n * The credentials an app asks the end user for.\n *\n * Most apps do not authenticate with credentials Devic holds — they take an\n * API key the user creates at the provider — so without this they cannot be\n * connected at all, no matter how many popups are opened.\n *\n * A dialog of its own rather than something inside the app's card: a provider\n * explains where to find a key in a paragraph, and three of those do not fit\n * in one column of a grid without turning into a stack of clipped text. The\n * fields are rendered from what the server describes, never from anything\n * per-app — there are hundreds of them.\n *\n * Values go straight into the connection and are never kept here.\n */\nexport function ConnectFieldsForm({\n integration,\n schemes,\n initialScheme,\n onlyFields,\n submitting,\n error,\n theme,\n onCancel,\n onSubmit,\n}: ConnectFieldsFormProps): JSX.Element | null {\n const t = useTranslations();\n const [mode, setMode] = useState(initialScheme ?? schemes[0]?.mode ?? \"\");\n const [values, setValues] = useState<Record<string, string>>({});\n const [touched, setTouched] = useState(false);\n\n const scheme = useMemo(\n () => schemes.find((s) => s.mode === mode) ?? schemes[0],\n [schemes, mode]\n );\n\n const fields = useMemo(\n () => (scheme?.accountFields ?? []).filter((f) => wanted(f, onlyFields)),\n [scheme, onlyFields]\n );\n\n if (!scheme) return null;\n\n const valueOf = (field: IntegrationAuthField) =>\n values[field.name] ?? field.default ?? \"\";\n\n const missing = fields.filter((f) => f.required && !valueOf(f).trim());\n\n const handleSubmit = (event: FormEvent) => {\n event.preventDefault();\n setTouched(true);\n if (missing.length || submitting) return;\n\n // Only what this scheme declares, trimmed. A value left blank is left out\n // rather than sent empty: the provider would store it and fail later.\n const accountFields: Record<string, string> = {};\n for (const field of scheme.accountFields) {\n const value = valueOf(field).trim();\n if (value) accountFields[field.name] = value;\n }\n onSubmit({ authScheme: scheme.mode, accountFields });\n };\n\n return createPortal(\n <div\n className=\"devic-int-overlay devic-int-overlay-stacked\"\n style={themeVars(theme)}\n data-dark={isDarkTheme(theme)}\n onClick={onCancel}\n >\n <form\n className=\"devic-int-connect-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={t(\"Connect {app}\", { app: integration.name })}\n onClick={(e) => e.stopPropagation()}\n onSubmit={handleSubmit}\n >\n <div className=\"devic-int-connect-header\">\n <IntegrationLogo integration={integration} />\n <div className=\"devic-int-connect-heading\">\n <strong>{t(\"Connect {app}\", { app: integration.name })}</strong>\n <span>\n {scheme.redirect\n ? t(\"You'll be sent to {app} to finish authorising.\", {\n app: integration.name,\n })\n : t(\n \"Your credentials go straight to the app — only you can use this account.\"\n )}\n </span>\n </div>\n <button\n type=\"button\"\n className=\"devic-int-close\"\n onClick={onCancel}\n aria-label={t(\"Close\")}\n >\n ×\n </button>\n </div>\n\n <div className=\"devic-int-connect-body\">\n {error && <div className=\"devic-int-error\">{error}</div>}\n\n {/* Only when there is a real choice — a picker with one option is\n just another thing to read before typing a key. */}\n {schemes.length > 1 && (\n <label className=\"devic-int-connect-field\">\n <span className=\"devic-int-connect-label\">\n {t(\"Connect with\")}\n </span>\n <select\n value={scheme.mode}\n onChange={(e) => {\n setMode(e.target.value);\n setValues({});\n setTouched(false);\n }}\n >\n {schemes.map((s) => (\n <option key={s.mode} value={s.mode}>\n {s.mode}\n </option>\n ))}\n </select>\n </label>\n )}\n\n {fields.map((field, index) => {\n const invalid = touched && field.required && !valueOf(field).trim();\n return (\n <label key={field.name} className=\"devic-int-connect-field\">\n <span className=\"devic-int-connect-label\">\n {field.label}\n {!field.required && <em> {t(\"(optional)\")}</em>}\n </span>\n <input\n autoFocus={index === 0}\n type={field.secret ? \"password\" : \"text\"}\n value={valueOf(field)}\n onChange={(e) =>\n setValues((prev) => ({\n ...prev,\n [field.name]: e.target.value,\n }))\n }\n placeholder={field.default}\n autoComplete={field.secret ? \"new-password\" : \"off\"}\n spellCheck={false}\n aria-invalid={invalid || undefined}\n data-invalid={invalid || undefined}\n />\n {field.description && (\n <small className=\"devic-int-connect-hint\">\n {field.description}\n </small>\n )}\n </label>\n );\n })}\n\n {scheme.guideUrl && (\n <a\n className=\"devic-int-connect-guide\"\n href={scheme.guideUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n {t(\"Where do I find this?\")}\n </a>\n )}\n </div>\n\n <div className=\"devic-int-connect-actions\">\n <button\n type=\"button\"\n className=\"devic-int-btn\"\n onClick={onCancel}\n disabled={submitting}\n >\n {t(\"Cancel\")}\n </button>\n <button\n type=\"submit\"\n className=\"devic-int-btn devic-int-btn-primary\"\n disabled={submitting}\n >\n {submitting\n ? t(\"Connecting…\")\n : scheme.redirect\n ? t(\"Continue\")\n : t(\"Connect\")}\n </button>\n </div>\n </form>\n </div>,\n document.body\n );\n}\n"],"names":["theme","useTranslations","useState","useMemo","createPortal","_jsx","themeVars","isDarkTheme","_jsxs","IntegrationLogo"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IntegrationLogo.js","sources":["../../../../../src/components/IntegrationsModal/IntegrationLogo.tsx"],"sourcesContent":["import { useState, type JSX } from \"react\";\nimport type { Integration } from \"../../api/types\";\n\nexport interface IntegrationLogoProps {\n integration: Integration;\n className?: string;\n}\n\n/**\n * An app's real logo, with its initial as the fallback.\n *\n * The URL comes from the provider and is fetched from whatever host it names,\n * so a broken one is a matter of when, not if — and a broken-image icon in\n * someone else's product looks like our bug. The failed state is kept per logo\n * rather than in the list, so one dead URL never blanks the rest.\n */\nexport function IntegrationLogo({\n integration,\n className = \"\",\n}: IntegrationLogoProps): JSX.Element {\n const [broken, setBroken] = useState(false);\n\n if (!integration.logo || broken) {\n return (\n <span\n className={`devic-int-logo devic-int-logo-fallback ${className}`.trim()}\n aria-hidden=\"true\"\n >\n {(integration.name || integration.app).charAt(0).toUpperCase()}\n </span>\n );\n }\n\n return (\n <img\n className={`devic-int-logo ${className}`.trim()}\n src={integration.logo}\n alt=\"\"\n aria-hidden=\"true\"\n onError={() => setBroken(true)}\n />\n );\n}\n\nexport default IntegrationLogo;\n"],"names":["useState","_jsx"],"mappings":";;;;;AAQA;;;;;;;AAOG;AACG,SAAU,eAAe,CAAC,EAC9B,WAAW,EACX,SAAS,GAAG,EAAE,GACO,EAAA;IACrB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGA,cAAQ,CAAC,KAAK,CAAC;AAE3C,IAAA,IAAI,CAAC,WAAW,CAAC,IAAI,IAAI,MAAM,EAAE;AAC/B,QAAA,QACEC,cAAA,CAAA,MAAA,EAAA,EACE,SAAS,EAAE,0CAA0C,SAAS,CAAA,CAAE,CAAC,IAAI,EAAE,EAAA,aAAA,EAC3D,MAAM,EAAA,QAAA,EAEjB,CAAC,WAAW,CAAC,IAAI,IAAI,WAAW,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAA,CACzD;IAEX;AAEA,IAAA,QACEA,cAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,kBAAkB,SAAS,CAAA,CAAE,CAAC,IAAI,EAAE,EAC/C,GAAG,EAAE,WAAW,CAAC,IAAI,EACrB,GAAG,EAAC,EAAE,EAAA,aAAA,EACM,MAAM,EAClB,OAAO,EAAE,MAAM,SAAS,CAAC,IAAI,CAAC,EAAA,CAC9B;AAEN
|
|
1
|
+
{"version":3,"file":"IntegrationLogo.js","sources":["../../../../../src/components/IntegrationsModal/IntegrationLogo.tsx"],"sourcesContent":["import { useState, type JSX } from \"react\";\nimport type { Integration } from \"../../api/types\";\n\nexport interface IntegrationLogoProps {\n integration: Integration;\n className?: string;\n}\n\n/**\n * An app's real logo, with its initial as the fallback.\n *\n * The URL comes from the provider and is fetched from whatever host it names,\n * so a broken one is a matter of when, not if — and a broken-image icon in\n * someone else's product looks like our bug. The failed state is kept per logo\n * rather than in the list, so one dead URL never blanks the rest.\n */\nexport function IntegrationLogo({\n integration,\n className = \"\",\n}: IntegrationLogoProps): JSX.Element {\n const [broken, setBroken] = useState(false);\n\n if (!integration.logo || broken) {\n return (\n <span\n className={`devic-int-logo devic-int-logo-fallback ${className}`.trim()}\n aria-hidden=\"true\"\n >\n {(integration.name || integration.app).charAt(0).toUpperCase()}\n </span>\n );\n }\n\n return (\n <img\n className={`devic-int-logo ${className}`.trim()}\n src={integration.logo}\n alt=\"\"\n aria-hidden=\"true\"\n onError={() => setBroken(true)}\n />\n );\n}\n\nexport default IntegrationLogo;\n"],"names":["useState","_jsx"],"mappings":";;;;;AAQA;;;;;;;AAOG;AACG,SAAU,eAAe,CAAC,EAC9B,WAAW,EACX,SAAS,GAAG,EAAE,GACO,EAAA;IACrB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGA,cAAQ,CAAC,KAAK,CAAC;AAE3C,IAAA,IAAI,CAAC,WAAW,CAAC,IAAI,IAAI,MAAM,EAAE;AAC/B,QAAA,QACEC,cAAA,CAAA,MAAA,EAAA,EACE,SAAS,EAAE,0CAA0C,SAAS,CAAA,CAAE,CAAC,IAAI,EAAE,EAAA,aAAA,EAC3D,MAAM,EAAA,QAAA,EAEjB,CAAC,WAAW,CAAC,IAAI,IAAI,WAAW,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,EAAA,CACzD;IAEX;AAEA,IAAA,QACEA,cAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,kBAAkB,SAAS,CAAA,CAAE,CAAC,IAAI,EAAE,EAC/C,GAAG,EAAE,WAAW,CAAC,IAAI,EACrB,GAAG,EAAC,EAAE,EAAA,aAAA,EACM,MAAM,EAClB,OAAO,EAAE,MAAM,SAAS,CAAC,IAAI,CAAC,EAAA,CAC9B;AAEN;;;;"}
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var IntegrationLogo = require('./IntegrationLogo.js');
|
|
6
|
+
var useTranslations = require('../../i18n/useTranslations.js');
|
|
6
7
|
|
|
7
8
|
const STORAGE_PREFIX = "devic:apps-hint-dismissed:";
|
|
8
9
|
/** Reading storage throws in Safari's private mode and in sandboxed frames. */
|
|
@@ -100,6 +101,7 @@ function flyTarget(bar, selector) {
|
|
|
100
101
|
* what was dismissed is understood to still be there.
|
|
101
102
|
*/
|
|
102
103
|
function IntegrationsHint({ state, onOpen, label, maxLogos = 6, storageKey, flyToSelector = ".devic-int-launcher", dark = false, className = "", }) {
|
|
104
|
+
const t = useTranslations.useTranslations();
|
|
103
105
|
const sorted = React.useMemo(() => order(state.integrations), [state.integrations]);
|
|
104
106
|
const ref = React.useRef(null);
|
|
105
107
|
const [boxes, setBoxes] = React.useState(maxLogos + 1);
|
|
@@ -219,13 +221,13 @@ function IntegrationsHint({ state, onOpen, label, maxLogos = 6, storageKey, flyT
|
|
|
219
221
|
return null;
|
|
220
222
|
const text = label ??
|
|
221
223
|
(sorted.some((i) => i.connected)
|
|
222
|
-
? "Explore connected apps"
|
|
223
|
-
: "Connect your apps");
|
|
224
|
+
? t("Explore connected apps")
|
|
225
|
+
: t("Connect your apps"));
|
|
224
226
|
// When some apps will not fit, the `+N` box takes one of the slots itself.
|
|
225
227
|
const capacity = Math.max(1, boxes);
|
|
226
228
|
const shown = sorted.slice(0, sorted.length > capacity ? capacity - 1 : capacity);
|
|
227
229
|
const extra = sorted.length - shown.length;
|
|
228
|
-
return (jsxRuntime.jsxs("div", { ref: ref, className: `devic-int-hint ${className}`.trim(), "data-dark": dark, "data-leaving": leaving, children: [jsxRuntime.jsxs("button", { type: "button", className: "devic-int-hint-main", onClick: onOpen, children: [jsxRuntime.jsx("span", { className: "devic-int-hint-label", children: text }), jsxRuntime.jsxs("span", { className: "devic-int-hint-logos", "aria-hidden": "true", children: [shown.map((integration) => (jsxRuntime.jsx("span", { className: "devic-int-hint-item", "data-connected": integration.connected, children: jsxRuntime.jsx(IntegrationLogo.IntegrationLogo, { integration: integration, className: "devic-int-hint-logo" }) }, integration.app))), extra > 0 && (jsxRuntime.jsxs("span", { className: "devic-int-hint-item devic-int-hint-more", children: ["+", extra] }))] })] }), jsxRuntime.jsx("button", { type: "button", className: "devic-int-hint-close", onClick: dismiss, "aria-label": "Hide this", title: "Hide this. Your apps stay in the header.", children: "\u00D7" })] }));
|
|
230
|
+
return (jsxRuntime.jsxs("div", { ref: ref, className: `devic-int-hint ${className}`.trim(), "data-dark": dark, "data-leaving": leaving, children: [jsxRuntime.jsxs("button", { type: "button", className: "devic-int-hint-main", onClick: onOpen, children: [jsxRuntime.jsx("span", { className: "devic-int-hint-label", children: text }), jsxRuntime.jsxs("span", { className: "devic-int-hint-logos", "aria-hidden": "true", children: [shown.map((integration) => (jsxRuntime.jsx("span", { className: "devic-int-hint-item", "data-connected": integration.connected, children: jsxRuntime.jsx(IntegrationLogo.IntegrationLogo, { integration: integration, className: "devic-int-hint-logo" }) }, integration.app))), extra > 0 && (jsxRuntime.jsxs("span", { className: "devic-int-hint-item devic-int-hint-more", children: ["+", extra] }))] })] }), jsxRuntime.jsx("button", { type: "button", className: "devic-int-hint-close", onClick: dismiss, "aria-label": t("Hide this"), title: t("Hide this. Your apps stay in the header."), children: "\u00D7" })] }));
|
|
229
231
|
}
|
|
230
232
|
|
|
231
233
|
exports.IntegrationsHint = IntegrationsHint;
|