@orbe-agro/client-core-prod 5.6.136 → 5.6.137

package/lib/@ecme/components/layouts/PostLoginLayout/components/CollapsibleSide.stories.tsx

@@ -0,0 +1,38 @@
+import type { Meta, StoryObj } from '@storybook/react'
+import { BrowserRouter } from 'react-router-dom'
+import CollapsibleSide from './CollapsibleSide'
+
+const meta = {
+    title: '@ecme/Layouts/PostLogin/CollapsibleSide',
+    component: CollapsibleSide,
+    parameters: {
+        layout: 'fullscreen',
+    },
+    tags: ['autodocs'],
+    decorators: [
+        (Story) => (
+            <BrowserRouter>
+                <Story />
+            </BrowserRouter>
+        ),
+    ],
+} satisfies Meta<typeof CollapsibleSide>
+
+export default meta
+
+type TStory = StoryObj<typeof meta>
+
+export const Default: TStory = {
+    args: {
+        pageTitle: 'Dashboard',
+    },
+    render: (args) => (
+        <CollapsibleSide {...args}>
+            <div className="p-4">
+                <div className="rounded border border-gray-200 p-4">
+                    Conteudo da pagina
+                </div>
+            </div>
+        </CollapsibleSide>
+    ),
+}

package/lib/@ecme/components/layouts/PostLoginLayout/components/ContentOverlay.stories.tsx

@@ -0,0 +1,35 @@
+import type { Meta, StoryObj } from '@storybook/react'
+import { BrowserRouter } from 'react-router-dom'
+import ContentOverlay from './ContentOverlay'
+
+const meta = {
+    title: '@ecme/Layouts/PostLogin/ContentOverlay',
+    component: ContentOverlay,
+    parameters: {
+        layout: 'fullscreen',
+    },
+    tags: ['autodocs'],
+    decorators: [
+        (Story) => (
+            <BrowserRouter>
+                <Story />
+            </BrowserRouter>
+        ),
+    ],
+} satisfies Meta<typeof ContentOverlay>
+
+export default meta
+
+type TStory = StoryObj<typeof meta>
+
+export const Default: TStory = {
+    render: () => (
+        <ContentOverlay>
+            <div className="p-4">
+                <div className="rounded border border-gray-200 bg-white p-4 dark:bg-gray-900">
+                    Conteudo da pagina
+                </div>
+            </div>
+        </ContentOverlay>
+    ),
+}

package/lib/@ecme/components/layouts/PostLoginLayout/components/FrameLessSide.stories.tsx

@@ -0,0 +1,35 @@
+import type { Meta, StoryObj } from '@storybook/react'
+import { BrowserRouter } from 'react-router-dom'
+import FrameLessSide from './FrameLessSide'
+
+const meta = {
+    title: '@ecme/Layouts/PostLogin/FrameLessSide',
+    component: FrameLessSide,
+    parameters: {
+        layout: 'fullscreen',
+    },
+    tags: ['autodocs'],
+    decorators: [
+        (Story) => (
+            <BrowserRouter>
+                <Story />
+            </BrowserRouter>
+        ),
+    ],
+} satisfies Meta<typeof FrameLessSide>
+
+export default meta
+
+type TStory = StoryObj<typeof meta>
+
+export const Default: TStory = {
+    render: () => (
+        <FrameLessSide>
+            <div className="p-4">
+                <div className="rounded border border-gray-200 bg-white p-4 dark:bg-gray-900">
+                    Conteudo da pagina
+                </div>
+            </div>
+        </FrameLessSide>
+    ),
+}

package/lib/@ecme/components/layouts/PostLoginLayout/components/StackedSide.stories.tsx

@@ -0,0 +1,38 @@
+import type { Meta, StoryObj } from '@storybook/react'
+import { BrowserRouter } from 'react-router-dom'
+import StackedSide from './StackedSide'
+
+const meta = {
+    title: '@ecme/Layouts/PostLogin/StackedSide',
+    component: StackedSide,
+    parameters: {
+        layout: 'fullscreen',
+    },
+    tags: ['autodocs'],
+    decorators: [
+        (Story) => (
+            <BrowserRouter>
+                <Story />
+            </BrowserRouter>
+        ),
+    ],
+} satisfies Meta<typeof StackedSide>
+
+export default meta
+
+type TStory = StoryObj<typeof meta>
+
+export const Default: TStory = {
+    args: {
+        pageTitle: 'Dashboard',
+    },
+    render: (args) => (
+        <StackedSide {...args}>
+            <div className="p-4">
+                <div className="rounded border border-gray-200 p-4">
+                    Conteudo da pagina
+                </div>
+            </div>
+        </StackedSide>
+    ),
+}

package/lib/@ecme/components/layouts/PostLoginLayout/components/TopBarClassic.stories.tsx

@@ -0,0 +1,38 @@
+import type { Meta, StoryObj } from '@storybook/react'
+import { BrowserRouter } from 'react-router-dom'
+import TopBarClassic from './TopBarClassic'
+
+const meta = {
+    title: '@ecme/Layouts/PostLogin/TopBarClassic',
+    component: TopBarClassic,
+    parameters: {
+        layout: 'fullscreen',
+    },
+    tags: ['autodocs'],
+    decorators: [
+        (Story) => (
+            <BrowserRouter>
+                <Story />
+            </BrowserRouter>
+        ),
+    ],
+} satisfies Meta<typeof TopBarClassic>
+
+export default meta
+
+type TStory = StoryObj<typeof meta>
+
+export const Default: TStory = {
+    args: {
+        pageTitle: 'Dashboard',
+    },
+    render: (args) => (
+        <TopBarClassic {...args}>
+            <div className="p-4">
+                <div className="rounded border border-gray-200 p-4">
+                    Conteudo da pagina
+                </div>
+            </div>
+        </TopBarClassic>
+    ),
+}

package/lib/@ecme/components/template/Header.stories.tsx

@@ -0,0 +1,46 @@
+import type { Meta, StoryObj } from '@storybook/react'
+import Header from './Header'
+
+const meta = {
+    title: '@ecme/Template/Header',
+    component: Header,
+    parameters: {
+        layout: 'fullscreen',
+    },
+    tags: ['autodocs'],
+    argTypes: {
+        container: {
+            control: 'boolean',
+        },
+        className: {
+            control: 'text',
+        },
+        wrapperClass: {
+            control: 'text',
+        },
+    },
+} satisfies Meta<typeof Header>
+
+export default meta
+
+type TStory = StoryObj<typeof meta>
+
+export const Default: TStory = {
+    args: {
+        container: false,
+        className: '',
+        wrapperClass: '',
+    },
+    render: (args) => (
+        <Header
+            {...args}
+            headerStart={
+                <div className="px-4 text-sm font-semibold">Minha Marca</div>
+            }
+            headerMiddle={<div className="text-sm">Área central</div>}
+            headerEnd={
+                <div className="px-4 text-sm text-gray-600">Usuário</div>
+            }
+        />
+    ),
+}

package/lib/@ecme/components/template/Search.stories.tsx

@@ -0,0 +1,79 @@
+import type { Meta, StoryObj } from '@storybook/react'
+import { useEffect } from 'react'
+import { BrowserRouter } from 'react-router-dom'
+import navigationConfig from '@/configs/navigation.config'
+import type { NavigationTree } from '@/@types/navigation'
+import { useSessionUser } from '@/store/authStore'
+import Search from './Search'
+
+const collectAuthorityPaths = (navTree: NavigationTree[]): string[] => {
+    return navTree.reduce((acc: string[], node) => {
+        if (node.path) {
+            acc.push(node.path)
+        }
+
+        if (node.subMenu?.length) {
+            acc.push(...collectAuthorityPaths(node.subMenu))
+        }
+
+        return acc
+    }, [])
+}
+
+const allAuthority = Array.from(new Set(collectAuthorityPaths(navigationConfig)))
+
+const WithSimulatedAuthorities = ({
+    children,
+}: {
+    children: React.ReactNode
+}) => {
+    useEffect(() => {
+        const previousUser = useSessionUser.getState().user
+
+        useSessionUser.setState({
+            user: {
+                ...previousUser,
+                authority: allAuthority,
+            },
+        })
+
+        return () => {
+            useSessionUser.setState({ user: previousUser })
+        }
+    }, [])
+
+    return <>{children}</>
+}
+
+const meta = {
+    title: '@ecme/Template/Search',
+    component: Search,
+    parameters: {
+        layout: 'padded',
+    },
+    tags: ['autodocs'],
+    decorators: [
+        (Story) => (
+            <BrowserRouter>
+                <WithSimulatedAuthorities>
+                    <Story />
+                </WithSimulatedAuthorities>
+            </BrowserRouter>
+        ),
+    ],
+    argTypes: {
+        className: {
+            control: 'text',
+        },
+    },
+} satisfies Meta<typeof Search>
+
+export default meta
+
+type TStory = StoryObj<typeof meta>
+
+export const Default: TStory = {
+    args: {
+        className: '',
+    },
+}

package/lib/@ecme/components/template/Search.tsx

@@ -2,22 +2,11 @@ import { NavigationTree } from '@/@types/navigation'
 import Button from '@/components/ui/Button'
 import Dialog from '@/components/ui/Dialog'
 import ScrollBar from '@/components/ui/ScrollBar'
-import navigationIcon from '@/configs/navigation-icon.config'
 import navigationConfig from '@/configs/navigation.config'
 import { NAV_ITEM_TYPE_ITEM } from '@/constants/navigation.constant'
-import {
-    GUIDE_PREFIX_PATH,
-    UI_COMPONENTS_PREFIX_PATH,
-} from '@/constants/route.constant'
+import { useSessionUser } from '@/store/authStore'
 import classNames from '@/utils/classNames'
 import withHeaderItem from '@/utils/hoc/withHeaderItem'
-import {
-    filterDeep,
-    findDeep,
-    findPathDeep,
-    findValueDeep,
-} from 'deepdash-es/standalone'
-import { flatten, flattenDeep } from 'lodash'
 import debounce from 'lodash/debounce'
 import { useEffect, useMemo, useRef, useState } from 'react'
 import Highlighter from 'react-highlight-words'
@@ -42,6 +31,38 @@ type SearchResult = {
     data: SearchData[]
 }
 
+const filterNavigationByAuthority = (
+    navTree: NavigationTree[],
+    userAuthority: string[],
+): NavigationTree[] => {
+    return navTree.reduce((acc: NavigationTree[], nav) => {
+        if (nav.excludeWhenHasPaths && nav.excludeWhenHasPaths.length > 0) {
+            const shouldExclude = nav.excludeWhenHasPaths.some((path) =>
+                userAuthority.includes(path),
+            )
+
+            if (shouldExclude) {
+                return acc
+            }
+        }
+
+        if (nav.subMenu && nav.subMenu.length > 0) {
+            const filteredSubMenu = filterNavigationByAuthority(
+                nav.subMenu,
+                userAuthority,
+            )
+
+            if (filteredSubMenu.length > 0) {
+                acc.push({ ...nav, subMenu: filteredSubMenu })
+            }
+        } else if ((nav.path && userAuthority.includes(nav.path)) || !nav.path) {
+            acc.push(nav)
+        }
+
+        return acc
+    }, [])
+}
+
 const ListItem = (props: {
     icon: string
     label: string
@@ -98,6 +119,7 @@ const _Search = ({ className }: { className?: string }) => {
     const [searchDialogOpen, setSearchDialogOpen] = useState(false)
     const [searchResult, setSearchResult] = useState<SearchResult[]>([])
     const [noResult, setNoResult] = useState(false)
+    const userAuthority = useSessionUser((state) => state.user.authority)
 
     const inputRef = useRef<HTMLInputElement>(null)
 
@@ -121,6 +143,10 @@ const _Search = ({ className }: { className?: string }) => {
 
     const flatNavTree = useMemo(() => {
         const arr: NavigationTreeFlat[] = []
+        const filteredNavigationTree = filterNavigationByAuthority(
+            navigationConfig,
+            userAuthority || [],
+        )
 
         const makeflat = (item: NavigationTree, parents: string[]) => {
             if (Array.isArray(item.subMenu) && item.subMenu.length > 0) {
@@ -131,11 +157,12 @@ const _Search = ({ className }: { className?: string }) => {
             arr.push({ ...item, parents })
         }
 
-        navigationConfig.forEach(function f(item) {
+        filteredNavigationTree.forEach(function f(item) {
             makeflat(item, [t(item.translateKey)])
         })
+
         return arr
-    }, [navigationConfig, t])
+    }, [userAuthority, t])
 
     const filterNavigationTreeFlat = (
         text: string,

package/lib/@ecme/components/template/VerticalMenuContent/VerticalMenuContent.stories.tsx

@@ -2,12 +2,7 @@ import type { Meta, StoryObj } from '@storybook/react'
 import { BrowserRouter } from 'react-router-dom'
 import VerticalMenuContent from './VerticalMenuContent'
 import type { NavigationTree } from '@/@types/navigation'
-import ticketNavigationConfig from '@base/configs/navigation.config/modules.submenu/Ticket/ticket.navigation'
-import {
-    NAV_ITEM_TYPE_COLLAPSE,
-    NAV_ITEM_TYPE_ITEM,
-    NAV_ITEM_TYPE_TITLE,
-} from '@/constants/navigation.constant'
+import modulesNavigationConfig from '@base/configs/navigation.config/modules.navigation'
 
 const collectAuthorityPaths = (navTree: NavigationTree[]): string[] => {
     return navTree.reduce((acc: string[], node) => {
@@ -23,151 +18,10 @@ const collectAuthorityPaths = (navTree: NavigationTree[]): string[] => {
     }, [])
 }
 
-const ticketAuthority = Array.from(
-    new Set(collectAuthorityPaths(ticketNavigationConfig)),
+const allAuthority = Array.from(
+    new Set(collectAuthorityPaths(modulesNavigationConfig)),
 )
 
-const ticketSubmenuAllExpanded: NavigationTree[] = ticketNavigationConfig.map(
-    (menu) => {
-        if (menu.key !== 'ticket') {
-            return menu
-        }
-
-        return {
-            ...menu,
-            subMenu: menu.subMenu.map((subMenu) => {
-                if (
-                    subMenu.key === 'ticket.relatorios' ||
-                    subMenu.key === 'ticket.cadastros'
-                ) {
-                    return {
-                        ...subMenu,
-                        type: NAV_ITEM_TYPE_TITLE,
-                    }
-                }
-
-                return subMenu
-            }),
-        }
-    },
-)
-
-const mockNavigationTree: NavigationTree[] = [
-    {
-        key: 'inicio',
-        path: '/inicio',
-        title: 'Início',
-        translateKey: 'nav.inicio',
-        icon: '',
-        type: NAV_ITEM_TYPE_ITEM,
-        authority: ['/inicio'],
-        subMenu: [],
-    },
-    {
-        key: 'cadastros',
-        path: '',
-        title: 'Cadastros',
-        translateKey: 'nav.cadastros',
-        icon: '',
-        type: NAV_ITEM_TYPE_COLLAPSE,
-        authority: ['/cadastros'],
-        subMenu: [
-            {
-                key: 'clientes',
-                path: '/cadastros/clientes',
-                title: 'Clientes',
-                translateKey: 'nav.clientes',
-                icon: '',
-                type: NAV_ITEM_TYPE_ITEM,
-                authority: ['/cadastros/clientes'],
-                subMenu: [],
-            },
-            {
-                key: 'fornecedores',
-                path: '/cadastros/fornecedores',
-                title: 'Fornecedores',
-                translateKey: 'nav.fornecedores',
-                icon: '',
-                type: NAV_ITEM_TYPE_ITEM,
-                authority: ['/cadastros/fornecedores'],
-                subMenu: [],
-            },
-        ],
-    },
-    {
-        key: 'relatorios',
-        path: '/relatorios',
-        title: 'Relatórios',
-        translateKey: 'nav.relatorios',
-        icon: 'ChartBarIcon',
-        type: NAV_ITEM_TYPE_ITEM,
-        authority: ['/relatorios'],
-        subMenu: [],
-    },
-    {
-        key: 'configuracoes',
-        path: '',
-        title: 'Configurações',
-        translateKey: 'nav.configuracoes',
-        icon: '',
-        type: NAV_ITEM_TYPE_COLLAPSE,
-        authority: ['/configuracoes'],
-        subMenu: [
-            {
-                key: 'perfil',
-                path: '/configuracoes/perfil',
-                title: 'Perfil',
-                translateKey: 'nav.perfil',
-                icon: '',
-                type: NAV_ITEM_TYPE_ITEM,
-                authority: ['/configuracoes/perfil'],
-                subMenu: [],
-            },
-            {
-                key: 'integracoes',
-                path: '',
-                title: 'Integrações',
-                translateKey: 'nav.integracoes',
-                icon: '',
-                type: NAV_ITEM_TYPE_COLLAPSE,
-                authority: ['/configuracoes/integracoes'],
-                subMenu: [
-                    {
-                        key: 'webhooks',
-                        path: '/configuracoes/integracoes/webhooks',
-                        title: 'Webhooks',
-                        translateKey: 'nav.webhooks',
-                        icon: 'WebhookIcon',
-                        type: NAV_ITEM_TYPE_ITEM,
-                        authority: ['/configuracoes/integracoes/webhooks'],
-                        subMenu: [],
-                    },
-                    {
-                        key: 'lorem.ipsum',
-                        path: '/configuracoes/integracoes/lorem-ipsum',
-                        title: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.',
-                        translateKey: 'nav.loremIpsum',
-                        icon: 'LoremIpsumIcon',
-                        type: NAV_ITEM_TYPE_ITEM,
-                        authority: ['/configuracoes/integracoes/lorem-ipsum'],
-                        subMenu: [],
-                    },
-                ],
-            },
-        ],
-    },
-]
-
-const allUserAuthority = [
-    '/inicio',
-    '/cadastros/clientes',
-    '/cadastros/fornecedores',
-    '/relatorios',
-    '/configuracoes/perfil',
-    '/configuracoes/integracoes/webhooks',
-    '/configuracoes/integracoes/lorem-ipsum',
-]
-
 const meta: Meta<typeof VerticalMenuContent> = {
     title: '@ecme/Template/VerticalMenuContent',
     component: VerticalMenuContent,
@@ -202,110 +56,17 @@ type TStory = StoryObj<typeof VerticalMenuContent>
 export const Default: TStory = {
     args: {
         collapsed: false,
-        routeKey: '/inicio',
-        navigationTree: mockNavigationTree,
-        userAuthority: allUserAuthority,
-        direction: 'ltr',
-        translationSetup: true,
-    },
-}
-
-export const Collapsed: TStory = {
-    args: {
-        collapsed: true,
-        routeKey: '/cadastros/clientes',
-        navigationTree: mockNavigationTree,
-        userAuthority: allUserAuthority,
-        direction: 'ltr',
-        translationSetup: true,
-    },
-}
-
-export const WithExpandedMenu: TStory = {
-    args: {
-        collapsed: false,
-        routeKey: '/configuracoes/integracoes/webhooks',
-        navigationTree: mockNavigationTree,
-        userAuthority: allUserAuthority,
-        direction: 'ltr',
-        translationSetup: true,
-    },
-}
-
-export const LimitedAuthority: TStory = {
-    args: {
-        collapsed: false,
-        routeKey: '/inicio',
-        navigationTree: mockNavigationTree,
-        userAuthority: ['/inicio', '/relatorios'],
-        direction: 'ltr',
-        translationSetup: true,
-    },
-}
-
-export const RTLDirection: TStory = {
-    args: {
-        collapsed: false,
-        routeKey: '/inicio',
-        navigationTree: mockNavigationTree,
-        userAuthority: allUserAuthority,
-        direction: 'rtl',
-        translationSetup: true,
-    },
-}
-
-export const MinimalNavigation: TStory = {
-    args: {
-        collapsed: false,
-        routeKey: '/inicio',
-        navigationTree: [
-            {
-                key: 'inicio',
-                path: '/inicio',
-                title: 'Início',
-                translateKey: 'nav.inicio',
-                icon: '',
-                type: NAV_ITEM_TYPE_ITEM,
-                authority: ['/inicio'],
-                subMenu: [],
-            },
-        ],
-        userAuthority: ['/inicio'],
-        direction: 'ltr',
-        translationSetup: true,
-    },
-}
-
-export const WithMenuClick: TStory = {
-    args: {
-        collapsed: false,
-        routeKey: '/inicio',
-        navigationTree: mockNavigationTree,
-        userAuthority: allUserAuthority,
-        direction: 'ltr',
-        translationSetup: true,
-        onMenuItemClick: () => alert('Menu item clicked!'),
-    },
-}
-
-export const TicketSubmenu: TStory = {
-    args: {
-        collapsed: false,
-        routeKey: 'ticket',
-        navigationTree: ticketNavigationConfig,
-        userAuthority: ticketAuthority,
-        direction: 'ltr',
-        translationSetup: true,
-    },
-}
-
-export const TicketSubmenuSortOrderStable: TStory = {
-    args: {
-        collapsed: false,
-        routeKey: 'ticket',
-        navigationTree: ticketSubmenuAllExpanded,
-        userAuthority: ticketAuthority,
+        routeKey: 'modules',
+        navigationTree: modulesNavigationConfig,
+        userAuthority: allAuthority,
         direction: 'ltr',
         translationSetup: true,
     },
+    decorators: [
+        (Story) => (
+            <div style={{ maxWidth: '25vw' }}>
+                <Story />
+            </div>
+        ),
+    ],
 }