From 1601e0ff0eab97d30b0da273e2689aa944471447 Mon Sep 17 00:00:00 2001
From: Linda Paiste <lindapaiste@gmail.com>
Date: Mon, 12 Jun 2023 18:23:18 -0500
Subject: [PATCH] Adjust the `totalSize` when deleting an asset.

---
 client/constants.js                   |  2 --
 client/modules/IDE/actions/assets.js  | 23 +++++++-------------
 client/modules/IDE/reducers/assets.js | 31 ++++++++++++++++-----------
 3 files changed, 27 insertions(+), 29 deletions(-)

diff --git a/client/constants.js b/client/constants.js
index 2678e6950b..fc7ba88914 100644
--- a/client/constants.js
+++ b/client/constants.js
@@ -131,8 +131,6 @@ export const CLEAR_PERSISTED_STATE = 'CLEAR_PERSISTED_STATE';
 
 export const HIDE_RUNTIME_ERROR_WARNING = 'HIDE_RUNTIME_ERROR_WARNING';
 export const SHOW_RUNTIME_ERROR_WARNING = 'SHOW_RUNTIME_ERROR_WARNING';
-export const SET_ASSETS = 'SET_ASSETS';
-export const DELETE_ASSET = 'DELETE_ASSET';
 
 export const TOGGLE_DIRECTION = 'TOGGLE_DIRECTION';
 export const SET_SORTING = 'SET_SORTING';
diff --git a/client/modules/IDE/actions/assets.js b/client/modules/IDE/actions/assets.js
index 8c7a046121..abeeb22321 100644
--- a/client/modules/IDE/actions/assets.js
+++ b/client/modules/IDE/actions/assets.js
@@ -1,14 +1,9 @@
 import apiClient from '../../../utils/apiClient';
 import * as ActionTypes from '../../../constants';
 import { startLoader, stopLoader } from './loader';
+import { assetsActions } from '../reducers/assets';
 
-function setAssets(assets, totalSize) {
-  return {
-    type: ActionTypes.SET_ASSETS,
-    assets,
-    totalSize
-  };
-}
+const { setAssets, deleteAsset } = assetsActions;
 
 export function getAssets() {
   return (dispatch) => {
@@ -16,7 +11,12 @@ export function getAssets() {
     apiClient
       .get('/S3/objects')
       .then((response) => {
-        dispatch(setAssets(response.data.assets, response.data.totalSize));
+        dispatch(
+          setAssets({
+            list: response.data.assets,
+            totalSize: response.data.totalSize
+          })
+        );
         dispatch(stopLoader());
       })
       .catch(() => {
@@ -28,13 +28,6 @@ export function getAssets() {
   };
 }
 
-export function deleteAsset(assetKey) {
-  return {
-    type: ActionTypes.DELETE_ASSET,
-    key: assetKey
-  };
-}
-
 export function deleteAssetRequest(assetKey) {
   return (dispatch) => {
     apiClient
diff --git a/client/modules/IDE/reducers/assets.js b/client/modules/IDE/reducers/assets.js
index f1dd0f40cb..e2fb58f625 100644
--- a/client/modules/IDE/reducers/assets.js
+++ b/client/modules/IDE/reducers/assets.js
@@ -1,20 +1,27 @@
-import * as ActionTypes from '../../../constants';
+import { createSlice } from '@reduxjs/toolkit';
 
-// 1,000,000 bytes in a MB. can't upload if totalSize is bigger than this.
 const initialState = {
   list: [],
   totalSize: 0
 };
 
-const assets = (state = initialState, action) => {
-  switch (action.type) {
-    case ActionTypes.SET_ASSETS:
-      return { list: action.assets, totalSize: action.totalSize };
-    case ActionTypes.DELETE_ASSET:
-      return { list: state.list.filter((asset) => asset.key !== action.key) };
-    default:
-      return state;
+const assetsSlice = createSlice({
+  name: 'assets',
+  initialState,
+  reducers: {
+    setAssets: (state, action) => action.payload,
+    deleteAsset: (state, action) => {
+      const key = action.payload;
+      const index = state.list.findIndex((asset) => asset.key === key);
+      if (index !== -1) {
+        const asset = state.list[index];
+        state.totalSize -= asset.size;
+        state.list.splice(index, 1);
+      }
+    }
   }
-};
+});
+
+export const assetsActions = assetsSlice.actions;
 
-export default assets;
+export default assetsSlice.reducer;