diff --git a/apps/web/src/app/(dashboard)/documents/empty-state.tsx b/apps/web/src/app/(dashboard)/documents/empty-state.tsx
index 680f67bf5..a7d25a208 100644
--- a/apps/web/src/app/(dashboard)/documents/empty-state.tsx
+++ b/apps/web/src/app/(dashboard)/documents/empty-state.tsx
@@ -1,41 +1,40 @@
 import { ArrowRight, CheckCircle2 } from 'lucide-react';
+import { match } from 'ts-pattern';
 
 import { ExtendedDocumentStatus } from '@documenso/prisma/types/extended-document-status';
 
 export type EmptyDocumentProps = { status: ExtendedDocumentStatus };
 
 export default function EmptyDocumentState({ status }: EmptyDocumentProps) {
-  let headerText = 'All done';
-  let bodyText = 'All documents signed for now.';
-  let extraText = '';
-  let showArrow = false;
-
-  switch (status) {
-    case 'COMPLETED':
-      headerText = 'Nothing here';
-      bodyText = 'There are no signed documents yet.';
-      extraText = 'Start by adding a document';
-      showArrow = true;
-      break;
-    case 'DRAFT':
-      headerText = 'Nothing here';
-      bodyText = 'There are no drafts yet.';
-      extraText = 'Start by adding a document';
-      showArrow = true;
-      break;
-    case 'ALL':
-      headerText = 'Nothing here';
-      bodyText = 'There are no documents yet.';
-      extraText = 'Start by adding a document';
-      showArrow = true;
-      break;
-    default:
-      break;
-  }
+  const { headerText, bodyText, extraText, showArrow } = match(status)
+    .with(ExtendedDocumentStatus.COMPLETED, () => ({
+      headerText: 'Nothing here',
+      bodyText: 'There are no signed documents yet.',
+      extraText: 'Start by adding a document',
+      showArrow: true,
+    }))
+    .with(ExtendedDocumentStatus.DRAFT, () => ({
+      headerText: 'Nothing here',
+      bodyText: 'There are no drafts yet.',
+      extraText: 'Start by adding a document',
+      showArrow: true,
+    }))
+    .with(ExtendedDocumentStatus.ALL, () => ({
+      headerText: 'Nothing here',
+      bodyText: 'There are no documents yet.',
+      extraText: 'Start by adding a document',
+      showArrow: true,
+    }))
+    .otherwise(() => ({
+      headerText: 'All done',
+      bodyText: 'All documents signed for now.',
+      extraText: '',
+      showArrow: false,
+    }));
 
   return (
     <div className="text-muted-foreground/50 flex h-96 flex-col items-center justify-center space-y-3">
-      <CheckCircle2 className="text-muted-foreground/50 h-14 w-14" />
+      <CheckCircle2 className="text-muted-foreground/50 h-12 w-12" strokeWidth={1.5} />
       <div className="text-center">
         <h3 className="text-lg font-semibold">{headerText}</h3>
         <p>{bodyText}</p>