📁 Drive fixes (#2722)

* #2712 Fixed trash size not being shown at initial render

* #2712 Update trash size when moving items into it

* #2721 unselect selected items after performing a bulk operation

* #2714 Fixed item versions creation and display

* file version creation imporvements

* file version creation imporvements

* remove unused imports

* resolve conflict

twake/backend/node/src/services/documents/entities/file-version.ts

@@ -9,17 +9,17 @@ export const TYPE = "drive_file_versions";
 })
 export class FileVersion {
   @Type(() => String)
-  @Column("id", "uuid")
+  @Column("drive_item_id", "uuid")
+  drive_item_id: string;
+
+  @Type(() => String)
+  @Column("id", "uuid", { generator: "uuid" })
   id: string;
 
   @Type(() => String)
   @Column("provider", "string")
   provider: "internal" | "drive" | string;
 
-  @Type(() => String)
-  @Column("drive_item_id", "uuid")
-  drive_item_id: string;
-
   @Column("file_metadata", "encoded_json")
   file_metadata: DriveFileMetadata;
 
@@ -32,7 +32,7 @@ export class FileVersion {
   creator_id: string;
 
   @Type(() => String)
-  @Column("application_id", "uuid")
+  @Column("application_id", "string")
   application_id: string;
 
   @Type(() => String)

twake/backend/node/src/services/documents/services/index.ts

@@ -538,6 +538,7 @@ export class DocumentsService {
       driveItemVersion.file_metadata.size = metadata.size;
       driveItemVersion.file_metadata.name = metadata.name;
       driveItemVersion.file_metadata.mime = metadata.mime;
+      driveItemVersion.drive_item_id = item.id;
 
       await this.fileVersionRepository.save(driveItemVersion);
 

twake/frontend/src/app/features/drive/hooks/use-drive-actions.tsx

@@ -1,11 +1,8 @@
-import { useGlobalEffect } from 'app/features/global/hooks/use-global-effect';
 import { ToasterService } from 'app/features/global/services/toaster-service';
-import { LoadingState, LoadingStateInitTrue } from 'app/features/global/state/atoms/Loading';
 import useRouterCompany from 'app/features/router/hooks/use-router-company';
 import { useCallback } from 'react';
-import { useParams } from 'react-router-dom';
-import { useRecoilCallback, useRecoilState, useRecoilValue } from 'recoil';
-import { DriveApiClient, setPublicLinkToken } from '../api-client/api-client';
+import { useRecoilCallback } from 'recoil';
+import { DriveApiClient } from '../api-client/api-client';
 import { DriveItemAtom, DriveItemChildrenAtom } from '../state/store';
 import { DriveItem, DriveItemVersion } from '../types';
 

twake/frontend/src/app/features/drive/hooks/use-drive-item.tsx

@@ -1,11 +1,10 @@
 import { ToasterService } from 'app/features/global/services/toaster-service';
-import { LoadingState, LoadingStateInitTrue } from 'app/features/global/state/atoms/Loading';
+import { LoadingStateInitTrue } from 'app/features/global/state/atoms/Loading';
 import useRouterCompany from 'app/features/router/hooks/use-router-company';
 import { useCallback } from 'react';
 import { useRecoilState, useRecoilValue } from 'recoil';
-import { DriveApiClient } from '../api-client/api-client';
 import { DriveItemAtom, DriveItemChildrenAtom } from '../state/store';
-import { DriveItem, DriveItemVersion } from '../types';
+import { DriveItem } from '../types';
 import { useDriveActions } from './use-drive-actions';
 import { useDriveUpload } from './use-drive-upload';
 

twake/frontend/src/app/features/drive/hooks/use-drive-upload.tsx

@@ -23,7 +23,6 @@ export const useDriveUpload = () => {
             const version = {
               drive_item_id: context.id,
               provider: 'internal',
-              application_id: '',
               file_metadata: {
                 name: file.metadata?.name,
                 size: file.upload_data?.size,

twake/frontend/src/app/features/drive/state/store.ts

@@ -1,12 +1,17 @@
-import { atomFamily } from 'recoil';
+import { atomFamily, atom } from 'recoil';
 import { DriveItem, DriveItemDetails } from '../types';
 
 export const DriveItemChildrenAtom = atomFamily<DriveItem[], string>({
   key: 'DriveItemChildrenAtom',
-  default: (_: string) => [],
+  default: () => [],
 });
 
 export const DriveItemAtom = atomFamily<Partial<DriveItemDetails> | null, string>({
   key: 'DriveItemAtom',
-  default: (_: string) => null,
+  default: () => null,
+});
+
+export const DriveItemSelectedList = atom<{[key: string]: boolean }>({
+  key: 'DriveItemSelectedList',
+  default: {}
 });

twake/frontend/src/app/views/applications/drive/drive-item.tsx

@@ -5,7 +5,7 @@ export const DriveItem = ({ className, onClick }: { className?: string; onClick:
   return (
     <div
       className={
-        'rounded-md bg-zinc-500 bg-opacity-10 w-64 m-1 inline inline-flex flex-row items-center px-4 py-3 cursor-pointer hover:bg-zinc-500 hover:bg-opacity-25 ' +
+        'rounded-md bg-zinc-500 bg-opacity-10 w-64 m-1 inline-flex flex-row items-center px-4 py-3 cursor-pointer hover:bg-zinc-500 hover:bg-opacity-25 ' +
         (className || '')
       }
       onClick={e => {

twake/frontend/src/app/views/applications/drive/header-path.tsx

@@ -1,11 +1,7 @@
 import { Button } from 'app/atoms/button/button';
 import { Title } from 'app/atoms/text';
-import { useDriveItem } from 'app/features/drive/hooks/use-drive-item';
 import { DriveItem } from 'app/features/drive/types';
 import { useEffect, useState } from 'react';
-import { useParams } from 'react-router-dom';
-import { useRecoilState } from 'recoil';
-import { DriveCurrentFolderAtom } from '.';
 import { PublicIcon } from './components/public-icon';
 
 export default ({

twake/frontend/src/app/views/applications/drive/index.tsx

@@ -4,18 +4,16 @@ import { Base, BaseSmall, Subtitle, Title } from 'app/atoms/text';
 import Menu from 'app/components/menus/menu';
 import { getFilesTree } from 'app/components/uploads/file-tree-utils';
 import UploadZone from 'app/components/uploads/upload-zone';
-import { setPublicLinkToken } from 'app/features/drive/api-client/api-client';
 import { useDriveActions } from 'app/features/drive/hooks/use-drive-actions';
 import { useDriveItem } from 'app/features/drive/hooks/use-drive-item';
 import { useDriveRealtime } from 'app/features/drive/hooks/use-drive-realtime';
 import { useDriveUpload } from 'app/features/drive/hooks/use-drive-upload';
+import { DriveItemSelectedList } from 'app/features/drive/state/store';
 import { formatBytes } from 'app/features/drive/utils';
 import useRouterCompany from 'app/features/router/hooks/use-router-company';
-import _, { initial } from 'lodash';
-import { useCallback, useEffect, useRef, useState } from 'react';
-import { useParams } from 'react-router-dom';
-import { atom, atomFamily, useRecoilState, useSetRecoilState } from 'recoil';
-import shortUUID from 'short-uuid';
+import _ from 'lodash';
+import { useCallback, useEffect, useRef } from 'react';
+import { atomFamily, useRecoilState, useSetRecoilState } from 'recoil';
 import HeaderPath from './header-path';
 import { DocumentRow } from './item-row/document-row';
 import { FolderRow } from './item-row/folder-row';
@@ -39,24 +37,24 @@ export default ({ initialParentId }: { initialParentId?: string }) => {
 
   const { download, downloadZip, update } = useDriveActions();
   const { access, item, inTrash, refresh, children, loading, path } = useDriveItem(parentId);
-  const { item: trash, refresh: refreshTrash } = useDriveItem('trash');
+  const { item: trash } = useDriveItem('trash');
   const { uploadTree } = useDriveUpload();
   useDriveRealtime(parentId);
 
   const uploadZone = 'drive_' + companyId;
   const uploadZoneRef = useRef<UploadZone | null>(null);
-  const [checked, setChecked] = useState<{ [key: string]: boolean }>({});
 
   const setCreationModalState = useSetRecoilState(CreateModalAtom);
   const setSelectorModalState = useSetRecoilState(SelectorModalAtom);
   const setConfirmDeleteModalState = useSetRecoilState(ConfirmDeleteModalAtom);
   const setConfirmTrashModalState = useSetRecoilState(ConfirmTrashModalAtom);
+  const [checked, setChecked] = useRecoilState(DriveItemSelectedList);
 
   useEffect(() => {
     setChecked({});
     refresh(parentId);
-    if (parentId === 'root' || parentId === 'trash') refreshTrash(parentId);
-  }, [parentId, refresh, refreshTrash]);
+    refresh("trash");
+  }, [parentId, refresh]);
 
   const openItemModal = useCallback(() => {
     if (item?.id) setCreationModalState({ open: true, parent_id: item.id });
@@ -138,6 +136,7 @@ export default ({ initialParentId }: { initialParentId?: string }) => {
                                 item.parent_id,
                               );
                             }
+                            setChecked({});
                           },
                         }),
                     },

twake/frontend/src/app/views/applications/drive/modals/confirm-delete/index.tsx

@@ -3,6 +3,7 @@ import { Modal, ModalContent } from 'app/atoms/modal';
 import { Base } from 'app/atoms/text';
 import { useDriveActions } from 'app/features/drive/hooks/use-drive-actions';
 import { useDriveItem } from 'app/features/drive/hooks/use-drive-item';
+import { DriveItemSelectedList } from 'app/features/drive/state/store';
 import { DriveItem } from 'app/features/drive/types';
 import { useEffect, useState } from 'react';
 import { atom, useRecoilState, useSetRecoilState } from 'recoil';
@@ -35,6 +36,7 @@ const ConfirmDeleteModalContent = ({ items }: { items: DriveItem[] }) => {
   const { remove } = useDriveActions();
   const [loading, setLoading] = useState(false);
   const [state, setState] = useRecoilState(ConfirmDeleteModalAtom);
+  const [, setSelected] = useRecoilState(DriveItemSelectedList);
 
   useEffect(() => {
     refresh(items[0].id);
@@ -62,6 +64,7 @@ const ConfirmDeleteModalContent = ({ items }: { items: DriveItem[] }) => {
             await remove(item.id, item.parent_id);
           }
           setLoading(false);
+          setSelected({});
           setState({ ...state, open: false });
         }}
       >

twake/frontend/src/app/views/applications/drive/modals/confirm-trash/index.tsx

@@ -3,6 +3,7 @@ import { Modal, ModalContent } from 'app/atoms/modal';
 import { Base } from 'app/atoms/text';
 import { useDriveActions } from 'app/features/drive/hooks/use-drive-actions';
 import { useDriveItem } from 'app/features/drive/hooks/use-drive-item';
+import { DriveItemSelectedList } from 'app/features/drive/state/store';
 import { DriveItem } from 'app/features/drive/types';
 import { useEffect, useState } from 'react';
 import { atom, useRecoilState } from 'recoil';
@@ -35,6 +36,7 @@ const ConfirmTrashModalContent = ({ items }: { items: DriveItem[] }) => {
   const { remove } = useDriveActions();
   const [loading, setLoading] = useState(false);
   const [state, setState] = useRecoilState(ConfirmTrashModalAtom);
+  const [, setSelected] = useRecoilState(DriveItemSelectedList);
 
   useEffect(() => {
     refresh(items[0].id);
@@ -57,7 +59,9 @@ const ConfirmTrashModalContent = ({ items }: { items: DriveItem[] }) => {
         onClick={async () => {
           setLoading(true);
           await Promise.all((items || []).map(async item => await remove(item.id, item.parent_id)));
+          setSelected({});
           setLoading(false);
+          refresh("trash");
           setState({ ...state, open: false });
         }}
       >

twake/frontend/src/app/views/applications/drive/modals/versions/index.tsx

@@ -86,7 +86,7 @@ const VersionModalContent = ({ id }: { id: string }) => {
           </div>
         )}
 
-        {[...(versions || [item.last_version_cache])].map((version, index) => (
+        {[...(versions?.length ? versions : [item.last_version_cache])].map((version, index) => (
           <div
             key={index}
             className={