fix: update dependencies and fix ui breaking changes (#397)

graasp · Jul 4, 2024 · c376302 · c376302
1 parent d006aab
commit c376302
Show file tree

Hide file tree

Showing 3 changed files with 1,412 additions and 906 deletions.
diff --git a/package.json b/package.json
@@ -18,38 +18,38 @@
     "@emotion/cache": "11.11.0",
     "@emotion/react": "11.11.4",
     "@emotion/styled": "11.11.5",
-    "@graasp/query-client": "3.13.0",
-    "@graasp/sdk": "4.12.0",
-    "@graasp/translations": "1.28.0",
-    "@graasp/ui": "4.17.1",
-    "@mui/icons-material": "5.15.16",
+    "@graasp/query-client": "3.15.0",
+    "@graasp/sdk": "4.15.1",
+    "@graasp/translations": "1.31.0",
+    "@graasp/ui": "4.20.2",
+    "@mui/icons-material": "5.15.21",
     "@mui/lab": "5.0.0-alpha.141",
-    "@mui/material": "5.15.16",
-    "@sentry/react": "7.113.0",
+    "@mui/material": "5.15.21",
+    "@sentry/react": "7.118.0",
     "date-fns": "3.6.0",
     "google-map-react": "2.2.1",
     "http-status-codes": "2.3.0",
-    "i18next": "23.11.3",
+    "i18next": "23.11.5",
     "lodash.capitalize": "4.2.1",
     "lodash.countby": "4.6.0",
     "lodash.groupby": "4.6.0",
     "lodash.sortby": "4.7.0",
     "lodash.truncate": "4.4.2",
-    "lucide-react": "0.378.0",
+    "lucide-react": "0.400.0",
     "miragejs": "0.1.48",
     "react": "18.3.1",
     "react-date-range": "2.0.1",
     "react-dom": "18.3.1",
     "react-ga4": "2.1.0",
-    "react-i18next": "14.1.1",
-    "react-router-dom": "6.23.0",
+    "react-i18next": "14.1.2",
+    "react-router-dom": "6.24.0",
     "react-toastify": "10.0.5",
-    "recharts": "2.12.6",
+    "recharts": "2.12.7",
     "stylis": "4.3.2",
     "stylis-plugin-rtl": "2.1.1",
     "supercluster": "8.0.1",
     "use-supercluster": "0.4.0",
-    "uuid": "9.0.1"
+    "uuid": "10.0.0"
   },
   "scripts": {
     "dev": "vite",
@@ -88,40 +88,41 @@
     ]
   },
   "devDependencies": {
-    "@cypress/code-coverage": "3.12.38",
-    "@testing-library/jest-dom": "6.4.5",
-    "@testing-library/react": "15.0.6",
+    "@cypress/code-coverage": "3.12.39",
+    "@testing-library/jest-dom": "6.4.6",
+    "@testing-library/react": "16.0.0",
     "@testing-library/user-event": "14.5.2",
     "@trivago/prettier-plugin-sort-imports": "4.3.0",
     "@types/google-map-react": "2.1.10",
     "@types/lodash.capitalize": "4.2.9",
     "@types/lodash.countby": "4.6.9",
     "@types/lodash.groupby": "4.6.9",
     "@types/lodash.truncate": "4.4.9",
-    "@types/node": "20.12.8",
+    "@types/node": "20.14.9",
     "@types/react-date-range": "1.4.9",
-    "@typescript-eslint/eslint-plugin": "7.8.0",
-    "@typescript-eslint/parser": "7.8.0",
-    "@vitejs/plugin-react": "4.2.1",
+    "@types/react-dom": "18.3.0",
+    "@typescript-eslint/eslint-plugin": "7.15.0",
+    "@typescript-eslint/parser": "7.15.0",
+    "@vitejs/plugin-react": "4.3.1",
     "concurrently": "8.2.2",
     "cross-env": "7.0.3",
-    "cypress": "13.8.1",
+    "cypress": "13.13.0",
     "env-cmd": "10.1.0",
     "eslint": "8.57.0",
     "eslint-config-airbnb": "19.0.4",
     "eslint-config-airbnb-typescript": "18.0.0",
     "eslint-config-prettier": "9.1.0",
     "eslint-import-resolver-typescript": "3.6.1",
     "eslint-plugin-import": "^2.29.1",
-    "eslint-plugin-jsx-a11y": "^6.8.0",
+    "eslint-plugin-jsx-a11y": "^6.9.0",
     "husky": "9.0.11",
     "istanbul-lib-coverage": "3.2.2",
-    "nyc": "15.1.0",
-    "prettier": "3.2.5",
-    "typescript": "5.4.5",
-    "vite": "5.2.11",
-    "vite-plugin-checker": "0.6.4",
-    "vite-plugin-istanbul": "6.0.0"
+    "nyc": "17.0.0",
+    "prettier": "3.3.2",
+    "typescript": "5.5.3",
+    "vite": "5.3.2",
+    "vite-plugin-checker": "0.7.0",
+    "vite-plugin-istanbul": "6.0.2"
   },
   "packageManager": "[email protected]"
 }
diff --git a/src/components/common/ItemLink.tsx b/src/components/common/ItemLink.tsx
@@ -1,6 +1,6 @@
 import { Link } from 'react-router-dom';
 
-import { Stack, Typography } from '@mui/material';
+import { Box, Stack, Typography } from '@mui/material';
 
 import {
   DiscriminatedItem,
@@ -9,7 +9,7 @@ import {
   getLinkExtra,
   getMimetype,
 } from '@graasp/sdk';
-import { ItemIcon } from '@graasp/ui';
+import { DEFAULT_LIGHT_PRIMARY_COLOR, ItemIcon } from '@graasp/ui';
 
 import i18n from '@/config/i18n';
 import { buildItemPath } from '@/config/paths';
@@ -31,20 +31,20 @@ const ItemLink = ({ item }: { item: DiscriminatedItem }): JSX.Element => {
       }}
     >
       <Stack direction="row" alignItems="center" spacing={2}>
-        <ItemIcon
-          type={item.type}
-          iconSrc={iconSrc}
-          alt={alt}
-          mimetype={getMimetype(item.extra)}
-          size="40px"
-          sx={{
-            width: '40px',
-            height: '40px',
-            backgroundColor: '#4e4ecc33',
-            borderRadius: 1,
-            padding: 1,
-          }}
-        />
+        <Box
+          p={1}
+          width="40px"
+          height="40px"
+          borderRadius={1}
+          bgcolor={DEFAULT_LIGHT_PRIMARY_COLOR.main}
+        >
+          <ItemIcon
+            type={item.type}
+            iconSrc={iconSrc}
+            alt={alt}
+            mimetype={getMimetype(item.extra)}
+          />
+        </Box>
         <Stack>
           <Typography variant="h6">{item.name}</Typography>
           <Typography variant="caption" color="gray">