Fix spinner when deleting resource

CHANGELOG.md

@@ -26,6 +26,7 @@ As this project is a user-facing application, the places in the semantic version
 ### Fixed
 
 - Missing `type` in store caused new corpus form to crash
+- Fix visual feedback when saving config and deleting resource
 
 ## [1.3.0] (2024-02-12)
 

src/corpus/deleteCorpus.composable.ts

@@ -2,17 +2,16 @@ import { useAuth } from "@/auth/auth.composable";
 import useMinkBackend from "@/api/backend.composable";
 import useMessenger from "@/message/messenger.composable";
 import useResources from "@/library/resources.composable";
+import useSpin from "@/spin/spin.composable";
 
 export default function useDeleteCorpus() {
   const { refreshJwt } = useAuth();
   const mink = useMinkBackend();
+  const { spin } = useSpin();
   const { refreshResources } = useResources();
   const { alertError } = useMessenger();
 
-  /**
-   * Delete a corpus in backend.
-   */
-  async function deleteCorpus(corpusId: string): Promise<void> {
+  async function doDeleteCorpus(corpusId: string): Promise<void> {
     // Delete corpus in the backend.
     await mink.deleteCorpus(corpusId).catch(alertError);
     // The backend will have updated the remote JWT, so refresh our copy.
@@ -21,5 +20,13 @@ export default function useDeleteCorpus() {
     await refreshResources();
   }
 
+  /**
+   * Delete a corpus in backend and refresh resources.
+   */
+  async function deleteCorpus(corpusId: string) {
+    // Wrap deletion as well as refreshing in spin, for visual feedback.
+    return spin(doDeleteCorpus(corpusId), null, `corpus/${corpusId}`);
+  }
+
   return { deleteCorpus };
 }

src/metadata/deleteMetadata.composable.ts

@@ -2,17 +2,16 @@ import { useAuth } from "@/auth/auth.composable";
 import useMinkBackend from "@/api/backend.composable";
 import useMessenger from "@/message/messenger.composable";
 import useResources from "@/library/resources.composable";
+import useSpin from "@/spin/spin.composable";
 
 export default function useDeleteMetadata() {
   const { refreshJwt } = useAuth();
   const mink = useMinkBackend();
+  const { spin } = useSpin();
   const { refreshResources } = useResources();
   const { alertError } = useMessenger();
 
-  /**
-   * Delete a metadata resource in the backend.
-   */
-  async function deleteMetadata(resourceId: string): Promise<void> {
+  async function doDeleteMetadata(resourceId: string): Promise<void> {
     // Delete resource in the backend.
     await mink.deleteMetadata(resourceId).catch(alertError);
     // The backend will have updated the remote JWT, so refresh our copy.
@@ -21,5 +20,13 @@ export default function useDeleteMetadata() {
     await refreshResources();
   }
 
+  /**
+   * Delete a metadata resource in the backend and refresh resources.
+   */
+  async function deleteMetadata(resourceId: string) {
+    // Wrap deletion as well as refreshing in spin, for visual feedback.
+    return spin(doDeleteMetadata(resourceId), null, `resource/${resourceId}`);
+  }
+
   return { deleteMetadata };
 }