tutur3u · vhpx · Jun 29, 2023 · Jun 17, 2023 · Jun 20, 2023 · Jun 21, 2023
diff --git a/apps/web/package.json b/apps/web/package.json
@@ -25,21 +25,21 @@
     "@emotion/react": "^11.11.1",
     "@emotion/server": "^11.11.0",
     "@heroicons/react": "^2.0.18",
-    "@mantine/core": "^6.0.13",
-    "@mantine/dates": "^6.0.13",
-    "@mantine/form": "^6.0.13",
-    "@mantine/hooks": "^6.0.13",
-    "@mantine/modals": "^6.0.13",
-    "@mantine/next": "^6.0.13",
-    "@mantine/notifications": "^6.0.13",
-    "@mantine/prism": "^6.0.13",
-    "@mantine/spotlight": "^6.0.13",
-    "@mantine/tiptap": "^6.0.13",
-    "@sentry/nextjs": "^7.55.2",
+    "@mantine/core": "^6.0.15",
+    "@mantine/dates": "^6.0.15",
+    "@mantine/form": "^6.0.15",
+    "@mantine/hooks": "^6.0.15",
+    "@mantine/modals": "^6.0.15",
+    "@mantine/next": "^6.0.15",
+    "@mantine/notifications": "^6.0.15",
+    "@mantine/prism": "^6.0.15",
+    "@mantine/spotlight": "^6.0.15",
+    "@mantine/tiptap": "^6.0.15",
+    "@sentry/nextjs": "^7.57.0",
     "@supabase/auth-helpers-nextjs": "^0.7.2",
     "@supabase/auth-helpers-react": "^0.4.0",
-    "@supabase/supabase-js": "^2.25.0",
-    "@tabler/icons-react": "^2.22.0",
+    "@supabase/supabase-js": "^2.26.0",
+    "@tabler/icons-react": "^2.23.0",
     "@tiptap/extension-highlight": "2.0.3",
     "@tiptap/extension-link": "2.0.3",
     "@tiptap/extension-subscript": "2.0.3",
@@ -55,16 +55,16 @@
     "eventsource-parser": "^1.0.0",
     "lodash": "^4.17.21",
     "moment": "^2.29.4",
-    "next": "^13.4.6",
-    "next-translate": "^2.0.6",
+    "next": "^13.4.7",
+    "next-translate": "^2.4.4",
     "nextjs-google-analytics": "^2.3.3",
     "openai": "^3.3.0",
     "react": "18.2.0",
     "react-beautiful-dnd": "^13.1.1",
     "react-csv-reader": "^4.0.0",
     "react-dom": "18.2.0",
     "react-resizable": "^3.0.5",
-    "swr": "^2.1.5",
+    "swr": "^2.2.0",
     "ui": "workspace:*",
     "uuid": "^9.0.0",
     "xlsx": "^0.18.5"
@@ -76,29 +76,29 @@
     "@types/jest": "^29.5.2",
     "@types/js-cookie": "^3.0.3",
     "@types/lodash": "^4.14.195",
-    "@types/node": "^20.3.1",
-    "@types/react": "^18.2.12",
+    "@types/node": "^20.3.2",
+    "@types/react": "^18.2.14",
     "@types/react-beautiful-dnd": "^13.1.4",
-    "@types/react-dom": "^18.2.5",
+    "@types/react-dom": "^18.2.6",
     "@types/react-resizable": "^3.0.4",
     "@types/testing-library__jest-dom": "^5.14.6",
     "@types/uuid": "^9.0.2",
-    "@typescript-eslint/eslint-plugin": "^5.59.11",
-    "@typescript-eslint/parser": "^5.59.11",
+    "@typescript-eslint/eslint-plugin": "^5.60.1",
+    "@typescript-eslint/parser": "^5.60.1",
     "autoprefixer": "^10.4.14",
     "eslint": "8.43.0",
     "eslint-config-custom": "workspace:*",
     "genversion": "^3.1.1",
     "jest": "^29.5.0",
     "jest-environment-jsdom": "^29.5.0",
-    "lint-staged": "^13.2.2",
-    "next-translate-plugin": "^2.0.5",
+    "lint-staged": "^13.2.3",
+    "next-translate-plugin": "^2.4.4",
     "postcss": "^8.4.24",
-    "supabase": "^1.68.6",
+    "supabase": "^1.75.2",
     "tailwind-config": "workspace:*",
     "tailwindcss": "^3.3.2",
     "tsconfig": "workspace:*",
-    "typescript": "^5.1.3"
+    "typescript": "^5.1.6"
   },
   "packageManager": "[email protected]"
 }
diff --git a/apps/web/src/components/cards/ProductCard.tsx b/apps/web/src/components/cards/ProductCard.tsx
@@ -55,9 +55,9 @@ const ProductCard = ({
                   <span className="opacity-75">sản phẩm</span>
                 </div>
               )}
-              {showCategory && (
+              {showCategory && product?.category && (
                 <div className="line-clamp-1 w-full rounded border border-orange-500/20 bg-orange-500/10 px-4 py-0.5 font-semibold text-orange-500 dark:border-orange-300/20 dark:bg-orange-300/10 dark:text-orange-300">
-                  {product?.category}
+                  {product.category}
                 </div>
               )}
             </div>

diff --git a/apps/web/src/components/layouts/LeftSidebar.tsx b/apps/web/src/components/layouts/LeftSidebar.tsx
@@ -124,7 +124,7 @@ function LeftSidebar({ className }: SidebarProps) {
         )}
       </div>
 
-      <Divider className="my-2" />
+      <Divider className={`my-2 ${sidebar === 'closed' && 'mt-[0.6rem]'}`} />
 
       {ws?.id && (
         <div className="mx-2">

diff --git a/apps/web/src/components/layouts/NestedLayout.tsx b/apps/web/src/components/layouts/NestedLayout.tsx
@@ -9,7 +9,7 @@ import BottomNavbar from './BottomNavbar';
 import { useAppearance } from '../../hooks/useAppearance';
 import LeftSidebar from './LeftSidebar';
 import TopNavbar from './TopNavbar';
-import ScrollTopTopButton from './ScrollTopTopButton';
+import ScrollToTopButton from './ScrollToTopButton';
 
 interface Props {
   children: React.ReactNode;
@@ -51,23 +51,23 @@ const NestedLayout: FC<Props> = ({
   const [disableTabs, setDisableTabs] = useState(defaultNoTabs);
   const [cachedDisableTabs, setCachedDisableTabs] = useState(defaultNoTabs);
 
+  const elementId = 'content';
   const [prevScrollPos, setPrevScrollPos] = useState(0);
 
   useEffect(() => {
     if (defaultNoTabs) {
       setDisableTabs(true);
       setCachedDisableTabs(true);
-      return;
     } else {
       setDisableTabs(false);
       setCachedDisableTabs(false);
     }
 
-    const content = document.getElementById('content');
-    if (!content) return;
+    const el = document.getElementById(elementId);
+    if (!el) return;
 
     const handleScroll = () => {
-      const pos = content.scrollTop;
+      const pos = el.scrollTop;
       setPrevScrollPos(pos);
 
       const disable = pos > 0;
@@ -76,14 +76,15 @@ const NestedLayout: FC<Props> = ({
       setCachedDisableTabs(disable);
     };
 
-    content.addEventListener('scroll', handleScroll);
-    return () => content.removeEventListener('scroll', handleScroll);
-  }, [defaultNoTabs]);
+    el.addEventListener('scroll', handleScroll);
+    return () => el.removeEventListener('scroll', handleScroll);
+  }, [defaultNoTabs, elementId]);
 
   return (
-    <div className="flex">
-      <ScrollTopTopButton prevScrollPos={prevScrollPos} />
+    <div className="flex max-h-screen min-h-full">
+      <ScrollToTopButton elementId={elementId} prevScrollPos={prevScrollPos} />
       <LeftSidebar />
+      <BottomNavbar />
       <TopNavbar
         cachedDisableTabs={cachedDisableTabs}
         defaultNoTabs={defaultNoTabs}
@@ -94,11 +95,10 @@ const NestedLayout: FC<Props> = ({
         segments={segments}
         tabs={filteredTabs}
       />
-      <BottomNavbar />
 
       <main
         id="content"
-        className={`h-full w-full overflow-x-hidden scroll-smooth transition-all duration-500 md:h-screen ${
+        className={`h-full w-full overflow-x-hidden scroll-smooth transition-all duration-500 ${
           sidebar === 'open'
             ? 'fixed overflow-y-hidden md:static md:overflow-y-auto'
             : 'overflow-y-auto'

diff --git a/...components/layouts/ScrollTopTopButton.tsx → .../components/layouts/ScrollToTopButton.tsx b/...components/layouts/ScrollTopTopButton.tsx → .../components/layouts/ScrollToTopButton.tsx
@@ -2,10 +2,11 @@ import { ArrowUpCircleIcon } from '@heroicons/react/24/solid';
 import { Button } from '@mantine/core';
 
 interface Props {
+  elementId: string;
   prevScrollPos: number;
 }
 
-const ScrollTopTopButton = ({ prevScrollPos }: Props) => {
+const ScrollToTopButton = ({ elementId, prevScrollPos }: Props) => {
   return (
     <Button
       className={`fixed bottom-16 right-4 z-50 rounded-full border border-blue-300/50 bg-[#f4f9ff] dark:border-blue-300/20 dark:bg-[#2b3542] md:bottom-4 md:right-8 ${
@@ -14,12 +15,12 @@ const ScrollTopTopButton = ({ prevScrollPos }: Props) => {
       size="md"
       variant="subtle"
       onClick={() => {
-        document?.getElementById('content')?.scrollTo(0, 0);
+        document?.getElementById(elementId)?.scrollTo(0, 0);
       }}
     >
       <ArrowUpCircleIcon className="h-6 w-6" />
     </Button>
   );
 };
 
-export default ScrollTopTopButton;
+export default ScrollToTopButton;
diff --git a/apps/web/src/components/layouts/TopNavbar.tsx b/apps/web/src/components/layouts/TopNavbar.tsx
@@ -36,9 +36,9 @@ const TopNavbar = ({
       id="top-navigation"
       className={`${
         disableTabs ? 'h-[3.95rem]' : 'h-25'
-      } fixed left-0 right-0 top-0 ${
+      } fixed left-0 right-0 top-0 w-full ${
         isExpanded ? 'md:left-64' : 'md:left-[3.8rem]'
-      } z-[100] clear-both w-full flex-none border-b border-zinc-300 bg-white/50 backdrop-blur transition-all duration-500 content-none dark:border-zinc-800 dark:bg-[#111113]/50`}
+      } z-[100] clear-both flex-none border-b border-zinc-300 bg-white/50 backdrop-blur transition-all duration-500 content-none dark:border-zinc-800 dark:bg-[#111113]/50`}
       onMouseEnter={
         defaultNoTabs || !disableTabs ? undefined : () => setDisableTabs(false)
       }

diff --git a/apps/web/src/components/layouts/sidebar/SidebarLinkList.tsx b/apps/web/src/components/layouts/sidebar/SidebarLinkList.tsx
@@ -86,12 +86,14 @@ const SidebarLinkList = ({ wsId, wsPreset, sidebarOpened }: Props) => {
         />
       )}
 
-      <SidebarLink
-        href={`/${wsId}/documents`}
-        activeIcon={<ClipboardDocumentListIcon className="w-5" />}
-        label={documents}
-        showTooltip={!sidebarOpened}
-      />
+      {(wsPreset === 'ALL' || wsPreset !== 'PHARMACY') && (
+        <SidebarLink
+          href={`/${wsId}/documents`}
+          activeIcon={<ClipboardDocumentListIcon className="w-5" />}
+          label={documents}
+          showTooltip={!sidebarOpened}
+        />
+      )}
 
       <SidebarLink
         href={`/${wsId}/users`}
@@ -116,14 +118,12 @@ const SidebarLinkList = ({ wsId, wsPreset, sidebarOpened }: Props) => {
         />
       )}
 
-      {adminLevel && (
-        <SidebarLink
-          href={`/${wsId}/inventory`}
-          activeIcon={<ArchiveBoxIcon className="w-5" />}
-          label={inventory}
-          showTooltip={!sidebarOpened}
-        />
-      )}
+      <SidebarLink
+        href={`/${wsId}/inventory`}
+        activeIcon={<ArchiveBoxIcon className="w-5" />}
+        label={inventory}
+        showTooltip={!sidebarOpened}
+      />
 
       {(wsPreset === 'ALL' || wsPreset === 'EDUCATION') && (
         <SidebarLink

diff --git a/apps/web/src/components/selectors/PaginationSelector.tsx b/apps/web/src/components/selectors/PaginationSelector.tsx
@@ -8,12 +8,23 @@ interface Props {
   items: number;
   setItems: (items: number) => void;
   options?: number[];
+  evenNumbers?: boolean;
 }
 
-const PaginationSelector = ({ items, setItems, options }: Props) => {
+const PaginationSelector = ({
+  items,
+  setItems,
+  options,
+  evenNumbers = false,
+}: Props) => {
   const { t } = useTranslation('pagination');
 
-  const data = (options ?? [1, 3, 7, 11, 15, 35, 55, 75, 95]).map((val) => ({
+  const oddOptions = [1, 3, 7, 11, 15, 35, 55, 75, 95];
+  const evenOptions = [2, 4, 8, 12, 16, 36, 56, 76, 96];
+
+  const defaultOptions = evenNumbers ? evenOptions : oddOptions;
+
+  const data = (options ?? defaultOptions).map((val) => ({
     value: val.toString(),
     label: `${val} ${t('items')}`,
   }));

diff --git a/apps/web/src/pages/[wsId]/infrastructure/users.tsx b/apps/web/src/pages/[wsId]/infrastructure/users.tsx
@@ -76,12 +76,12 @@ const InfrastructureUsersPage: PageWithLayoutProps = () => {
           <GeneralSearchBar setQuery={setQuery} />
           <ModeSelector mode={mode} setMode={setMode} />
           <PaginationSelector
-            options={[1, 4, 8, 12, 16, 36, 56, 76, 96]}
             items={itemsPerPage}
             setItems={(size) => {
               setPage(1);
               setItemsPerPage(size);
             }}
+            evenNumbers
           />
           <div className="hidden xl:block" />
         </div>

diff --git a/apps/web/src/pages/[wsId]/infrastructure/workspaces.tsx b/apps/web/src/pages/[wsId]/infrastructure/workspaces.tsx
@@ -77,12 +77,12 @@ const InfrastructureWorkspacesPage: PageWithLayoutProps = () => {
           <GeneralSearchBar setQuery={setQuery} />
           <ModeSelector mode={mode} setMode={setMode} />
           <PaginationSelector
-            options={[1, 4, 8, 12, 16, 36, 56, 76, 96]}
             items={itemsPerPage}
             setItems={(size) => {
               setPage(1);
               setItemsPerPage(size);
             }}
+            evenNumbers
           />
           <div className="hidden xl:block" />
         </div>

diff --git a/apps/web/src/pages/[wsId]/inventory/products/new.tsx b/apps/web/src/pages/[wsId]/inventory/products/new.tsx
@@ -65,6 +65,8 @@ const NewProductPage: PageWithLayoutProps = () => {
             name,
             manufacturer,
             category_id: categoryId,
+            description,
+            usage,
           }}
         />
       ),

diff --git a/apps/web/src/pages/[wsId]/inventory/suppliers/[supplierId].tsx b/apps/web/src/pages/[wsId]/inventory/suppliers/[supplierId].tsx
@@ -22,10 +22,12 @@ const SupplierDetailsPage: PageWithLayoutProps = () => {
   const router = useRouter();
   const { supplierId } = router.query;
 
-  const supplierApiPath = `/api/suppliers/${supplierId}`;
-  const { data: supplier } = useSWR<ProductSupplier>(
-    supplierId ? supplierApiPath : null
-  );
+  const supplierApiPath =
+    ws && supplierId
+      ? `/api/workspaces/${ws.id}/inventory/suppliers/${supplierId}`
+      : null;
+
+  const { data: supplier } = useSWR<ProductSupplier>(supplierApiPath);
 
   useEffect(() => {
     setRootSegment(
-Original file line number
+Diff line change
@@ Expand Up / @@ -65,6 +65,8 @@ const NewProductPage: PageWithLayoutProps = () => { @@
                 name,
                 manufacturer,
                 category_id: categoryId,
+                description,
+                usage,
               }}
             />
           ),
@@ Expand Down @@