Delete browser profile (#243)

- delete browser profile, if not in use
- if in use, show error message, listing crawl configs that use the profile
- backend: fix check for confirming profile deletion

backend/profiles.py

@@ -361,7 +361,7 @@ class ProfileOps:
         # delete profile.pathname
 
         res = await self.profiles.delete_one(query)
-        if not res or res.get("deleteCount") != 1:
+        if not res or res.deleted_count != 1:
             raise HTTPException(status_code=404, detail="profile_not_found")
 
         return {"success": True}

frontend/src/pages/archive/browser-profiles-detail.ts

@@ -6,6 +6,7 @@ import type { AuthState } from "../../utils/AuthService";
 import LiteElement, { html } from "../../utils/LiteElement";
 import { ProfileBrowser } from "../../components/profile-browser";
 import { Profile } from "./types";
+import { F } from "lodash/fp";
 
 /**
  * Usage:
@@ -287,6 +288,20 @@ export class BrowserProfilesDetail extends LiteElement {
               >${msg("Duplicate profile")}</span
             >
           </li>
+          <hr />
+          <li
+            class="p-2 text-danger hover:bg-danger hover:text-white cursor-pointer"
+            role="menuitem"
+            @click=${() => {
+              this.deleteProfile();
+            }}
+          >
+            <sl-icon
+              class="inline-block align-middle px-1"
+              name="file-earmark-x"
+            ></sl-icon>
+            <span class="inline-block align-middle pr-2">${msg("Delete")}</span>
+          </li>
         </ul>
       </sl-dropdown>
     `;
@@ -404,6 +419,50 @@ export class BrowserProfilesDetail extends LiteElement {
     }
   }
 
+  private async deleteProfile() {
+    const profileName = this.profile!.name;
+
+    try {
+      const data = await this.apiFetch(
+        `/archives/${this.archiveId}/profiles/${this.profile!.id}`,
+        this.authState!,
+        {
+          method: "DELETE",
+        }
+      );
+
+      if (data.error && data.crawlconfigs) {
+        this.notify({
+          message: msg(
+            html`Could not delete <strong>${profileName}</strong>, in use by
+              <strong
+                >${data.crawlconfigs
+                  .map(({ name }: any) => name)
+                  .join(", ")}</strong
+              >. Please remove browser profile from crawl template to continue.`
+          ),
+          type: "warning",
+          icon: "exclamation-triangle",
+          duration: 15000,
+        });
+      } else {
+        this.navTo(`/archives/${this.archiveId}/browser-profiles`);
+
+        this.notify({
+          message: msg(html`Deleted <strong>${profileName}</strong>.`),
+          type: "success",
+          icon: "check2-circle",
+        });
+      }
+    } catch (e) {
+      this.notify({
+        message: msg("Sorry, couldn't delete browser profile at this time."),
+        type: "danger",
+        icon: "exclamation-octagon",
+      });
+    }
+  }
+
   private createBrowser({ url }: { url: string }) {
     const params = {
       url,

frontend/src/pages/archive/browser-profiles-list.ts

@@ -170,7 +170,29 @@ export class BrowserProfilesList extends LiteElement {
               e.target.closest("sl-dropdown").hide();
             }}
           >
-            ${msg("Duplicate browser profile")}
+            <sl-icon
+              class="inline-block align-middle px-1"
+              name="files"
+            ></sl-icon>
+            <span class="inline-block align-middle pr-2"
+              >${msg("Duplicate profile")}</span
+            >
+          </li>
+          <li
+            class="p-2 text-danger hover:bg-danger hover:text-white cursor-pointer"
+            role="menuitem"
+            @click=${(e: any) => {
+              // Close dropdown before deleting template
+              e.target.closest("sl-dropdown").hide();
+
+              this.deleteProfile(data);
+            }}
+          >
+            <sl-icon
+              class="inline-block align-middle px-1"
+              name="file-earmark-x"
+            ></sl-icon>
+            <span class="inline-block align-middle pr-2">${msg("Delete")}</span>
           </li>
         </ul>
       </sl-dropdown>
@@ -300,6 +322,50 @@ export class BrowserProfilesList extends LiteElement {
     }
   }
 
+  private async deleteProfile(profile: Profile) {
+    try {
+      const data = await this.apiFetch(
+        `/archives/${this.archiveId}/profiles/${profile.id}`,
+        this.authState!,
+        {
+          method: "DELETE",
+        }
+      );
+
+      if (data.error && data.crawlconfigs) {
+        this.notify({
+          message: msg(
+            html`Could not delete <strong>${profile.name}</strong>, in use by
+              <strong
+                >${data.crawlconfigs
+                  .map(({ name }: any) => name)
+                  .join(", ")}</strong
+              >. Please remove browser profile from crawl template to continue.`
+          ),
+          type: "warning",
+          icon: "exclamation-triangle",
+          duration: 15000,
+        });
+      } else {
+        this.notify({
+          message: msg(html`Deleted <strong>${profile.name}</strong>.`),
+          type: "success",
+          icon: "check2-circle",
+        });
+
+        this.browserProfiles = this.browserProfiles!.filter(
+          (p) => p.id !== profile.id
+        );
+      }
+    } catch (e) {
+      this.notify({
+        message: msg("Sorry, couldn't delete browser profile at this time."),
+        type: "danger",
+        icon: "exclamation-octagon",
+      });
+    }
+  }
+
   private createBrowser({ url }: { url: string }) {
     const params = {
       url,