chain pruning

src/api/operations.ts

@@ -6,6 +6,7 @@ import {
   opCreateLinkURL,
   opDeleteLinkURL,
   opFetchGraphURL,
+  opPruneChainURL,
   opPruneLinkURL,
   opUpdateUserDataURL,
 } from "./paths.ts";
@@ -48,11 +49,7 @@ type backfillChainBodyType = {
   root: string; // playlistID
 };
 
-interface backfillChainDataType extends apiRespBaseType {
+interface backfillChainDataType extends backfillLinkDataType {}
-  toAddNum: number;
-  addedNum: number;
-  localNum: number;
-}
 
 type pruneLinkBodyType = createLinkBodyType;
 
@@ -61,6 +58,10 @@ interface pruneLinkDataType extends apiRespBaseType {
   deletedNum: number;
 }
 
+type pruneChainBodyType = backfillChainBodyType;
+
+interface pruneChainDataType extends pruneLinkDataType {}
+
 export const apiFetchGraph = async (): Promise<
   AxiosResponse<fetchGraphDataType, any>
 > => {
@@ -137,3 +138,14 @@ export const apiPruneLink = async (
     return error.response;
   }
 };
+
+export const apiPruneChain = async (
+  data: pruneChainBodyType
+): Promise<AxiosResponse<pruneChainDataType, any>> => {
+  try {
+    const response = await axiosInstance.put(opPruneChainURL, data);
+    return response;
+  } catch (error: any) {
+    return error.response;
+  }
+};

src/api/paths.ts

@@ -17,3 +17,4 @@ export const opDeleteLinkURL: "api/operations/link" = opCreateLinkURL;
 export const opBackfillLinkURL = "api/operations/populate/link";
 export const opBackfillChainURL = "api/operations/populate/chain";
 export const opPruneLinkURL = "api/operations/prune/link";
+export const opPruneChainURL = "api/operations/prune/chain";

src/pages/Graph/index.tsx

@@ -48,6 +48,7 @@ import {
   apiCreateLink,
   apiDeleteLink,
   apiFetchGraph,
+  apiPruneChain,
   apiPruneLink,
   apiUpdateUserData,
 } from "../../api/operations.ts";
@@ -354,6 +355,34 @@ const Graph = (): React.ReactNode => {
     return;
   };
 
+  const pruneChain = async () => {
+    if (selectedNodeID === "") {
+      showWarnToastNotification("Select a playlist!");
+      return;
+    }
+    const selectedNode = playlistNodes.filter(
+      (nd) => nd.id === selectedNodeID
+    )[0];
+    if (!selectedNode) throw new ReferenceError("no playlist selected");
+    setLoading(true);
+    const resp = await APIWrapper({
+      apiFn: apiPruneChain,
+      data: {
+        root: spotifyPlaylistLinkPrefix + selectedNodeID,
+      },
+      refreshAuth,
+    });
+    setLoading(false);
+
+    if (resp?.status === 200) {
+      if (resp?.data.deletedNum < resp?.data.toDelNum)
+        showWarnToastNotification(resp?.data.message);
+      else showSuccessToastNotification(resp?.data.message);
+      return;
+    }
+    return;
+  };
+
   type getLayoutedElementsOpts = {
     direction: rankdirType;
   };
@@ -570,9 +599,9 @@ const Graph = (): React.ReactNode => {
           <PiSubsetOf size={36} />
           Prune Link
         </Button>
-        <Button disabled={loading}>
+        <Button disabled={loading} onClickMethod={pruneChain}>
           <PiSubsetOf size={36} />
-          Prune Link
+          Prune Chain
         </Button>
         <hr className={styles.divider} />
         <Button disabled={loading} onClickMethod={() => arrangeLayout("TB")}>