[PB-3527]:feat/replace custom file grid with UI library Grid component

package.json

@@ -10,7 +10,7 @@
     "@internxt/css-config": "1.1.0",
     "@internxt/lib": "1.4.1",
     "@internxt/sdk": "=1.15.6",
-    "@internxt/ui": "=0.1.8",
+    "@internxt/ui": "^0.0.23",
     "@phosphor-icons/react": "^2.1.7",
     "@popperjs/core": "^2.11.6",
     "@reduxjs/toolkit": "^1.6.0",

src/hooks/useSidenavNavigation.tsx

@@ -5,7 +5,7 @@ import { useSelector } from 'react-redux';
 import { useTranslationContext } from 'app/i18n/provider/TranslationProvider';
 import { useAppSelector } from 'app/store/hooks';
 import workspacesSelectors from 'app/store/slices/workspaces/workspaces.selectors';
-import { SidenavOption } from '@internxt/ui/dist/components/sidenav/SidenavOptions';
+import { SidenavOption } from '@internxt/ui';
 import { AppView } from 'app/core/types';
 import { RootState } from 'app/store';
 import localStorageService from 'services/local-storage.service';
@@ -93,7 +93,7 @@ export const useSidenavNavigation = () => {
         onClick: () => handleDownloadApp(translate),
         isVisible: !isB2BWorkspace,
       },
-    ],
+    ] as SidenavOption[],
     [workspaceUuid, pendingInvitations.length, isB2BWorkspace, translate, onSidenavItemClick],
   );
 

src/views/Drive/components/DriveExplorer/components/DriveExplorerGrid.tsx

@@ -5,10 +5,10 @@ import { useAppDispatch } from 'app/store/hooks';
 import { fetchSortedFolderContentThunk } from 'app/store/slices/storage/storage.thunks/fetchSortedFolderContentThunk';
 import InfiniteScroll from 'react-infinite-scroll-component';
 import { DriveItemData } from 'app/drive/types';
+import { Grid } from '@internxt/ui';
 import DriveGridItemSkeleton from '../../DriveGridItemSkeleton';
 import EditItemNameDialog from 'app/drive/components/EditItemNameDialog/EditItemNameDialog';
 import DriveExplorerGridItem from './DriveExplorerGridItem';
-import './DriveExplorerGrid.scss';
 
 interface DriveExplorerGridProps {
   folderId: string;
@@ -93,7 +93,7 @@ const DriveExplorerGrid: FC<DriveExplorerGridProps> = (props: DriveExplorerGridP
   return (
     <>
       {isLoading && isFirstLoad.current ? (
-        <div className="files-grid grow">{loadingSkeleton()}</div>
+        <Grid className="grow">{loadingSkeleton()}</Grid>
       ) : (
         <div
           id="scrollableList"
@@ -116,14 +116,16 @@ const DriveExplorerGrid: FC<DriveExplorerGridProps> = (props: DriveExplorerGridP
             dataLength={itemsList().length}
             next={onEndOfScroll}
             hasMore={hasMoreItems}
-            loader={loadingSkeleton()}
+            loader={<Grid>{loadingSkeleton()}</Grid>}
             scrollableTarget="scrollableList"
-            className="files-grid z-0 grow"
+            className="z-0 grow"
             style={{ overflow: 'visible' }}
             scrollThreshold={0.6}
           >
-            {itemsFolderList()}
-            {itemsFileList()}
+            <Grid>
+              {itemsFolderList()}
+              {itemsFileList()}
+            </Grid>
           </InfiniteScroll>
         </div>
       )}

yarn.lock

@@ -1886,6 +1886,14 @@
   dependencies:
     tailwindcss "^4.1.17"
 
+"@internxt/css-config@^1.0.2":
+  version "1.0.3"
+  resolved "https://npm.pkg.github.com/download/@internxt/css-config/1.0.3/26437930886829b10faf82680c65ab28baff2d47#26437930886829b10faf82680c65ab28baff2d47"
+  integrity sha512-aLpqoS/qVeRToBbdytJDbPZD4hlJrthYjNZJH/Vv1Mpwd8IdkzrdcMPy1VrUb29DIEhowgBeBgnePh3fVqgdJQ==
+  dependencies:
+    tailwindcss "^3.4.14"
+    typescript "^5.6.3"
+
 "@internxt/eslint-config-internxt@1.0.10":
   version "1.0.10"
   resolved "https://registry.yarnpkg.com/@internxt/eslint-config-internxt/-/eslint-config-internxt-1.0.10.tgz#19025c479f84617a59484660f2f9c983ff3bc4ec"
@@ -1914,15 +1922,15 @@
     axios "1.13.6"
     internxt-crypto "0.0.14"
 
-"@internxt/ui@=0.1.8":
-  version "0.1.8"
-  resolved "https://registry.yarnpkg.com/@internxt/ui/-/ui-0.1.8.tgz#563e266b431b9817a2dd6dd3a39d356a54c081db"
-  integrity sha512-h60suo8azArfm9/sTNQ0pzstPgu802z00gPXE/bnqhE8SyxYeIg3cUlmUAc8avuVOmErSqI5BcNN40JdVRj9NA==
+"@internxt/ui@^0.0.23":
+  version "0.0.23"
+  resolved "https://npm.pkg.github.com/download/@internxt/ui/0.0.23/c3598a1d212405391dbde35d2836f43668c23aa6#c3598a1d212405391dbde35d2836f43668c23aa6"
+  integrity sha512-5AHV78h8tUb2FOq19U6VtsmMHqwmQhojsV4Y8Jx9nOldZd2jDlYpayN+U8kqCMVgMWdczhbHr7ah56CTadvwlg==
   dependencies:
-    "@internxt/css-config" "1.1.0"
-    "@phosphor-icons/react" "^2.1.10"
-    "@radix-ui/react-switch" "^1.2.6"
-    "@radix-ui/themes" "^3.2.1"
+    "@internxt/css-config" "^1.0.2"
+    "@phosphor-icons/react" "^2.1.7"
+    "@radix-ui/react-switch" "^1.1.3"
+    "@radix-ui/themes" "^3.2.0"
 
 "@isaacs/cliui@^8.0.2":
   version "8.0.2"
@@ -2109,11 +2117,6 @@
   resolved "https://registry.yarnpkg.com/@open-draft/until/-/until-2.1.0.tgz#0acf32f470af2ceaf47f095cdecd40d68666efda"
   integrity sha512-U69T3ItWHvLwGg5eJ0n3I62nWuE6ilHlmz7zM0npLBRvPRd7e6NYmg54vvRtP5mZG7kZqZCFVdsTWo7BPtBujg==
 
-"@phosphor-icons/react@^2.1.10":
-  version "2.1.10"
-  resolved "https://registry.yarnpkg.com/@phosphor-icons/react/-/react-2.1.10.tgz#3a97ec5b7a4b8d53afeb29125bc17e74ed2daf92"
-  integrity sha512-vt8Tvq8GLjheAZZYa+YG/pW7HDbov8El/MANW8pOAz4eGxrwhnbfrQZq0Cp4q8zBEu8NIhHdnr+r8thnfRSNYA==
-
 "@phosphor-icons/react@^2.1.7":
   version "2.1.7"
   resolved "https://registry.yarnpkg.com/@phosphor-icons/react/-/react-2.1.7.tgz#b11a4b25849b7e3849970b688d9fe91e5d4fd8d7"
@@ -2666,7 +2669,7 @@
     "@radix-ui/react-use-previous" "1.1.1"
     "@radix-ui/react-use-size" "1.1.1"
 
-"@radix-ui/react-switch@^1.2.6":
+"@radix-ui/react-switch@^1.1.3":
   version "1.2.6"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-switch/-/react-switch-1.2.6.tgz#ff79acb831f0d5ea9216cfcc5b939912571358e3"
   integrity sha512-bByzr1+ep1zk4VubeEVViV592vu2lHE2BZY5OnzehZqOOgogN80+mNtCqPkhn2gklJqOpxWgPoYTSnhBCqpOXQ==
@@ -2834,10 +2837,10 @@
   resolved "https://registry.yarnpkg.com/@radix-ui/rect/-/rect-1.1.1.tgz#78244efe12930c56fd255d7923865857c41ac8cb"
   integrity sha512-HPwpGIzkl28mWyZqG52jiqDJ12waP11Pa1lGoiyUkIEuMLBP0oeK/C89esbXrxsky5we7dfd8U58nm0SgAWpVw==
 
-"@radix-ui/themes@^3.2.1":
-  version "3.2.1"
-  resolved "https://registry.yarnpkg.com/@radix-ui/themes/-/themes-3.2.1.tgz#2a2824627dae4a13b3f250b1611a4eca28c07da8"
-  integrity sha512-WJL2YKAGItkunwm3O4cLTFKCGJTfAfF6Hmq7f5bCo1ggqC9qJQ/wfg/25AAN72aoEM1yqXZQ+pslsw48AFR0Xg==
+"@radix-ui/themes@^3.2.0":
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/themes/-/themes-3.3.0.tgz#e7e795ab158642cf6ca2617c683488445dccc989"
+  integrity sha512-I0/h2CRNTpYNB7Mi3xFIvSsQq5a108d7kK8dTO5zp5b9HR5QJXKag6B8tjpz2ITkVYkFdkGk45doNkSr7OxwNw==
   dependencies:
     "@radix-ui/colors" "^3.0.0"
     classnames "^2.3.2"
@@ -6615,6 +6618,11 @@ jiti@^1.21.6:
   resolved "https://registry.yarnpkg.com/jiti/-/jiti-1.21.6.tgz#6c7f7398dd4b3142767f9a168af2f317a428d268"
   integrity sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w==
 
+jiti@^1.21.7:
+  version "1.21.7"
+  resolved "https://registry.yarnpkg.com/jiti/-/jiti-1.21.7.tgz#9dd81043424a3d28458b193d965f0d18a2300ba9"
+  integrity sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==
+
 js-file-download@^0.4.12:
   version "0.4.12"
   resolved "https://registry.yarnpkg.com/js-file-download/-/js-file-download-0.4.12.tgz#10c70ef362559a5b23cdbdc3bd6f399c3d91d821"
@@ -6758,6 +6766,11 @@ lilconfig@^3.0.0:
   resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-3.1.2.tgz#e4a7c3cb549e3a606c8dcc32e5ae1005e62c05cb"
   integrity sha512-eop+wDAvpItUys0FWkHIKeC9ybYrTGbU41U5K7+bttZZeohvnY7M9dZ5kB21GNWiFT2q1OoPTvncPCgSOVO5ow==
 
+lilconfig@^3.1.1, lilconfig@^3.1.3:
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-3.1.3.tgz#a1bcfd6257f9585bf5ae14ceeebb7b559025e4c4"
+  integrity sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==
+
 lines-and-columns@^1.1.6:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632"
@@ -7720,6 +7733,13 @@ postcss-load-config@^4.0.2:
     lilconfig "^3.0.0"
     yaml "^2.3.4"
 
+"postcss-load-config@^4.0.2 || ^5.0 || ^6.0":
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-6.0.1.tgz#6fd7dcd8ae89badcf1b2d644489cbabf83aa8096"
+  integrity sha512-oPtTM4oerL+UXmx+93ytZVN82RrlY/wPUV8IeDxFrzIjXOLF1pN+EmKPLbubvKHT2HC20xXsCAH2Z+CKV6Oz/g==
+  dependencies:
+    lilconfig "^3.1.1"
+
 postcss-media-query-parser@^0.2.3:
   version "0.2.3"
   resolved "https://registry.yarnpkg.com/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz#27b39c6f4d94f81b1a73b8f76351c609e5cef244"
@@ -9157,6 +9177,34 @@ tailwindcss@^3.3.4:
     resolve "^1.22.8"
     sucrase "^3.35.0"
 
+tailwindcss@^3.4.14:
+  version "3.4.19"
+  resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-3.4.19.tgz#af2a0a4ae302d52ebe078b6775e799e132500ee2"
+  integrity sha512-3ofp+LL8E+pK/JuPLPggVAIaEuhvIz4qNcf3nA1Xn2o/7fb7s/TYpHhwGDv1ZU3PkBluUVaF8PyCHcm48cKLWQ==
+  dependencies:
+    "@alloc/quick-lru" "^5.2.0"
+    arg "^5.0.2"
+    chokidar "^3.6.0"
+    didyoumean "^1.2.2"
+    dlv "^1.1.3"
+    fast-glob "^3.3.2"
+    glob-parent "^6.0.2"
+    is-glob "^4.0.3"
+    jiti "^1.21.7"
+    lilconfig "^3.1.3"
+    micromatch "^4.0.8"
+    normalize-path "^3.0.0"
+    object-hash "^3.0.0"
+    picocolors "^1.1.1"
+    postcss "^8.4.47"
+    postcss-import "^15.1.0"
+    postcss-js "^4.0.1"
+    postcss-load-config "^4.0.2 || ^5.0 || ^6.0"
+    postcss-nested "^6.2.0"
+    postcss-selector-parser "^6.1.2"
+    resolve "^1.22.8"
+    sucrase "^3.35.0"
+
 tailwindcss@^4.1.17:
   version "4.1.17"
   resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-4.1.17.tgz#e6dcb7a9c60cef7522169b5f207ffec2fd652286"
@@ -9409,6 +9457,11 @@ typescript@^4.4.2:
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.9.5.tgz#095979f9bcc0d09da324d58d03ce8f8374cbe65a"
   integrity sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==
 
+typescript@^5.6.3:
+  version "5.9.3"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.9.3.tgz#5b4f59e15310ab17a216f5d6cf53ee476ede670f"
+  integrity sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==
+
 ua-parser-js@^1.0.33:
   version "1.0.41"
   resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-1.0.41.tgz#bd04dc9ec830fcf9e4fad35cf22dcedd2e3b4e9c"