From a7f052a9aff718a55e28f60f5f4960710e2a48d3 Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Tue, 5 Mar 2024 13:15:46 +0800
Subject: [PATCH] Add empty trash support to account page

---
 .../mutations/emptyTrashMutation.ts           | 36 +++++++++++++++++++
 packages/web/pages/settings/account.tsx       | 24 ++++++++++++-
 2 files changed, 59 insertions(+), 1 deletion(-)
 create mode 100644 packages/web/lib/networking/mutations/emptyTrashMutation.ts

diff --git a/packages/web/lib/networking/mutations/emptyTrashMutation.ts b/packages/web/lib/networking/mutations/emptyTrashMutation.ts
new file mode 100644
index 000000000..6f55f9284
--- /dev/null
+++ b/packages/web/lib/networking/mutations/emptyTrashMutation.ts
@@ -0,0 +1,36 @@
+import { gql } from 'graphql-request'
+import { gqlFetcher } from '../networkHelpers'
+
+type EmptyTrashResult = {
+  success?: boolean
+  errorCodes?: string[]
+}
+
+type EmptyTrashApiResponse = {
+  emptyTrash: EmptyTrashResult
+}
+
+export async function emptyTrashMutation(): Promise<boolean> {
+  const mutation = gql`
+    mutation emptyTrash {
+      emptyTrash {
+        ... on EmptyTrashError {
+          errorCodes
+        }
+        ... on EmptyTrashSuccess {
+          success
+        }
+      }
+    }
+  `
+
+  try {
+    const data = (await gqlFetcher(mutation, {})) as EmptyTrashApiResponse
+    if ('success' in data.emptyTrash) {
+      return data.emptyTrash.success as boolean
+    }
+    return false
+  } catch {
+    return false
+  }
+}
diff --git a/packages/web/pages/settings/account.tsx b/packages/web/pages/settings/account.tsx
index 041cbdad9..ec494c918 100644
--- a/packages/web/pages/settings/account.tsx
+++ b/packages/web/pages/settings/account.tsx
@@ -19,6 +19,7 @@ import { applyStoredTheme } from '../../lib/themeUpdater'
 import { showErrorToast, showSuccessToast } from '../../lib/toastHelpers'
 import { ConfirmationModal } from '../../components/patterns/ConfirmationModal'
 import { ProgressBar } from '../../components/elements/ProgressBar'
+import { emptyTrashMutation } from '../../lib/networking/mutations/emptyTrashMutation'
 
 const ACCOUNT_LIMIT = 50_000
 
@@ -198,6 +199,18 @@ export default function Account(): JSX.Element {
     })()
   }, [email])
 
+  const emptyTrash = useCallback(() => {
+    ;(async () => {
+      showSuccessToast('Emptying trash')
+      const result = await emptyTrashMutation()
+      if (result) {
+        showSuccessToast('Emptied trash')
+      } else {
+        showErrorToast('Error emptying trash')
+      }
+    })()
+  }, [])
+
   applyStoredTheme()
 
   return (
@@ -396,11 +409,20 @@ export default function Account(): JSX.Element {
                 <StyledText style="footnote" css={{ mt: '0px' }}>
                   {`${libraryCount} of ${ACCOUNT_LIMIT} library items used.`}
                 </StyledText>
-                <StyledText style="footnote" css={{ m: '0px' }}>
+                <StyledText style="footnote" css={{ m: '0px', mb: '10px' }}>
                   NOTE: this is a soft limit, if you are approaching or have
                   exceeded this limit please contact support to have your limit
                   raised.
                 </StyledText>
+                <Button
+                  style="ctaDarkYellow"
+                  onClick={(event) => {
+                    event.preventDefault()
+                    emptyTrash()
+                  }}
+                >
+                  Empty trash
+                </Button>
               </>
             )}
             {/* <Button style="ctaDarkYellow">Upgrade</Button> */}