@greatapps/common 1.1.396 → 1.1.398

package/dist/components/modals/PaidPlanRequiredModal.mjs

@@ -9,7 +9,7 @@ import {
   DialogHeader,
   DialogTitle
 } from "../ui/overlay/Dialog";
-import { useWhitelabelUrls } from "../../modules/whitelabel/hooks/whitelabel.hook";
+import { useWhitelabelUrls } from "../../providers/whitelabel.provider";
 import { useModalManager } from "../../store/useModalManager";
 function PaidPlanRequiredModal() {
   const { activeModal, modalData, closeModal } = useModalManager();

package/dist/components/modals/PaidPlanRequiredModal.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/modals/PaidPlanRequiredModal.tsx"],"sourcesContent":["\"use client\";\n\nimport { IconLock } from '@tabler/icons-react';\nimport { Button } from '../ui/buttons/Button';\nimport {\n    Dialog,\n    DialogContent,\n    DialogDescription,\n    DialogHeader,\n    DialogTitle,\n} from '../ui/overlay/Dialog';\nimport { useWhitelabelUrls } from '../../modules/whitelabel/hooks/whitelabel.hook';\nimport { useModalManager } from '../../store/useModalManager';\nimport type { ModalData } from '../../store/useModalManager';\n\nexport default function PaidPlanRequiredModal() {\n    const { activeModal, modalData, closeModal } = useModalManager();\n    const isOpen = activeModal === 'paidPlanRequiredModal';\n    const data = modalData as ModalData & { title?: string; description?: string };\n    const { accountsUrl } = useWhitelabelUrls();\n\n    const title = (data.title as string) ?? \"Recurso disponível em planos pagos\";\n    const description = (data.description as string) ?? \"Para acessar este recurso, faça upgrade para um plano pago\";\n\n    const handleKnowPlans = () => {\n        closeModal();\n        window.open(`${accountsUrl}/signature?tab=plans`, '_blank');\n    };\n\n    return (\n        <Dialog open={isOpen} onOpenChange={() => closeModal()}>\n            <DialogContent className=\"flex flex-col p-0 gap-0 w-full md:w-[410px] lg:w-[410px]\">\n                <DialogHeader className=\"gap-3 text-left p-5\">\n                    <div className=\"flex items-center justify-center w-10 h-10 bg-zinc-50 rounded-lg\">\n                        <IconLock size={24} className=\"text-zinc-950\" />\n                    </div>\n                    <div className=\"flex flex-col gap-2\">\n                        <DialogTitle className=\"paragraph-medium-semibold text-zinc-950\">\n                            {title}\n                        </DialogTitle>\n                        <DialogDescription className=\"paragraph-small-regular text-zinc-600\">\n                            {description}\n                        </DialogDescription>\n                    </div>\n                </DialogHeader>\n                <div className=\"flex items-center gap-2 p-5 border-t border-zinc-200\">\n                    <Button\n                        className=\"w-fit h-10!\"\n                        onClick={handleKnowPlans}\n                    >\n                        Conhecer planos\n                    </Button>\n                </div>\n            </DialogContent>\n        </Dialog>\n    );\n}\n"],"mappings":";AAkCwB,cAEJ,YAFI;AAhCxB,SAAS,gBAAgB;AACzB,SAAS,cAAc;AACvB;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AACP,SAAS,yBAAyB;AAClC,SAAS,uBAAuB;AAGjB,SAAR,wBAAyC;AAC5C,QAAM,EAAE,aAAa,WAAW,WAAW,IAAI,gBAAgB;AAC/D,QAAM,SAAS,gBAAgB;AAC/B,QAAM,OAAO;AACb,QAAM,EAAE,YAAY,IAAI,kBAAkB;AAE1C,QAAM,QAAS,KAAK,SAAoB;AACxC,QAAM,cAAe,KAAK,eAA0B;AAEpD,QAAM,kBAAkB,MAAM;AAC1B,eAAW;AACX,WAAO,KAAK,GAAG,WAAW,wBAAwB,QAAQ;AAAA,EAC9D;AAEA,SACI,oBAAC,UAAO,MAAM,QAAQ,cAAc,MAAM,WAAW,GACjD,+BAAC,iBAAc,WAAU,4DACrB;AAAA,yBAAC,gBAAa,WAAU,uBACpB;AAAA,0BAAC,SAAI,WAAU,oEACX,8BAAC,YAAS,MAAM,IAAI,WAAU,iBAAgB,GAClD;AAAA,MACA,qBAAC,SAAI,WAAU,uBACX;AAAA,4BAAC,eAAY,WAAU,2CAClB,iBACL;AAAA,QACA,oBAAC,qBAAkB,WAAU,yCACxB,uBACL;AAAA,SACJ;AAAA,OACJ;AAAA,IACA,oBAAC,SAAI,WAAU,wDACX;AAAA,MAAC;AAAA;AAAA,QACG,WAAU;AAAA,QACV,SAAS;AAAA,QACZ;AAAA;AAAA,IAED,GACJ;AAAA,KACJ,GACJ;AAER;","names":[]}
+{"version":3,"sources":["../../../src/components/modals/PaidPlanRequiredModal.tsx"],"sourcesContent":["\"use client\";\n\nimport { IconLock } from '@tabler/icons-react';\nimport { Button } from '../ui/buttons/Button';\nimport {\n    Dialog,\n    DialogContent,\n    DialogDescription,\n    DialogHeader,\n    DialogTitle,\n} from '../ui/overlay/Dialog';\nimport { useWhitelabelUrls } from '../../providers/whitelabel.provider';\nimport { useModalManager } from '../../store/useModalManager';\nimport type { ModalData } from '../../store/useModalManager';\n\nexport default function PaidPlanRequiredModal() {\n    const { activeModal, modalData, closeModal } = useModalManager();\n    const isOpen = activeModal === 'paidPlanRequiredModal';\n    const data = modalData as ModalData & { title?: string; description?: string };\n    const { accountsUrl } = useWhitelabelUrls();\n\n    const title = (data.title as string) ?? \"Recurso disponível em planos pagos\";\n    const description = (data.description as string) ?? \"Para acessar este recurso, faça upgrade para um plano pago\";\n\n    const handleKnowPlans = () => {\n        closeModal();\n        window.open(`${accountsUrl}/signature?tab=plans`, '_blank');\n    };\n\n    return (\n        <Dialog open={isOpen} onOpenChange={() => closeModal()}>\n            <DialogContent className=\"flex flex-col p-0 gap-0 w-full md:w-[410px] lg:w-[410px]\">\n                <DialogHeader className=\"gap-3 text-left p-5\">\n                    <div className=\"flex items-center justify-center w-10 h-10 bg-zinc-50 rounded-lg\">\n                        <IconLock size={24} className=\"text-zinc-950\" />\n                    </div>\n                    <div className=\"flex flex-col gap-2\">\n                        <DialogTitle className=\"paragraph-medium-semibold text-zinc-950\">\n                            {title}\n                        </DialogTitle>\n                        <DialogDescription className=\"paragraph-small-regular text-zinc-600\">\n                            {description}\n                        </DialogDescription>\n                    </div>\n                </DialogHeader>\n                <div className=\"flex items-center gap-2 p-5 border-t border-zinc-200\">\n                    <Button\n                        className=\"w-fit h-10!\"\n                        onClick={handleKnowPlans}\n                    >\n                        Conhecer planos\n                    </Button>\n                </div>\n            </DialogContent>\n        </Dialog>\n    );\n}\n"],"mappings":";AAkCwB,cAEJ,YAFI;AAhCxB,SAAS,gBAAgB;AACzB,SAAS,cAAc;AACvB;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AACP,SAAS,yBAAyB;AAClC,SAAS,uBAAuB;AAGjB,SAAR,wBAAyC;AAC5C,QAAM,EAAE,aAAa,WAAW,WAAW,IAAI,gBAAgB;AAC/D,QAAM,SAAS,gBAAgB;AAC/B,QAAM,OAAO;AACb,QAAM,EAAE,YAAY,IAAI,kBAAkB;AAE1C,QAAM,QAAS,KAAK,SAAoB;AACxC,QAAM,cAAe,KAAK,eAA0B;AAEpD,QAAM,kBAAkB,MAAM;AAC1B,eAAW;AACX,WAAO,KAAK,GAAG,WAAW,wBAAwB,QAAQ;AAAA,EAC9D;AAEA,SACI,oBAAC,UAAO,MAAM,QAAQ,cAAc,MAAM,WAAW,GACjD,+BAAC,iBAAc,WAAU,4DACrB;AAAA,yBAAC,gBAAa,WAAU,uBACpB;AAAA,0BAAC,SAAI,WAAU,oEACX,8BAAC,YAAS,MAAM,IAAI,WAAU,iBAAgB,GAClD;AAAA,MACA,qBAAC,SAAI,WAAU,uBACX;AAAA,4BAAC,eAAY,WAAU,2CAClB,iBACL;AAAA,QACA,oBAAC,qBAAkB,WAAU,yCACxB,uBACL;AAAA,SACJ;AAAA,OACJ;AAAA,IACA,oBAAC,SAAI,WAAU,wDACX;AAAA,MAAC;AAAA;AAAA,QACG,WAAU;AAAA,QACV,SAAS;AAAA,QACZ;AAAA;AAAA,IAED,GACJ;AAAA,KACJ,GACJ;AAER;","names":[]}

package/dist/components/navigation/subcomponents/ProjectSelector.mjs

@@ -6,7 +6,6 @@ import { useHasPlanAddon } from "../../../modules/plans/hooks/use-has-plan-addon
 import { useMobileNavbarSheet } from "../../../store/useMobileNavbarSheet";
 import { useAppNavigationContext } from "../AppNavigationContext";
 import { ProjectSelectorPopover } from "../ProjectSelectorPopover";
-import { UsersSelectorPopover } from "../../layouts/UsersSelectorPopover";
 import { Button, Command, CommandEmpty, CommandInput, CommandItem, CommandList, UserAvatar } from "../../../index";
 import { IconChevronDown, IconPlus, IconSettings } from "@tabler/icons-react";
 function ProjectItemSkeleton() {
@@ -39,58 +38,52 @@ function ProjectSelector({
     }
   }, [openProjectList, breakpoint, clearProjectList]);
   if (breakpoint === "desktop" || breakpoint === "md") {
-    return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsx(
-        ProjectSelectorPopover,
-        {
-          open: isPopoverOpen,
-          setOpen: setIsPopoverOpen,
-          titleRef,
-          projects,
-          selectedProject,
-          isLoading,
-          isFetchingNextPage,
-          hasNextPage,
-          onLoadMore,
-          onSelectProject,
-          onAddProject,
-          onManageProjects,
-          children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 truncate select-none cursor-pointer", ref: titleRef, children: [
-            isLoading ? /* @__PURE__ */ jsx("div", { className: "skeleton h-4 w-32 rounded" }) : /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-600 truncate max-w-[120px] inline-block", children: selectedProject?.title }),
-            /* @__PURE__ */ jsx(
-              IconChevronDown,
-              {
-                size: 20,
-                className: `transition-transform duration-200 ${isPopoverOpen ? "rotate-180 text-gray-950" : "text-gray-400"}`
-              }
-            )
-          ] })
-        }
-      ),
-      /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsx(UsersSelectorPopover, { projectId: selectedProject?.id }) })
-    ] });
+    return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsx(
+      ProjectSelectorPopover,
+      {
+        open: isPopoverOpen,
+        setOpen: setIsPopoverOpen,
+        titleRef,
+        projects,
+        selectedProject,
+        isLoading,
+        isFetchingNextPage,
+        hasNextPage,
+        onLoadMore,
+        onSelectProject,
+        onAddProject,
+        onManageProjects,
+        children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 truncate select-none cursor-pointer", ref: titleRef, children: [
+          isLoading ? /* @__PURE__ */ jsx("div", { className: "skeleton h-4 w-32 rounded" }) : /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-600 truncate max-w-[120px] inline-block", children: selectedProject?.title }),
+          /* @__PURE__ */ jsx(
+            IconChevronDown,
+            {
+              size: 20,
+              className: `transition-transform duration-200 ${isPopoverOpen ? "rotate-180 text-gray-950" : "text-gray-400"}`
+            }
+          )
+        ] })
+      }
+    ) });
   }
   return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2.5", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: "flex items-center gap-1 cursor-pointer",
-          onClick: () => setActiveSection(activeSection === "projects" ? null : "projects"),
-          children: [
-            /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-600", children: selectedProject?.title }),
-            /* @__PURE__ */ jsx(
-              IconChevronDown,
-              {
-                size: 20,
-                className: `transition-transform duration-200 ${activeSection === "projects" ? "rotate-180 text-gray-950" : "text-gray-400"}`
-              }
-            )
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsx(UsersSelectorPopover, { projectId: selectedProject?.id })
-    ] }),
+    /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "flex items-center gap-1 cursor-pointer",
+        onClick: () => setActiveSection(activeSection === "projects" ? null : "projects"),
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-600", children: selectedProject?.title }),
+          /* @__PURE__ */ jsx(
+            IconChevronDown,
+            {
+              size: 20,
+              className: `transition-transform duration-200 ${activeSection === "projects" ? "rotate-180 text-gray-950" : "text-gray-400"}`
+            }
+          )
+        ]
+      }
+    ) }),
     activeSection === "projects" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col p-3 gap-2 border border-gray-200 rounded-lg animate-in fade-in duration-400", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
         /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold", children: "Projetos" }),

package/dist/components/navigation/subcomponents/ProjectSelector.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/navigation/subcomponents/ProjectSelector.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useRef, useEffect, RefObject } from 'react';\nimport { ADDON_IDS } from '../../../modules/subscriptions/constants/addons.constants';\nimport { useHasPlanAddon } from '../../../modules/plans/hooks/use-has-plan-addon.hook';\nimport { useMobileNavbarSheet } from '../../../store/useMobileNavbarSheet';\nimport { useAppNavigationContext } from '../AppNavigationContext';\nimport { ProjectSelectorPopover } from '../ProjectSelectorPopover';\nimport { UsersSelectorPopover } from '../../layouts/UsersSelectorPopover';\nimport { Button, Command, CommandEmpty, CommandInput, CommandItem, CommandList, UserAvatar } from '../../../index';\nimport { IconChevronDown, IconPlus, IconSettings } from '@tabler/icons-react';\nimport type { NavigationProject } from '../types';\n\nexport interface ProjectSelectorProps {\n  projects: NavigationProject[];\n  selectedProject: NavigationProject | null;\n  isLoading?: boolean;\n  isFetchingNextPage?: boolean;\n  hasNextPage?: boolean;\n  onLoadMore?: () => void | Promise<unknown>;\n  onSelectProject: (project: NavigationProject) => void;\n  onAddProject?: () => void;\n  onManageProjects?: () => void;\n}\n\nfunction ProjectItemSkeleton() {\n  return (\n    <div className=\"flex items-center gap-2 p-[8.8px]\">\n      <div className=\"skeleton size-9 rounded-lg shrink-0\" />\n      <div className=\"skeleton h-4 w-36 rounded\" />\n    </div>\n  );\n}\n\nexport function ProjectSelector({\n  projects,\n  selectedProject,\n  isLoading,\n  isFetchingNextPage,\n  hasNextPage,\n  onLoadMore,\n  onSelectProject,\n  onAddProject,\n  onManageProjects,\n}: ProjectSelectorProps) {\n  const { breakpoint } = useAppNavigationContext();\n  const { hasAddon: canAddProject } = useHasPlanAddon(ADDON_IDS.PROJECTS);\n  const [isPopoverOpen, setIsPopoverOpen] = useState(false);\n  const [activeSection, setActiveSection] = useState<'projects' | null>(null);\n  const titleRef = useRef<HTMLDivElement>(null);\n  const { openProjectList, clearProjectList } = useMobileNavbarSheet();\n\n  useEffect(() => {\n    if (openProjectList && breakpoint === 'mobile') {\n      setActiveSection('projects');\n      clearProjectList();\n    }\n  }, [openProjectList, breakpoint, clearProjectList]);\n\n  // Desktop and md: title + popover + users selector (same visual as current gpages sidebars)\n  if (breakpoint === 'desktop' || breakpoint === 'md') {\n    return (\n      <div className=\"flex items-center justify-between\">\n        <ProjectSelectorPopover\n          open={isPopoverOpen}\n          setOpen={setIsPopoverOpen}\n          titleRef={titleRef as unknown as RefObject<HTMLSpanElement | null>}\n          projects={projects}\n          selectedProject={selectedProject}\n          isLoading={isLoading}\n          isFetchingNextPage={isFetchingNextPage}\n          hasNextPage={hasNextPage}\n          onLoadMore={onLoadMore}\n          onSelectProject={onSelectProject}\n          onAddProject={onAddProject}\n          onManageProjects={onManageProjects}\n        >\n          <div className=\"flex items-center gap-2 truncate select-none cursor-pointer\" ref={titleRef}>\n            {isLoading ? (\n              <div className=\"skeleton h-4 w-32 rounded\" />\n            ) : (\n              <span className=\"paragraph-medium-semibold text-gray-600 truncate max-w-[120px] inline-block\">\n                {selectedProject?.title}\n              </span>\n            )}\n            <IconChevronDown\n              size={20}\n              className={`transition-transform duration-200 ${isPopoverOpen ? 'rotate-180 text-gray-950' : 'text-gray-400'}`}\n            />\n          </div>\n        </ProjectSelectorPopover>\n        <div className=\"flex items-center gap-2\">\n          <UsersSelectorPopover projectId={selectedProject?.id} />\n        </div>\n      </div>\n    );\n  }\n\n  // Mobile: inline collapsible accordion\n  return (\n    <div className=\"flex flex-col gap-2.5\">\n      <div className=\"flex items-center justify-between\">\n        <div\n          className=\"flex items-center gap-1 cursor-pointer\"\n          onClick={() => setActiveSection(activeSection === 'projects' ? null : 'projects')}\n        >\n          <span className=\"paragraph-medium-semibold text-gray-600\">{selectedProject?.title}</span>\n          <IconChevronDown\n            size={20}\n            className={`transition-transform duration-200 ${\n              activeSection === 'projects' ? 'rotate-180 text-gray-950' : 'text-gray-400'\n            }`}\n          />\n        </div>\n        <UsersSelectorPopover projectId={selectedProject?.id} />\n      </div>\n      {activeSection === 'projects' && (\n        <div className=\"flex flex-col p-3 gap-2 border border-gray-200 rounded-lg animate-in fade-in duration-400\">\n          <div className=\"flex items-center justify-between\">\n            <span className=\"paragraph-small-semibold\">Projetos</span>\n            {(onAddProject || onManageProjects) && (\n              <div className=\"flex items-center gap-1.5\">\n                {canAddProject && onAddProject && (\n                  <Button variant=\"secondary\" className=\"h-8! paragraph-small-semibold text-gray-950\" onClick={onAddProject}>\n                    <IconPlus size={16} />\n                    Adicionar\n                  </Button>\n                )}\n                {onManageProjects && (\n                  <Button variant=\"secondary\" className=\"p-0 size-8\" onClick={onManageProjects}>\n                    <IconSettings size={18} />\n                  </Button>\n                )}\n              </div>\n            )}\n          </div>\n          <Command className=\"gap-2\">\n            <CommandInput placeholder=\"Busque aqui\" />\n            <CommandList\n              className=\"custom-scrollbar paragraph-small-medium text-gray-600 h-[227px]\"\n              onScroll={(event) => {\n                if (!hasNextPage || isFetchingNextPage || !onLoadMore) return;\n\n                const target = event.currentTarget;\n                const distanceToBottom = target.scrollHeight - target.scrollTop - target.clientHeight;\n\n                if (distanceToBottom <= 80) {\n                  onLoadMore();\n                }\n              }}\n            >\n              <CommandEmpty>Nenhum resultado encontrado.</CommandEmpty>\n              {isLoading ? (\n                <>\n                  <ProjectItemSkeleton />\n                  <ProjectItemSkeleton />\n                  <ProjectItemSkeleton />\n                  <ProjectItemSkeleton />\n                </>\n              ) : (\n                projects.map((project) => (\n                  <CommandItem\n                    key={project.id}\n                    value={`${project.title}-${project.id}`}\n                    keywords={[project.title]}\n                    className={selectedProject?.id === project.id ? 'bg-gray-50 min-h-[39px]' : 'min-h-[39px]'}\n                    onSelect={() => { onSelectProject(project); setActiveSection(null); }}\n                  >\n                    <UserAvatar\n                      photo={project.photo}\n                      name={project.title}\n                      size={36}\n                    />\n                    {project.title}\n                  </CommandItem>\n                ))\n              )}\n              {isFetchingNextPage && (\n                <>\n                  <ProjectItemSkeleton />\n                  <ProjectItemSkeleton />\n                </>\n              )}\n            </CommandList>\n          </Command>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../../src/components/navigation/subcomponents/ProjectSelector.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useRef, useEffect, RefObject } from 'react';\nimport { ADDON_IDS } from '../../../modules/subscriptions/constants/addons.constants';\nimport { useHasPlanAddon } from '../../../modules/plans/hooks/use-has-plan-addon.hook';\nimport { useMobileNavbarSheet } from '../../../store/useMobileNavbarSheet';\nimport { useAppNavigationContext } from '../AppNavigationContext';\nimport { ProjectSelectorPopover } from '../ProjectSelectorPopover';\nimport { Button, Command, CommandEmpty, CommandInput, CommandItem, CommandList, UserAvatar } from '../../../index';\nimport { IconChevronDown, IconPlus, IconSettings } from '@tabler/icons-react';\nimport type { NavigationProject } from '../types';\n\nexport interface ProjectSelectorProps {\n  projects: NavigationProject[];\n  selectedProject: NavigationProject | null;\n  isLoading?: boolean;\n  isFetchingNextPage?: boolean;\n  hasNextPage?: boolean;\n  onLoadMore?: () => void | Promise<unknown>;\n  onSelectProject: (project: NavigationProject) => void;\n  onAddProject?: () => void;\n  onManageProjects?: () => void;\n}\n\nfunction ProjectItemSkeleton() {\n  return (\n    <div className=\"flex items-center gap-2 p-[8.8px]\">\n      <div className=\"skeleton size-9 rounded-lg shrink-0\" />\n      <div className=\"skeleton h-4 w-36 rounded\" />\n    </div>\n  );\n}\n\nexport function ProjectSelector({\n  projects,\n  selectedProject,\n  isLoading,\n  isFetchingNextPage,\n  hasNextPage,\n  onLoadMore,\n  onSelectProject,\n  onAddProject,\n  onManageProjects,\n}: ProjectSelectorProps) {\n  const { breakpoint } = useAppNavigationContext();\n  const { hasAddon: canAddProject } = useHasPlanAddon(ADDON_IDS.PROJECTS);\n  const [isPopoverOpen, setIsPopoverOpen] = useState(false);\n  const [activeSection, setActiveSection] = useState<'projects' | null>(null);\n  const titleRef = useRef<HTMLDivElement>(null);\n  const { openProjectList, clearProjectList } = useMobileNavbarSheet();\n\n  useEffect(() => {\n    if (openProjectList && breakpoint === 'mobile') {\n      setActiveSection('projects');\n      clearProjectList();\n    }\n  }, [openProjectList, breakpoint, clearProjectList]);\n\n  // Desktop and md: title + popover + users selector (same visual as current gpages sidebars)\n  if (breakpoint === 'desktop' || breakpoint === 'md') {\n    return (\n      <div className=\"flex items-center justify-between\">\n        <ProjectSelectorPopover\n          open={isPopoverOpen}\n          setOpen={setIsPopoverOpen}\n          titleRef={titleRef as unknown as RefObject<HTMLSpanElement | null>}\n          projects={projects}\n          selectedProject={selectedProject}\n          isLoading={isLoading}\n          isFetchingNextPage={isFetchingNextPage}\n          hasNextPage={hasNextPage}\n          onLoadMore={onLoadMore}\n          onSelectProject={onSelectProject}\n          onAddProject={onAddProject}\n          onManageProjects={onManageProjects}\n        >\n          <div className=\"flex items-center gap-2 truncate select-none cursor-pointer\" ref={titleRef}>\n            {isLoading ? (\n              <div className=\"skeleton h-4 w-32 rounded\" />\n            ) : (\n              <span className=\"paragraph-medium-semibold text-gray-600 truncate max-w-[120px] inline-block\">\n                {selectedProject?.title}\n              </span>\n            )}\n            <IconChevronDown\n              size={20}\n              className={`transition-transform duration-200 ${isPopoverOpen ? 'rotate-180 text-gray-950' : 'text-gray-400'}`}\n            />\n          </div>\n        </ProjectSelectorPopover>\n      </div>\n    );\n  }\n\n  // Mobile: inline collapsible accordion\n  return (\n    <div className=\"flex flex-col gap-2.5\">\n      <div className=\"flex items-center justify-between\">\n        <div\n          className=\"flex items-center gap-1 cursor-pointer\"\n          onClick={() => setActiveSection(activeSection === 'projects' ? null : 'projects')}\n        >\n          <span className=\"paragraph-medium-semibold text-gray-600\">{selectedProject?.title}</span>\n          <IconChevronDown\n            size={20}\n            className={`transition-transform duration-200 ${\n              activeSection === 'projects' ? 'rotate-180 text-gray-950' : 'text-gray-400'\n            }`}\n          />\n        </div>\n      </div>\n      {activeSection === 'projects' && (\n        <div className=\"flex flex-col p-3 gap-2 border border-gray-200 rounded-lg animate-in fade-in duration-400\">\n          <div className=\"flex items-center justify-between\">\n            <span className=\"paragraph-small-semibold\">Projetos</span>\n            {(onAddProject || onManageProjects) && (\n              <div className=\"flex items-center gap-1.5\">\n                {canAddProject && onAddProject && (\n                  <Button variant=\"secondary\" className=\"h-8! paragraph-small-semibold text-gray-950\" onClick={onAddProject}>\n                    <IconPlus size={16} />\n                    Adicionar\n                  </Button>\n                )}\n                {onManageProjects && (\n                  <Button variant=\"secondary\" className=\"p-0 size-8\" onClick={onManageProjects}>\n                    <IconSettings size={18} />\n                  </Button>\n                )}\n              </div>\n            )}\n          </div>\n          <Command className=\"gap-2\">\n            <CommandInput placeholder=\"Busque aqui\" />\n            <CommandList\n              className=\"custom-scrollbar paragraph-small-medium text-gray-600 h-[227px]\"\n              onScroll={(event) => {\n                if (!hasNextPage || isFetchingNextPage || !onLoadMore) return;\n\n                const target = event.currentTarget;\n                const distanceToBottom = target.scrollHeight - target.scrollTop - target.clientHeight;\n\n                if (distanceToBottom <= 80) {\n                  onLoadMore();\n                }\n              }}\n            >\n              <CommandEmpty>Nenhum resultado encontrado.</CommandEmpty>\n              {isLoading ? (\n                <>\n                  <ProjectItemSkeleton />\n                  <ProjectItemSkeleton />\n                  <ProjectItemSkeleton />\n                  <ProjectItemSkeleton />\n                </>\n              ) : (\n                projects.map((project) => (\n                  <CommandItem\n                    key={project.id}\n                    value={`${project.title}-${project.id}`}\n                    keywords={[project.title]}\n                    className={selectedProject?.id === project.id ? 'bg-gray-50 min-h-[39px]' : 'min-h-[39px]'}\n                    onSelect={() => { onSelectProject(project); setActiveSection(null); }}\n                  >\n                    <UserAvatar\n                      photo={project.photo}\n                      name={project.title}\n                      size={36}\n                    />\n                    {project.title}\n                  </CommandItem>\n                ))\n              )}\n              {isFetchingNextPage && (\n                <>\n                  <ProjectItemSkeleton />\n                  <ProjectItemSkeleton />\n                </>\n              )}\n            </CommandList>\n          </Command>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@greatapps/common",
-  "version": "1.1.396",
+  "version": "1.1.398",
   "description": "Shared library for GreatApps frontend applications",
   "main": "./dist/index.mjs",
   "types": "./src/index.ts",

package/src/components/navigation/ProjectSelectorPopover.tsx

@@ -13,7 +13,7 @@ import {
   PopoverTrigger,
   UserAvatar,
 } from '../../index';
-import { IconCheck, IconChevronDown, IconFolderOpen, IconPlus } from '@tabler/icons-react';
+import { IconCheck, IconChevronDown, IconFolderOpen } from '@tabler/icons-react';
 import type { NavigationProject } from './types';
 
 interface ProjectSelectorPopoverProps {
@@ -96,20 +96,6 @@ export function ProjectSelectorPopover({
         <div className="flex flex-col p-3 gap-2">
           <div className="flex items-center justify-between">
             <span className="paragraph-small-semibold">Projetos</span>
-            {(onAddProject || onManageProjects) && (
-              <div className="flex items-center gap-1.5">
-                {onAddProject && (
-                  <Button
-                    variant="secondary"
-                    className="h-8! paragraph-small-semibold text-gray-950"
-                    onClick={onAddProject}
-                  >
-                    <IconPlus size={16} />
-                    Adicionar
-                  </Button>
-                )}
-              </div>
-            )}
           </div>
           <Command className="gap-2">
             <CommandInput placeholder="Busque aqui" />

package/src/modules/plans/hooks/use-has-plan-addon.hook.ts

@@ -2,16 +2,13 @@
 
 import type { AddonKindEnum } from '../../subscriptions/constants/addons.constants';
 import { useActiveSubscription } from '../../subscriptions/hooks/find-active-subscription.hook';
-import { usePlanById } from './use-plan-by-id.hook';
 
 export function useHasPlanAddon(addonId: AddonKindEnum) {
   const { data: subscriptionData, isLoading: isLoadingSubscription } = useActiveSubscription();
   const activeSubscription = subscriptionData?.data?.[0] ?? null;
 
-  const { data: planData, isLoading: isLoadingPlan } = usePlanById(activeSubscription?.id_plan);
-
-  const hasAddon = !!planData?.data?.items?.some((i) => i.id_addon === addonId);
-  const isLoading = isLoadingSubscription || isLoadingPlan;
+  const hasAddon = !!activeSubscription?.items?.find((i) => i.id_addon === addonId);
+  const isLoading = isLoadingSubscription;
 
   return { hasAddon, isLoading };
 }