feat: allow export item as raw file (#1385)

* feat: allow export item as raw file * refactor: update query client * refactor: update translations
graasp · Jul 29, 2024 · 1bc4145 · 1bc4145
1 parent fff5747
commit 1bc4145
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 30 deletions.
diff --git a/package.json b/package.json
@@ -22,9 +22,9 @@
     "@emotion/styled": "11.13.0",
     "@graasp/chatbox": "3.1.0",
     "@graasp/map": "1.17.0",
-    "@graasp/query-client": "3.19.0",
-    "@graasp/sdk": "4.21.0",
-    "@graasp/translations": "1.32.0",
+    "@graasp/query-client": "3.20.0",
+    "@graasp/sdk": "4.22.0",
+    "@graasp/translations": "1.33.0",
     "@graasp/ui": "4.23.0",
     "@mui/icons-material": "5.16.4",
     "@mui/lab": "5.0.0-alpha.172",

diff --git a/src/components/item/header/ItemHeaderActions.tsx b/src/components/item/header/ItemHeaderActions.tsx
@@ -71,7 +71,7 @@ const ItemHeaderActions = ({ itemId }: Props): JSX.Element | null => {
             <EditButton onClick={openEditModal} type="iconButton" item={item} />
           </>
         )}
-        <DownloadButton id={item.id} name={item.name} />
+        <DownloadButton item={item} />
 
         <ShareButton itemId={item.id} />
         <ChatboxButton

diff --git a/src/components/main/DownloadButton.tsx b/src/components/main/DownloadButton.tsx
@@ -1,5 +1,6 @@
 import { useEffect } from 'react';
 
+import { DiscriminatedItem } from '@graasp/sdk';
 import { DownloadButton as Button } from '@graasp/ui';
 
 import { buildDownloadButtonId } from '@/config/selectors';
@@ -9,37 +10,37 @@ import { mutations } from '../../config/queryClient';
 import { BUILDER } from '../../langs/constants';
 
 type Props = {
-  id: string;
-  name: string;
+  item: DiscriminatedItem;
 };
 
-export const DownloadButton = ({ id, name }: Props): JSX.Element => {
+export const DownloadButton = ({ item }: Props): JSX.Element => {
   const { t: translateBuilder } = useBuilderTranslation();
 
   const {
     mutate: downloadItem,
     data,
     isSuccess,
     isLoading: isDownloading,
-  } = mutations.useExportZip();
+  } = mutations.useExportItem();
 
   useEffect(() => {
     if (isSuccess) {
-      const url = window.URL.createObjectURL(new Blob([data]));
+      const url = window.URL.createObjectURL(new Blob([data.data]));
       const link = document.createElement('a');
       link.href = url;
-      link.setAttribute('download', `${name}.zip`);
+
+      link.setAttribute('download', data.name);
       document.body.appendChild(link);
       link.click();
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [data, isSuccess, id]);
+  }, [data, isSuccess, item]);
 
   const handleDownload = () => {
-    downloadItem({ id });
+    downloadItem({ id: item.id });
   };
   return (
-    <span id={buildDownloadButtonId(id)}>
+    <span id={buildDownloadButtonId(item.id)}>
       <Button
         handleDownload={handleDownload}
         isLoading={isDownloading}

diff --git a/src/components/table/ItemActions.tsx b/src/components/table/ItemActions.tsx
@@ -13,7 +13,7 @@ type Props = {
 const ItemActions = ({ data: item }: Props): JSX.Element => (
   <Stack direction="row" justifyContent="center" alignItems="center">
     <BookmarkButton size="medium" key="bookmark" item={item} />
-    <DownloadButton id={item.id} name={item.name} />
+    <DownloadButton item={item} />
   </Stack>
 );
 

diff --git a/yarn.lock b/yarn.lock
@@ -1873,9 +1873,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@graasp/query-client@npm:3.19.0":
-  version: 3.19.0
-  resolution: "@graasp/query-client@npm:3.19.0"
+"@graasp/query-client@npm:3.20.0":
+  version: 3.20.0
+  resolution: "@graasp/query-client@npm:3.20.0"
   dependencies:
     "@tanstack/react-query": "npm:4.36.1"
     "@tanstack/react-query-devtools": "npm:4.36.1"
@@ -1885,22 +1885,23 @@ __metadata:
     "@graasp/sdk": ^4.0.0
     "@graasp/translations": "*"
     react: ^18.0.0
-  checksum: 10/da50eed4589e9513f1e70812c589ec533ea6045f7f8df7da7c3262ed270f7edc0f5b027ecd1faa065e01981966e155754fd1ffb68c6cad2cc495da6b3dbdd6a0
+  checksum: 10/adaf2664a47438450eafd27765b9ac66d0fc4670c28f21d1668d247ec247bc2793faddffdbd204316bbff600526253da9c1f14bda0e4f4b5c2fe221299d75906
   languageName: node
   linkType: hard
 
-"@graasp/sdk@npm:4.21.0":
-  version: 4.21.0
-  resolution: "@graasp/sdk@npm:4.21.0"
+"@graasp/sdk@npm:4.22.0":
+  version: 4.22.0
+  resolution: "@graasp/sdk@npm:4.22.0"
   dependencies:
     "@faker-js/faker": "npm:8.4.1"
     filesize: "npm:10.1.4"
     js-cookie: "npm:3.0.5"
+    mime-types: "npm:2.1.35"
     validator: "npm:13.12.0"
   peerDependencies:
     date-fns: ^3
     uuid: ^9 || ^10.0.0
-  checksum: 10/b3d0b021fcb7343ab38f5d0d701a2169123240b6d0a2feab4172662c6af451e352444e97c5e816cf87fcf6ad59ad14338a36bc46e7f0fce220e1e05ea364c934
+  checksum: 10/c1e81d401f51a9c22eb4f5bc12057aa3ea249771701c390a11dc7c1609b814d9222926bbb7d9b19f70fda67bccb854f42045d890dd850f71bf4f9f8629fcb799
   languageName: node
   linkType: hard
 
@@ -1928,12 +1929,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@graasp/translations@npm:1.32.0":
-  version: 1.32.0
-  resolution: "@graasp/translations@npm:1.32.0"
+"@graasp/translations@npm:1.33.0":
+  version: 1.33.0
+  resolution: "@graasp/translations@npm:1.33.0"
   peerDependencies:
     i18next: ^23.8.1
-  checksum: 10/ba1c1300435902ae440dfd427aa9f9dd14a3f60d7e6c3f79984464af320f959b557b7cef6abd69b4ff16bca1c3e9c9a41401d96d807277eeb8474d56c0d9d5c7
+  checksum: 10/fcbbd3a67c0e30a0a2e2da0207714e9e61ef7808ceaa241dbdf5ff73e5a98ecd7528cda269b8b14aa81b668cac97d06dfd564e4ade8312adde526f24feaddb98
   languageName: node
   linkType: hard
 
@@ -8151,9 +8152,9 @@ __metadata:
     "@emotion/styled": "npm:11.13.0"
     "@graasp/chatbox": "npm:3.1.0"
     "@graasp/map": "npm:1.17.0"
-    "@graasp/query-client": "npm:3.19.0"
-    "@graasp/sdk": "npm:4.21.0"
-    "@graasp/translations": "npm:1.32.0"
+    "@graasp/query-client": "npm:3.20.0"
+    "@graasp/sdk": "npm:4.22.0"
+    "@graasp/translations": "npm:1.33.0"
     "@graasp/ui": "npm:4.23.0"
     "@mui/icons-material": "npm:5.16.4"
     "@mui/lab": "npm:5.0.0-alpha.172"
@@ -10641,7 +10642,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"mime-types@npm:^2.1.12, mime-types@npm:~2.1.19, mime-types@npm:~2.1.24, mime-types@npm:~2.1.34":
+"mime-types@npm:2.1.35, mime-types@npm:^2.1.12, mime-types@npm:~2.1.19, mime-types@npm:~2.1.24, mime-types@npm:~2.1.34":
   version: 2.1.35
   resolution: "mime-types@npm:2.1.35"
   dependencies: