Merge branch 'master' into staging

package.json

@@ -1,14 +1,14 @@
 {
   "name": "drive-web",
-  "version": "v1.0.309",
+  "version": "v1.0.312",
   "private": true,
   "dependencies": {
     "@headlessui/react": "1.7.5",
     "@iconscout/react-unicons": "^1.1.6",
     "@internxt/inxt-js": "=1.2.21",
     "@internxt/lib": "^1.2.0",
-    "@internxt/sdk": "^1.5.12",
-    "@phosphor-icons/react": "^2.0.10",
+    "@internxt/sdk": "^1.5.13",
+    "@phosphor-icons/react": "^2.1.7",
     "@popperjs/core": "^2.11.6",
     "@reduxjs/toolkit": "^1.6.0",
     "@sentry/react": "^7.1.0",

src/app/backups/components/BackupsAsFoldersList/BackupsAsFoldersList.tsx

@@ -18,6 +18,7 @@ import List from '../../../shared/components/List';
 import { deleteItemsThunk } from '../../../store/slices/storage/storage.thunks/deleteItemsThunk';
 import { downloadItemsThunk } from '../../../store/slices/storage/storage.thunks/downloadItemsThunk';
 import { uiActions } from '../../../store/slices/ui';
+import { backupsActions } from 'app/store/slices/backups';
 
 export default function BackupsAsFoldersList({
   className = '',
@@ -45,8 +46,9 @@ export default function BackupsAsFoldersList({
     const storageClient = SdkFactory.getNewApiInstance().createNewStorageClient();
     const [responsePromise] = storageClient.getFolderContentByUuid(folderId);
     const response = await responsePromise;
-    const folders = response.children.map((folder) => ({ ...folder, isFolder: true }));
-    const items = _.concat(folders as DriveItemData[], response.files as DriveItemData[]);
+    const files = response.files.map((file) => ({ ...file, isFolder: false, name: file.plainName }));
+    const folders = response.children.map((folder) => ({ ...folder, isFolder: true, name: folder.plainName }));
+    const items = _.concat(folders as DriveItemData[], files as DriveItemData[]);
     setCurrentItems(items);
     setIsloading(false);
   }
@@ -76,6 +78,7 @@ export default function BackupsAsFoldersList({
       if (!isLoading) {
         setIsloading(true);
         onFolderPush(item as DriveFolderData);
+        dispatch(backupsActions.setCurrentFolder(item));
       }
     } else {
       dispatch(uiActions.setIsFileViewerOpen(true));
@@ -128,9 +131,7 @@ export default function BackupsAsFoldersList({
             isLoading={isLoading}
             itemComposition={[
               (item) => {
-                const displayName = item.type
-                  ? `${item.plainName ?? item.name}.${item.type}`
-                  : item.plainName ?? item.name;
+                const displayName = item.type === 'folder' ? item.name : `${item.plainName}.${item.type}`;
                 const Icon = iconService.getItemIcon(item.isFolder, item.type);
 
                 return (

src/app/payment/components/checkout/ProductCardComponent.tsx

@@ -61,6 +61,11 @@ export const ProductFeaturesComponent = ({
   const planAmount = getProductAmount(selectedPlan.decimalAmount, couponCodeData).toFixed(2);
   const upsellPlanAmount = upsellManager.amount && getProductAmount(upsellManager.amount, couponCodeData).toFixed(2);
 
+  const discountPercentage =
+    couponCodeData?.amountOff && couponCodeData?.amountOff < selectedPlan.amount
+      ? ((couponCodeData?.amountOff / selectedPlan.amount) * 100).toFixed(2)
+      : undefined;
+
   return (
     <div className="flex w-full flex-col space-y-4 overflow-y-auto">
       <div className="flex w-full flex-row items-center justify-between space-x-4">
@@ -91,7 +96,7 @@ export const ProductFeaturesComponent = ({
                 <SealPercent weight="fill" size={24} />
                 <p className="">
                   {translate('checkout.productCard.saving', {
-                    percent: couponCodeData?.percentOff,
+                    percent: couponCodeData?.percentOff ?? discountPercentage,
                   })}
                 </p>
               </div>

src/app/payment/views/IntegratedCheckoutView/CheckoutView.tsx

@@ -62,8 +62,11 @@ const CheckoutView = ({
   });
 
   function onAuthMethodToggled(authMethod: AuthMethodTypes) {
+    reset({
+      email: '',
+      password: '',
+    });
     checkoutViewManager.handleAuthMethodChange(authMethod);
-    reset();
   }
 
   return (

src/app/shared/components/Breadcrumbs/BreadcrumbsMenu/BreadcrumbsMenuBackups.tsx

@@ -14,16 +14,22 @@ const BreadcrumbsMenuBackups = (props: BreadcrumbsMenuProps): JSX.Element => {
   const dispatch = useAppDispatch();
   const { breadcrumbDirtyName } = useDriveItemStoreProps();
   const currentDevice = useAppSelector((state) => state.backups.currentDevice);
+  const currentFolder = useAppSelector((state) => state.backups.currentFolder);
   const path = getAppConfig().views.find((view) => view.path === location.pathname);
   const pathId = path?.id;
   const isSharedView = pathId === 'shared';
+  const isFolder = props.items.length > 2;
 
   const onDeleteBackupButtonClicked = () => {
     dispatch(uiActions.setIsDeleteBackupDialog(true));
   };
 
-  const onDownloadBackupButtonClicked = () => {
-    dispatch(downloadItemsThunk([currentDevice as DriveItemData]));
+  const onDownloadBackupButtonClicked = async () => {
+    if (isFolder) {
+      dispatch(downloadItemsThunk([currentFolder as DriveItemData]));
+    } else {
+      dispatch(downloadItemsThunk([currentDevice as DriveItemData]));
+    }
   };
 
   return (

src/app/shared/components/Breadcrumbs/Containers/BreadcrumbsBackupsView.tsx

@@ -51,7 +51,10 @@ const BreadcrumbsBackupsView = ({
       backupsAsFoldersPath.forEach((item, i) => {
         const clickableOptions = {
           active: true,
-          onClick: () => goToFolder(item.id),
+          onClick: () => {
+            dispatch(backupsActions.setCurrentFolder(item));
+            goToFolder(item.id);
+          },
         };
         items.push({
           uuid: item.uuid,

src/app/store/slices/backups/index.ts

@@ -15,6 +15,7 @@ interface BackupsState {
   currentDevice: Device | DriveFolderData | null;
   devices: (Device | DriveFolderData)[];
   backups: DeviceBackup[];
+  currentFolder: Device | DriveFolderData | null;
 }
 
 const initialState: BackupsState = {
@@ -23,6 +24,7 @@ const initialState: BackupsState = {
   currentDevice: null,
   devices: [],
   backups: [],
+  currentFolder: null,
 };
 
 export const fetchDevicesThunk = createAsyncThunk<Array<Device | DriveFolderData>, void, { state: RootState }>(
@@ -154,6 +156,9 @@ export const backupsSlice = createSlice({
       state.currentDevice = action.payload;
       state.backups = [];
     },
+    setCurrentFolder: (state, action: PayloadAction<Device | null | DriveFolderData>) => {
+      state.currentFolder = action.payload;
+    },
   },
   extraReducers: (builder) => {
     builder

src/app/store/slices/storage/storage.thunks/fetchFolderContentThunk.ts

@@ -29,7 +29,6 @@ export const fetchPaginatedFolderContentThunk = createAsyncThunk<void, string, {
     const driveItemsSort = storageState.driveItemsSort;
     const driveItemsOrder = storageState.driveItemsOrder;
 
-    if (foldersOffset === 0 && filesOffset === 0) dispatch(storageActions.resetOrder());
     try {
       let itemsPromise;
 

yarn.lock

@@ -1612,10 +1612,10 @@
   resolved "https://npm.pkg.github.com/download/@internxt/prettier-config/1.0.2/5bd220b8de76734448db5475b3e0c01f9d22c19b#5bd220b8de76734448db5475b3e0c01f9d22c19b"
   integrity sha512-t4HiqvCbC7XgQepwWlIaFJe3iwW7HCf6xOSU9nKTV0tiGqOPz7xMtIgLEloQrDA34Cx4PkOYBXrvFPV6RxSFAA==
 
-"@internxt/sdk@^1.5.12":
-  version "1.5.12"
-  resolved "https://npm.pkg.github.com/download/@internxt/sdk/1.5.12/b565fa78fa927d38c1e0cb8c4f973260b595fcbb#b565fa78fa927d38c1e0cb8c4f973260b595fcbb"
-  integrity sha512-ZE6vp8WtOkJkNSCv/SqIOa8Cng/of5ybkwO2A8igWqUrH23j1bp4fH11DQLoXR/ApO7dALsc/KNSGml8pfNBag==
+"@internxt/sdk@^1.5.13":
+  version "1.5.13"
+  resolved "https://npm.pkg.github.com/download/@internxt/sdk/1.5.13/6f10ce1ddb39e17233c81ad4d56780407af0c10b#6f10ce1ddb39e17233c81ad4d56780407af0c10b"
+  integrity sha512-BNtwO8IJE48z1KQFMBUSk0q5jeJ5u437lVGRvCIWO60AVhTcV3eLHftiVbTEVITbuxuu/7eKMNzWoAsZRPBzCg==
   dependencies:
     axios "^0.24.0"
     query-string "^7.1.0"