[PB-5819]: feature/add original location column for trash

src/app/drive/types/index.ts

@@ -1,5 +1,6 @@
 import { RenewalPeriod } from '@internxt/sdk/dist/drive/payments/types/types';
 import { ShareLink } from '@internxt/sdk/dist/drive/share/types';
+import { FileStatus } from '@internxt/sdk/dist/drive/storage/types';
 import { UserResumeData } from '@internxt/sdk/dist/drive/users/types';
 import { AppSumoDetails } from '@internxt/sdk/dist/shared/types/appsumo';
 import { AdvancedSharedItem } from 'app/share/types';
@@ -91,7 +92,13 @@ export interface DriveFileMetadataPayload {
   itemName: string;
 }
 
-export type DriveItemData = DriveFileData & DriveFolderData;
+export type DriveItemData = DriveFileData &
+  DriveFolderData & {
+    parent?: {
+      plainName: string;
+      status: FileStatus;
+    };
+  };
 
 export interface DriveItemPatch {
   name?: string;
@@ -152,6 +159,8 @@ export enum FileViewMode {
   Grid = 'grid',
 }
 
+export type SortField = 'type' | 'name' | 'updatedAt' | 'size' | 'expiresAt';
+
 export enum DownloadFolderMethod {
   FileSystemAccessAPI = 'file-system-access-api',
   StreamSaver = 'stream-saver',

src/app/i18n/locales/de.json

@@ -1537,7 +1537,8 @@
         "modified": "Modifiziert",
         "size": "Größe",
         "actions": "Aktionen",
-        "autoDelete": "Automatisches Löschen"
+        "autoDelete": "Automatisches Löschen",
+        "originalLocation": "Ursprünglicher Speicherort"
       }
     },
     "viewMode": {

src/app/i18n/locales/en.json

@@ -1619,7 +1619,8 @@
         "modified": "Modified",
         "size": "Size",
         "actions": "Actions",
-        "autoDelete": "Auto-delete"
+        "autoDelete": "Auto-delete",
+        "originalLocation": "Original location"
       }
     },
     "viewMode": {

src/app/i18n/locales/es.json

@@ -1597,7 +1597,8 @@
         "modified": "Modificado",
         "size": "Tamaño",
         "actions": "Acciones",
-        "autoDelete": "Eliminación automática"
+        "autoDelete": "Eliminación automática",
+        "originalLocation": "Ubicación original"
       }
     },
     "viewMode": {

src/app/i18n/locales/fr.json

@@ -1543,7 +1543,8 @@
         "modified": "Modifié",
         "size": "Taille",
         "actions": "Actions",
-        "autoDelete": "Suppression automatique"
+        "autoDelete": "Suppression automatique",
+        "originalLocation": "Emplacement d'origine"
       }
     },
     "viewMode": {

src/app/i18n/locales/it.json

@@ -1650,7 +1650,8 @@
         "modified": "Ultima modifica",
         "size": "Dimensione",
         "actions": "Azioni",
-        "autoDelete": "Eliminazione automatica"
+        "autoDelete": "Eliminazione automatica",
+        "originalLocation": "Posizione originale"
       }
     },
     "viewMode": {

src/app/i18n/locales/ru.json

@@ -1558,7 +1558,8 @@
         "modified": "Изменено",
         "size": "Размер",
         "actions": "Действия",
-        "autoDelete": "Автоматическое удаление"
+        "autoDelete": "Автоматическое удаление",
+        "originalLocation": "Исходное расположение"
       }
     },
     "viewMode": {

src/app/i18n/locales/tw.json

@@ -1549,7 +1549,8 @@
         "modified": "修改日期",
         "size": "大小",
         "actions": "操作",
-        "autoDelete": "自動刪除"
+        "autoDelete": "自動刪除",
+        "originalLocation": "原始位置"
       }
     },
     "viewMode": {

src/app/i18n/locales/zh.json

@@ -1584,7 +1584,8 @@
         "modified": "修改日期",
         "size": "大小",
         "actions": "操作",
-        "autoDelete": "自动删除"
+        "autoDelete": "自动删除",
+        "originalLocation": "原始位置"
       }
     },
     "viewMode": {

src/views/Drive/components/DriveExplorer/components/DriveExplorerList/DriveExplorerList.tsx

@@ -17,7 +17,7 @@ import { sharedThunks } from 'app/store/slices/sharedLinks';
 import { storageActions } from 'app/store/slices/storage';
 import { uiActions } from 'app/store/slices/ui';
 import workspacesSelectors from 'app/store/slices/workspaces/workspaces.selectors';
-import { DriveItemData, DriveItemDetails } from 'app/drive/types';
+import { DriveItemData, DriveItemDetails, SortField } from 'app/drive/types';
 import EditItemNameDialog from 'app/drive/components/EditItemNameDialog/EditItemNameDialog';
 import ShareWithTeamDialog from 'app/drive/components/ShareWithTeamDialog/ShareWithTeamDialog';
 import DriveExplorerListItem from './DriveExplorerListItem';
@@ -59,8 +59,6 @@ interface DriveExplorerListProps {
 
 type ObjectWithId = { id: string | number };
 
-type SortField = 'type' | 'name' | 'updatedAt' | 'size' | 'expiresAt';
-
 type ContextMenuDriveItem = DriveItemData | Pick<DriveItemData, SortField> | (ListShareLinksItem & { code: string });
 
 function findUniqueItems<T extends ObjectWithId>(array1: T[], array2: T[]): T[] {
@@ -476,7 +474,7 @@ const DriveExplorerList: React.FC<DriveExplorerListProps> = memo((props) => {
           />
         )}
         <ShareWithTeamDialog item={props.selectedItems[0]} roles={roles} />
-        <List<DriveItemData, 'type' | 'name' | 'updatedAt' | 'size' | 'expiresAt'>
+        <List<DriveItemData, SortField>
           header={getListHeaders(translate, isRecents, isTrash)}
           checkboxDataCy="driveListHeaderCheckbox"
           disableKeyboardShortcuts={props.disableKeyboardShortcuts || props.showStopSharingConfirmation}

src/views/Drive/components/DriveExplorer/components/DriveExplorerList/DriveExplorerListItem.tsx

@@ -10,6 +10,7 @@ import { useDriveItemActions, useDriveItemDrag, useDriveItemDrop, useDriveItemSt
 import './DriveExplorerListItem.scss';
 import { useTranslationContext } from 'app/i18n/provider/TranslationProvider';
 import { WarningCircle } from '@phosphor-icons/react';
+import { FileStatus } from '@internxt/sdk/dist/drive/storage/types';
 
 const getItemClassNames = (isSelected: boolean, isDraggingOver: boolean, isDragging: boolean): string => {
   const selectedClass = isSelected ? 'selected' : '';
@@ -86,6 +87,7 @@ const DriveExplorerListItem = ({ item, isTrash }: DriveExplorerItemProps): JSX.E
   const isItemShared = (item.sharings?.length ?? 0) > 0;
   const isInteractive = isItemInteractive(item);
   const itemClassNames = getItemClassNames(isItemSelected(item), isDraggingOverThisItem, isDraggingThisItem);
+  const parentFolderName = item.parent?.status === FileStatus.EXISTS ? (item.parent?.plainName ?? 'Drive') : '-';
 
   const template = (
     <div
@@ -162,10 +164,18 @@ const DriveExplorerListItem = ({ item, isTrash }: DriveExplorerItemProps): JSX.E
         </div>
       )}
 
+      {isTrash && (
+        <div className="flex shrink-0 w-date items-center whitespace-nowrap pr-3" title={parentFolderName}>
+          <p className="truncate">{parentFolderName}</p>
+        </div>
+      )}
+
       {/* DATE */}
-      <div className="block shrink-0 w-date items-center whitespace-nowrap">
-        {dateService.formatDefaultDate(item.updatedAt, translate)}
-      </div>
+      {!isTrash && (
+        <div className="block shrink-0 w-date items-center whitespace-nowrap">
+          {dateService.formatDefaultDate(item.updatedAt, translate)}
+        </div>
+      )}
 
       {/* SIZE */}
       <div className="w-size shrink-0 items-center whitespace-nowrap">

src/views/Drive/components/DriveExplorer/components/DriveExplorerList/getListHeaders.ts

@@ -1,19 +1,12 @@
-interface ListHeaderItem {
-  label: string;
-  width: string;
-  name: 'type' | 'name' | 'updatedAt' | 'size' | 'expiresAt';
-  orderable: boolean;
-  defaultDirection: 'ASC' | 'DESC';
-  buttonDataCy?: string;
-  textDataCy?: string;
-}
+import { DriveItemData, SortField } from 'app/drive/types';
+import { HeaderProps } from '@internxt/ui/dist/components/data-display/list/ListHeader';
 
 export const getListHeaders = (
   translate: (key: string) => string,
   isRecents: boolean,
   isTrash: boolean,
-): ListHeaderItem[] => {
-  const headers: ListHeaderItem[] = [
+): HeaderProps<DriveItemData, SortField>[] => {
+  const headers: HeaderProps<DriveItemData, SortField>[] = [
     {
       label: translate('drive.list.columns.name'),
       width: 'flex grow items-center min-w-driveNameHeader',
@@ -26,31 +19,39 @@ export const getListHeaders = (
   ];
 
   if (isTrash) {
-    headers.push({
-      label: translate('drive.list.columns.autoDelete'),
-      width: 'w-date',
-      name: 'expiresAt',
-      orderable: true,
-      defaultDirection: 'ASC',
-    });
+    headers.push(
+      {
+        label: translate('drive.list.columns.autoDelete'),
+        width: 'w-date',
+        name: 'expiresAt',
+        orderable: true,
+        defaultDirection: 'ASC',
+      },
+      {
+        label: translate('drive.list.columns.originalLocation'),
+        width: 'w-date',
+        name: 'parent',
+        orderable: false,
+      },
+    );
   }
 
-  headers.push(
-    {
+  if (!isTrash) {
+    headers.push({
       label: translate('drive.list.columns.modified'),
       width: 'w-date',
       name: 'updatedAt',
       orderable: !isRecents,
       defaultDirection: 'ASC',
-    },
-    {
-      label: translate('drive.list.columns.size'),
-      orderable: false,
-      defaultDirection: 'ASC',
-      width: 'w-size',
-      name: 'size',
-    },
-  );
+    });
+  }
+
+  headers.push({
+    label: translate('drive.list.columns.size'),
+    orderable: false,
+    width: 'w-size',
+    name: 'size',
+  });
 
   return headers;
 };