feat: update sdk (#151)

* feat: update sdk

* build: use esm only

package.json

@@ -54,31 +54,27 @@
     "storybook:test-ci": "wait-on http://127.0.0.1:6006 && yarn storybook:test"
   },
   "dependencies": {
-    "@emotion/react": "11.11.4",
-    "@emotion/styled": "11.11.5",
-    "@graasp/sdk": "4.7.6",
-    "@graasp/translations": "1.30.3",
-    "@graasp/ui": "4.20.0",
-    "@mui/icons-material": "5.15.20",
-    "@mui/lab": "5.0.0-alpha.170",
-    "@mui/material": "5.15.20",
     "i18n-iso-countries": "7.11.2",
     "leaflet": "^1.9.4",
     "leaflet-easybutton": "2.4.0",
     "leaflet-geosearch": "3.11.1",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-i18next": "14.0.8",
     "react-leaflet": "^4.2.1",
     "react-leaflet-cluster": "2.1.0",
-    "react-router-dom": "6.22.3",
-    "react-toastify": "10.0.5",
-    "stylis-plugin-rtl": "2.1.1"
+    "react-toastify": "10.0.5"
   },
   "devDependencies": {
     "@commitlint/cli": "17.8.1",
     "@commitlint/config-conventional": "17.8.1",
+    "@emotion/react": "11.11.4",
+    "@emotion/styled": "11.11.5",
     "@graasp/query-client": "3.17.0",
+    "@graasp/sdk": "4.29.0",
+    "@graasp/stylis-plugin-rtl": "2.2.0",
+    "@graasp/translations": "1.30.3",
+    "@graasp/ui": "5.0.0",
+    "@mui/icons-material": "5.15.20",
+    "@mui/lab": "5.0.0-alpha.170",
+    "@mui/material": "5.15.20",
     "@storybook/addon-coverage": "1.0.4",
     "@storybook/addon-essentials": "7.6.20",
     "@storybook/addon-interactions": "7.6.20",
@@ -109,7 +105,12 @@
     "eslint-plugin-react-refresh": "^0.4.5",
     "eslint-plugin-storybook": "0.8.0",
     "http-server": "14.1.1",
+    "lucide-react": "0.441.0",
     "prettier": "3.2.5",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-i18next": "14.0.8",
+    "react-router-dom": "6.22.3",
     "rollup-plugin-visualizer": "5.12.0",
     "storybook": "7.6.20",
     "typescript": "^5.3.3",
@@ -118,15 +119,17 @@
     "vite-plugin-dts": "3.7.3"
   },
   "peerDependencies": {
-    "@emotion/react": "^11.11.1",
-    "@emotion/styled": "^11.11.0",
+    "@emotion/react": "^11.11.4",
+    "@emotion/styled": "^11.11.5",
     "@graasp/query-client": "*",
     "@graasp/sdk": "*",
+    "@graasp/stylis-plugin-rtl": "*",
     "@graasp/translations": "*",
     "@graasp/ui": "*",
-    "@mui/icons-material": "^5.15.10",
-    "@mui/lab": "^5.0.0-alpha.165",
-    "@mui/material": "^5.15.10",
+    "@mui/icons-material": "^5.15.20",
+    "@mui/lab": "^5.0.0-alpha.170",
+    "@mui/material": "^5.15.20",
+    "lucide-react": "*",
     "react": "*",
     "react-dom": "*",
     "react-i18next": "^14.0.0"

src/components/Map.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react';
 import { MapContainer, TileLayer } from 'react-leaflet';
 
+import { AccountType } from '@graasp/sdk';
 import { DEFAULT_LANG } from '@graasp/translations';
 
 import 'leaflet-easybutton/src/easy-button.css';
@@ -19,7 +20,7 @@ import MapContent from './map/MapContent';
 
 type Props = QueryClientContextInterface;
 
-const Map = ({
+const MapComponent = ({
   item,
   currentMember,
   useAddressFromGeolocation,
@@ -37,7 +38,7 @@ const Map = ({
   const [showMap, setShowMap] = useState<boolean>(false);
 
   useEffect(() => {
-    if (currentMember) {
+    if (currentMember?.type === AccountType.Individual) {
       i18n.changeLanguage(currentMember.extra.lang ?? DEFAULT_LANG);
     } else {
       i18n.changeLanguage(navigator.language ?? DEFAULT_LANG);
@@ -100,4 +101,4 @@ const Map = ({
   );
 };
 
-export default Map;
+export default MapComponent;

src/components/context/QueryClientContext.tsx

@@ -2,7 +2,7 @@ import { createContext, useContext, useMemo } from 'react';
 
 import type { configureQueryClient } from '@graasp/query-client';
 import {
-  CompleteMember,
+  CurrentAccount,
   DiscriminatedItem,
   ItemGeolocation,
   PackedItem,
@@ -15,7 +15,7 @@ type QueryClientMutations = ReturnType<
 
 export interface QueryClientContextInterface {
   item?: PackedItem;
-  currentMember?: CompleteMember | null;
+  currentMember?: CurrentAccount | null;
   currentPosition?: { lat: number; lng: number };
   useAddressFromGeolocation: QueryClientHooks['useAddressFromGeolocation'];
   useItemsInMap: QueryClientHooks['useItemsInMap'];

tsconfig.build.json

@@ -0,0 +1,9 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "declaration": true,
+    "outDir": "dist",
+    "noEmit": false
+  },
+  "exclude": ["**/*.stories.**"]
+}

vite.config.ts

@@ -7,15 +7,22 @@ import dts from 'vite-plugin-dts';
 
 export default (): UserConfigExport =>
   defineConfig({
-    plugins: [react(), dts({ entryRoot: 'src' }), cssInjectedByJsPlugin()],
+    server: { open: false },
+    plugins: [
+      react(),
+      dts({ tsconfigPath: './tsconfig.build.json' }),
+      // necessary because of leaflet map
+      cssInjectedByJsPlugin(),
+    ],
+    optimizeDeps: {
+      exclude: ['node_modules/.cache'],
+    },
     build: {
       lib: {
-        // Could also be a dictionary or array of multiple entry points
-        entry: resolve(__dirname, 'src/index.ts'),
         name: 'graasp-map',
-        formats: ['cjs', 'es'],
-        // the proper extensions will be added
-        fileName: 'index',
+        formats: ['es'],
+        // Could also be a dictionary or array of multiple entry points
+        entry: [resolve(__dirname, 'src/index.ts')],
       },
       rollupOptions: {
         // make sure to externalize deps that shouldn't be bundled