@burdenoff/microfe-conversations 2026.522.1 → 2026.523.1

package/dist/conversations/pages/ConversationListPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationListPage.js","names":[],"sources":["../../../src/conversations/pages/ConversationListPage.tsx"],"sourcesContent":["import { useMemo, useState, useCallback, useEffect } from \"react\";\nimport { useEventBus } from \"@burdenoff/fe-libs/shared/events\";\nimport { useNavigate, useSearchParams } from \"react-router-dom\";\nimport {\n  Archive,\n  Filter,\n  LayoutGrid,\n  LayoutList,\n  MessageCircle,\n  Pin,\n  Plus,\n  Rows3,\n  Search,\n  SlidersHorizontal,\n  X,\n} from \"lucide-react\";\nimport { cn } from \"../utils/cn\";\nimport { ConversationCard } from \"../components/ConversationCard\";\nimport { EmptyState, PageLayout } from \"../components/PageLayout\";\nimport {\n  useSearchConversations,\n  useGetConversations,\n} from \"../hooks/useConversationQueries\";\nimport { useConversationStream } from \"../hooks/useMessageSubscriptions\";\nimport { useConversations } from \"../providers/ConversationsProvider\";\nimport { useConversationsStore } from \"../store/conversationsStore\";\nimport type { Conversation, ConversationFilter } from \"../types\";\nimport { PermissionGuard } from \"../components/PermissionGuard\";\nimport { CONVERSATIONS_PERMISSIONS } from \"../constants/permissions\";\nimport { useTr } from \"../utils/i18n\";\nimport { joinPath } from \"../utils/navigation\";\n\n// Default filter shape applied whenever the `?filter=` URL param is absent\n// or unrecognised. Covers every dimension on `ConversationFilter` except\n// `searchQuery` — the text search is independent of URL-driven filters and\n// must not be wiped when the URL flips between filter values.\n//\n// The boolean toggles (hasUnread / isPinned / isMuted) are explicitly set\n// to `undefined` here (rather than omitted). Zustand's `set` merges\n// shallowly — the store's `updateConversationFilter` does\n// `{ ...currentFilter, ...partial }` — so an omitted key would preserve the\n// previous value, leaving a toggle like `hasUnread: true` sticky across a\n// URL that drops the filter param. Typing the constant as\n// `Partial<ConversationFilter>` widens the type so the explicit\n// `undefined` entries are accepted as `boolean | undefined` rather than\n// narrowed to the literal `undefined` under `as const`.\nconst FILTER_DEFAULTS: Partial<ConversationFilter> = {\n  state: \"all\",\n  type: \"all\",\n  visibility: \"all\",\n  hasUnread: undefined,\n  isPinned: undefined,\n  isMuted: undefined,\n};\n\ninterface ConversationListPageProps {\n  forcedFilterParam?: \"channel\" | \"direct\" | \"group\" | \"archived\";\n}\n\nexport function ConversationListPage({\n  forcedFilterParam,\n}: ConversationListPageProps = {}) {\n  const navigate = useNavigate();\n  const { basePath, onConversationSelect } = useConversations();\n  const bus = useEventBus();\n  const tr = useTr();\n  const {\n    searchQuery,\n    setSearchQuery,\n    viewMode,\n    setViewMode,\n    conversationFilter,\n    updateConversationFilter,\n    activeConversationId,\n    setActiveConversationId,\n  } = useConversationsStore();\n  const [showFilters, setShowFilters] = useState(false);\n  const [searchParams] = useSearchParams();\n\n  // Sync URL filter param (?filter=channel|direct|group|archived) to the store\n  // on mount / URL change. When the param is absent or unrecognised, reset\n  // every filter dimension to its module-level default (`FILTER_DEFAULTS`) —\n  // but deliberately do NOT touch `searchQuery`. The list's text search is\n  // independent of URL-driven filters; zeroing it here would wipe in-progress\n  // searches every time the URL flips between filter values or drops the\n  // param entirely. Using `updateConversationFilter` with an explicit\n  // full-defaults payload (instead of the store's `resetConversationFilter`)\n  // keeps the merge exhaustive for filter dimensions while leaving\n  // `searchQuery` alone.\n  useEffect(() => {\n    const filterParam = forcedFilterParam ?? searchParams.get(\"filter\");\n\n    if (!filterParam) {\n      updateConversationFilter(FILTER_DEFAULTS);\n      setShowFilters(false);\n      return;\n    }\n\n    const filterMap: Record<string, string> = {\n      channel: \"CHANNEL\",\n      direct: \"DIRECT\",\n      group: \"GROUP\",\n      archived: \"ARCHIVED\",\n    };\n\n    const mapped = filterMap[filterParam.toLowerCase()];\n    if (!mapped) {\n      updateConversationFilter(FILTER_DEFAULTS);\n      setShowFilters(false);\n      return;\n    }\n\n    // Start from a clean filter baseline (still preserving searchQuery) then\n    // apply the URL-driven dimension, so switching between ?filter=direct and\n    // ?filter=archived can't mix the boolean toggles from the previous URL.\n    if (mapped === \"ARCHIVED\") {\n      updateConversationFilter({ ...FILTER_DEFAULTS, state: \"ARCHIVED\" });\n    } else {\n      updateConversationFilter({\n        ...FILTER_DEFAULTS,\n        type: mapped as \"CHANNEL\" | \"DIRECT\" | \"GROUP\",\n      });\n    }\n    setShowFilters(true);\n  }, [forcedFilterParam, searchParams, updateConversationFilter]);\n\n  const {\n    conversations: baseConversations,\n    loading,\n    error,\n  } = useGetConversations({\n    first: 50,\n    types:\n      conversationFilter.type === \"all\" ? undefined : [conversationFilter.type],\n    hasUnread: conversationFilter.hasUnread,\n    isPinned: conversationFilter.isPinned,\n  });\n\n  // Live conversation lifecycle stream — keeps the list current without polling.\n  // Apollo cache updates are handled inside the hook (append on add, evict on\n  // delete, normalisation handles updates).\n  useConversationStream();\n\n  const {\n    conversations: searchedConversations,\n    loading: searchLoading,\n    error: searchError,\n  } = useSearchConversations(searchQuery);\n\n  const conversations = useMemo(\n    () => (searchQuery.trim() ? searchedConversations : baseConversations),\n    [searchQuery, searchedConversations, baseConversations],\n  );\n\n  const filteredConversations = useMemo(() => {\n    if (conversationFilter.state === \"all\") return conversations;\n    return conversations.filter(\n      (conversation) => conversation.state === conversationFilter.state,\n    );\n  }, [conversations, conversationFilter.state]);\n\n  const pinnedConversations = useMemo(\n    () => filteredConversations.filter((conversation) => conversation.isPinned),\n    [filteredConversations],\n  );\n\n  const unpinnedConversations = useMemo(\n    () =>\n      filteredConversations.filter((conversation) => !conversation.isPinned),\n    [filteredConversations],\n  );\n\n  const totalUnread = useMemo(\n    () =>\n      filteredConversations.reduce(\n        (count, conversation) => count + conversation.unreadCount,\n        0,\n      ),\n    [filteredConversations],\n  );\n\n  const handleConversationClick = useCallback(\n    (conversation: Conversation) => {\n      setActiveConversationId(conversation.id);\n      onConversationSelect?.(conversation);\n      bus.emit(\"conversations.conversation.opened\", {\n        conversationId: conversation.id,\n        conversationType: conversation.type,\n      });\n\n      if (conversation.sourceContext?.contextHref) {\n        try {\n          const url = new URL(conversation.sourceContext.contextHref);\n          if (url.origin === window.location.origin) {\n            navigate(`${url.pathname}${url.search}${url.hash}`);\n            return;\n          }\n        } catch {\n          // Fall back to conversation detail below.\n        }\n      }\n\n      navigate(joinPath(basePath || \"/conversations\", conversation.id));\n    },\n    [basePath, bus, navigate, onConversationSelect, setActiveConversationId],\n  );\n\n  const isLoading = loading || searchLoading;\n  const activeError = error ?? searchError;\n  const subtitle = [\n    `${filteredConversations.length} ${tr(\"conversations.countLabel\", \"conversations\")}`,\n    totalUnread > 0\n      ? `${totalUnread} ${tr(\"conversations.unreadCountLabel\", \"unread\")}`\n      : null,\n  ]\n    .filter(Boolean)\n    .join(\" · \");\n\n  return (\n    <PageLayout\n      title={tr(\"conversations.title\", \"Conversations\")}\n      subtitle={subtitle}\n      icon={<MessageCircle size={24} />}\n      maxWidth=\"2xl\"\n      headerActions={\n        <button\n          type=\"button\"\n          onClick={() =>\n            navigate(joinPath(basePath || \"/conversations\", \"new\"))\n          }\n          aria-label={tr(\n            \"conversations.createNewConversation\",\n            \"Create a new conversation\",\n          )}\n          className=\"inline-flex items-center gap-2 px-4 py-2 text-sm font-medium rounded-lg bg-primary text-primary-foreground hover:bg-primary/90 transition-colors shadow-sm\"\n        >\n          <Plus size={16} />\n          {tr(\"conversations.newConversation\", \"New Conversation\")}\n        </button>\n      }\n    >\n      <div className=\"space-y-3\">\n        <div className=\"flex items-center gap-2\">\n          <div className=\"relative flex-1\">\n            <Search\n              size={16}\n              className=\"absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground\"\n            />\n            <input\n              aria-label={tr(\"conversations.search\", \"Search conversations\")}\n              type=\"text\"\n              placeholder={tr(\n                \"conversations.search\",\n                \"Search conversations...\",\n              )}\n              value={searchQuery}\n              onChange={(event) => setSearchQuery(event.target.value)}\n              className=\"w-full pl-9 pr-8 py-2 text-sm rounded-lg border border-border bg-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring\"\n            />\n            {searchQuery && (\n              <button\n                type=\"button\"\n                onClick={() => setSearchQuery(\"\")}\n                aria-label={tr(\n                  \"conversations.clearSearch\",\n                  \"Clear conversation search\",\n                )}\n                className=\"absolute right-2 top-1/2 -translate-y-1/2 p-0.5 rounded text-muted-foreground hover:text-foreground\"\n              >\n                <X size={14} />\n              </button>\n            )}\n          </div>\n\n          <button\n            type=\"button\"\n            onClick={() => setShowFilters((state) => !state)}\n            aria-label={\n              showFilters\n                ? tr(\"conversations.hideFilters\", \"Hide conversation filters\")\n                : tr(\"conversations.showFilters\", \"Show conversation filters\")\n            }\n            aria-pressed={showFilters}\n            className={cn(\n              \"p-2 rounded-lg border transition-colors\",\n              showFilters\n                ? \"bg-primary/10 border-primary/30 text-primary\"\n                : \"border-border text-muted-foreground hover:text-foreground hover:bg-muted/50\",\n            )}\n          >\n            <SlidersHorizontal size={16} />\n          </button>\n\n          <div className=\"flex items-center border border-border rounded-lg overflow-hidden\">\n            <ViewModeButton\n              active={viewMode === \"list\"}\n              icon={<LayoutList size={14} />}\n              label={tr(\"conversations.listView\", \"List view\")}\n              onClick={() => setViewMode(\"list\")}\n            />\n            <ViewModeButton\n              active={viewMode === \"grid\"}\n              icon={<LayoutGrid size={14} />}\n              label={tr(\"conversations.gridView\", \"Grid view\")}\n              onClick={() => setViewMode(\"grid\")}\n            />\n            <ViewModeButton\n              active={viewMode === \"compact\"}\n              icon={<Rows3 size={14} />}\n              label={tr(\"conversations.compactView\", \"Compact view\")}\n              onClick={() => setViewMode(\"compact\")}\n            />\n          </div>\n        </div>\n\n        {showFilters && (\n          <div className=\"flex flex-wrap gap-2 animate-in fade-in-0 slide-in-from-top-2 duration-200\">\n            <FilterChip\n              label={tr(\"conversations.all\", \"All\")}\n              active={conversationFilter.type === \"all\"}\n              onClick={() => updateConversationFilter({ type: \"all\" })}\n            />\n            <FilterChip\n              label={tr(\"conversations.direct\", \"Direct\")}\n              active={conversationFilter.type === \"DIRECT\"}\n              onClick={() => updateConversationFilter({ type: \"DIRECT\" })}\n            />\n            <FilterChip\n              label={tr(\"conversations.groups\", \"Groups\")}\n              active={conversationFilter.type === \"GROUP\"}\n              onClick={() => updateConversationFilter({ type: \"GROUP\" })}\n            />\n            <FilterChip\n              label={tr(\"conversations.channels\", \"Channels\")}\n              active={conversationFilter.type === \"CHANNEL\"}\n              onClick={() => updateConversationFilter({ type: \"CHANNEL\" })}\n            />\n            <div className=\"w-px h-6 bg-border self-center\" />\n            <FilterChip\n              label={tr(\"conversations.unread\", \"Unread\")}\n              icon={<Filter size={12} />}\n              active={conversationFilter.hasUnread === true}\n              onClick={() =>\n                updateConversationFilter({\n                  hasUnread: conversationFilter.hasUnread ? undefined : true,\n                })\n              }\n            />\n            <FilterChip\n              label={tr(\"conversations.pinned\", \"Pinned\")}\n              icon={<Pin size={12} />}\n              active={conversationFilter.isPinned === true}\n              onClick={() =>\n                updateConversationFilter({\n                  isPinned: conversationFilter.isPinned ? undefined : true,\n                })\n              }\n            />\n            <FilterChip\n              label={tr(\"conversations.archived\", \"Archived\")}\n              icon={<Archive size={12} />}\n              active={conversationFilter.state === \"ARCHIVED\"}\n              onClick={() =>\n                updateConversationFilter({\n                  state:\n                    conversationFilter.state === \"ARCHIVED\"\n                      ? \"all\"\n                      : \"ARCHIVED\",\n                })\n              }\n            />\n          </div>\n        )}\n      </div>\n\n      {isLoading ? (\n        <div className=\"px-4 py-8 text-sm text-muted-foreground\">\n          {tr(\"conversations.loading\", \"Loading conversations...\")}\n        </div>\n      ) : activeError ? (\n        <EmptyState\n          icon={<MessageCircle size={32} />}\n          title={tr(\n            \"conversations.couldNotLoad\",\n            \"Could not load conversations\",\n          )}\n          description={activeError.message}\n        />\n      ) : filteredConversations.length === 0 ? (\n        <EmptyState\n          icon={<MessageCircle size={32} />}\n          title={tr(\"conversations.noConversations\", \"No conversations found\")}\n          description={\n            searchQuery\n              ? `${tr(\"conversations.noMatchingConversations\", \"No conversations matching\")} \"${searchQuery}\"`\n              : tr(\n                  \"conversations.startConversationPrompt\",\n                  \"Start a new conversation to get going\",\n                )\n          }\n        />\n      ) : (\n        <div className=\"space-y-1\">\n          {pinnedConversations.length > 0 && (\n            <div>\n              <div className=\"flex items-center gap-1.5 px-4 py-2\">\n                <Pin size={12} className=\"text-muted-foreground\" />\n                <span className=\"text-xs font-medium text-muted-foreground uppercase tracking-wider\">\n                  {tr(\"conversations.pinned\", \"Pinned\")}\n                </span>\n              </div>\n              {pinnedConversations.map((conversation) => (\n                <ConversationCard\n                  key={conversation.id}\n                  conversation={conversation}\n                  isActive={activeConversationId === conversation.id}\n                  onClick={handleConversationClick}\n                />\n              ))}\n            </div>\n          )}\n\n          {unpinnedConversations.length > 0 && (\n            <div>\n              {pinnedConversations.length > 0 && (\n                <div className=\"flex items-center gap-1.5 px-4 py-2 mt-2\">\n                  <span className=\"text-xs font-medium text-muted-foreground uppercase tracking-wider\">\n                    {tr(\"conversations.allConversations\", \"All Conversations\")}\n                  </span>\n                </div>\n              )}\n              {unpinnedConversations.map((conversation) => (\n                <ConversationCard\n                  key={conversation.id}\n                  conversation={conversation}\n                  isActive={activeConversationId === conversation.id}\n                  onClick={handleConversationClick}\n                />\n              ))}\n            </div>\n          )}\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n\nfunction ViewModeButton({\n  active,\n  icon,\n  label,\n  onClick,\n}: {\n  active: boolean;\n  icon: React.ReactNode;\n  label: string;\n  onClick: () => void;\n}) {\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      aria-label={label}\n      aria-pressed={active}\n      className={cn(\n        \"p-1.5 transition-colors\",\n        active\n          ? \"bg-primary/10 text-primary\"\n          : \"text-muted-foreground hover:text-foreground\",\n      )}\n    >\n      {icon}\n    </button>\n  );\n}\n\nfunction FilterChip({\n  label,\n  icon,\n  active,\n  onClick,\n}: {\n  label: string;\n  icon?: React.ReactNode;\n  active: boolean;\n  onClick: () => void;\n}) {\n  return (\n    <PermissionGuard\n      permission={CONVERSATIONS_PERMISSIONS.CONVERSATION_LIST}\n      allowUnavailablePermissions\n    >\n      <button\n        type=\"button\"\n        onClick={onClick}\n        aria-pressed={active}\n        className={cn(\n          \"inline-flex items-center gap-1 px-3 py-1 text-xs font-medium rounded-full border transition-colors\",\n          active\n            ? \"bg-primary/10 border-primary/30 text-primary\"\n            : \"bg-background border-border text-muted-foreground hover:text-foreground hover:bg-muted/50\",\n        )}\n      >\n        {icon}\n        {label}\n      </button>\n    </PermissionGuard>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ConversationListPage.js","names":[],"sources":["../../../src/conversations/pages/ConversationListPage.tsx"],"sourcesContent":["import {\n  useMemo,\n  useState,\n  useCallback,\n  useDeferredValue,\n  useEffect,\n} from \"react\";\nimport { useEventBus } from \"@burdenoff/fe-libs/shared/events\";\nimport { useNavigate, useSearchParams } from \"react-router-dom\";\nimport {\n  Archive,\n  Filter,\n  LayoutGrid,\n  LayoutList,\n  MessageCircle,\n  Pin,\n  Plus,\n  Rows3,\n  Search,\n  SlidersHorizontal,\n  X,\n} from \"lucide-react\";\nimport { cn } from \"../utils/cn\";\nimport { ConversationCard } from \"../components/ConversationCard\";\nimport { EmptyState, PageLayout } from \"../components/PageLayout\";\nimport {\n  useSearchConversations,\n  useGetConversations,\n} from \"../hooks/useConversationQueries\";\nimport { useConversationStream } from \"../hooks/useMessageSubscriptions\";\nimport { useConversations } from \"../providers/ConversationsProvider\";\nimport { useConversationsStore } from \"../store/conversationsStore\";\nimport type { Conversation, ConversationFilter } from \"../types\";\nimport { PermissionGuard } from \"../components/PermissionGuard\";\nimport { CONVERSATIONS_PERMISSIONS } from \"../constants/permissions\";\nimport { useTr } from \"../utils/i18n\";\nimport { joinPath } from \"../utils/navigation\";\n\n// Default filter shape applied whenever the `?filter=` URL param is absent\n// or unrecognised. Covers every dimension on `ConversationFilter` except\n// `searchQuery` — the text search is independent of URL-driven filters and\n// must not be wiped when the URL flips between filter values.\n//\n// The boolean toggles (hasUnread / isPinned / isMuted) are explicitly set\n// to `undefined` here (rather than omitted). Zustand's `set` merges\n// shallowly — the store's `updateConversationFilter` does\n// `{ ...currentFilter, ...partial }` — so an omitted key would preserve the\n// previous value, leaving a toggle like `hasUnread: true` sticky across a\n// URL that drops the filter param. Typing the constant as\n// `Partial<ConversationFilter>` widens the type so the explicit\n// `undefined` entries are accepted as `boolean | undefined` rather than\n// narrowed to the literal `undefined` under `as const`.\nconst FILTER_DEFAULTS: Partial<ConversationFilter> = {\n  state: \"all\",\n  type: \"all\",\n  visibility: \"all\",\n  hasUnread: undefined,\n  isPinned: undefined,\n  isMuted: undefined,\n};\n\nfunction useDebouncedValue<T>(value: T, delayMs: number): T {\n  const [debouncedValue, setDebouncedValue] = useState(value);\n\n  useEffect(() => {\n    const timeoutId = window.setTimeout(\n      () => setDebouncedValue(value),\n      delayMs,\n    );\n    return () => window.clearTimeout(timeoutId);\n  }, [delayMs, value]);\n\n  return debouncedValue;\n}\n\nexport interface ConversationListPageProps {\n  forcedFilterParam?: \"channel\" | \"direct\" | \"group\" | \"archived\";\n}\n\nexport function ConversationListPage({\n  forcedFilterParam,\n}: ConversationListPageProps = {}) {\n  const navigate = useNavigate();\n  const { basePath, onConversationSelect } = useConversations();\n  const bus = useEventBus();\n  const tr = useTr();\n  const {\n    searchQuery,\n    setSearchQuery,\n    viewMode,\n    setViewMode,\n    conversationFilter,\n    updateConversationFilter,\n    activeConversationId,\n    setActiveConversationId,\n  } = useConversationsStore();\n  const [showFilters, setShowFilters] = useState(false);\n  const [searchParams] = useSearchParams();\n  const debouncedSearchQuery = useDebouncedValue(searchQuery, 250);\n  const deferredSearchQuery = useDeferredValue(debouncedSearchQuery);\n  const trimmedSearchQuery = deferredSearchQuery.trim();\n  const isSearchActive = trimmedSearchQuery.length >= 2;\n\n  // Sync URL filter param (?filter=channel|direct|group|archived) to the store\n  // on mount / URL change. When the param is absent or unrecognised, reset\n  // every filter dimension to its module-level default (`FILTER_DEFAULTS`) —\n  // but deliberately do NOT touch `searchQuery`. The list's text search is\n  // independent of URL-driven filters; zeroing it here would wipe in-progress\n  // searches every time the URL flips between filter values or drops the\n  // param entirely. Using `updateConversationFilter` with an explicit\n  // full-defaults payload (instead of the store's `resetConversationFilter`)\n  // keeps the merge exhaustive for filter dimensions while leaving\n  // `searchQuery` alone.\n  useEffect(() => {\n    const filterParam = forcedFilterParam ?? searchParams.get(\"filter\");\n\n    if (!filterParam) {\n      updateConversationFilter(FILTER_DEFAULTS);\n      setShowFilters(false);\n      return;\n    }\n\n    const filterMap: Record<string, string> = {\n      channel: \"CHANNEL\",\n      direct: \"DIRECT\",\n      group: \"GROUP\",\n      archived: \"ARCHIVED\",\n    };\n\n    const mapped = filterMap[filterParam.toLowerCase()];\n    if (!mapped) {\n      updateConversationFilter(FILTER_DEFAULTS);\n      setShowFilters(false);\n      return;\n    }\n\n    // Start from a clean filter baseline (still preserving searchQuery) then\n    // apply the URL-driven dimension, so switching between ?filter=direct and\n    // ?filter=archived can't mix the boolean toggles from the previous URL.\n    if (mapped === \"ARCHIVED\") {\n      updateConversationFilter({ ...FILTER_DEFAULTS, state: \"ARCHIVED\" });\n    } else {\n      updateConversationFilter({\n        ...FILTER_DEFAULTS,\n        type: mapped as \"CHANNEL\" | \"DIRECT\" | \"GROUP\",\n      });\n    }\n    setShowFilters(true);\n  }, [forcedFilterParam, searchParams, updateConversationFilter]);\n\n  const {\n    conversations: baseConversations,\n    loading,\n    error,\n  } = useGetConversations({\n    first: 50,\n    types:\n      conversationFilter.type === \"all\" ? undefined : [conversationFilter.type],\n    hasUnread: conversationFilter.hasUnread,\n    isPinned: conversationFilter.isPinned,\n  });\n\n  // Live conversation lifecycle stream — keeps the list current without polling.\n  // Apollo cache updates are handled inside the hook (append on add, evict on\n  // delete, normalisation handles updates).\n  useConversationStream();\n\n  const {\n    conversations: searchedConversations,\n    loading: searchLoading,\n    error: searchError,\n  } = useSearchConversations(deferredSearchQuery);\n\n  const conversations = useMemo(\n    () => (isSearchActive ? searchedConversations : baseConversations),\n    [isSearchActive, searchedConversations, baseConversations],\n  );\n\n  const filteredConversations = useMemo(() => {\n    if (conversationFilter.state === \"all\") return conversations;\n    return conversations.filter(\n      (conversation) => conversation.state === conversationFilter.state,\n    );\n  }, [conversations, conversationFilter.state]);\n\n  const pinnedConversations = useMemo(\n    () => filteredConversations.filter((conversation) => conversation.isPinned),\n    [filteredConversations],\n  );\n\n  const unpinnedConversations = useMemo(\n    () =>\n      filteredConversations.filter((conversation) => !conversation.isPinned),\n    [filteredConversations],\n  );\n\n  const totalUnread = useMemo(\n    () =>\n      filteredConversations.reduce(\n        (count, conversation) => count + conversation.unreadCount,\n        0,\n      ),\n    [filteredConversations],\n  );\n\n  const handleConversationClick = useCallback(\n    (conversation: Conversation) => {\n      setActiveConversationId(conversation.id);\n      onConversationSelect?.(conversation);\n      bus.emit(\"conversations.conversation.opened\", {\n        conversationId: conversation.id,\n        conversationType: conversation.type,\n      });\n\n      if (conversation.sourceContext?.contextHref) {\n        try {\n          const url = new URL(conversation.sourceContext.contextHref);\n          if (url.origin === window.location.origin) {\n            navigate(`${url.pathname}${url.search}${url.hash}`);\n            return;\n          }\n        } catch {\n          // Fall back to conversation detail below.\n        }\n      }\n\n      navigate(joinPath(basePath || \"/conversations\", conversation.id));\n    },\n    [basePath, bus, navigate, onConversationSelect, setActiveConversationId],\n  );\n\n  const isLoading = loading || searchLoading;\n  const activeError = error ?? searchError;\n  const subtitle = [\n    `${filteredConversations.length} ${tr(\"conversations.countLabel\", \"conversations\")}`,\n    totalUnread > 0\n      ? `${totalUnread} ${tr(\"conversations.unreadCountLabel\", \"unread\")}`\n      : null,\n  ]\n    .filter(Boolean)\n    .join(\" · \");\n\n  return (\n    <PageLayout\n      title={tr(\"conversations.title\", \"Conversations\")}\n      subtitle={subtitle}\n      icon={<MessageCircle size={24} />}\n      maxWidth=\"2xl\"\n      headerActions={\n        <button\n          type=\"button\"\n          onClick={() =>\n            navigate(joinPath(basePath || \"/conversations\", \"new\"))\n          }\n          aria-label={tr(\n            \"conversations.createNewConversation\",\n            \"Create a new conversation\",\n          )}\n          className=\"inline-flex items-center gap-2 px-4 py-2 text-sm font-medium rounded-lg bg-primary text-primary-foreground hover:bg-primary/90 transition-colors shadow-sm\"\n        >\n          <Plus size={16} />\n          {tr(\"conversations.newConversation\", \"New Conversation\")}\n        </button>\n      }\n    >\n      <div className=\"space-y-3\">\n        <div className=\"flex flex-wrap items-center gap-2\">\n          <div className=\"relative min-w-[14rem] flex-1\">\n            <Search\n              size={16}\n              className=\"absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground\"\n            />\n            <input\n              aria-label={tr(\"conversations.search\", \"Search conversations\")}\n              type=\"text\"\n              placeholder={tr(\n                \"conversations.search\",\n                \"Search conversations...\",\n              )}\n              value={searchQuery}\n              onChange={(event) => setSearchQuery(event.target.value)}\n              className=\"w-full pl-9 pr-8 py-2 text-sm rounded-lg border border-border bg-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring\"\n            />\n            {searchQuery && (\n              <button\n                type=\"button\"\n                onClick={() => setSearchQuery(\"\")}\n                aria-label={tr(\n                  \"conversations.clearSearch\",\n                  \"Clear conversation search\",\n                )}\n                className=\"absolute right-2 top-1/2 -translate-y-1/2 p-0.5 rounded text-muted-foreground hover:text-foreground\"\n              >\n                <X size={14} />\n              </button>\n            )}\n          </div>\n\n          <button\n            type=\"button\"\n            onClick={() => setShowFilters((state) => !state)}\n            aria-label={\n              showFilters\n                ? tr(\"conversations.hideFilters\", \"Hide conversation filters\")\n                : tr(\"conversations.showFilters\", \"Show conversation filters\")\n            }\n            aria-pressed={showFilters}\n            className={cn(\n              \"p-2 rounded-lg border transition-colors\",\n              showFilters\n                ? \"bg-primary/10 border-primary/30 text-primary\"\n                : \"border-border text-muted-foreground hover:text-foreground hover:bg-muted/50\",\n            )}\n          >\n            <SlidersHorizontal size={16} />\n          </button>\n\n          <div className=\"flex items-center border border-border rounded-lg overflow-hidden\">\n            <ViewModeButton\n              active={viewMode === \"list\"}\n              icon={<LayoutList size={14} />}\n              label={tr(\"conversations.listView\", \"List view\")}\n              onClick={() => setViewMode(\"list\")}\n            />\n            <ViewModeButton\n              active={viewMode === \"grid\"}\n              icon={<LayoutGrid size={14} />}\n              label={tr(\"conversations.gridView\", \"Grid view\")}\n              onClick={() => setViewMode(\"grid\")}\n            />\n            <ViewModeButton\n              active={viewMode === \"compact\"}\n              icon={<Rows3 size={14} />}\n              label={tr(\"conversations.compactView\", \"Compact view\")}\n              onClick={() => setViewMode(\"compact\")}\n            />\n          </div>\n        </div>\n\n        {showFilters && (\n          <div className=\"flex flex-wrap gap-2 animate-in fade-in-0 slide-in-from-top-2 duration-200\">\n            <FilterChip\n              label={tr(\"conversations.all\", \"All\")}\n              active={conversationFilter.type === \"all\"}\n              onClick={() => updateConversationFilter({ type: \"all\" })}\n            />\n            <FilterChip\n              label={tr(\"conversations.direct\", \"Direct\")}\n              active={conversationFilter.type === \"DIRECT\"}\n              onClick={() => updateConversationFilter({ type: \"DIRECT\" })}\n            />\n            <FilterChip\n              label={tr(\"conversations.groups\", \"Groups\")}\n              active={conversationFilter.type === \"GROUP\"}\n              onClick={() => updateConversationFilter({ type: \"GROUP\" })}\n            />\n            <FilterChip\n              label={tr(\"conversations.channels\", \"Channels\")}\n              active={conversationFilter.type === \"CHANNEL\"}\n              onClick={() => updateConversationFilter({ type: \"CHANNEL\" })}\n            />\n            <div className=\"w-px h-6 bg-border self-center\" />\n            <FilterChip\n              label={tr(\"conversations.unread\", \"Unread\")}\n              icon={<Filter size={12} />}\n              active={conversationFilter.hasUnread === true}\n              onClick={() =>\n                updateConversationFilter({\n                  hasUnread: conversationFilter.hasUnread ? undefined : true,\n                })\n              }\n            />\n            <FilterChip\n              label={tr(\"conversations.pinned\", \"Pinned\")}\n              icon={<Pin size={12} />}\n              active={conversationFilter.isPinned === true}\n              onClick={() =>\n                updateConversationFilter({\n                  isPinned: conversationFilter.isPinned ? undefined : true,\n                })\n              }\n            />\n            <FilterChip\n              label={tr(\"conversations.archived\", \"Archived\")}\n              icon={<Archive size={12} />}\n              active={conversationFilter.state === \"ARCHIVED\"}\n              onClick={() =>\n                updateConversationFilter({\n                  state:\n                    conversationFilter.state === \"ARCHIVED\"\n                      ? \"all\"\n                      : \"ARCHIVED\",\n                })\n              }\n            />\n          </div>\n        )}\n      </div>\n\n      {isLoading ? (\n        <div className=\"px-4 py-8 text-sm text-muted-foreground\">\n          {tr(\"conversations.loading\", \"Loading conversations...\")}\n        </div>\n      ) : activeError ? (\n        <EmptyState\n          icon={<MessageCircle size={32} />}\n          title={tr(\n            \"conversations.couldNotLoad\",\n            \"Could not load conversations\",\n          )}\n          description={activeError.message}\n        />\n      ) : filteredConversations.length === 0 ? (\n        <EmptyState\n          icon={<MessageCircle size={32} />}\n          title={tr(\"conversations.noConversations\", \"No conversations found\")}\n          description={\n            isSearchActive\n              ? `${tr(\"conversations.noMatchingConversations\", \"No conversations matching\")} \"${searchQuery}\"`\n              : tr(\n                  \"conversations.startConversationPrompt\",\n                  \"Start a new conversation to get going\",\n                )\n          }\n        />\n      ) : (\n        <div className=\"space-y-1\">\n          {pinnedConversations.length > 0 && (\n            <div>\n              <div className=\"flex items-center gap-1.5 px-4 py-2\">\n                <Pin size={12} className=\"text-muted-foreground\" />\n                <span className=\"text-xs font-medium text-muted-foreground uppercase tracking-wider\">\n                  {tr(\"conversations.pinned\", \"Pinned\")}\n                </span>\n              </div>\n              {pinnedConversations.map((conversation) => (\n                <ConversationCard\n                  key={conversation.id}\n                  conversation={conversation}\n                  isActive={activeConversationId === conversation.id}\n                  onClick={handleConversationClick}\n                />\n              ))}\n            </div>\n          )}\n\n          {unpinnedConversations.length > 0 && (\n            <div>\n              {pinnedConversations.length > 0 && (\n                <div className=\"flex items-center gap-1.5 px-4 py-2 mt-2\">\n                  <span className=\"text-xs font-medium text-muted-foreground uppercase tracking-wider\">\n                    {tr(\"conversations.allConversations\", \"All Conversations\")}\n                  </span>\n                </div>\n              )}\n              {unpinnedConversations.map((conversation) => (\n                <ConversationCard\n                  key={conversation.id}\n                  conversation={conversation}\n                  isActive={activeConversationId === conversation.id}\n                  onClick={handleConversationClick}\n                />\n              ))}\n            </div>\n          )}\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n\nfunction ViewModeButton({\n  active,\n  icon,\n  label,\n  onClick,\n}: {\n  active: boolean;\n  icon: React.ReactNode;\n  label: string;\n  onClick: () => void;\n}) {\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      aria-label={label}\n      aria-pressed={active}\n      className={cn(\n        \"flex min-h-10 min-w-10 items-center justify-center p-2 transition-colors\",\n        active\n          ? \"bg-primary/10 text-primary\"\n          : \"text-muted-foreground hover:text-foreground\",\n      )}\n    >\n      {icon}\n    </button>\n  );\n}\n\nfunction FilterChip({\n  label,\n  icon,\n  active,\n  onClick,\n}: {\n  label: string;\n  icon?: React.ReactNode;\n  active: boolean;\n  onClick: () => void;\n}) {\n  return (\n    <PermissionGuard\n      permission={CONVERSATIONS_PERMISSIONS.CONVERSATION_READ}\n      allowUnavailablePermissions\n    >\n      <button\n        type=\"button\"\n        onClick={onClick}\n        aria-pressed={active}\n        className={cn(\n          \"inline-flex min-h-9 items-center gap-1 rounded-full border px-3 py-1.5 text-xs font-medium transition-colors\",\n          active\n            ? \"bg-primary/10 border-primary/30 text-primary\"\n            : \"bg-background border-border text-muted-foreground hover:text-foreground hover:bg-muted/50\",\n        )}\n      >\n        {icon}\n        {label}\n      </button>\n    </PermissionGuard>\n  );\n}\n"],"mappings":"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"}

package/dist/conversations/pages/ConversationsLandingPage.js

@@ -74,7 +74,7 @@ function h() {
 		x,
 		g
 	]), /* @__PURE__ */ l(e, {
-		permission: t.CONVERSATION_LIST,
+		permission: t.CONVERSATION_READ,
 		allowUnavailablePermissions: !0,
 		children: /* @__PURE__ */ u("main", {
 			className: "flex flex-col h-full",

package/dist/conversations/pages/ConversationsLandingPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationsLandingPage.js","names":[],"sources":["../../../src/conversations/pages/ConversationsLandingPage.tsx"],"sourcesContent":["import { useEffect, useMemo } from \"react\";\nimport { useSearchParams } from \"react-router-dom\";\nimport { Tabs, type TabItem } from \"@burdenoff/fe-libs/chrome\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\n\nimport { ConversationListPage } from \"./ConversationListPage\";\nimport { NewConversationPage } from \"./NewConversationPage\";\nimport { ConversationsSettingsPage } from \"./ConversationsSettingsPage\";\nimport { PermissionGuard } from \"../components/PermissionGuard\";\nimport { CONVERSATIONS_PERMISSIONS } from \"../constants/permissions\";\nimport { useUserFeatureFlags } from \"../hooks/useUserFeatureFlags\";\n\nconst DEFAULT_TAB_ID = \"all\";\n\n/**\n * Coming-soon placeholder shown for tabs whose dedicated pages\n * are not yet implemented in this microfrontend.\n */\nfunction ComingSoon({ title }: { title: string }) {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const value = t(key);\n    return value === key ? fallback : value;\n  };\n\n  return (\n    <div className=\"flex h-full items-center justify-center p-8 text-center\">\n      <div className=\"space-y-2\">\n        <h3 className=\"text-lg font-semibold text-foreground\">{title}</h3>\n        <p className=\"text-sm text-muted-foreground\">\n          {tr(\"conversations.comingSoon\", \"Coming soon.\")}\n        </p>\n      </div>\n    </div>\n  );\n}\n\n/**\n * Tabbed landing page for the Conversations microfrontend.\n *\n * Renders an underline tab bar at the top and swaps the active panel\n * based on the `?tab=...` URL search param. The first tab (\"all\") uses\n * a clean URL with no `tab` param.\n */\nexport function ConversationsLandingPage() {\n  const [params, setParams] = useSearchParams();\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const value = t(key);\n    return value === key ? fallback : value;\n  };\n\n  const { archivedEnabled } = useUserFeatureFlags();\n\n  const tabs: TabItem[] = useMemo(\n    () => [\n      {\n        id: DEFAULT_TAB_ID,\n        label: tr(\"conversations.allConversations\", \"All Conversations\"),\n      },\n      { id: \"channels\", label: tr(\"conversations.channels\", \"Channels\") },\n      {\n        id: \"direct\",\n        label: tr(\"conversations.directMessages\", \"Direct Messages\"),\n      },\n      { id: \"groups\", label: tr(\"conversations.groups\", \"Groups\") },\n      ...(archivedEnabled\n        ? [{ id: \"archived\", label: tr(\"conversations.archived\", \"Archived\") }]\n        : []),\n      { id: \"new\", label: tr(\"conversations.new\", \"New\") },\n      { id: \"settings\", label: tr(\"conversations.settings\", \"Settings\") },\n    ],\n    // Suppression is for `tr`, which closes over `t`; `archivedEnabled` IS listed.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [t, archivedEnabled],\n  );\n\n  const currentTab = params.get(\"tab\");\n  // Render `activeId` correctly for the archived-off case; the effect below cleans the URL lazily.\n  const activeId =\n    currentTab === \"archived\" && !archivedEnabled\n      ? DEFAULT_TAB_ID\n      : (currentTab ?? DEFAULT_TAB_ID);\n\n  useEffect(() => {\n    if (!archivedEnabled && currentTab === \"archived\") {\n      // Updater form reads the freshest params at flush time to preserve concurrent query-param changes.\n      setParams(\n        (prev) => {\n          const next = new URLSearchParams(prev);\n          next.delete(\"tab\");\n          return next;\n        },\n        { replace: true },\n      );\n    }\n  }, [archivedEnabled, currentTab, setParams]);\n\n  const handleTabChange = (id: string) => {\n    setParams(\n      (prev) => {\n        const next = new URLSearchParams(prev);\n        if (id === DEFAULT_TAB_ID) {\n          next.delete(\"tab\");\n        } else {\n          next.set(\"tab\", id);\n        }\n        return next;\n      },\n      { replace: true },\n    );\n  };\n\n  return (\n    <PermissionGuard\n      permission={CONVERSATIONS_PERMISSIONS.CONVERSATION_LIST}\n      allowUnavailablePermissions\n    >\n      <main\n        className=\"flex flex-col h-full\"\n        aria-labelledby=\"conversations-page-heading\"\n      >\n        <h1 id=\"conversations-page-heading\" className=\"sr-only\">\n          {tr(\"conversations.title\", \"Conversations\")}\n        </h1>\n        <div className=\"border-b border-border-subtle px-4 pt-3\">\n          <Tabs\n            items={tabs}\n            activeTabId={activeId}\n            onTabChange={handleTabChange}\n            variant=\"underline\"\n          />\n        </div>\n        <div\n          className=\"flex-1 min-h-0 overflow-auto\"\n          role=\"region\"\n          aria-live=\"polite\"\n          aria-label={tr(\n            \"conversations.activePanel\",\n            \"Active conversations panel\",\n          )}\n        >\n          {activeId === \"all\" && <ConversationListPage />}\n          {activeId === \"channels\" && (\n            <ConversationListPage forcedFilterParam=\"channel\" />\n          )}\n          {activeId === \"direct\" && (\n            <ConversationListPage forcedFilterParam=\"direct\" />\n          )}\n          {activeId === \"groups\" && (\n            <ConversationListPage forcedFilterParam=\"group\" />\n          )}\n          {activeId === \"archived\" && (\n            <ComingSoon\n              title={tr(\n                \"conversations.archivedTitle\",\n                \"Archived Conversations\",\n              )}\n            />\n          )}\n          {activeId === \"new\" && <NewConversationPage />}\n          {activeId === \"settings\" && <ConversationsSettingsPage />}\n        </div>\n      </main>\n    </PermissionGuard>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ConversationsLandingPage.js","names":[],"sources":["../../../src/conversations/pages/ConversationsLandingPage.tsx"],"sourcesContent":["import { useEffect, useMemo } from \"react\";\nimport { useSearchParams } from \"react-router-dom\";\nimport { Tabs, type TabItem } from \"@burdenoff/fe-libs/chrome\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\n\nimport { ConversationListPage } from \"./ConversationListPage\";\nimport { NewConversationPage } from \"./NewConversationPage\";\nimport { ConversationsSettingsPage } from \"./ConversationsSettingsPage\";\nimport { PermissionGuard } from \"../components/PermissionGuard\";\nimport { CONVERSATIONS_PERMISSIONS } from \"../constants/permissions\";\nimport { useUserFeatureFlags } from \"../hooks/useUserFeatureFlags\";\n\nconst DEFAULT_TAB_ID = \"all\";\n\n/**\n * Coming-soon placeholder shown for tabs whose dedicated pages\n * are not yet implemented in this microfrontend.\n */\nfunction ComingSoon({ title }: { title: string }) {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const value = t(key);\n    return value === key ? fallback : value;\n  };\n\n  return (\n    <div className=\"flex h-full items-center justify-center p-8 text-center\">\n      <div className=\"space-y-2\">\n        <h3 className=\"text-lg font-semibold text-foreground\">{title}</h3>\n        <p className=\"text-sm text-muted-foreground\">\n          {tr(\"conversations.comingSoon\", \"Coming soon.\")}\n        </p>\n      </div>\n    </div>\n  );\n}\n\n/**\n * Tabbed landing page for the Conversations microfrontend.\n *\n * Renders an underline tab bar at the top and swaps the active panel\n * based on the `?tab=...` URL search param. The first tab (\"all\") uses\n * a clean URL with no `tab` param.\n */\nexport function ConversationsLandingPage() {\n  const [params, setParams] = useSearchParams();\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const value = t(key);\n    return value === key ? fallback : value;\n  };\n\n  const { archivedEnabled } = useUserFeatureFlags();\n\n  const tabs: TabItem[] = useMemo(\n    () => [\n      {\n        id: DEFAULT_TAB_ID,\n        label: tr(\"conversations.allConversations\", \"All Conversations\"),\n      },\n      { id: \"channels\", label: tr(\"conversations.channels\", \"Channels\") },\n      {\n        id: \"direct\",\n        label: tr(\"conversations.directMessages\", \"Direct Messages\"),\n      },\n      { id: \"groups\", label: tr(\"conversations.groups\", \"Groups\") },\n      ...(archivedEnabled\n        ? [{ id: \"archived\", label: tr(\"conversations.archived\", \"Archived\") }]\n        : []),\n      { id: \"new\", label: tr(\"conversations.new\", \"New\") },\n      { id: \"settings\", label: tr(\"conversations.settings\", \"Settings\") },\n    ],\n    // Suppression is for `tr`, which closes over `t`; `archivedEnabled` IS listed.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [t, archivedEnabled],\n  );\n\n  const currentTab = params.get(\"tab\");\n  // Render `activeId` correctly for the archived-off case; the effect below cleans the URL lazily.\n  const activeId =\n    currentTab === \"archived\" && !archivedEnabled\n      ? DEFAULT_TAB_ID\n      : (currentTab ?? DEFAULT_TAB_ID);\n\n  useEffect(() => {\n    if (!archivedEnabled && currentTab === \"archived\") {\n      // Updater form reads the freshest params at flush time to preserve concurrent query-param changes.\n      setParams(\n        (prev) => {\n          const next = new URLSearchParams(prev);\n          next.delete(\"tab\");\n          return next;\n        },\n        { replace: true },\n      );\n    }\n  }, [archivedEnabled, currentTab, setParams]);\n\n  const handleTabChange = (id: string) => {\n    setParams(\n      (prev) => {\n        const next = new URLSearchParams(prev);\n        if (id === DEFAULT_TAB_ID) {\n          next.delete(\"tab\");\n        } else {\n          next.set(\"tab\", id);\n        }\n        return next;\n      },\n      { replace: true },\n    );\n  };\n\n  return (\n    <PermissionGuard\n      permission={CONVERSATIONS_PERMISSIONS.CONVERSATION_READ}\n      allowUnavailablePermissions\n    >\n      <main\n        className=\"flex flex-col h-full\"\n        aria-labelledby=\"conversations-page-heading\"\n      >\n        <h1 id=\"conversations-page-heading\" className=\"sr-only\">\n          {tr(\"conversations.title\", \"Conversations\")}\n        </h1>\n        <div className=\"border-b border-border-subtle px-4 pt-3\">\n          <Tabs\n            items={tabs}\n            activeTabId={activeId}\n            onTabChange={handleTabChange}\n            variant=\"underline\"\n          />\n        </div>\n        <div\n          className=\"flex-1 min-h-0 overflow-auto\"\n          role=\"region\"\n          aria-live=\"polite\"\n          aria-label={tr(\n            \"conversations.activePanel\",\n            \"Active conversations panel\",\n          )}\n        >\n          {activeId === \"all\" && <ConversationListPage />}\n          {activeId === \"channels\" && (\n            <ConversationListPage forcedFilterParam=\"channel\" />\n          )}\n          {activeId === \"direct\" && (\n            <ConversationListPage forcedFilterParam=\"direct\" />\n          )}\n          {activeId === \"groups\" && (\n            <ConversationListPage forcedFilterParam=\"group\" />\n          )}\n          {activeId === \"archived\" && (\n            <ComingSoon\n              title={tr(\n                \"conversations.archivedTitle\",\n                \"Archived Conversations\",\n              )}\n            />\n          )}\n          {activeId === \"new\" && <NewConversationPage />}\n          {activeId === \"settings\" && <ConversationsSettingsPage />}\n        </div>\n      </main>\n    </PermissionGuard>\n  );\n}\n"],"mappings":"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"}

package/dist/conversations/pages/ConversationsSettingsPage.js

@@ -1,7 +1,7 @@
 import { useConversations as e } from "../providers/ConversationsProvider.js";
 import { PageLayout as t, PageSection as n } from "../components/PageLayout.js";
-import { useGetConversation as r, useUpdateConversation as i } from "../hooks/useConversationQueries.js";
-import { useConversationsStore as a } from "../store/conversationsStore.js";
+import { useConversationsStore as r } from "../store/conversationsStore.js";
+import { useGetConversation as i, useUpdateConversation as a } from "../hooks/useConversationQueries.js";
 import { PermissionGuard as o } from "../components/PermissionGuard.js";
 import { CONVERSATIONS_PERMISSIONS as s } from "../constants/permissions.js";
 import { nativeImpact as c, nativeNotify as l } from "../../utils/nativeBridge.js";
@@ -13,10 +13,10 @@ import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
 import { useI18n as w } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 //#region src/conversations/pages/ConversationsSettingsPage.tsx
 function T() {
-	let T = b(), { basePath: D } = e(), { activeConversationId: O } = a(), { t: k } = w(), A = (e, t) => {
+	let T = b(), { basePath: D } = e(), { activeConversationId: O } = r(), { t: k } = w(), A = (e, t) => {
 		let n = k(e);
 		return n === e ? t : n;
-	}, { conversation: j, loading: M } = r(O ?? ""), { updateConversation: N, loading: P, error: F } = i(), [I, L] = p(!0), [R, z] = p(!0), [B, V] = p("ALL"), [H, U] = p(!1), W = f(null), { exportComments: G, loading: K, downloadUrl: q } = u();
+	}, { conversation: j, loading: M } = i(O ?? ""), { updateConversation: N, loading: P, error: F } = a(), [I, L] = p(!0), [R, z] = p(!0), [B, V] = p("ALL"), [H, U] = p(!1), W = f(null), { exportComments: G, loading: K, downloadUrl: q } = u();
 	d(() => {
 		let e = j?.settings && typeof j.settings == "object" ? j.settings : null;
 		e && (typeof e.showTypingIndicators == "boolean" && L(e.showTypingIndicators), typeof e.showReadReceipts == "boolean" && z(e.showReadReceipts), typeof e.defaultNotificationLevel == "string" && V(e.defaultNotificationLevel));

package/dist/conversations/providers/ConversationsProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationsProvider.d.ts","sourceRoot":"","sources":["../../../src/conversations/providers/ConversationsProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAmBnD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAoDvD;;GAEG;AACH,eAAO,MAAM,gBAAgB,8BAQ5B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,qBAAqB,EAAE,EAAE,CACpC,iBAAiB,CAAC,sBAAsB,CAAC,CAqL1C,CAAC"}
+{"version":3,"file":"ConversationsProvider.d.ts","sourceRoot":"","sources":["../../../src/conversations/providers/ConversationsProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAmBnD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAoDvD;;GAEG;AACH,eAAO,MAAM,gBAAgB,8BAQ5B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,qBAAqB,EAAE,EAAE,CACpC,iBAAiB,CAAC,sBAAsB,CAAC,CAmM1C,CAAC"}

package/dist/conversations/providers/ConversationsProvider.js

@@ -41,11 +41,12 @@ var w = e(null), T = () => {
 		variant: N
 	}, F = r(!1), I = r(k);
 	I.current = k;
-	let L = n(() => new a({ defaultOptions: { queries: {
+	let L = !!t, R = n(() => new a({ defaultOptions: { queries: {
 		retry: 1,
 		refetchOnWindowFocus: !1,
 		staleTime: 300 * 1e3
-	} } }), []), R = n(() => {
+	} } }), []), z = n(() => {
+		if (L) return null;
 		let e = typeof window < "u" && (window.location.hostname === "localhost" || window.location.hostname.endsWith(".local.burdenoff.com")), t = e ? `${window.location.origin}/__local/conversations/graphql` : E ? `${E}/workspaces/graphql` : "/workspaces/graphql", n = {};
 		D && (n.Authorization = `Bearer ${D}`), O && (n["X-Workspace-Authorization"] = `Bearer ${O}`), T && (n["x-workspace-id"] = T), e && v?.id && (n["x-actor-id"] = v.id, n["x-actor-type"] = "user");
 		let r = new c({
@@ -85,23 +86,24 @@ var w = e(null), T = () => {
 		E,
 		D,
 		v?.id,
+		L,
 		T,
 		O
-	]), z = !!t, B = /* @__PURE__ */ b(o, {
-		client: L,
+	]), B = /* @__PURE__ */ b(o, {
+		client: R,
 		children: /* @__PURE__ */ b(w.Provider, {
 			value: P,
-			children: z ? /* @__PURE__ */ x(h, {
+			children: L ? /* @__PURE__ */ x(h, {
 				scopeId: T ?? null,
 				gateway: "workspace",
 				children: [/* @__PURE__ */ b(S, {}), e]
 			}) : /* @__PURE__ */ x(y, { children: [/* @__PURE__ */ b(S, {}), e] })
 		})
 	});
-	return z ? B : /* @__PURE__ */ b(p, {
-		client: R,
+	return L ? B : z ? /* @__PURE__ */ b(p, {
+		client: z,
 		children: /* @__PURE__ */ b(i, { children: B })
-	});
+	}) : null;
 };
 //#endregion
 export { E as ConversationsProvider, T as useConversations };

package/dist/conversations/providers/ConversationsProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationsProvider.js","names":[],"sources":["../../../src/conversations/providers/ConversationsProvider.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport { createContext, useContext, useMemo, useRef } from \"react\";\nimport { MemoryRouter } from \"react-router-dom\";\nimport { QueryClient, QueryClientProvider } from \"@tanstack/react-query\";\nimport {\n  ApolloClient,\n  InMemoryCache,\n  HttpLink,\n  from,\n  Observable,\n} from \"@apollo/client\";\nimport { onError } from \"@apollo/client/link/error\";\nimport { ApolloProvider, useApolloClient } from \"@apollo/client/react\";\nimport { PermissionProvider } from \"@burdenoff/fe-libs/shared/providers/shell\";\nimport {\n  isAuthNetworkError,\n  redirectToLogin,\n} from \"@burdenoff/fe-libs/shared/utils\";\nimport { useEvent } from \"@burdenoff/fe-libs/shared/events\";\nimport type { ConversationsRootProps } from \"../types\";\n\n/**\n * Clears Apollo cache on auth.signed_out so stale conversation data\n * is not retained across sessions. Must render inside ApolloProvider.\n */\nfunction AuthCacheClearer() {\n  const client = useApolloClient();\n  useEvent(\"auth.signed_out\", () => {\n    void client.clearStore();\n  });\n  return null;\n}\n\nfunction hasSessionAuthErrors(\n  errors: ReadonlyArray<{\n    message?: string;\n    extensions?: Record<string, unknown>;\n  }> = [],\n): boolean {\n  return errors.some((error) => {\n    const code =\n      typeof error.extensions?.code === \"string\" ? error.extensions.code : \"\";\n    const errorCode =\n      typeof error.extensions?.errorCode === \"string\"\n        ? error.extensions.errorCode\n        : \"\";\n    const message = (error.message ?? \"\").toLowerCase();\n\n    return (\n      code === \"UNAUTHENTICATED\" ||\n      errorCode === \"TOKEN_EXPIRED\" ||\n      message.includes(\"token_expired\") ||\n      message.includes(\"token expired\") ||\n      message.includes(\"session expired\") ||\n      message.includes(\"unauthorized\") ||\n      message.includes(\"unauthenticated\") ||\n      message.includes(\"authentication required\") ||\n      message.includes(\"workspace context missing\")\n    );\n  });\n}\n\n/**\n * Context value for Conversations microfrontend\n */\ntype ConversationsContextValue = ConversationsRootProps;\n\nconst ConversationsContext = createContext<ConversationsContextValue | null>(\n  null,\n);\n\n/**\n * Hook to access Conversations context\n */\nexport const useConversations = () => {\n  const context = useContext(ConversationsContext);\n  if (!context) {\n    throw new Error(\n      \"useConversations must be used within ConversationsProvider\",\n    );\n  }\n  return context;\n};\n\n/**\n * Provider component for Conversations microfrontend\n * Sets up routing, context, Apollo Client, and React Query client\n */\nexport const ConversationsProvider: FC<\n  PropsWithChildren<ConversationsRootProps>\n> = ({\n  children,\n  basePath,\n  navigate,\n  currentUser,\n  workspaceId,\n  apiGatewayUrl,\n  authToken,\n  workspaceToken,\n  getWorkspaceToken,\n  onConversationSelect,\n  onMessageSend,\n  defaultView,\n  variant,\n}) => {\n  const contextValue: ConversationsContextValue = {\n    basePath,\n    navigate,\n    currentUser,\n    workspaceId,\n    apiGatewayUrl,\n    authToken,\n    workspaceToken,\n    getWorkspaceToken,\n    onConversationSelect,\n    onMessageSend,\n    defaultView,\n    variant,\n  };\n\n  const isRefreshingRef = useRef(false);\n  const getWorkspaceTokenRef = useRef(getWorkspaceToken);\n  getWorkspaceTokenRef.current = getWorkspaceToken;\n\n  // Create QueryClient instance (memoized to avoid recreation on re-renders)\n  const queryClient = useMemo(\n    () =>\n      new QueryClient({\n        defaultOptions: {\n          queries: {\n            retry: 1,\n            refetchOnWindowFocus: false,\n            staleTime: 5 * 60 * 1000, // 5 minutes\n          },\n        },\n      }),\n    [],\n  );\n\n  // Create ApolloClient instance (memoized, recreated when tokens change)\n  // The workspace gateway requires dual-token auth:\n  //   Authorization: Bearer <authToken>                    (platform identity)\n  //   X-Workspace-Authorization: Bearer <workspaceToken>   (workspace access)\n  const apolloClient = useMemo(() => {\n    const isLocalDirectMode =\n      typeof window !== \"undefined\" &&\n      (window.location.hostname === \"localhost\" ||\n        window.location.hostname.endsWith(\".local.burdenoff.com\"));\n    const workspaceEndpoint = isLocalDirectMode\n      ? `${window.location.origin}/__local/conversations/graphql`\n      : apiGatewayUrl\n        ? `${apiGatewayUrl}/workspaces/graphql`\n        : \"/workspaces/graphql\";\n\n    const headers: Record<string, string> = {};\n    if (authToken) {\n      headers[\"Authorization\"] = `Bearer ${authToken}`;\n    }\n    if (workspaceToken) {\n      headers[\"X-Workspace-Authorization\"] = `Bearer ${workspaceToken}`;\n    }\n    if (workspaceId) {\n      headers[\"x-workspace-id\"] = workspaceId;\n    }\n    if (isLocalDirectMode && currentUser?.id) {\n      headers[\"x-actor-id\"] = currentUser.id;\n      headers[\"x-actor-type\"] = \"user\";\n    }\n\n    const httpLink = new HttpLink({\n      uri: workspaceEndpoint,\n      headers: Object.keys(headers).length > 0 ? headers : undefined,\n    });\n\n    const errorLink = onError(({ error, operation, forward }) => {\n      if (!error) return;\n\n      const errors =\n        \"errors\" in error && Array.isArray(error.errors) ? error.errors : [];\n      const hasAuthError = hasSessionAuthErrors(errors);\n\n      if (\n        !getWorkspaceTokenRef.current ||\n        !hasAuthError ||\n        isRefreshingRef.current\n      ) {\n        if (error instanceof Error && isAuthNetworkError(error)) {\n          redirectToLogin();\n        }\n        return;\n      }\n\n      return new Observable((observer) => {\n        isRefreshingRef.current = true;\n        getWorkspaceTokenRef\n          .current?.()\n          .then((freshToken) => {\n            isRefreshingRef.current = false;\n            if (!freshToken) {\n              redirectToLogin();\n              observer.error(new Error(\"Failed to refresh workspace token\"));\n              return;\n            }\n\n            operation.setContext(\n              ({\n                headers: existingHeaders = {},\n              }: {\n                headers?: Record<string, string>;\n              }) => ({\n                headers: {\n                  ...existingHeaders,\n                  \"X-Workspace-Authorization\": `Bearer ${freshToken}`,\n                  ...(workspaceId ? { \"x-workspace-id\": workspaceId } : {}),\n                },\n              }),\n            );\n\n            const subscriber = forward(operation).subscribe(observer);\n            return () => subscriber.unsubscribe();\n          })\n          .catch((refreshError: unknown) => {\n            isRefreshingRef.current = false;\n            observer.error(refreshError);\n          });\n      });\n    });\n\n    return new ApolloClient({\n      link: from([errorLink, httpLink]),\n      cache: new InMemoryCache(),\n      defaultOptions: {\n        watchQuery: {\n          fetchPolicy: \"cache-and-network\",\n        },\n      },\n    });\n  }, [apiGatewayUrl, authToken, currentUser?.id, workspaceId, workspaceToken]);\n\n  // PermissionProvider requires the shell's AuthProvider — only mount it in integrated mode.\n  const isIntegrated = !!basePath;\n\n  // Wrap content with QueryClientProvider and ConversationsContext.Provider\n  const content = (\n    <QueryClientProvider client={queryClient}>\n      <ConversationsContext.Provider value={contextValue}>\n        {isIntegrated ? (\n          <PermissionProvider scopeId={workspaceId ?? null} gateway=\"workspace\">\n            <AuthCacheClearer />\n            {children}\n          </PermissionProvider>\n        ) : (\n          <>\n            <AuthCacheClearer />\n            {children}\n          </>\n        )}\n      </ConversationsContext.Provider>\n    </QueryClientProvider>\n  );\n\n  // When integrated into a shell (basePath provided), the shell already has a router and ApolloProvider\n  // so we don't create another one. When standalone (no basePath), use MemoryRouter and ApolloProvider.\n  return isIntegrated ? (\n    content\n  ) : (\n    <ApolloProvider client={apolloClient}>\n      <MemoryRouter>{content}</MemoryRouter>\n    </ApolloProvider>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"ConversationsProvider.js","names":[],"sources":["../../../src/conversations/providers/ConversationsProvider.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport { createContext, useContext, useMemo, useRef } from \"react\";\nimport { MemoryRouter } from \"react-router-dom\";\nimport { QueryClient, QueryClientProvider } from \"@tanstack/react-query\";\nimport {\n  ApolloClient,\n  InMemoryCache,\n  HttpLink,\n  from,\n  Observable,\n} from \"@apollo/client\";\nimport { onError } from \"@apollo/client/link/error\";\nimport { ApolloProvider, useApolloClient } from \"@apollo/client/react\";\nimport { PermissionProvider } from \"@burdenoff/fe-libs/shared/providers/shell\";\nimport {\n  isAuthNetworkError,\n  redirectToLogin,\n} from \"@burdenoff/fe-libs/shared/utils\";\nimport { useEvent } from \"@burdenoff/fe-libs/shared/events\";\nimport type { ConversationsRootProps } from \"../types\";\n\n/**\n * Clears Apollo cache on auth.signed_out so stale conversation data\n * is not retained across sessions. Must render inside ApolloProvider.\n */\nfunction AuthCacheClearer() {\n  const client = useApolloClient();\n  useEvent(\"auth.signed_out\", () => {\n    void client.clearStore();\n  });\n  return null;\n}\n\nfunction hasSessionAuthErrors(\n  errors: ReadonlyArray<{\n    message?: string;\n    extensions?: Record<string, unknown>;\n  }> = [],\n): boolean {\n  return errors.some((error) => {\n    const code =\n      typeof error.extensions?.code === \"string\" ? error.extensions.code : \"\";\n    const errorCode =\n      typeof error.extensions?.errorCode === \"string\"\n        ? error.extensions.errorCode\n        : \"\";\n    const message = (error.message ?? \"\").toLowerCase();\n\n    return (\n      code === \"UNAUTHENTICATED\" ||\n      errorCode === \"TOKEN_EXPIRED\" ||\n      message.includes(\"token_expired\") ||\n      message.includes(\"token expired\") ||\n      message.includes(\"session expired\") ||\n      message.includes(\"unauthorized\") ||\n      message.includes(\"unauthenticated\") ||\n      message.includes(\"authentication required\") ||\n      message.includes(\"workspace context missing\")\n    );\n  });\n}\n\n/**\n * Context value for Conversations microfrontend\n */\ntype ConversationsContextValue = ConversationsRootProps;\n\nconst ConversationsContext = createContext<ConversationsContextValue | null>(\n  null,\n);\n\n/**\n * Hook to access Conversations context\n */\nexport const useConversations = () => {\n  const context = useContext(ConversationsContext);\n  if (!context) {\n    throw new Error(\n      \"useConversations must be used within ConversationsProvider\",\n    );\n  }\n  return context;\n};\n\n/**\n * Provider component for Conversations microfrontend\n * Sets up routing, context, Apollo Client, and React Query client\n */\nexport const ConversationsProvider: FC<\n  PropsWithChildren<ConversationsRootProps>\n> = ({\n  children,\n  basePath,\n  navigate,\n  currentUser,\n  workspaceId,\n  apiGatewayUrl,\n  authToken,\n  workspaceToken,\n  getWorkspaceToken,\n  onConversationSelect,\n  onMessageSend,\n  defaultView,\n  variant,\n}) => {\n  const contextValue: ConversationsContextValue = {\n    basePath,\n    navigate,\n    currentUser,\n    workspaceId,\n    apiGatewayUrl,\n    authToken,\n    workspaceToken,\n    getWorkspaceToken,\n    onConversationSelect,\n    onMessageSend,\n    defaultView,\n    variant,\n  };\n\n  const isRefreshingRef = useRef(false);\n  const getWorkspaceTokenRef = useRef(getWorkspaceToken);\n  getWorkspaceTokenRef.current = getWorkspaceToken;\n  // PermissionProvider requires the shell's AuthProvider — only mount it in integrated mode.\n  const isIntegrated = !!basePath;\n\n  // Create QueryClient instance (memoized to avoid recreation on re-renders)\n  const queryClient = useMemo(\n    () =>\n      new QueryClient({\n        defaultOptions: {\n          queries: {\n            retry: 1,\n            refetchOnWindowFocus: false,\n            staleTime: 5 * 60 * 1000, // 5 minutes\n          },\n        },\n      }),\n    [],\n  );\n\n  // Create ApolloClient instance (memoized, recreated when tokens change)\n  // The workspace gateway requires dual-token auth:\n  //   Authorization: Bearer <authToken>                    (platform identity)\n  //   X-Workspace-Authorization: Bearer <workspaceToken>   (workspace access)\n  const apolloClient = useMemo(() => {\n    if (isIntegrated) return null;\n\n    const isLocalDirectMode =\n      typeof window !== \"undefined\" &&\n      (window.location.hostname === \"localhost\" ||\n        window.location.hostname.endsWith(\".local.burdenoff.com\"));\n    const workspaceEndpoint = isLocalDirectMode\n      ? `${window.location.origin}/__local/conversations/graphql`\n      : apiGatewayUrl\n        ? `${apiGatewayUrl}/workspaces/graphql`\n        : \"/workspaces/graphql\";\n\n    const headers: Record<string, string> = {};\n    if (authToken) {\n      headers[\"Authorization\"] = `Bearer ${authToken}`;\n    }\n    if (workspaceToken) {\n      headers[\"X-Workspace-Authorization\"] = `Bearer ${workspaceToken}`;\n    }\n    if (workspaceId) {\n      headers[\"x-workspace-id\"] = workspaceId;\n    }\n    if (isLocalDirectMode && currentUser?.id) {\n      headers[\"x-actor-id\"] = currentUser.id;\n      headers[\"x-actor-type\"] = \"user\";\n    }\n\n    const httpLink = new HttpLink({\n      uri: workspaceEndpoint,\n      headers: Object.keys(headers).length > 0 ? headers : undefined,\n    });\n\n    const errorLink = onError(({ error, operation, forward }) => {\n      if (!error) return;\n\n      const errors =\n        \"errors\" in error && Array.isArray(error.errors) ? error.errors : [];\n      const hasAuthError = hasSessionAuthErrors(errors);\n\n      if (\n        !getWorkspaceTokenRef.current ||\n        !hasAuthError ||\n        isRefreshingRef.current\n      ) {\n        if (error instanceof Error && isAuthNetworkError(error)) {\n          redirectToLogin();\n        }\n        return;\n      }\n\n      return new Observable((observer) => {\n        isRefreshingRef.current = true;\n        getWorkspaceTokenRef\n          .current?.()\n          .then((freshToken) => {\n            isRefreshingRef.current = false;\n            if (!freshToken) {\n              redirectToLogin();\n              observer.error(new Error(\"Failed to refresh workspace token\"));\n              return;\n            }\n\n            operation.setContext(\n              ({\n                headers: existingHeaders = {},\n              }: {\n                headers?: Record<string, string>;\n              }) => ({\n                headers: {\n                  ...existingHeaders,\n                  \"X-Workspace-Authorization\": `Bearer ${freshToken}`,\n                  ...(workspaceId ? { \"x-workspace-id\": workspaceId } : {}),\n                },\n              }),\n            );\n\n            const subscriber = forward(operation).subscribe(observer);\n            return () => subscriber.unsubscribe();\n          })\n          .catch((refreshError: unknown) => {\n            isRefreshingRef.current = false;\n            observer.error(refreshError);\n          });\n      });\n    });\n\n    return new ApolloClient({\n      link: from([errorLink, httpLink]),\n      cache: new InMemoryCache(),\n      defaultOptions: {\n        watchQuery: {\n          fetchPolicy: \"cache-and-network\",\n        },\n      },\n    });\n  }, [\n    apiGatewayUrl,\n    authToken,\n    currentUser?.id,\n    isIntegrated,\n    workspaceId,\n    workspaceToken,\n  ]);\n\n  // Wrap content with QueryClientProvider and ConversationsContext.Provider\n  const content = (\n    <QueryClientProvider client={queryClient}>\n      <ConversationsContext.Provider value={contextValue}>\n        {isIntegrated ? (\n          <PermissionProvider scopeId={workspaceId ?? null} gateway=\"workspace\">\n            <AuthCacheClearer />\n            {children}\n          </PermissionProvider>\n        ) : (\n          <>\n            <AuthCacheClearer />\n            {children}\n          </>\n        )}\n      </ConversationsContext.Provider>\n    </QueryClientProvider>\n  );\n\n  // When integrated into a shell (basePath provided), the shell already has a router and ApolloProvider\n  // so we don't create another one. When standalone (no basePath), use MemoryRouter and ApolloProvider.\n  if (isIntegrated) {\n    return content;\n  }\n\n  if (!apolloClient) {\n    return null;\n  }\n\n  return (\n    <ApolloProvider client={apolloClient}>\n      <MemoryRouter>{content}</MemoryRouter>\n    </ApolloProvider>\n  );\n};\n"],"mappings":"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"}

package/dist/index.js

@@ -1,7 +1,7 @@
 import { useConversations as e } from "./conversations/providers/ConversationsProvider.js";
-import { useConversationsStore as t } from "./conversations/store/conversationsStore.js";
-import { ConversationsRoot as n } from "./conversations/ConversationsRoot.js";
-import { ConversationsUserRoot as r } from "./conversations/ConversationsUserRoot.js";
-import { ConversationsAdminRoot as i } from "./conversations/ConversationsAdminRoot.js";
+import { ConversationsRoot as t } from "./conversations/ConversationsRoot.js";
+import { ConversationsUserRoot as n } from "./conversations/ConversationsUserRoot.js";
+import { ConversationsAdminRoot as r } from "./conversations/ConversationsAdminRoot.js";
+import { useConversationsStore as i } from "./conversations/store/conversationsStore.js";
 import "./conversations/index.js";
-export { i as ConversationsAdminRoot, n as ConversationsRoot, r as ConversationsUserRoot, e as useConversations, t as useConversationsStore };
+export { r as ConversationsAdminRoot, t as ConversationsRoot, n as ConversationsUserRoot, e as useConversations, i as useConversationsStore };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@burdenoff/microfe-conversations",
-  "version": "2026.522.1",
+  "version": "2026.523.1",
   "description": "Burdenoff Conversations Microfrontend - Complete messaging and conversation interface",
   "type": "module",
   "files": [