diff --git a/invokeai/backend/model_management/model_manager.py b/invokeai/backend/model_management/model_manager.py
index 03514cfeff..213ebe8ad9 100644
--- a/invokeai/backend/model_management/model_manager.py
+++ b/invokeai/backend/model_management/model_manager.py
@@ -593,6 +593,7 @@ class ModelManager(object):
                 rmtree(str(model_path))
             else:
                 model_path.unlink()
+        self.commit()
 
     # LS: tested
     def add_model(
diff --git a/invokeai/frontend/web/src/features/ui/components/tabs/ModelManager/subpanels/ModelManagerPanel/ModelListItem.tsx b/invokeai/frontend/web/src/features/ui/components/tabs/ModelManager/subpanels/ModelManagerPanel/ModelListItem.tsx
index ab5fddd5ea..61c2c8b5e2 100644
--- a/invokeai/frontend/web/src/features/ui/components/tabs/ModelManager/subpanels/ModelManagerPanel/ModelListItem.tsx
+++ b/invokeai/frontend/web/src/features/ui/components/tabs/ModelManager/subpanels/ModelManagerPanel/ModelListItem.tsx
@@ -8,6 +8,7 @@ import IAIAlertDialog from 'common/components/IAIAlertDialog';
 import IAIIconButton from 'common/components/IAIIconButton';
 import { setOpenModel } from 'features/system/store/systemSlice';
 import { useTranslation } from 'react-i18next';
+import { useDeleteMainModelsMutation } from 'services/api/endpoints/models';
 
 type ModelListItemProps = {
   modelKey: string;
@@ -24,6 +25,8 @@ export default function ModelListItem(props: ModelListItemProps) {
     (state: RootState) => state.system.openModel
   );
 
+  const [deleteMainModel] = useDeleteMainModelsMutation();
+
   const { t } = useTranslation();
 
   const dispatch = useAppDispatch();
@@ -35,7 +38,11 @@ export default function ModelListItem(props: ModelListItemProps) {
   };
 
   const handleModelDelete = () => {
-    dispatch(deleteModel(modelKey));
+    const [base_model, _, model_name] = modelKey.split('/');
+    deleteMainModel({
+      base_model: base_model,
+      model_name: model_name,
+    });
     dispatch(setOpenModel(null));
   };
 
diff --git a/invokeai/frontend/web/src/services/api/endpoints/models.ts b/invokeai/frontend/web/src/services/api/endpoints/models.ts
index 217a54a74d..767668f5b2 100644
--- a/invokeai/frontend/web/src/services/api/endpoints/models.ts
+++ b/invokeai/frontend/web/src/services/api/endpoints/models.ts
@@ -39,6 +39,11 @@ type UpdateMainModelQuery = {
   body: MainModelConfig;
 };
 
+type DeleteMainModelQuery = {
+  base_model: BaseModelType;
+  model_name: string;
+};
+
 const mainModelsAdapter = createEntityAdapter<MainModelConfigEntity>({
   sortComparer: (a, b) => a.name.localeCompare(b.name),
 });
@@ -121,6 +126,18 @@ export const modelsApi = api.injectEndpoints({
       },
       invalidatesTags: ['MainModel'],
     }),
+    deleteMainModels: build.mutation<
+      EntityState<MainModelConfigEntity>,
+      DeleteMainModelQuery
+    >({
+      query: ({ base_model, model_name }) => {
+        return {
+          url: `models/${base_model}/main/${model_name}`,
+          method: 'DELETE',
+        };
+      },
+      invalidatesTags: ['MainModel'],
+    }),
     getLoRAModels: build.query<EntityState<LoRAModelConfigEntity>, void>({
       query: () => ({ url: 'models/', params: { model_type: 'lora' } }),
       providesTags: (result, error, arg) => {
@@ -265,4 +282,5 @@ export const {
   useGetTextualInversionModelsQuery,
   useGetVaeModelsQuery,
   useUpdateMainModelsMutation,
+  useDeleteMainModelsMutation,
 } = modelsApi;