fix: upgrade deps (#303)

Author: spaenleh

.yarnrc.yml

@@ -1,3 +1,5 @@
+defaultSemverRangePrefix: ""
+
 compressionLevel: mixed
 
 enableGlobalCache: false

eslint.config.mjs

@@ -3,6 +3,7 @@ import { FlatCompat } from '@eslint/eslintrc';
 import js from '@eslint/js';
 import typescriptEslint from '@typescript-eslint/eslint-plugin';
 import tsParser from '@typescript-eslint/parser';
+import cypressEslint from 'eslint-plugin-cypress';
 import prettier from 'eslint-plugin-prettier';
 import reactHooks from 'eslint-plugin-react-hooks';
 import globals from 'globals';
@@ -38,14 +39,14 @@ export default [
       'airbnb',
       'plugin:import/typescript',
       'prettier',
-      'plugin:cypress/recommended',
       'plugin:react/recommended',
       'plugin:react-hooks/recommended',
       'plugin:@typescript-eslint/recommended',
     ),
   ),
   {
     plugins: {
+      cypress: cypressEslint,
       '@typescript-eslint': fixupPluginRules(typescriptEslint),
       prettier,
       'react-hooks': fixupPluginRules(reactHooks),

package.json

@@ -11,45 +11,37 @@
   "homepage": ".",
   "type": "module",
   "dependencies": {
-    "@codemirror/lang-javascript": "^6.2.2",
+    "@codemirror/lang-javascript": "6.2.4",
     "@emotion/react": "11.14.0",
     "@emotion/styled": "11.14.0",
-    "@graasp/apps-query-client": "^3.7.3",
-    "@graasp/sdk": "^5.5.0",
-    "@graasp/stylis-plugin-rtl": "^2.2.0",
-    "@graasp/ui": "5.4.7",
-    "@mui/icons-material": "6.3.1",
+    "@graasp/apps-query-client": "3.7.5",
+    "@graasp/sdk": "5.13.3",
+    "@graasp/ui": "5.5.4",
+    "@mui/icons-material": "6.4.12",
     "@mui/lab": "6.0.0-dev.240424162023-9968b4889d",
-    "@mui/material": "6.3.1",
-    "@sentry/react": "8.48.0",
-    "@tanstack/react-query": "^4.36.1",
-    "@tanstack/react-query-devtools": "^4.36.1",
-    "@types/node": "22.10.7",
-    "@types/react": "18.3.18",
-    "@types/react-dom": "18.3.5",
-    "@types/stopword": "^2.0.3",
-    "@uiw/react-codemirror": "^4.23.7",
-    "date-fns": "^4.1.0",
-    "file-saver": "^2.0.5",
-    "i18next": "^24.2.0",
-    "lodash.countby": "^4.6.0",
-    "lodash.flatten": "^4.4.0",
-    "lodash.groupby": "^4.6.0",
-    "lucide-react": "^0.469.0",
-    "prism-react-renderer": "^2.4.1",
+    "@mui/material": "6.4.12",
+    "@sentry/react": "8.55.0",
+    "@tanstack/react-query": "4.39.2",
+    "@tanstack/react-query-devtools": "4.39.2",
+    "@uiw/react-codemirror": "4.23.13",
+    "date-fns": "4.1.0",
+    "file-saver": "2.0.5",
+    "i18next": "24.2.3",
+    "lodash.countby": "4.6.0",
+    "lodash.flatten": "4.4.0",
+    "lodash.groupby": "4.6.0",
+    "lucide-react": "0.515.0",
+    "prism-react-renderer": "2.4.1",
     "react": "18.3.1",
     "react-dom": "18.3.1",
-    "react-i18next": "^15.4.0",
-    "react-markdown": "^9.0.3",
+    "react-i18next": "15.5.3",
+    "react-markdown": "9.1.0",
     "react-mde": "12.0.8",
-    "react-router-dom": "^6.28.1",
-    "react-toastify": "11.0.3",
-    "react-wordcloud": "^1.2.7",
-    "remark-breaks": "^4.0.0",
-    "remark-gfm": "^4.0.0",
-    "stopword": "^3.1.4",
-    "string-to-color": "^2.2.2",
-    "typescript": "5.7.3"
+    "react-toastify": "11.0.5",
+    "react-wordcloud": "1.2.7",
+    "remark-breaks": "4.0.0",
+    "remark-gfm": "4.0.1",
+    "stopword": "3.1.5"
   },
   "scripts": {
     "dev": "yarn vite",
@@ -74,48 +66,53 @@
     "cov:report": "open ./coverage/lcov-report/index.html"
   },
   "devDependencies": {
-    "@commitlint/cli": "19.6.1",
-    "@commitlint/config-conventional": "19.6.0",
-    "@cypress/code-coverage": "3.13.10",
-    "@eslint/compat": "^1.2.4",
-    "@eslint/eslintrc": "^3.2.0",
-    "@eslint/js": "^9.17.0",
-    "@trivago/prettier-plugin-sort-imports": "^5.2.1",
-    "@types/file-saver": "^2.0.7",
+    "@commitlint/cli": "19.8.1",
+    "@commitlint/config-conventional": "19.8.1",
+    "@cypress/code-coverage": "3.14.4",
+    "@eslint/compat": "1.3.0",
+    "@eslint/eslintrc": "3.3.1",
+    "@eslint/js": "9.29.0",
+    "@trivago/prettier-plugin-sort-imports": "5.2.2",
+    "@types/file-saver": "2.0.7",
     "@types/i18n": "0.13.12",
-    "@types/lodash.countby": "^4.6.9",
-    "@types/lodash.flatten": "^4.4.9",
-    "@types/lodash.groupby": "^4.6.9",
+    "@types/lodash.countby": "4.6.9",
+    "@types/lodash.flatten": "4.4.9",
+    "@types/lodash.groupby": "4.6.9",
+    "@types/node": "22.15.31",
+    "@types/react": "18.3.23",
+    "@types/react-dom": "18.3.7",
+    "@types/stopword": "2.0.3",
     "@types/uuid": "10.0.0",
-    "@typescript-eslint/eslint-plugin": "8.21.0",
-    "@typescript-eslint/parser": "8.21.0",
-    "@vitejs/plugin-react": "^4.3.4",
-    "axios": "1.7.9",
+    "@typescript-eslint/eslint-plugin": "8.34.0",
+    "@typescript-eslint/parser": "8.34.0",
+    "@vitejs/plugin-react": "4.5.2",
+    "axios": "1.10.0",
     "concurrently": "9.1.2",
-    "cypress": "^14.4.1",
+    "cypress": "14.4.1",
     "env-cmd": "10.1.0",
-    "eslint": "^9.17.0",
+    "eslint": "9.29.0",
     "eslint-config-airbnb": "19.0.4",
-    "eslint-config-airbnb-typescript": "^18.0.0",
-    "eslint-config-prettier": "10.0.1",
+    "eslint-config-airbnb-typescript": "18.0.0",
+    "eslint-config-prettier": "10.1.5",
     "eslint-config-react-app": "7.0.1",
-    "eslint-import-resolver-typescript": "^3.7.0",
-    "eslint-plugin-cypress": "4.1.0",
+    "eslint-import-resolver-typescript": "4.4.3",
+    "eslint-plugin-cypress": "5.1.0",
     "eslint-plugin-import": "2.31.0",
     "eslint-plugin-jsx-a11y": "6.10.2",
-    "eslint-plugin-prettier": "5.2.3",
-    "eslint-plugin-react": "^7.37.3",
-    "eslint-plugin-react-hooks": "5.1.0",
-    "globals": "^15.14.0",
+    "eslint-plugin-prettier": "5.4.1",
+    "eslint-plugin-react": "7.37.5",
+    "eslint-plugin-react-hooks": "5.2.0",
+    "globals": "15.15.0",
     "husky": "9.1.7",
-    "nock": "^13.5.6",
+    "nock": "13.5.6",
     "nyc": "17.1.0",
-    "prettier": "3.4.2",
-    "uuid": "11.0.5",
-    "vite": "^6.0.7",
-    "vite-plugin-checker": "^0.8.0",
-    "vite-plugin-istanbul": "^6.0.2",
-    "vitest": "^3.0.0"
+    "prettier": "3.5.3",
+    "typescript": "5.8.3",
+    "uuid": "11.1.0",
+    "vite": "6.3.5",
+    "vite-plugin-checker": "0.9.3",
+    "vite-plugin-istanbul": "7.0.0",
+    "vitest": "3.2.3"
   },
   "browserslist": {
     "production": [

src/modules/common/CommentEditor.tsx

@@ -11,14 +11,13 @@ import {
 
 import {
   Box,
+  Button,
   FormHelperText,
   Stack,
   TextareaAutosize,
   styled,
 } from '@mui/material';
 
-import { Button } from '@graasp/ui';
-
 import {
   Bold,
   Code2,
@@ -177,7 +176,7 @@ const CommentEditor = ({
           justifyContent="space-between"
         >
           <Button
-            dataCy={COMMENT_EDITOR_CANCEL_BUTTON_CYPRESS}
+            data-cy={COMMENT_EDITOR_CANCEL_BUTTON_CYPRESS}
             color="secondary"
             variant="outlined"
             onClick={() => onCancel()}
@@ -186,7 +185,7 @@ const CommentEditor = ({
           </Button>
           <Button
             endIcon={<SendHorizonal />}
-            dataCy={COMMENT_EDITOR_SAVE_BUTTON_CYPRESS}
+            data-cy={COMMENT_EDITOR_SAVE_BUTTON_CYPRESS}
             color="primary"
             variant="outlined"
             onClick={() => onSend(text)}

src/modules/common/KeywordChip.tsx

@@ -1,8 +1,6 @@
-import React from 'react';
-
 import { Avatar, Chip } from '@mui/material';
 
-import stc from 'string-to-color';
+import { stringToColor } from '@graasp/ui/apps';
 
 import { KEYWORD_CHIP_COUNT_ID, buildKeywordChipId } from '@/config/selectors';
 
@@ -17,7 +15,7 @@ const KeywordChip = ({
   isSelected: boolean;
   onClick: () => void;
 }): JSX.Element => {
-  const color = stc(text);
+  const color = stringToColor(text);
   return (
     <Chip
       avatar={

src/modules/common/TextWithHighlightedKeywords.tsx

@@ -1,10 +1,9 @@
-import React from 'react';
 import { useTranslation } from 'react-i18next';
 
 import ArrowForwardIcon from '@mui/icons-material/ArrowForward';
 import { Box, IconButton, Tooltip, Typography, styled } from '@mui/material';
 
-import stc from 'string-to-color';
+import { stringToColor } from '@graasp/ui/apps';
 
 import { createRegexFromString } from '../analytics/utils';
 
@@ -51,8 +50,8 @@ const TextWithHighlightedKeywords = ({
       <span
         key={part + memberName}
         style={{
-          color: stc(part),
-          backgroundColor: `${stc(part)}20`,
+          color: stringToColor(part),
+          backgroundColor: `${stringToColor(part)}20`,
           padding: '4px',
         }}
       >

src/modules/main/AnalyticsView.tsx

@@ -7,7 +7,6 @@ import PeopleIcon from '@mui/icons-material/People';
 import { Alert, Box, Button, Grid2, Typography } from '@mui/material';
 
 import { AppAction } from '@graasp/sdk';
-import { Loader } from '@graasp/ui';
 
 import groupBy from 'lodash.groupby';
 
@@ -24,6 +23,7 @@ import FrequentWords from '../analytics/FrequentWords';
 import StatisticCard from '../analytics/StatisticCard';
 import WordCloud from '../analytics/WordCloud';
 import { getAllWords } from '../analytics/utils';
+import Loader from '../common/Loader';
 
 const AnalyticsView = (): JSX.Element => {
   const { data: actions, isLoading } = hooks.useAppActions();
@@ -114,7 +114,7 @@ const AnalyticsView = (): JSX.Element => {
   }
 
   if (isLoading) {
-    return <Loader />;
+    return <Loader>Analytics</Loader>;
   }
   return <Alert severity="error">{t('UNEXPECTED_ERROR')}</Alert>;
 };

src/modules/settings/OrphanComments.tsx

@@ -1,9 +1,8 @@
 import { useTranslation } from 'react-i18next';
 
-import { FormControlLabel } from '@mui/material';
+import { Button, FormControlLabel } from '@mui/material';
 
 import { UUID } from '@graasp/sdk';
-import { Button } from '@graasp/ui';
 
 import { CommentAppData } from '@/config/appData';
 import { mutations } from '@/config/queryClient';
@@ -39,7 +38,7 @@ const OrphanComments = ({ comments }: Props): JSX.Element | null => {
 
   const buttonControl = (
     <Button
-      dataCy={ORPHAN_BUTTON_CYPRESS}
+      data-cy={ORPHAN_BUTTON_CYPRESS}
       variant="outlined"
       color="primary"
       onClick={() => handleOnClickRemoveOrphans(orphanThreads)}