fix: wip

fix: meta
fix: wip
2025-02-12 23:17:43 +11:00 · 2025-02-12 19:10:41 +11:00 · 2025-02-12 18:39:00 +11:00 · 2025-02-12 16:41:35 +11:00 · 2025-02-11 02:04:00 +11:00 · 2025-02-10 03:33:22 +11:00
309 changed files with 15352 additions and 26824 deletions
--- a/.env.example
+++ b/.env.example
@@ -1,4 +1,5 @@
 # [[AUTH]]
+NEXTAUTH_URL="http://localhost:3000"
 NEXTAUTH_SECRET="secret"

 # [[CRYPTO]]
@@ -18,10 +19,14 @@ NEXT_PRIVATE_OIDC_WELL_KNOWN=""
 NEXT_PRIVATE_OIDC_CLIENT_ID=""
 NEXT_PRIVATE_OIDC_CLIENT_SECRET=""
 NEXT_PRIVATE_OIDC_PROVIDER_LABEL="OIDC"
+# This can be used to still allow signups for OIDC connections
+# when signup is disabled via `NEXT_PUBLIC_DISABLE_SIGNUP`
+NEXT_PRIVATE_OIDC_ALLOW_SIGNUP=""
 NEXT_PRIVATE_OIDC_SKIP_VERIFY=""

 # [[URLS]]
 NEXT_PUBLIC_WEBAPP_URL="http://localhost:3000"
+NEXT_PUBLIC_MARKETING_URL="http://localhost:3001"
 # URL used by the web app to request itself (e.g. local background jobs)
 NEXT_PRIVATE_INTERNAL_WEBAPP_URL="http://localhost:3000"

@@ -108,9 +113,13 @@ NEXT_PUBLIC_DOCUMENT_SIZE_UPLOAD_LIMIT=5
 # [[STRIPE]]
 NEXT_PRIVATE_STRIPE_API_KEY=
 NEXT_PRIVATE_STRIPE_WEBHOOK_SECRET=
+NEXT_PUBLIC_STRIPE_COMMUNITY_PLAN_MONTHLY_PRICE_ID=
+NEXT_PUBLIC_STRIPE_ENTERPRISE_PLAN_MONTHLY_PRICE_ID=

 # [[BACKGROUND JOBS]]
 NEXT_PRIVATE_JOBS_PROVIDER="local"
+NEXT_PRIVATE_TRIGGER_API_KEY=
+NEXT_PRIVATE_TRIGGER_API_URL=
 NEXT_PRIVATE_INNGEST_EVENT_KEY=

 # [[FEATURES]]
@@ -126,5 +135,10 @@ E2E_TEST_AUTHENTICATE_USERNAME="Test User"
 E2E_TEST_AUTHENTICATE_USER_EMAIL="testuser@mail.com"
 E2E_TEST_AUTHENTICATE_USER_PASSWORD="test_Password123"

+# This is only required for the marketing site
+# [[REDIS]]
+NEXT_PRIVATE_REDIS_URL=
+NEXT_PRIVATE_REDIS_TOKEN=
+
 # [[LOGGER]]
 NEXT_PRIVATE_LOGGER_HONEY_BADGER_API_KEY=
--- a/.github/actions/cache-build/action.yml
+++ b/.github/actions/cache-build/action.yml
@@ -3,7 +3,7 @@ description: 'Cache or restore if necessary'
 inputs:
  node_version:
    required: false
-    default: v22.x
+    default: v20.x
 runs:
  using: 'composite'
  steps:
--- a/.github/actions/node-install/action.yml
+++ b/.github/actions/node-install/action.yml
@@ -2,7 +2,7 @@ name: 'Setup node and cache node_modules'
 inputs:
  node_version:
    required: false
-    default: v22.x
+    default: v20.x

 runs:
  using: 'composite'
--- a/.github/workflows/e2e-tests.yml
+++ b/.github/workflows/e2e-tests.yml
@@ -1,7 +1,7 @@
 name: Playwright Tests
 on:
  push:
-    branches: ['main', 'feat/rr7']
+    branches: ['main']
  pull_request:
    branches: ['main']
 jobs:
--- a/.gitpod.yml
+++ b/.gitpod.yml
@@ -4,7 +4,9 @@ tasks:
      npm run dx:up &&
      cp .env.example .env &&
      set -a; source .env &&
+      export NEXTAUTH_URL="$(gp url 3000)" &&
      export NEXT_PUBLIC_WEBAPP_URL="$(gp url 3000)" &&
+      export NEXT_PUBLIC_MARKETING_URL="$(gp url 3001)"
    command: npm run d

 ports:
--- a/.husky/pre-commit
+++ b/.husky/pre-commit
@@ -4,9 +4,12 @@
 SCRIPT_DIR="$(readlink -f "$(dirname "$0")")"
 MONOREPO_ROOT="$(readlink -f "$SCRIPT_DIR/../")"

+echo "Copying pdf.js"
+npm run copy:pdfjs --workspace apps/**
+
 echo "Copying .well-known/ contents"
 node "$MONOREPO_ROOT/scripts/copy-wellknown.cjs"

-git add "$MONOREPO_ROOT/apps/remix/public/"
+git add "$MONOREPO_ROOT/apps/web/public/"

 npx lint-staged
--- a/README.md
+++ b/README.md
@@ -1,3 +1,7 @@
+> 🚨 We are live on Product Hunt 🎉  Check out our latest launch: <a href="documen.so/sign-everywhere">The Platform Plan</a>!
+
+<a href="https://www.producthunt.com/posts/documenso-platform-plan?embed=true&utm_source=badge-featured&utm_medium=badge&utm_souce=badge-documenso&#0045;platform&#0045;plan" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=670576&theme=light" alt="Documenso&#0032;Platform&#0032;Plan - Whitelabeled&#0032;signing&#0032;flows&#0032;in&#0032;your&#0032;product | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
+
 <img src="https://github.com/documenso/documenso/assets/13398220/a643571f-0239-46a6-a73e-6bef38d1228b" alt="Documenso Logo">

 <p align="center" style="margin-top: 20px">
@@ -69,9 +73,9 @@ Contact us if you are interested in our Enterprise plan for large organizations
 <a href="https://cal.com/timurercan/enterprise-customers?utm_source=banner&utm_campaign=oss"><img alt="Book us with Cal.com" src="https://cal.com/book-with-cal-dark.svg" /></a>

 ## Tech Stack
-
 <p align="left">
  <a href="https://www.typescriptlang.org"><img src="https://shields.io/badge/TypeScript-3178C6?logo=TypeScript&logoColor=FFF&style=flat-square" alt="TypeScript"></a>
+  <a href="https://nextjs.org/"><img src="https://img.shields.io/badge/next.js-000000?style=flat-square&logo=nextdotjs&logoColor=white" alt="NextJS"></a>
  <a href="https://prisma.io"><img width="122" height="20" src="http://made-with.prisma.io/indigo.svg" alt="Made with Prisma" /></a>
  <a href="https://tailwindcss.com/"><img src="https://img.shields.io/badge/tailwindcss-0F172A?&logo=tailwindcss" alt="Tailwind CSS"></a>
  <a href=""><img src="" alt=""></a>
@@ -81,17 +85,20 @@ Contact us if you are interested in our Enterprise plan for large organizations
  <a href=""><img src="" alt=""></a>
 </p>

+
 - [Typescript](https://www.typescriptlang.org/) - Language
- [ReactRouter](https://reactrouter.com/) - Framework
- [Prisma](https://www.prisma.io/) - ORM
+- [Next.js](https://nextjs.org/) - Framework
+- [Prisma](https://www.prisma.io/)  - ORM
 - [Tailwind](https://tailwindcss.com/) - CSS
 - [shadcn/ui](https://ui.shadcn.com/) - Component Library
+- [NextAuth.js](https://next-auth.js.org/) - Authentication
 - [react-email](https://react.email/) - Email Templates
 - [tRPC](https://trpc.io/) - API
 - [@documenso/pdf-sign](https://www.npmjs.com/package/@documenso/pdf-sign) - PDF Signatures (launching soon)
 - [React-PDF](https://github.com/wojtekmaj/react-pdf) - Viewing PDFs
 - [PDF-Lib](https://github.com/Hopding/pdf-lib) - PDF manipulation
 - [Stripe](https://stripe.com/) - Payments
+- [Vercel](https://vercel.com) - Hosting

 <!-- - Support for [opensignpdf (requires Java on server)](https://github.com/open-pdf-sign) is currently planned. -->

@@ -101,7 +108,7 @@ Contact us if you are interested in our Enterprise plan for large organizations

 To run Documenso locally, you will need

- Node.js (v22 or above)
+- Node.js (v18 or above)
 - Postgres SQL Database
 - Docker (optional)

@@ -164,8 +171,10 @@ git clone https://github.com/<your-username>/documenso

 4. Set the following environment variables:

+   - NEXTAUTH_URL
   - NEXTAUTH_SECRET
   - NEXT_PUBLIC_WEBAPP_URL
+   - NEXT_PUBLIC_MARKETING_URL
   - NEXT_PRIVATE_DATABASE_URL
   - NEXT_PRIVATE_DIRECT_DATABASE_URL
   - NEXT_PRIVATE_SMTP_FROM_NAME
@@ -234,14 +243,16 @@ cp .env.example .env

 The following environment variables must be set:

+- `NEXTAUTH_URL`
 - `NEXTAUTH_SECRET`
 - `NEXT_PUBLIC_WEBAPP_URL`
+- `NEXT_PUBLIC_MARKETING_URL`
 - `NEXT_PRIVATE_DATABASE_URL`
 - `NEXT_PRIVATE_DIRECT_DATABASE_URL`
 - `NEXT_PRIVATE_SMTP_FROM_NAME`
 - `NEXT_PRIVATE_SMTP_FROM_ADDRESS`

-> If you are using a reverse proxy in front of Documenso, don't forget to provide the public URL for the `NEXT_PUBLIC_WEBAPP_URL` variable!
+> If you are using a reverse proxy in front of Documenso, don't forget to provide the public URL for both `NEXTAUTH_URL` and `NEXT_PUBLIC_WEBAPP_URL` variables!

 Now you can install the dependencies and build it:

--- a/apps/documentation/package.json
+++ b/apps/documentation/package.json
@@ -7,7 +7,8 @@
    "build": "next build",
    "start": "next start -p 3002",
    "lint:fix": "next lint --fix",
-    "clean": "rimraf .next && rimraf node_modules"
+    "clean": "rimraf .next && rimraf node_modules",
+    "copy:pdfjs": "node ../../scripts/copy-pdfjs.cjs"
  },
  "dependencies": {
    "@documenso/assets": "*",
--- a/apps/documentation/pages/developers/_meta.json
+++ b/apps/documentation/pages/developers/_meta.json
@@ -14,4 +14,4 @@
  "public-api": "Public API",
  "embedding": "Embedding",
  "webhooks": "Webhooks"
-}
+}
--- a/apps/documentation/pages/developers/embedding/css-variables.mdx
+++ b/apps/documentation/pages/developers/embedding/css-variables.mdx
@@ -111,83 +111,6 @@ The colors will be automatically converted to the appropriate format internally.

 4. **Consistent Radius**: Use a consistent border radius value that matches your application's design system.

-## CSS Class Targets
-
-In addition to CSS variables, specific components in the embedded experience can be targeted using CSS classes for more granular styling:
-
-### Component Classes
-
-| Class Name                        | Description                                                             |
-| --------------------------------- | ----------------------------------------------------------------------- |
-| `.embed--Root`                    | Main container for the embedded signing experience                      |
-| `.embed--DocumentContainer`       | Container for the document and signing widget                           |
-| `.embed--DocumentViewer`          | Container for the document viewer                                       |
-| `.embed--DocumentWidget`          | The signing widget container                                            |
-| `.embed--DocumentWidgetContainer` | Outer container for the signing widget, handles positioning             |
-| `.embed--DocumentWidgetHeader`    | Header section of the signing widget                                    |
-| `.embed--DocumentWidgetContent`   | Main content area of the signing widget                                 |
-| `.embed--DocumentWidgetForm`      | Form section within the signing widget                                  |
-| `.embed--DocumentWidgetFooter`    | Footer section of the signing widget                                    |
-| `.embed--WaitingForTurn`          | Container for the waiting screen when it's not the user's turn to sign  |
-| `.embed--DocumentCompleted`       | Container for the completion screen after signing                       |
-| `.field--FieldRootContainer`      | Base container for document fields (signatures, text, checkboxes, etc.) |
-
-Field components also expose several data attributes that can be used for styling different states:
-
-| Data Attribute      | Values                                         | Description                          |
-| ------------------- | ---------------------------------------------- | ------------------------------------ |
-| `[data-field-type]` | `SIGNATURE`, `TEXT`, `CHECKBOX`, `RADIO`, etc. | The type of field                    |
-| `[data-inserted]`   | `true`, `false`                                | Whether the field has been filled    |
-| `[data-validate]`   | `true`, `false`                                | Whether the field is being validated |
-
-### Field Styling Example
-
-```css
-/* Style all field containers */
-.field--FieldRootContainer {
-  transition: all 200ms ease;
-}
-
-/* Style specific field types */
-.field--FieldRootContainer[data-field-type='SIGNATURE'] {
-  background-color: rgba(0, 0, 0, 0.02);
-}
-
-/* Style inserted fields */
-.field--FieldRootContainer[data-inserted='true'] {
-  background-color: var(--primary);
-  opacity: 0.2;
-}
-
-/* Style fields being validated */
-.field--FieldRootContainer[data-validate='true'] {
-  border-color: orange;
-}
-```
-
-### Example Usage
-
-```css
-/* Custom styles for the document widget */
-.embed--DocumentWidget {
-  background-color: #ffffff;
-  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
-}
-
-/* Custom styles for the waiting screen */
-.embed--WaitingForTurn {
-  background-color: #f9fafb;
-  padding: 2rem;
-}
-
-/* Responsive adjustments for the document container */
-@media (min-width: 768px) {
-  .embed--DocumentContainer {
-    gap: 2rem;
-  }
-}
-```
-
 ## Related

 - [React Integration](/developers/embedding/react)
--- a/apps/documentation/pages/developers/local-development/index.mdx
+++ b/apps/documentation/pages/developers/local-development/index.mdx
@@ -16,16 +16,18 @@ Pick the one that fits your needs the best.
 ## Tech Stack

 - [Typescript](https://www.typescriptlang.org/) - Language
- [React Router](https://reactrouter.com/) - Framework
+- [Next.js](https://nextjs.org/) - Framework
 - [Prisma](https://www.prisma.io/) - ORM
 - [Tailwind](https://tailwindcss.com/) - CSS
 - [shadcn/ui](https://ui.shadcn.com/) - Component Library
+- [NextAuth.js](https://next-auth.js.org/) - Authentication
 - [react-email](https://react.email/) - Email Templates
 - [tRPC](https://trpc.io/) - API
 - [@documenso/pdf-sign](https://www.npmjs.com/package/@documenso/pdf-sign) - PDF Signatures
 - [React-PDF](https://github.com/wojtekmaj/react-pdf) - Viewing PDFs
 - [PDF-Lib](https://github.com/Hopding/pdf-lib) - PDF manipulation
 - [Stripe](https://stripe.com/) - Payments
+- [Vercel](https://vercel.com) - Hosting

 <div className="mt-16 flex items-center justify-center gap-4">
  <a href="https://documen.so/discord">
--- a/apps/documentation/pages/developers/local-development/manual.mdx
+++ b/apps/documentation/pages/developers/local-development/manual.mdx
@@ -32,8 +32,10 @@ Run `npm i` in the root directory to install the dependencies required for the p
 Set up the following environment variables in the `.env` file:

 ```bash
+NEXTAUTH_URL
 NEXTAUTH_SECRET
 NEXT_PUBLIC_WEBAPP_URL
+NEXT_PUBLIC_MARKETING_URL
 NEXT_PRIVATE_DATABASE_URL
 NEXT_PRIVATE_DIRECT_DATABASE_URL
 NEXT_PRIVATE_SMTP_FROM_NAME
--- a/apps/documentation/pages/developers/local-development/translations.mdx
+++ b/apps/documentation/pages/developers/local-development/translations.mdx
@@ -13,13 +13,35 @@ Documenso uses the following stack to handle translations:

 Additional reading can be found in the [Lingui documentation](https://lingui.dev/introduction).

+## Requirements
+
+You **must** insert **`setupI18nSSR()`** when creating any of the following files:
+
+- Server layout.tsx
+- Server page.tsx
+- Server loading.tsx
+
+Server meaning it does not have `'use client'` in it.
+
+```tsx
+import { setupI18nSSR } from '@documenso/lib/client-only/providers/i18n.server';
+
+export default function SomePage() {
+  setupI18nSSR(); // Required if there are translations within the page, or nested in components.
+
+  // Rest of code...
+}
+```
+
+Additional information can be found [here.](https://lingui.dev/tutorials/react-rsc#pages-layouts-and-lingui)
+
 ## Quick guide

 If you require more in-depth information, please see the [Lingui documentation](https://lingui.dev/introduction).

 ### HTML

-Wrap all text to translate in **`<Trans></Trans>`** tags exported from **@lingui/react/macro**.
+Wrap all text to translate in **`<Trans></Trans>`** tags exported from **@lingui/macro** (not @lingui/react).

 ```html
 <h1>
@@ -42,9 +64,8 @@ For text that is broken into elements, but represent a whole sentence, you must
 ### Constants outside of react components

 ```tsx
-import { msg } from '@lingui/core/macro';
+import { Trans, msg } from '@lingui/macro';
 import { useLingui } from '@lingui/react';
-import { Trans } from '@lingui/react/macro';

 // Wrap text in msg`text to translate` when it's in a constant here, or another file/package.
 export const CONSTANT_WITH_MSG = {
@@ -77,13 +98,31 @@ Lingui provides a Plural component to make it easy. See full documentation [here

 Lingui provides a [DateTime instance](https://lingui.dev/ref/core#i18n.date) with the configured locale.

+#### Server components
+
+Note that the i18n instance is coming from **setupI18nSSR**.
+
 ```tsx
 import { Trans } from '@lingui/macro';
 import { useLingui } from '@lingui/react';

 export const SomeComponent = () => {
-  const { i18n } = useLingui();
+  const { i18n } = setupI18nSSR();

  return <Trans>The current date is {i18n.date(new Date(), { dateStyle: 'short' })}</Trans>;
 };
 ```
+
+#### Client components
+
+Note that the i18n instance is coming from the **import**.
+
+```tsx
+import { i18n } from '@lingui/core';
+import { Trans } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
+
+export const SomeComponent = () => {
+  return <Trans>The current date is {i18n.date(new Date(), { dateStyle: 'short' })}</Trans>;
+};
+```
--- a/apps/documentation/pages/developers/public-api/index.mdx
+++ b/apps/documentation/pages/developers/public-api/index.mdx
@@ -3,8 +3,6 @@ title: Public API
 description: Learn how to interact with your documents programmatically using the Documenso public API.
 ---

-import { Callout, Steps } from 'nextra/components';
-
 # Public API

 Documenso provides a public REST API enabling you to interact with your documents programmatically. The API exposes various HTTP endpoints that allow you to perform operations such as:
@@ -15,30 +13,10 @@ Documenso provides a public REST API enabling you to interact with your document

 The documentation walks you through creating API keys and using them to authenticate your API requests. You'll also learn about the available endpoints, request and response formats, and how to use the API.

-## API V1 - Stable
+## Swagger Documentation

-Check out the [API V1 documentation](https://app.documenso.com/api/v1/openapi) for details about the API endpoints, request parameters, response formats, and authentication methods.
-
-## API V2 - Beta
-
-<Callout type="warning">API V2 is currently beta, and will be subject to breaking changes</Callout>
-
-Check out the [API V2 documentation](https://documen.so/api-v2-docs) for details about the API endpoints, request parameters, response formats, and authentication methods.
-
-Our new API V2 supports the following typed SDKs:
-
- [TypeScript](https://github.com/documenso/sdk-typescript)
- [Python](https://github.com/documenso/sdk-python)
- [Go](https://github.com/documenso/sdk-go)
-
-🚀 [V2 Announcement](https://documen.so/sdk-blog)
-
-📖 [Documentation](https://documen.so/api-v2-docs)
-
-💬 [Leave Feedback](https://documen.so/sdk-feedback)
-
-🔔 [Breaking Changes](https://documen.so/sdk-breaking)
+The [Swagger documentation](https://app.documenso.com/api/v1/openapi) also provides information about the API endpoints, request parameters, response formats, and authentication methods.

 ## Availability

-The API is available to individual users, teams and higher plans. [Fair Use](https://documen.so/fair) applies.
+The API is available to individual users and teams.
--- a/apps/documentation/pages/developers/self-hosting/how-to.mdx
+++ b/apps/documentation/pages/developers/self-hosting/how-to.mdx
@@ -5,7 +5,7 @@ description: Learn how to self-host Documenso on your server or cloud infrastruc

 import { Callout, Steps } from 'nextra/components';

-import { CallToAction } from '../../../components/call-to-action';
+import { CallToAction } from '@documenso/ui/components/call-to-action';

 # Self Hosting

@@ -35,8 +35,10 @@ cp .env.example .env
 Open the `.env` file and fill in the following variables:

 ```bash
+- NEXTAUTH_URL
 - NEXTAUTH_SECRET
 - NEXT_PUBLIC_WEBAPP_URL
+- NEXT_PUBLIC_MARKETING_URL
 - NEXT_PRIVATE_DATABASE_URL
 - NEXT_PRIVATE_DIRECT_DATABASE_URL
 - NEXT_PRIVATE_SMTP_FROM_NAME
@@ -44,8 +46,8 @@ Open the `.env` file and fill in the following variables:
 ```

 <Callout type="info">
-  If you use a reverse proxy in front of Documenso, don't forget to provide the public URL for the
-  `NEXT_PUBLIC_WEBAPP_URL` variable!
+  If you use a reverse proxy in front of Documenso, don't forget to provide the public URL for both
+  the `NEXTAUTH_URL` and `NEXT_PUBLIC_WEBAPP_URL` variables!
 </Callout>

 ### Install the Dependencies
@@ -169,6 +171,7 @@ Run the Docker container with the required environment variables:
 ```bash
 docker run -d \
 -p 3000:3000 \
+ -e NEXTAUTH_URL="<your-nextauth-url>"
 -e NEXTAUTH_SECRET="<your-nextauth-secret>"
 -e NEXT_PRIVATE_ENCRYPTION_KEY="<your-next-private-encryption-key>"
 -e NEXT_PRIVATE_ENCRYPTION_SECONDARY_KEY="<your-next-private-encryption-secondary-key>"
@@ -197,6 +200,7 @@ The environment variables listed above are a subset of those available for confi
 | Variable                                     | Description                                                                                         |
 | -------------------------------------------- | --------------------------------------------------------------------------------------------------- |
 | `PORT`                                       | The port on which the Documenso application runs. It defaults to `3000`.                            |
+| `NEXTAUTH_URL`                               | The URL for the NextAuth.js authentication service.                                                 |
 | `NEXTAUTH_SECRET`                            | The secret key used by NextAuth.js for encryption and signing.                                      |
 | `NEXT_PRIVATE_ENCRYPTION_KEY`                | The primary encryption key for symmetric encryption and decryption (at least 32 characters).        |
 | `NEXT_PRIVATE_ENCRYPTION_SECONDARY_KEY`      | The secondary encryption key for symmetric encryption and decryption (at least 32 characters).      |
--- a/apps/documentation/pages/developers/self-hosting/index.mdx
+++ b/apps/documentation/pages/developers/self-hosting/index.mdx
@@ -3,7 +3,7 @@ title: Getting Started with Self-Hosting
 description: A step-by-step guide to setting up and hosting your own Documenso instance.
 ---

-import { CallToAction } from '../../../components/call-to-action';
+import { CallToAction } from '@documenso/ui/components/call-to-action';

 # Getting Started with Self-Hosting

--- a/apps/documentation/pages/developers/webhooks.mdx
+++ b/apps/documentation/pages/developers/webhooks.mdx
@@ -21,7 +21,6 @@ Documenso supports Webhooks and allows you to subscribe to the following events:
 - `document.signed`
 - `document.completed`
 - `document.rejected`
- `document.cancelled`

 ## Create a webhook subscription

@@ -38,7 +37,7 @@ Clicking on the "**Create Webhook**" button opens a modal to create a new webhoo
 To create a new webhook subscription, you need to provide the following information:

 - Enter the webhook URL that will receive the event payload.
- Select the event(s) you want to subscribe to: `document.created`, `document.sent`, `document.opened`, `document.signed`, `document.completed`, `document.rejected`, `document.cancelled`.
+- Select the event(s) you want to subscribe to: `document.created`, `document.sent`, `document.opened`, `document.signed`, `document.completed`, `document.rejected`.
 - Optionally, you can provide a secret key that will be used to sign the payload. This key will be included in the `X-Documenso-Secret` header of the request.

 ![A screenshot of the Create Webhook modal that shows the URL input field and the event checkboxes](/webhook-images/webhooks-page-create-webhook-modal.webp)
@@ -529,96 +528,6 @@ Example payload for the `document.rejected` event:
 }
 ```

-Example payload for the `document.rejected` event:
-
-```json
-{
-  "event": "DOCUMENT_CANCELLED",
-  "payload": {
-    "id": 7,
-    "externalId": null,
-    "userId": 3,
-    "authOptions": null,
-    "formValues": null,
-    "visibility": "EVERYONE",
-    "title": "documenso.pdf",
-    "status": "PENDING",
-    "documentDataId": "cm6exvn93006hi02ru90a265a",
-    "createdAt": "2025-01-27T11:02:14.393Z",
-    "updatedAt": "2025-01-27T11:03:16.387Z",
-    "completedAt": null,
-    "deletedAt": null,
-    "teamId": null,
-    "templateId": null,
-    "source": "DOCUMENT",
-    "documentMeta": {
-      "id": "cm6exvn96006ji02rqvzjvwoy",
-      "subject": "",
-      "message": "",
-      "timezone": "Etc/UTC",
-      "password": null,
-      "dateFormat": "yyyy-MM-dd hh:mm a",
-      "redirectUrl": "",
-      "signingOrder": "PARALLEL",
-      "typedSignatureEnabled": true,
-      "language": "en",
-      "distributionMethod": "EMAIL",
-      "emailSettings": {
-        "documentDeleted": true,
-        "documentPending": true,
-        "recipientSigned": true,
-        "recipientRemoved": true,
-        "documentCompleted": true,
-        "ownerDocumentCompleted": true,
-        "recipientSigningRequest": true
-      }
-    },
-    "recipients": [
-      {
-        "id": 7,
-        "documentId": 7,
-        "templateId": null,
-        "email": "mybirihix@mailinator.com",
-        "name": "Zorita Baird",
-        "token": "XkKx1HCs6Znm2UBJA2j6o",
-        "documentDeletedAt": null,
-        "expired": null,
-        "signedAt": null,
-        "authOptions": { "accessAuth": null, "actionAuth": null },
-        "signingOrder": 1,
-        "rejectionReason": null,
-        "role": "SIGNER",
-        "readStatus": "NOT_OPENED",
-        "signingStatus": "NOT_SIGNED",
-        "sendStatus": "SENT"
-      }
-    ],
-    "Recipient": [
-      {
-        "id": 7,
-        "documentId": 7,
-        "templateId": null,
-        "email": "signer@documenso.com",
-        "name": "Signer",
-        "token": "XkKx1HCs6Znm2UBJA2j6o",
-        "documentDeletedAt": null,
-        "expired": null,
-        "signedAt": null,
-        "authOptions": { "accessAuth": null, "actionAuth": null },
-        "signingOrder": 1,
-        "rejectionReason": null,
-        "role": "SIGNER",
-        "readStatus": "NOT_OPENED",
-        "signingStatus": "NOT_SIGNED",
-        "sendStatus": "SENT"
-      }
-    ]
-  },
-  "createdAt": "2025-01-27T11:03:27.730Z",
-  "webhookEndpoint": "https://mywebhooksite.com/mywebhook"
-}
-```
-
 ## Availability

 Webhooks are available to individual users and teams.
--- a/apps/documentation/pages/users/signing-documents/index.mdx
+++ b/apps/documentation/pages/users/signing-documents/index.mdx
@@ -85,13 +85,12 @@ You can also set the recipient's role, which determines their actions and permis

 Documenso has 4 roles for recipients with different permissions and actions.

-|   Role    |                                    Function                                     | Action required | Signature |
-| :-------: | :-----------------------------------------------------------------------------: | :-------------: | :-------: |
-|  Signer   |                Needs to sign signatures fields assigned to them.                |       Yes       |    Yes    |
-| Approver  |          Needs to approve the document as a whole. Signature optional.          |       Yes       | Optional  |
-|  Viewer   |                   Needs to confirm they viewed the document.                    |       Yes       |    No     |
-| Assistant | Can help prepare the document by filling in fields on behalf of other signers.  |       Yes       |    No     |
-|    CC     | Receives a copy of the signed document after completion. No action is required. |       No        |    No     |
+|   Role   |                                    Function                                     | Action required | Signature |
+| :------: | :-----------------------------------------------------------------------------: | :-------------: | :-------: |
+|  Signer  |                Needs to sign signatures fields assigned to them.                |       Yes       |    Yes    |
+| Approver |          Needs to approve the document as a whole. Signature optional.          |       Yes       | Optional  |
+|  Viewer  |                   Needs to confirm they viewed the document.                    |       Yes       |    No     |
+|   BCC    | Receives a copy of the signed document after completion. No action is required. |       No        |    No     |

 ### Fields

--- a/apps/openpage-api/package.json
+++ b/apps/openpage-api/package.json
@@ -7,7 +7,8 @@
    "build": "next build",
    "start": "next start",
    "lint:fix": "next lint --fix",
-    "clean": "rimraf .next && rimraf node_modules"
+    "clean": "rimraf .next && rimraf node_modules",
+    "copy:pdfjs": "node ../../scripts/copy-pdfjs.cjs"
  },
  "dependencies": {
    "@documenso/prisma": "*",
--- a/apps/remix/.bin/build.sh
+++ b/apps/remix/.bin/build.sh
@@ -1,18 +1,9 @@
-#!/usr/bin/env sh
+#!/usr/bin/env bash

 # Exit on error.
 set -eo pipefail

-SCRIPT_DIR="$(readlink -f "$(dirname "$0")")"
-WEB_APP_DIR="$SCRIPT_DIR/.."
-
-# Store the original directory
-ORIGINAL_DIR=$(pwd)
-
-# Set up trap to ensure we return to original directory
-trap 'cd "$ORIGINAL_DIR"' EXIT
-
-cd "$WEB_APP_DIR"
+cd "$(dirname "$0")/.."

 start_time=$(date +%s)

@@ -34,4 +25,4 @@ cp -r ../../packages/lib/translations build/server/hono/packages/lib/translation
 # Time taken
 end_time=$(date +%s)

-echo "[Build]: Done in $((end_time - start_time)) seconds"
+echo "[Build]: Done in $((end_time - start_time)) seconds"
--- a/apps/remix/.bin/stripe-dev.sh
+++ b/apps/remix/.bin/stripe-dev.sh
@@ -1,77 +0,0 @@
-#!/usr/bin/env bash
-
-# Set Error handling
-set -eu
-
-SCRIPT_DIR="$(readlink -f "$(dirname "$0")")"
-WEB_APP_DIR="$SCRIPT_DIR/.."
-
-# Store the original directory
-ORIGINAL_DIR=$(pwd)
-
-# Set up trap to ensure we return to original directory
-trap 'cd "$ORIGINAL_DIR"' EXIT
-
-cd "$WEB_APP_DIR"
-
-# Define env file paths
-ENV_LOCAL_FILE="../../.env.local"
-
-# Function to load environment variable from env files
-load_env_var() {
-  local var_name=$1
-  local var_value=""
-
-  if [ -f "$ENV_LOCAL_FILE" ]; then
-    var_value=$(grep "^$var_name=" "$ENV_LOCAL_FILE" | cut -d '=' -f2)
-  fi
-
-  # Remove quotes if present
-  var_value=$(echo "$var_value" | sed 's/^"\(.*\)"$/\1/' | sed "s/^'\(.*\)'$/\1/")
-
-  echo "$var_value"
-}
-
-NEXT_PUBLIC_FEATURE_BILLING_ENABLED=$(load_env_var "NEXT_PUBLIC_FEATURE_BILLING_ENABLED")
-
-# Check if NEXT_PUBLIC_FEATURE_BILLING_ENABLED is equal to true
-if [ "$NEXT_PUBLIC_FEATURE_BILLING_ENABLED" != "true" ]; then
-  echo "[ERROR]: NEXT_PUBLIC_FEATURE_BILLING_ENABLED must be enabled."
-  exit 1
-fi
-
-# 1. Load NEXT_PRIVATE_STRIPE_API_KEY from env files
-NEXT_PRIVATE_STRIPE_API_KEY=$(load_env_var "NEXT_PRIVATE_STRIPE_API_KEY")
-
-# Check if NEXT_PRIVATE_STRIPE_API_KEY exists
-if [ -z "$NEXT_PRIVATE_STRIPE_API_KEY" ]; then
-  echo "[ERROR]: NEXT_PRIVATE_STRIPE_API_KEY not found in environment files."
-  echo "[ERROR]: Please make sure it's set in $ENV_LOCAL_FILE"
-  exit 1
-fi
-
-# 2. Check if stripe CLI is installed
-if ! command -v stripe &> /dev/null; then
-  echo "[ERROR]: Stripe CLI is not installed or not in PATH."
-  echo "[ERROR]: Please install the Stripe CLI: https://stripe.com/docs/stripe-cli"
-  exit 1
-fi
-
-# 3. Check if NEXT_PRIVATE_STRIPE_WEBHOOK_SECRET env key exists
-NEXT_PRIVATE_STRIPE_WEBHOOK_SECRET=$(load_env_var "NEXT_PRIVATE_STRIPE_WEBHOOK_SECRET")
-
-if [ -z "$NEXT_PRIVATE_STRIPE_WEBHOOK_SECRET" ]; then
-  echo "╔═════════════════════════════════════════════════════════════════════╗"
-  echo "║                                                                     ║"
-  echo "║  ! WARNING: NEXT_PRIVATE_STRIPE_WEBHOOK_SECRET MISSING !            ║"
-  echo "║                                                                     ║"
-  echo "║  Copy the webhook signing secret which will appear in the terminal  ║"
-  echo "║  soon into the env file.                                            ║"
-  echo "║                                                                     ║"
-  echo "║  The webhook secret will start with whsec_...                       ║"
-  echo "║                                                                     ║"
-  echo "╚═════════════════════════════════════════════════════════════════════╝"
-fi
-
-echo "[INFO]: Starting Stripe webhook listener..."
-stripe listen --api-key "$NEXT_PRIVATE_STRIPE_API_KEY" --forward-to http://localhost:3000/api/stripe/webhook
--- a/apps/remix/app/components/dialogs/assistant-confirmation-dialog.tsx
+++ b/apps/remix/app/components/dialogs/assistant-confirmation-dialog.tsx
@@ -1,73 +0,0 @@
-import { Trans } from '@lingui/react/macro';
-
-import { Button } from '@documenso/ui/primitives/button';
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from '@documenso/ui/primitives/dialog';
-
-import { DocumentSigningDisclosure } from '../general/document-signing/document-signing-disclosure';
-
-type ConfirmationDialogProps = {
-  isOpen: boolean;
-  onClose: () => void;
-  onConfirm: () => void;
-  hasUninsertedFields: boolean;
-  isSubmitting: boolean;
-};
-
-export function AssistantConfirmationDialog({
-  isOpen,
-  onClose,
-  onConfirm,
-  hasUninsertedFields,
-  isSubmitting,
-}: ConfirmationDialogProps) {
-  const onOpenChange = () => {
-    if (isSubmitting) {
-      return;
-    }
-
-    onClose();
-  };
-
-  return (
-    <Dialog open={isOpen} onOpenChange={onOpenChange}>
-      <DialogContent>
-        <DialogHeader>
-          <DialogTitle>
-            <Trans>Complete Document</Trans>
-          </DialogTitle>
-          <DialogDescription>
-            <Trans>
-              Are you sure you want to complete the document? This action cannot be undone. Please
-              ensure that you have completed prefilling all relevant fields before proceeding.
-            </Trans>
-          </DialogDescription>
-        </DialogHeader>
-
-        <div className="flex flex-col gap-4">
-          <DocumentSigningDisclosure />
-        </div>
-
-        <DialogFooter className="mt-4">
-          <Button variant="secondary" onClick={onClose} disabled={isSubmitting}>
-            Cancel
-          </Button>
-          <Button
-            variant={hasUninsertedFields ? 'destructive' : 'default'}
-            onClick={onConfirm}
-            disabled={isSubmitting}
-            loading={isSubmitting}
-          >
-            {isSubmitting ? 'Submitting...' : hasUninsertedFields ? 'Proceed' : 'Continue'}
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-}
--- a/apps/remix/app/components/dialogs/document-move-dialog.tsx
+++ b/apps/remix/app/components/dialogs/document-move-dialog.tsx
@@ -37,7 +37,7 @@ export const DocumentMoveDialog = ({ documentId, open, onOpenChange }: DocumentM

  const [selectedTeamId, setSelectedTeamId] = useState<number | null>(null);

-  const { data: teams, isPending: isLoadingTeams } = trpc.team.getTeams.useQuery();
+  const { data: teams, isLoading: isLoadingTeams } = trpc.team.getTeams.useQuery();

  const { mutateAsync: moveDocument, isPending } = trpc.document.moveDocumentToTeam.useMutation({
    onSuccess: () => {
--- a/apps/remix/app/components/dialogs/team-create-dialog.tsx
+++ b/apps/remix/app/components/dialogs/team-create-dialog.tsx
@@ -119,7 +119,7 @@ export const TeamCreateDialog = ({ trigger, ...props }: TeamCreateDialogProps) =
      setOpen(true);
      updateSearchParams({ action: null });
    }
-  }, [actionSearchParam, open]);
+  }, [actionSearchParam, open, setOpen, updateSearchParams]);

  useEffect(() => {
    form.reset();
--- a/apps/remix/app/components/dialogs/team-transfer-dialog.tsx
+++ b/apps/remix/app/components/dialogs/team-transfer-dialog.tsx
@@ -65,7 +65,7 @@ export const TeamTransferDialog = ({
  const {
    data,
    refetch: refetchTeamMembers,
-    isPending: loadingTeamMembers,
+    isLoading: loadingTeamMembers,
    isLoadingError: loadingTeamMembersError,
  } = trpc.team.getTeamMembers.useQuery({
    teamId,
--- a/apps/remix/app/components/dialogs/template-bulk-send-dialog.tsx
+++ b/apps/remix/app/components/dialogs/template-bulk-send-dialog.tsx
@@ -1,274 +0,0 @@
-import { zodResolver } from '@hookform/resolvers/zod';
-import { msg } from '@lingui/core/macro';
-import { useLingui } from '@lingui/react';
-import { Trans } from '@lingui/react/macro';
-import { File as FileIcon, Upload, X } from 'lucide-react';
-import { useForm } from 'react-hook-form';
-import { z } from 'zod';
-
-import { trpc } from '@documenso/trpc/react';
-import { Button } from '@documenso/ui/primitives/button';
-import { Checkbox } from '@documenso/ui/primitives/checkbox';
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} from '@documenso/ui/primitives/dialog';
-import { Form, FormControl, FormField, FormItem } from '@documenso/ui/primitives/form/form';
-import { useToast } from '@documenso/ui/primitives/use-toast';
-
-import { useOptionalCurrentTeam } from '~/providers/team';
-
-const ZBulkSendFormSchema = z.object({
-  file: z.instanceof(File),
-  sendImmediately: z.boolean().default(false),
-});
-
-type TBulkSendFormSchema = z.infer<typeof ZBulkSendFormSchema>;
-
-export type TemplateBulkSendDialogProps = {
-  templateId: number;
-  recipients: Array<{ email: string; name?: string | null }>;
-  trigger?: React.ReactNode;
-  onSuccess?: () => void;
-};
-
-export const TemplateBulkSendDialog = ({
-  templateId,
-  recipients,
-  trigger,
-  onSuccess,
-}: TemplateBulkSendDialogProps) => {
-  const { _ } = useLingui();
-  const { toast } = useToast();
-
-  const team = useOptionalCurrentTeam();
-
-  const form = useForm<TBulkSendFormSchema>({
-    resolver: zodResolver(ZBulkSendFormSchema),
-    defaultValues: {
-      sendImmediately: false,
-    },
-  });
-
-  const { mutateAsync: uploadBulkSend } = trpc.template.uploadBulkSend.useMutation();
-
-  const onDownloadTemplate = () => {
-    const headers = recipients.flatMap((_, index) => [
-      `recipient_${index + 1}_email`,
-      `recipient_${index + 1}_name`,
-    ]);
-
-    const exampleRow = recipients.flatMap((recipient) => [recipient.email, recipient.name || '']);
-
-    const csv = [headers.join(','), exampleRow.join(',')].join('\n');
-    const blob = new Blob([csv], { type: 'text/csv' });
-    const url = window.URL.createObjectURL(blob);
-
-    const a = Object.assign(document.createElement('a'), {
-      href: url,
-      download: 'template.csv',
-    });
-
-    a.click();
-
-    window.URL.revokeObjectURL(url);
-  };
-
-  const onSubmit = async (values: TBulkSendFormSchema) => {
-    try {
-      const csv = await values.file.text();
-
-      await uploadBulkSend({
-        templateId,
-        teamId: team?.id,
-        csv: csv,
-        sendImmediately: values.sendImmediately,
-      });
-
-      toast({
-        title: _(msg`Success`),
-        description: _(
-          msg`Your bulk send has been initiated. You will receive an email notification upon completion.`,
-        ),
-      });
-
-      form.reset();
-      onSuccess?.();
-    } catch (err) {
-      console.error(err);
-
-      toast({
-        title: 'Error',
-        description: 'Failed to upload CSV. Please check the file format and try again.',
-        variant: 'destructive',
-      });
-    }
-  };
-
-  return (
-    <Dialog>
-      <DialogTrigger asChild>
-        {trigger ?? (
-          <Button>
-            <Upload className="mr-2 h-4 w-4" />
-            <Trans>Bulk Send via CSV</Trans>
-          </Button>
-        )}
-      </DialogTrigger>
-
-      <DialogContent>
-        <DialogHeader>
-          <DialogTitle>
-            <Trans>Bulk Send Template via CSV</Trans>
-          </DialogTitle>
-
-          <DialogDescription>
-            <Trans>
-              Upload a CSV file to create multiple documents from this template. Each row represents
-              one document with its recipient details.
-            </Trans>
-          </DialogDescription>
-        </DialogHeader>
-
-        <Form {...form}>
-          <form onSubmit={form.handleSubmit(onSubmit)} className="flex flex-col gap-y-4">
-            <div className="bg-muted/70 rounded-lg border p-4">
-              <h3 className="text-sm font-medium">
-                <Trans>CSV Structure</Trans>
-              </h3>
-
-              <p className="text-muted-foreground mt-1 text-sm">
-                <Trans>
-                  For each recipient, provide their email (required) and name (optional) in separate
-                  columns. Download the template CSV below for the correct format.
-                </Trans>
-              </p>
-
-              <p className="mt-4 text-sm">
-                <Trans>Current recipients:</Trans>
-              </p>
-
-              <ul className="text-muted-foreground mt-2 list-inside list-disc text-sm">
-                {recipients.map((recipient, index) => (
-                  <li key={index}>
-                    {recipient.name ? `${recipient.name} (${recipient.email})` : recipient.email}
-                  </li>
-                ))}
-              </ul>
-            </div>
-
-            <div className="flex flex-col gap-y-2">
-              <Button onClick={onDownloadTemplate} variant="outline" type="button">
-                <Trans>Download Template CSV</Trans>
-              </Button>
-
-              <p className="text-muted-foreground text-xs">
-                <Trans>Pre-formatted CSV template with example data.</Trans>
-              </p>
-            </div>
-
-            <FormField
-              control={form.control}
-              name="file"
-              render={({ field: { onChange, value }, fieldState: { error } }) => (
-                <FormItem>
-                  <FormControl>
-                    {!value ? (
-                      <Button asChild variant="outline" className="w-full">
-                        <label className="cursor-pointer">
-                          <input
-                            type="file"
-                            accept=".csv"
-                            className="hidden"
-                            onChange={(e) => {
-                              const file = e.target.files?.[0];
-                              if (file) {
-                                onChange(file);
-                              }
-                            }}
-                            disabled={form.formState.isSubmitting}
-                          />
-                          <Upload className="mr-2 h-4 w-4" />
-                          <Trans>Upload CSV</Trans>
-                        </label>
-                      </Button>
-                    ) : (
-                      <div className="flex h-10 items-center rounded-md border px-3">
-                        <div className="flex flex-1 items-center gap-2">
-                          <FileIcon className="text-muted-foreground h-4 w-4" />
-                          <span className="flex-1 truncate text-sm">{value.name}</span>
-                        </div>
-
-                        <Button
-                          type="button"
-                          variant="link"
-                          className="text-destructive hover:text-destructive p-0 text-xs"
-                          onClick={() => onChange(null)}
-                          disabled={form.formState.isSubmitting}
-                        >
-                          <X className="h-4 w-4" />
-                          <span className="sr-only">
-                            <Trans>Remove</Trans>
-                          </span>
-                        </Button>
-                      </div>
-                    )}
-                  </FormControl>
-
-                  {error && <p className="text-destructive text-sm">{error.message}</p>}
-
-                  <p className="text-muted-foreground text-xs">
-                    <Trans>
-                      Maximum file size: 4MB. Maximum 100 rows per upload. Blank values will use
-                      template defaults.
-                    </Trans>
-                  </p>
-                </FormItem>
-              )}
-            />
-
-            <FormField
-              control={form.control}
-              name="sendImmediately"
-              render={({ field }) => (
-                <FormItem className="flex items-center space-x-2">
-                  <FormControl>
-                    <div className="flex items-center">
-                      <Checkbox
-                        id="send-immediately"
-                        checked={field.value}
-                        onCheckedChange={field.onChange}
-                      />
-
-                      <label
-                        htmlFor="send-immediately"
-                        className="text-muted-foreground ml-2 flex items-center text-sm"
-                      >
-                        <Trans>Send documents to recipients immediately</Trans>
-                      </label>
-                    </div>
-                  </FormControl>
-                </FormItem>
-              )}
-            />
-
-            <DialogFooter className="mt-4">
-              <Button variant="secondary" onClick={() => form.reset()} type="button">
-                <Trans>Cancel</Trans>
-              </Button>
-
-              <Button type="submit" loading={form.formState.isSubmitting}>
-                <Trans>Upload and Process</Trans>
-              </Button>
-            </DialogFooter>
-          </form>
-        </Form>
-      </DialogContent>
-    </Dialog>
-  );
-};
--- a/apps/remix/app/components/dialogs/template-create-dialog.tsx
+++ b/apps/remix/app/components/dialogs/template-create-dialog.tsx
@@ -83,6 +83,7 @@ export const TemplateCreateDialog = ({ templateRootPath }: TemplateCreateDialogP
      onOpenChange={(value) => !isUploadingFile && setShowTemplateCreateDialog(value)}
    >
      <DialogTrigger asChild>
+        {/* Todo: Wouldn't this break for google? */}
        <Button className="cursor-pointer" disabled={!user.emailVerified}>
          <FilePlus className="-ml-1 mr-2 h-4 w-4" />
          <Trans>New Template</Trans>
--- a/apps/remix/app/components/dialogs/template-direct-link-dialog.tsx
+++ b/apps/remix/app/components/dialogs/template-direct-link-dialog.tsx
@@ -76,11 +76,7 @@ export const TemplateDirectLinkDialog = ({
  );

  const validDirectTemplateRecipients = useMemo(
-    () =>
-      template.recipients.filter(
-        (recipient) =>
-          recipient.role !== RecipientRole.CC && recipient.role !== RecipientRole.ASSISTANT,
-      ),
+    () => template.recipients.filter((recipient) => recipient.role !== RecipientRole.CC),
    [template.recipients],
  );

--- a/apps/remix/app/components/dialogs/token-delete-dialog.tsx
+++ b/apps/remix/app/components/dialogs/token-delete-dialog.tsx
@@ -30,20 +30,22 @@ import {
 import { Input } from '@documenso/ui/primitives/input';
 import { useToast } from '@documenso/ui/primitives/use-toast';

-import { useOptionalCurrentTeam } from '~/providers/team';
-
 export type TokenDeleteDialogProps = {
+  teamId?: number;
  token: Pick<ApiToken, 'id' | 'name'>;
  onDelete?: () => void;
  children?: React.ReactNode;
 };

-export default function TokenDeleteDialog({ token, onDelete, children }: TokenDeleteDialogProps) {
+export default function TokenDeleteDialog({
+  teamId,
+  token,
+  onDelete,
+  children,
+}: TokenDeleteDialogProps) {
  const { _ } = useLingui();
  const { toast } = useToast();

-  const team = useOptionalCurrentTeam();
-
  const [isOpen, setIsOpen] = useState(false);

  const deleteMessage = _(msg`delete ${token.name}`);
@@ -73,7 +75,7 @@ export default function TokenDeleteDialog({ token, onDelete, children }: TokenDe
    try {
      await deleteTokenMutation({
        id: token.id,
-        teamId: team?.id,
+        teamId,
      });

      toast({
--- a/apps/remix/app/components/dialogs/webhook-create-dialog.tsx
+++ b/apps/remix/app/components/dialogs/webhook-create-dialog.tsx
@@ -230,13 +230,14 @@ export const WebhookCreateDialog = ({ trigger, ...props }: WebhookCreateDialogPr
              />

              <DialogFooter>
-                <Button type="button" variant="secondary" onClick={() => setOpen(false)}>
-                  <Trans>Cancel</Trans>
-                </Button>
-
-                <Button type="submit" loading={form.formState.isSubmitting}>
-                  <Trans>Create</Trans>
-                </Button>
+                <div className="flex w-full flex-nowrap gap-4">
+                  <Button type="button" variant="secondary" onClick={() => setOpen(false)}>
+                    <Trans>Cancel</Trans>
+                  </Button>
+                  <Button type="submit" loading={form.formState.isSubmitting}>
+                    <Trans>Create</Trans>
+                  </Button>
+                </div>
              </DialogFooter>
            </fieldset>
          </form>
--- a/apps/remix/app/components/embed/embed-authentication-required.tsx
+++ b/apps/remix/app/components/embed/embed-authentication-required.tsx
@@ -8,17 +8,11 @@ import { BrandingLogo } from '~/components/general/branding-logo';
 export type EmbedAuthenticationRequiredProps = {
  email?: string;
  returnTo: string;
-  isGoogleSSOEnabled?: boolean;
-  isOIDCSSOEnabled?: boolean;
-  oidcProviderLabel?: string;
 };

 export const EmbedAuthenticationRequired = ({
  email,
  returnTo,
-  isGoogleSSOEnabled,
-  isOIDCSSOEnabled,
-  oidcProviderLabel,
 }: EmbedAuthenticationRequiredProps) => {
  return (
    <div className="flex min-h-[100dvh] w-full items-center justify-center">
@@ -34,14 +28,7 @@ export const EmbedAuthenticationRequired = ({
          </AlertDescription>
        </Alert>

-        <SignInForm
-          isGoogleSSOEnabled={isGoogleSSOEnabled}
-          isOIDCSSOEnabled={isOIDCSSOEnabled}
-          oidcProviderLabel={oidcProviderLabel}
-          className="mt-4"
-          initialEmail={email}
-          returnTo={returnTo}
-        />
+        <SignInForm className="mt-4" initialEmail={email} returnTo={returnTo} />
      </div>
    </div>
  );
--- a/apps/remix/app/components/embed/embed-direct-template-client-page.tsx
+++ b/apps/remix/app/components/embed/embed-direct-template-client-page.tsx
@@ -47,7 +47,7 @@ export type EmbedDirectTemplateClientPageProps = {
  fields: Field[];
  metadata?: DocumentMeta | TemplateMeta | null;
  hidePoweredBy?: boolean;
-  allowWhiteLabelling?: boolean;
+  isPlatformOrEnterprise?: boolean;
 };

 export const EmbedDirectTemplateClientPage = ({
@@ -58,7 +58,7 @@ export const EmbedDirectTemplateClientPage = ({
  fields,
  metadata,
  hidePoweredBy = false,
-  allowWhiteLabelling = false,
+  isPlatformOrEnterprise = false,
 }: EmbedDirectTemplateClientPageProps) => {
  const { _ } = useLingui();
  const { toast } = useToast();
@@ -286,7 +286,7 @@ export const EmbedDirectTemplateClientPage = ({
        document.documentElement.classList.add('dark-mode-disabled');
      }

-      if (allowWhiteLabelling) {
+      if (isPlatformOrEnterprise) {
        injectCss({
          css: data.css,
          cssVars: data.cssVars,
@@ -483,6 +483,7 @@ export const EmbedDirectTemplateClientPage = ({

        {/* Fields */}
        <EmbedDocumentFields
+          recipient={recipient}
          fields={localFields}
          metadata={metadata}
          onSignField={onSignField}
--- a/apps/remix/app/components/embed/embed-document-completed.tsx
+++ b/apps/remix/app/components/embed/embed-document-completed.tsx
@@ -12,7 +12,7 @@ export type EmbedDocumentCompletedPageProps = {
 export const EmbedDocumentCompleted = ({ name, signature }: EmbedDocumentCompletedPageProps) => {
  console.log({ signature });
  return (
-    <div className="embed--DocumentCompleted relative mx-auto flex min-h-[100dvh] max-w-screen-lg flex-col items-center justify-center p-6">
+    <div className="relative mx-auto flex min-h-[100dvh] max-w-screen-lg flex-col items-center justify-center p-6">
      <h3 className="text-foreground text-2xl font-semibold">
        <Trans>Document Completed!</Trans>
      </h3>
--- a/apps/remix/app/components/embed/embed-document-fields.tsx
+++ b/apps/remix/app/components/embed/embed-document-fields.tsx
@@ -1,4 +1,4 @@
-import type { DocumentMeta, TemplateMeta } from '@prisma/client';
+import type { DocumentMeta, Recipient, TemplateMeta } from '@prisma/client';
 import { type Field, FieldType } from '@prisma/client';
 import { match } from 'ts-pattern';

@@ -31,6 +31,7 @@ import { DocumentSigningSignatureField } from '~/components/general/document-sig
 import { DocumentSigningTextField } from '~/components/general/document-signing/document-signing-text-field';

 export type EmbedDocumentFieldsProps = {
+  recipient: Recipient;
  fields: Field[];
  metadata?: DocumentMeta | TemplateMeta | null;
  onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
@@ -38,6 +39,7 @@ export type EmbedDocumentFieldsProps = {
 };

 export const EmbedDocumentFields = ({
+  recipient,
  fields,
  metadata,
  onSignField,
@@ -51,6 +53,7 @@ export const EmbedDocumentFields = ({
            <DocumentSigningSignatureField
              key={field.id}
              field={field}
+              recipient={recipient}
              onSignField={onSignField}
              onUnsignField={onUnsignField}
              typedSignatureEnabled={metadata?.typedSignatureEnabled}
@@ -60,6 +63,7 @@ export const EmbedDocumentFields = ({
            <DocumentSigningInitialsField
              key={field.id}
              field={field}
+              recipient={recipient}
              onSignField={onSignField}
              onUnsignField={onUnsignField}
            />
@@ -68,6 +72,7 @@ export const EmbedDocumentFields = ({
            <DocumentSigningNameField
              key={field.id}
              field={field}
+              recipient={recipient}
              onSignField={onSignField}
              onUnsignField={onUnsignField}
            />
@@ -76,6 +81,7 @@ export const EmbedDocumentFields = ({
            <DocumentSigningDateField
              key={field.id}
              field={field}
+              recipient={recipient}
              onSignField={onSignField}
              onUnsignField={onUnsignField}
              dateFormat={metadata?.dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT}
@@ -86,6 +92,7 @@ export const EmbedDocumentFields = ({
            <DocumentSigningEmailField
              key={field.id}
              field={field}
+              recipient={recipient}
              onSignField={onSignField}
              onUnsignField={onUnsignField}
            />
@@ -100,6 +107,7 @@ export const EmbedDocumentFields = ({
              <DocumentSigningTextField
                key={field.id}
                field={fieldWithMeta}
+                recipient={recipient}
                onSignField={onSignField}
                onUnsignField={onUnsignField}
              />
@@ -115,6 +123,7 @@ export const EmbedDocumentFields = ({
              <DocumentSigningNumberField
                key={field.id}
                field={fieldWithMeta}
+                recipient={recipient}
                onSignField={onSignField}
                onUnsignField={onUnsignField}
              />
@@ -130,6 +139,7 @@ export const EmbedDocumentFields = ({
              <DocumentSigningRadioField
                key={field.id}
                field={fieldWithMeta}
+                recipient={recipient}
                onSignField={onSignField}
                onUnsignField={onUnsignField}
              />
@@ -145,6 +155,7 @@ export const EmbedDocumentFields = ({
              <DocumentSigningCheckboxField
                key={field.id}
                field={fieldWithMeta}
+                recipient={recipient}
                onSignField={onSignField}
                onUnsignField={onUnsignField}
              />
@@ -160,6 +171,7 @@ export const EmbedDocumentFields = ({
              <DocumentSigningDropdownField
                key={field.id}
                field={fieldWithMeta}
+                recipient={recipient}
                onSignField={onSignField}
                onUnsignField={onUnsignField}
              />
--- a/apps/remix/app/components/embed/embed-document-rejected.tsx
+++ b/apps/remix/app/components/embed/embed-document-rejected.tsx
@@ -1,33 +0,0 @@
-import { Trans } from '@lingui/react/macro';
-import { XCircle } from 'lucide-react';
-
-export const EmbedDocumentRejected = () => {
-  return (
-    <div className="embed--DocumentRejected relative mx-auto flex min-h-[100dvh] max-w-screen-lg flex-col items-center justify-center p-6">
-      <div className="flex flex-col items-center">
-        <div className="flex items-center gap-x-4">
-          <XCircle className="text-destructive h-10 w-10" />
-
-          <h2 className="max-w-[35ch] text-center text-2xl font-semibold leading-normal md:text-3xl lg:text-4xl">
-            <Trans>Document Rejected</Trans>
-          </h2>
-        </div>
-
-        <div className="text-destructive mt-4 flex items-center text-center text-sm">
-          <Trans>You have rejected this document</Trans>
-        </div>
-
-        <p className="text-muted-foreground mt-6 max-w-[60ch] text-center text-sm">
-          <Trans>
-            The document owner has been notified of your decision. They may contact you with further
-            instructions if necessary.
-          </Trans>
-        </p>
-
-        <p className="text-muted-foreground mt-2 max-w-[60ch] text-center text-sm">
-          <Trans>No further action is required from you at this time.</Trans>
-        </p>
-      </div>
-    </div>
-  );
-};
--- a/apps/remix/app/components/embed/embed-document-signing-page.tsx
+++ b/apps/remix/app/components/embed/embed-document-signing-page.tsx
@@ -1,22 +1,15 @@
-import { useEffect, useId, useLayoutEffect, useState } from 'react';
+import { useEffect, useLayoutEffect, useState } from 'react';

 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
-import type { DocumentMeta, TemplateMeta } from '@prisma/client';
-import {
-  type DocumentData,
-  type Field,
-  FieldType,
-  RecipientRole,
-  SigningStatus,
-} from '@prisma/client';
+import type { DocumentMeta, Recipient, TemplateMeta } from '@prisma/client';
+import { type DocumentData, type Field, FieldType } from '@prisma/client';
 import { LucideChevronDown, LucideChevronUp } from 'lucide-react';

 import { useThrottleFn } from '@documenso/lib/client-only/hooks/use-throttle-fn';
 import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
 import { validateFieldsInserted } from '@documenso/lib/utils/fields';
-import type { RecipientWithFields } from '@documenso/prisma/types/recipient-with-fields';
 import { trpc } from '@documenso/trpc/react';
 import { FieldToolTip } from '@documenso/ui/components/field/field-tooltip';
 import { Button } from '@documenso/ui/primitives/button';
@@ -25,7 +18,6 @@ import { ElementVisible } from '@documenso/ui/primitives/element-visible';
 import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
 import { LazyPDFViewer } from '@documenso/ui/primitives/lazy-pdf-viewer';
-import { RadioGroup, RadioGroupItem } from '@documenso/ui/primitives/radio-group';
 import { SignaturePad } from '@documenso/ui/primitives/signature-pad';
 import { useToast } from '@documenso/ui/primitives/use-toast';

@@ -34,24 +26,20 @@ import { injectCss } from '~/utils/css-vars';

 import { ZSignDocumentEmbedDataSchema } from '../../types/embed-document-sign-schema';
 import { useRequiredDocumentSigningContext } from '../general/document-signing/document-signing-provider';
-import { DocumentSigningRecipientProvider } from '../general/document-signing/document-signing-recipient-provider';
-import { DocumentSigningRejectDialog } from '../general/document-signing/document-signing-reject-dialog';
 import { EmbedClientLoading } from './embed-client-loading';
 import { EmbedDocumentCompleted } from './embed-document-completed';
 import { EmbedDocumentFields } from './embed-document-fields';
-import { EmbedDocumentRejected } from './embed-document-rejected';

 export type EmbedSignDocumentClientPageProps = {
  token: string;
  documentId: number;
  documentData: DocumentData;
-  recipient: RecipientWithFields;
+  recipient: Recipient;
  fields: Field[];
  metadata?: DocumentMeta | TemplateMeta | null;
  isCompleted?: boolean;
  hidePoweredBy?: boolean;
-  allowWhitelabelling?: boolean;
-  allRecipients?: RecipientWithFields[];
+  isPlatformOrEnterprise?: boolean;
 };

 export const EmbedSignDocumentClientPage = ({
@@ -63,8 +51,7 @@ export const EmbedSignDocumentClientPage = ({
  metadata,
  isCompleted,
  hidePoweredBy = false,
-  allowWhitelabelling = false,
-  allRecipients = [],
+  isPlatformOrEnterprise = false,
 }: EmbedSignDocumentClientPageProps) => {
  const { _ } = useLingui();
  const { toast } = useToast();
@@ -82,26 +69,17 @@ export const EmbedSignDocumentClientPage = ({
  const [hasFinishedInit, setHasFinishedInit] = useState(false);
  const [hasDocumentLoaded, setHasDocumentLoaded] = useState(false);
  const [hasCompletedDocument, setHasCompletedDocument] = useState(isCompleted);
-  const [hasRejectedDocument, setHasRejectedDocument] = useState(
-    recipient.signingStatus === SigningStatus.REJECTED,
-  );
-  const [selectedSignerId, setSelectedSignerId] = useState<number | null>(
-    allRecipients.length > 0 ? allRecipients[0].id : null,
-  );

  const [isExpanded, setIsExpanded] = useState(false);
+
  const [isNameLocked, setIsNameLocked] = useState(false);
+
  const [showPendingFieldTooltip, setShowPendingFieldTooltip] = useState(false);

-  const [allowDocumentRejection, setAllowDocumentRejection] = useState(false);
-
-  const selectedSigner = allRecipients.find((r) => r.id === selectedSignerId);
-  const isAssistantMode = recipient.role === RecipientRole.ASSISTANT;
-
  const [throttledOnCompleteClick, isThrottled] = useThrottleFn(() => void onCompleteClick(), 500);

  const [pendingFields, _completedFields] = [
-    fields.filter((field) => field.recipientId === recipient.id && !field.inserted),
+    fields.filter((field) => !field.inserted),
    fields.filter((field) => field.inserted),
  ];

@@ -110,8 +88,6 @@ export const EmbedSignDocumentClientPage = ({

  const hasSignatureField = fields.some((field) => field.type === FieldType.SIGNATURE);

-  const assistantSignersId = useId();
-
  const onNextFieldClick = () => {
    validateFieldsInserted(fields);

@@ -173,25 +149,6 @@ export const EmbedSignDocumentClientPage = ({
    }
  };

-  const onDocumentRejected = (reason: string) => {
-    if (window.parent) {
-      window.parent.postMessage(
-        {
-          action: 'document-rejected',
-          data: {
-            token,
-            documentId,
-            recipientId: recipient.id,
-            reason,
-          },
-        },
-        '*',
-      );
-    }
-
-    setHasRejectedDocument(true);
-  };
-
  useLayoutEffect(() => {
    const hash = window.location.hash.slice(1);

@@ -205,13 +162,12 @@ export const EmbedSignDocumentClientPage = ({
      // Since a recipient can be provided a name we can lock it without requiring
      // a to be provided by the parent application, unlike direct templates.
      setIsNameLocked(!!data.lockName);
-      setAllowDocumentRejection(!!data.allowDocumentRejection);

      if (data.darkModeDisabled) {
        document.documentElement.classList.add('dark-mode-disabled');
      }

-      if (allowWhitelabelling) {
+      if (isPlatformOrEnterprise) {
        injectCss({
          css: data.css,
          cssVars: data.cssVars,
@@ -240,10 +196,6 @@ export const EmbedSignDocumentClientPage = ({
    }
  }, [hasFinishedInit, hasDocumentLoaded]);

-  if (hasRejectedDocument) {
-    return <EmbedDocumentRejected />;
-  }
-
  if (hasCompletedDocument) {
    return (
      <EmbedDocumentCompleted
@@ -261,244 +213,164 @@ export const EmbedSignDocumentClientPage = ({
  }

  return (
-    <DocumentSigningRecipientProvider recipient={recipient} targetSigner={selectedSigner ?? null}>
-      <div className="embed--Root relative mx-auto flex min-h-[100dvh] max-w-screen-lg flex-col items-center justify-center p-6">
-        {(!hasFinishedInit || !hasDocumentLoaded) && <EmbedClientLoading />}
+    <div className="relative mx-auto flex min-h-[100dvh] max-w-screen-lg flex-col items-center justify-center p-6">
+      {(!hasFinishedInit || !hasDocumentLoaded) && <EmbedClientLoading />}

-        {allowDocumentRejection && (
-          <div className="embed--Actions mb-4 flex w-full flex-row-reverse items-baseline justify-between">
-            <DocumentSigningRejectDialog
-              document={{ id: documentId }}
-              token={token}
-              onRejected={onDocumentRejected}
-            />
-          </div>
-        )}
-
-        <div className="embed--DocumentContainer relative flex w-full flex-col gap-x-6 gap-y-12 md:flex-row">
-          {/* Viewer */}
-          <div className="embed--DocumentViewer flex-1">
-            <LazyPDFViewer
-              documentData={documentData}
-              onDocumentLoad={() => setHasDocumentLoaded(true)}
-            />
-          </div>
-
-          {/* Widget */}
-          <div
-            key={isExpanded ? 'expanded' : 'collapsed'}
-            className="embed--DocumentWidgetContainer group/document-widget fixed bottom-8 left-0 z-50 h-fit w-full flex-shrink-0 px-6 md:sticky md:top-4 md:z-auto md:w-[350px] md:px-0"
-            data-expanded={isExpanded || undefined}
-          >
-            <div className="embed--DocumentWidget border-border bg-widget flex w-full flex-col rounded-xl border px-4 py-4 md:py-6">
-              {/* Header */}
-              <div className="embed--DocumentWidgetHeader">
-                <div className="flex items-center justify-between gap-x-2">
-                  <h3 className="text-foreground text-xl font-semibold md:text-2xl">
-                    {isAssistantMode ? (
-                      <Trans>Assist with signing</Trans>
-                    ) : (
-                      <Trans>Sign document</Trans>
-                    )}
-                  </h3>
-
-                  <Button variant="outline" className="h-8 w-8 p-0 md:hidden">
-                    {isExpanded ? (
-                      <LucideChevronDown
-                        className="text-muted-foreground h-5 w-5"
-                        onClick={() => setIsExpanded(false)}
-                      />
-                    ) : (
-                      <LucideChevronUp
-                        className="text-muted-foreground h-5 w-5"
-                        onClick={() => setIsExpanded(true)}
-                      />
-                    )}
-                  </Button>
-                </div>
-              </div>
-
-              <div className="embed--DocumentWidgetContent hidden group-data-[expanded]/document-widget:block md:block">
-                <p className="text-muted-foreground mt-2 text-sm">
-                  {isAssistantMode ? (
-                    <Trans>Help complete the document for other signers.</Trans>
-                  ) : (
-                    <Trans>Sign the document to complete the process.</Trans>
-                  )}
-                </p>
-
-                <hr className="border-border mb-8 mt-4" />
-              </div>
-
-              {/* Form */}
-              <div className="embed--DocumentWidgetForm -mx-2 hidden px-2 group-data-[expanded]/document-widget:block md:block">
-                <div className="flex flex-1 flex-col gap-y-4">
-                  {isAssistantMode && (
-                    <div>
-                      <Label>
-                        <Trans>Signing for</Trans>
-                      </Label>
-
-                      <fieldset className="dark:bg-background border-border mt-2 rounded-2xl border bg-white p-3">
-                        <RadioGroup
-                          className="gap-0 space-y-3 shadow-none"
-                          value={selectedSignerId?.toString()}
-                          onValueChange={(value) => setSelectedSignerId(Number(value))}
-                        >
-                          {allRecipients
-                            .filter((r) => r.fields.length > 0)
-                            .map((r) => (
-                              <div
-                                key={`${assistantSignersId}-${r.id}`}
-                                className="bg-widget border-border relative flex flex-col gap-4 rounded-lg border p-4"
-                              >
-                                <div className="flex items-center justify-between">
-                                  <div className="flex items-center gap-3">
-                                    <RadioGroupItem
-                                      id={`${assistantSignersId}-${r.id}`}
-                                      value={r.id.toString()}
-                                      className="after:absolute after:inset-0"
-                                    />
-
-                                    <div className="grid grow gap-1">
-                                      <Label
-                                        className="inline-flex items-start"
-                                        htmlFor={`${assistantSignersId}-${r.id}`}
-                                      >
-                                        {r.name}
-
-                                        {r.id === recipient.id && (
-                                          <span className="text-muted-foreground ml-2">
-                                            {_(msg`(You)`)}
-                                          </span>
-                                        )}
-                                      </Label>
-                                      <p className="text-muted-foreground text-xs">{r.email}</p>
-                                    </div>
-                                  </div>
-                                  <div className="text-muted-foreground text-xs leading-[inherit]">
-                                    {r.fields.length} {r.fields.length === 1 ? 'field' : 'fields'}
-                                  </div>
-                                </div>
-                              </div>
-                            ))}
-                        </RadioGroup>
-                      </fieldset>
-                    </div>
-                  )}
-
-                  {!isAssistantMode && (
-                    <>
-                      <div>
-                        <Label htmlFor="full-name">
-                          <Trans>Full Name</Trans>
-                        </Label>
-
-                        <Input
-                          type="text"
-                          id="full-name"
-                          className="bg-background mt-2"
-                          disabled={isNameLocked}
-                          value={fullName}
-                          onChange={(e) => !isNameLocked && setFullName(e.target.value)}
-                        />
-                      </div>
-
-                      <div>
-                        <Label htmlFor="email">
-                          <Trans>Email</Trans>
-                        </Label>
-
-                        <Input
-                          type="email"
-                          id="email"
-                          className="bg-background mt-2"
-                          value={email}
-                          disabled
-                        />
-                      </div>
-
-                      <div>
-                        <Label htmlFor="Signature">
-                          <Trans>Signature</Trans>
-                        </Label>
-
-                        <Card className="mt-2" gradient degrees={-120}>
-                          <CardContent className="p-0">
-                            <SignaturePad
-                              className="h-44 w-full"
-                              disabled={isThrottled || isSubmitting}
-                              defaultValue={signature ?? undefined}
-                              onChange={(value) => {
-                                setSignature(value);
-                              }}
-                              onValidityChange={(isValid) => {
-                                setSignatureValid(isValid);
-                              }}
-                              allowTypedSignature={Boolean(
-                                metadata &&
-                                  'typedSignatureEnabled' in metadata &&
-                                  metadata.typedSignatureEnabled,
-                              )}
-                            />
-                          </CardContent>
-                        </Card>
-
-                        {hasSignatureField && !signatureValid && (
-                          <div className="text-destructive mt-2 text-sm">
-                            <Trans>
-                              Signature is too small. Please provide a more complete signature.
-                            </Trans>
-                          </div>
-                        )}
-                      </div>
-                    </>
-                  )}
-                </div>
-              </div>
-
-              <div className="hidden flex-1 group-data-[expanded]/document-widget:block md:block" />
-
-              <div className="embed--DocumentWidgetFooter mt-4 hidden w-full grid-cols-2 items-center group-data-[expanded]/document-widget:grid md:grid">
-                {pendingFields.length > 0 ? (
-                  <Button className="col-start-2" onClick={() => onNextFieldClick()}>
-                    <Trans>Next</Trans>
-                  </Button>
-                ) : (
-                  <Button
-                    className={allowDocumentRejection ? 'col-start-2' : 'col-span-2'}
-                    disabled={
-                      isThrottled || (!isAssistantMode && hasSignatureField && !signatureValid)
-                    }
-                    loading={isSubmitting}
-                    onClick={() => throttledOnCompleteClick()}
-                  >
-                    <Trans>Complete</Trans>
-                  </Button>
-                )}
-              </div>
-            </div>
-          </div>
-
-          <ElementVisible target={PDF_VIEWER_PAGE_SELECTOR}>
-            {showPendingFieldTooltip && pendingFields.length > 0 && (
-              <FieldToolTip key={pendingFields[0].id} field={pendingFields[0]} color="warning">
-                <Trans>Click to insert field</Trans>
-              </FieldToolTip>
-            )}
-          </ElementVisible>
-
-          {/* Fields */}
-          <EmbedDocumentFields fields={fields} metadata={metadata} />
+      <div className="relative flex w-full flex-col gap-x-6 gap-y-12 md:flex-row">
+        {/* Viewer */}
+        <div className="flex-1">
+          <LazyPDFViewer
+            documentData={documentData}
+            onDocumentLoad={() => setHasDocumentLoaded(true)}
+          />
        </div>

-        {!hidePoweredBy && (
-          <div className="bg-primary text-primary-foreground fixed bottom-0 left-0 z-40 rounded-tr px-2 py-1 text-xs font-medium opacity-60 hover:opacity-100">
-            <span>Powered by</span>
-            <BrandingLogo className="ml-2 inline-block h-[14px]" />
+        {/* Widget */}
+        <div
+          key={isExpanded ? 'expanded' : 'collapsed'}
+          className="group/document-widget fixed bottom-8 left-0 z-50 h-fit w-full flex-shrink-0 px-6 md:sticky md:top-4 md:z-auto md:w-[350px] md:px-0"
+          data-expanded={isExpanded || undefined}
+        >
+          <div className="border-border bg-widget flex w-full flex-col rounded-xl border px-4 py-4 md:py-6">
+            {/* Header */}
+            <div>
+              <div className="flex items-center justify-between gap-x-2">
+                <h3 className="text-foreground text-xl font-semibold md:text-2xl">
+                  <Trans>Sign document</Trans>
+                </h3>
+
+                <Button variant="outline" className="h-8 w-8 p-0 md:hidden">
+                  {isExpanded ? (
+                    <LucideChevronDown
+                      className="text-muted-foreground h-5 w-5"
+                      onClick={() => setIsExpanded(false)}
+                    />
+                  ) : (
+                    <LucideChevronUp
+                      className="text-muted-foreground h-5 w-5"
+                      onClick={() => setIsExpanded(true)}
+                    />
+                  )}
+                </Button>
+              </div>
+            </div>
+
+            <div className="hidden group-data-[expanded]/document-widget:block md:block">
+              <p className="text-muted-foreground mt-2 text-sm">
+                <Trans>Sign the document to complete the process.</Trans>
+              </p>
+
+              <hr className="border-border mb-8 mt-4" />
+            </div>
+
+            {/* Form */}
+            <div className="-mx-2 hidden px-2 group-data-[expanded]/document-widget:block md:block">
+              <div className="flex flex-1 flex-col gap-y-4">
+                <div>
+                  <Label htmlFor="full-name">
+                    <Trans>Full Name</Trans>
+                  </Label>
+
+                  <Input
+                    type="text"
+                    id="full-name"
+                    className="bg-background mt-2"
+                    disabled={isNameLocked}
+                    value={fullName}
+                    onChange={(e) => !isNameLocked && setFullName(e.target.value)}
+                  />
+                </div>
+
+                <div>
+                  <Label htmlFor="email">
+                    <Trans>Email</Trans>
+                  </Label>
+
+                  <Input
+                    type="email"
+                    id="email"
+                    className="bg-background mt-2"
+                    value={email}
+                    disabled
+                  />
+                </div>
+
+                <div>
+                  <Label htmlFor="Signature">
+                    <Trans>Signature</Trans>
+                  </Label>
+
+                  <Card className="mt-2" gradient degrees={-120}>
+                    <CardContent className="p-0">
+                      <SignaturePad
+                        className="h-44 w-full"
+                        disabled={isThrottled || isSubmitting}
+                        defaultValue={signature ?? undefined}
+                        onChange={(value) => {
+                          setSignature(value);
+                        }}
+                        onValidityChange={(isValid) => {
+                          setSignatureValid(isValid);
+                        }}
+                        allowTypedSignature={Boolean(
+                          metadata &&
+                            'typedSignatureEnabled' in metadata &&
+                            metadata.typedSignatureEnabled,
+                        )}
+                      />
+                    </CardContent>
+                  </Card>
+
+                  {hasSignatureField && !signatureValid && (
+                    <div className="text-destructive mt-2 text-sm">
+                      <Trans>
+                        Signature is too small. Please provide a more complete signature.
+                      </Trans>
+                    </div>
+                  )}
+                </div>
+              </div>
+            </div>
+
+            <div className="hidden flex-1 group-data-[expanded]/document-widget:block md:block" />
+
+            <div className="mt-4 hidden w-full grid-cols-2 items-center group-data-[expanded]/document-widget:grid md:grid">
+              {pendingFields.length > 0 ? (
+                <Button className="col-start-2" onClick={() => onNextFieldClick()}>
+                  <Trans>Next</Trans>
+                </Button>
+              ) : (
+                <Button
+                  className="col-start-2"
+                  disabled={isThrottled || (hasSignatureField && !signatureValid)}
+                  loading={isSubmitting}
+                  onClick={() => throttledOnCompleteClick()}
+                >
+                  <Trans>Complete</Trans>
+                </Button>
+              )}
+            </div>
          </div>
-        )}
+        </div>
+
+        <ElementVisible target={PDF_VIEWER_PAGE_SELECTOR}>
+          {showPendingFieldTooltip && pendingFields.length > 0 && (
+            <FieldToolTip key={pendingFields[0].id} field={pendingFields[0]} color="warning">
+              <Trans>Click to insert field</Trans>
+            </FieldToolTip>
+          )}
+        </ElementVisible>
+
+        {/* Fields */}
+        <EmbedDocumentFields recipient={recipient} fields={fields} metadata={metadata} />
      </div>
-    </DocumentSigningRecipientProvider>
+
+      {!hidePoweredBy && (
+        <div className="bg-primary text-primary-foreground fixed bottom-0 left-0 z-40 rounded-tr px-2 py-1 text-xs font-medium opacity-60 hover:opacity-100">
+          <span>Powered by</span>
+          <BrandingLogo className="ml-2 inline-block h-[14px]" />
+        </div>
+      )}
+    </div>
  );
 };
--- a/apps/remix/app/components/embed/embed-document-waiting-for-turn.tsx
+++ b/apps/remix/app/components/embed/embed-document-waiting-for-turn.tsx
@@ -1,46 +0,0 @@
-import { useEffect, useState } from 'react';
-
-import { Trans } from '@lingui/react/macro';
-
-export const EmbedDocumentWaitingForTurn = () => {
-  const [hasPostedMessage, setHasPostedMessage] = useState(false);
-
-  useEffect(() => {
-    if (window.parent && !hasPostedMessage) {
-      window.parent.postMessage(
-        {
-          action: 'document-waiting-for-turn',
-          data: null,
-        },
-        '*',
-      );
-    }
-
-    setHasPostedMessage(true);
-  }, [hasPostedMessage]);
-
-  if (!hasPostedMessage) {
-    return null;
-  }
-
-  return (
-    <div className="embed--WaitingForTurn relative mx-auto flex min-h-[100dvh] max-w-screen-lg flex-col items-center justify-center p-6">
-      <h3 className="text-foreground text-center text-2xl font-bold">
-        <Trans>Waiting for Your Turn</Trans>
-      </h3>
-
-      <div className="mt-8 max-w-[50ch] text-center">
-        <p className="text-muted-foreground text-sm">
-          <Trans>
-            It's currently not your turn to sign. Please check back soon as this document should be
-            available for you to sign shortly.
-          </Trans>
-        </p>
-
-        <p className="text-muted-foreground mt-4 text-sm">
-          <Trans>Please check with the parent application for more information.</Trans>
-        </p>
-      </div>
-    </div>
-  );
-};
--- a/apps/remix/app/components/forms/2fa/disable-authenticator-app-dialog.tsx
+++ b/apps/remix/app/components/forms/2fa/disable-authenticator-app-dialog.tsx
@@ -9,7 +9,7 @@ import { useForm } from 'react-hook-form';
 import { useRevalidator } from 'react-router';
 import { z } from 'zod';

-import { authClient } from '@documenso/auth/client';
+import { trpc } from '@documenso/trpc/react';
 import { Button } from '@documenso/ui/primitives/button';
 import {
  Dialog,
@@ -47,6 +47,8 @@ export const DisableAuthenticatorAppDialog = () => {
  const [isOpen, setIsOpen] = useState(false);
  const [twoFactorDisableMethod, setTwoFactorDisableMethod] = useState<'totp' | 'backup'>('totp');

+  const { mutateAsync: disable2FA } = trpc.twoFactorAuthentication.disable.useMutation();
+
  const disable2FAForm = useForm<TDisable2FAForm>({
    defaultValues: {
      totpCode: '',
@@ -79,7 +81,7 @@ export const DisableAuthenticatorAppDialog = () => {

  const onDisable2FAFormSubmit = async ({ totpCode, backupCode }: TDisable2FAForm) => {
    try {
-      await authClient.twoFactor.disable({ totpCode, backupCode });
+      await disable2FA({ totpCode, backupCode });

      toast({
        title: _(msg`Two-factor authentication disabled`),
--- a/apps/remix/app/components/forms/2fa/enable-authenticator-app-dialog.tsx
+++ b/apps/remix/app/components/forms/2fa/enable-authenticator-app-dialog.tsx
@@ -9,8 +9,8 @@ import { useRevalidator } from 'react-router';
 import { renderSVG } from 'uqr';
 import { z } from 'zod';

-import { authClient } from '@documenso/auth/client';
 import { downloadFile } from '@documenso/lib/client-only/download-file';
+import { trpc } from '@documenso/trpc/react';
 import { Button } from '@documenso/ui/primitives/button';
 import {
  Dialog,
@@ -52,8 +52,24 @@ export const EnableAuthenticatorAppDialog = ({ onSuccess }: EnableAuthenticatorA

  const [isOpen, setIsOpen] = useState(false);
  const [recoveryCodes, setRecoveryCodes] = useState<string[] | null>(null);
-  const [isSettingUp2FA, setIsSettingUp2FA] = useState(false);
-  const [setup2FAData, setSetup2FAData] = useState<{ uri: string; secret: string } | null>(null);
+
+  const { mutateAsync: enable2FA } = trpc.twoFactorAuthentication.enable.useMutation();
+
+  const {
+    mutateAsync: setup2FA,
+    data: setup2FAData,
+    isPending: isSettingUp2FA,
+  } = trpc.twoFactorAuthentication.setup.useMutation({
+    onError: () => {
+      toast({
+        title: _(msg`Unable to setup two-factor authentication`),
+        description: _(
+          msg`We were unable to setup two-factor authentication for your account. Please ensure that you have entered your code correctly and try again.`,
+        ),
+        variant: 'destructive',
+      });
+    },
+  });

  const enable2FAForm = useForm<TEnable2FAForm>({
    defaultValues: {
@@ -64,34 +80,9 @@ export const EnableAuthenticatorAppDialog = ({ onSuccess }: EnableAuthenticatorA

  const { isSubmitting: isEnabling2FA } = enable2FAForm.formState;

-  const setup2FA = async () => {
-    if (isSettingUp2FA) {
-      return;
-    }
-
-    setIsSettingUp2FA(true);
-    setSetup2FAData(null);
-
-    try {
-      const data = await authClient.twoFactor.setup();
-
-      setSetup2FAData(data);
-    } catch (err) {
-      toast({
-        title: _(msg`Unable to setup two-factor authentication`),
-        description: _(
-          msg`We were unable to setup two-factor authentication for your account. Please ensure that you have entered your code correctly and try again.`,
-        ),
-        variant: 'destructive',
-      });
-    }
-
-    setIsSettingUp2FA(false);
-  };
-
  const onEnable2FAFormSubmit = async ({ token }: TEnable2FAForm) => {
    try {
-      const data = await authClient.twoFactor.enable({ code: token });
+      const data = await enable2FA({ code: token });

      setRecoveryCodes(data.recoveryCodes);
      onSuccess?.();
--- a/apps/remix/app/components/forms/2fa/view-recovery-codes-dialog.tsx
+++ b/apps/remix/app/components/forms/2fa/view-recovery-codes-dialog.tsx
@@ -6,9 +6,9 @@ import { useForm } from 'react-hook-form';
 import { match } from 'ts-pattern';
 import { z } from 'zod';

-import { authClient } from '@documenso/auth/client';
 import { downloadFile } from '@documenso/lib/client-only/download-file';
 import { AppError } from '@documenso/lib/errors/app-error';
+import { trpc } from '@documenso/trpc/react';
 import { Alert, AlertDescription } from '@documenso/ui/primitives/alert';
 import { Button } from '@documenso/ui/primitives/button';
 import {
@@ -41,32 +41,20 @@ export type TViewRecoveryCodesForm = z.infer<typeof ZViewRecoveryCodesForm>;
 export const ViewRecoveryCodesDialog = () => {
  const [isOpen, setIsOpen] = useState(false);

-  const [recoveryCodes, setRecoveryCodes] = useState<string[] | null>(null);
-  const [error, setError] = useState<string | null>(null);
+  const {
+    data: recoveryCodes,
+    mutate,
+    isPending,
+    error,
+  } = trpc.twoFactorAuthentication.viewRecoveryCodes.useMutation();

-  const form = useForm<TViewRecoveryCodesForm>({
+  const viewRecoveryCodesForm = useForm<TViewRecoveryCodesForm>({
    defaultValues: {
      token: '',
    },
    resolver: zodResolver(ZViewRecoveryCodesForm),
  });

-  const onFormSubmit = async ({ token }: TViewRecoveryCodesForm) => {
-    setError(null);
-
-    try {
-      const data = await authClient.twoFactor.viewRecoveryCodes({
-        token,
-      });
-
-      setRecoveryCodes(data.backupCodes);
-    } catch (err) {
-      const error = AppError.parseError(err);
-
-      setError(error.code);
-    }
-  };
-
  const downloadRecoveryCodes = () => {
    if (recoveryCodes) {
      const blob = new Blob([recoveryCodes.join('\n')], {
@@ -118,8 +106,8 @@ export const ViewRecoveryCodesDialog = () => {
            </DialogFooter>
          </div>
        ) : (
-          <Form {...form}>
-            <form onSubmit={form.handleSubmit(onFormSubmit)}>
+          <Form {...viewRecoveryCodesForm}>
+            <form onSubmit={viewRecoveryCodesForm.handleSubmit((value) => mutate(value))}>
              <DialogHeader className="mb-4">
                <DialogTitle>
                  <Trans>View Recovery Codes</Trans>
@@ -130,10 +118,10 @@ export const ViewRecoveryCodesDialog = () => {
                </DialogDescription>
              </DialogHeader>

-              <fieldset className="flex flex-col space-y-4" disabled={form.formState.isSubmitting}>
+              <fieldset className="flex flex-col space-y-4" disabled={isPending}>
                <FormField
                  name="token"
-                  control={form.control}
+                  control={viewRecoveryCodesForm.control}
                  render={({ field }) => (
                    <FormItem>
                      <FormControl>
@@ -173,7 +161,7 @@ export const ViewRecoveryCodesDialog = () => {
                    </Button>
                  </DialogClose>

-                  <Button type="submit" loading={form.formState.isSubmitting}>
+                  <Button type="submit" loading={isPending}>
                    <Trans>View</Trans>
                  </Button>
                </DialogFooter>
--- a/apps/remix/app/components/forms/avatar-image.tsx
+++ b/apps/remix/app/components/forms/avatar-image.tsx
@@ -42,7 +42,7 @@ export type AvatarImageFormProps = {
 };

 export const AvatarImageForm = ({ className }: AvatarImageFormProps) => {
-  const { user, refreshSession } = useSession();
+  const { user } = useSession();
  const { _ } = useLingui();
  const { toast } = useToast();
  const { revalidate } = useRevalidator();
@@ -103,13 +103,13 @@ export const AvatarImageForm = ({ className }: AvatarImageFormProps) => {
        teamId: team?.id,
      });

-      await refreshSession();
-
      toast({
        title: _(msg`Avatar Updated`),
        description: _(msg`Your avatar has been updated successfully.`),
        duration: 5000,
      });
+
+      void revalidate();
    } catch (err) {
      const error = AppError.parseError(err);

--- a/apps/remix/app/components/forms/password.tsx
+++ b/apps/remix/app/components/forms/password.tsx
@@ -122,7 +122,7 @@ export const PasswordForm = ({ className }: PasswordFormProps) => {
            render={({ field }) => (
              <FormItem>
                <FormLabel>
-                  <Trans>New Password</Trans>
+                  <Trans>Password</Trans>
                </FormLabel>
                <FormControl>
                  <PasswordInput autoComplete="new-password" {...field} />
--- a/apps/remix/app/components/forms/profile.tsx
+++ b/apps/remix/app/components/forms/profile.tsx
@@ -3,6 +3,7 @@ import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { useForm } from 'react-hook-form';
+import { useRevalidator } from 'react-router';
 import { z } from 'zod';

 import { useSession } from '@documenso/lib/client-only/providers/session';
@@ -41,7 +42,8 @@ export type ProfileFormProps = {
 export const ProfileForm = ({ className }: ProfileFormProps) => {
  const { _ } = useLingui();
  const { toast } = useToast();
-  const { user, refreshSession } = useSession();
+  const { user } = useSession();
+  const { revalidate } = useRevalidator();

  const form = useForm<TProfileFormSchema>({
    values: {
@@ -62,13 +64,13 @@ export const ProfileForm = ({ className }: ProfileFormProps) => {
        signature,
      });

-      await refreshSession();
-
      toast({
        title: _(msg`Profile updated`),
        description: _(msg`Your profile has been updated successfully.`),
        duration: 5000,
      });
+
+      await revalidate();
    } catch (err) {
      toast({
        title: _(msg`An unknown error occurred`),
--- a/apps/remix/app/components/forms/public-profile-claim-dialog.tsx
+++ b/apps/remix/app/components/forms/public-profile-claim-dialog.tsx
@@ -0,0 +1,197 @@
+import React, { useState } from 'react';
+
+import { zodResolver } from '@hookform/resolvers/zod';
+import { msg } from '@lingui/core/macro';
+import { useLingui } from '@lingui/react';
+import type { User } from '@prisma/client';
+import { useForm } from 'react-hook-form';
+import { z } from 'zod';
+
+import profileClaimTeaserImage from '@documenso/assets/images/profile-claim-teaser.png';
+import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
+import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
+import { trpc } from '@documenso/trpc/react';
+import { cn } from '@documenso/ui/lib/utils';
+import { Button } from '@documenso/ui/primitives/button';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+} from '@documenso/ui/primitives/dialog';
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '@documenso/ui/primitives/form/form';
+import { Input } from '@documenso/ui/primitives/input';
+import { useToast } from '@documenso/ui/primitives/use-toast';
+
+import { UserProfileSkeleton } from '../general/user-profile-skeleton';
+
+export const ZClaimPublicProfileFormSchema = z.object({
+  url: z
+    .string()
+    .trim()
+    .toLowerCase()
+    .min(1, { message: 'Please enter a valid username.' })
+    .regex(/^[a-z0-9-]+$/, {
+      message: 'Username can only container alphanumeric characters and dashes.',
+    }),
+});
+
+export type TClaimPublicProfileFormSchema = z.infer<typeof ZClaimPublicProfileFormSchema>;
+
+export type ClaimPublicProfileDialogFormProps = {
+  open: boolean;
+  onOpenChange?: (open: boolean) => void;
+  onClaimed?: () => void;
+  user: User;
+};
+
+export const ClaimPublicProfileDialogForm = ({
+  open,
+  onOpenChange,
+  onClaimed,
+  user,
+}: ClaimPublicProfileDialogFormProps) => {
+  const { _ } = useLingui();
+  const { toast } = useToast();
+
+  const [claimed, setClaimed] = useState(false);
+
+  const baseUrl = new URL(NEXT_PUBLIC_WEBAPP_URL() ?? 'http://localhost:3000');
+
+  const form = useForm<TClaimPublicProfileFormSchema>({
+    values: {
+      url: user.url || '',
+    },
+    resolver: zodResolver(ZClaimPublicProfileFormSchema),
+  });
+
+  const { mutateAsync: updatePublicProfile } = trpc.profile.updatePublicProfile.useMutation();
+
+  const isSubmitting = form.formState.isSubmitting;
+
+  const onFormSubmit = async ({ url }: TClaimPublicProfileFormSchema) => {
+    try {
+      await updatePublicProfile({
+        url,
+      });
+
+      setClaimed(true);
+      onClaimed?.();
+    } catch (err) {
+      const error = AppError.parseError(err);
+
+      if (error.code === 'PROFILE_URL_TAKEN') {
+        form.setError('url', {
+          type: 'manual',
+          message: _(msg`This username is already taken`),
+        });
+      } else if (error.code === 'PREMIUM_PROFILE_URL') {
+        form.setError('url', {
+          type: 'manual',
+          message: error.message,
+        });
+      } else if (error.code !== AppErrorCode.UNKNOWN_ERROR) {
+        toast({
+          title: 'An error occurred',
+          description: error.userMessage ?? error.message,
+          variant: 'destructive',
+        });
+      } else {
+        toast({
+          title: _(msg`An unknown error occurred`),
+          description: _(
+            msg`We encountered an unknown error while attempting to save your details. Please try again later.`,
+          ),
+          variant: 'destructive',
+        });
+      }
+    }
+  };
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent position="center" className="max-w-lg overflow-hidden">
+        {!claimed && (
+          <>
+            <DialogHeader>
+              <DialogTitle className="font-semi-bold text-center text-xl">
+                Introducing public profiles!
+              </DialogTitle>
+
+              <DialogDescription className="text-center">
+                Reserve your Documenso public profile username
+              </DialogDescription>
+            </DialogHeader>
+
+            <img src={profileClaimTeaserImage} alt="profile claim teaser" />
+
+            <Form {...form}>
+              <form
+                className={cn(
+                  'to-background -mt-32 flex w-full flex-col bg-gradient-to-b from-transparent to-15% pt-16 md:-mt-44',
+                )}
+                onSubmit={form.handleSubmit(onFormSubmit)}
+              >
+                <fieldset className="-mt-6 flex w-full flex-col gap-y-4" disabled={isSubmitting}>
+                  <FormField
+                    control={form.control}
+                    name="url"
+                    render={({ field }) => (
+                      <FormItem>
+                        <FormLabel>Public profile username</FormLabel>
+
+                        <FormControl>
+                          <Input type="text" className="mb-2 mt-2" {...field} />
+                        </FormControl>
+
+                        <FormMessage />
+
+                        <div className="bg-muted/50 text-muted-foreground mt-2 inline-block max-w-[29rem] truncate rounded-md px-2 py-1 text-sm lowercase">
+                          {baseUrl.host}/u/{field.value || '<username>'}
+                        </div>
+                      </FormItem>
+                    )}
+                  />
+                </fieldset>
+
+                <div className="mt-4 text-center">
+                  <Button type="submit" loading={isSubmitting}>
+                    Claim your username
+                  </Button>
+                </div>
+              </form>
+            </Form>
+          </>
+        )}
+
+        {claimed && (
+          <>
+            <DialogHeader>
+              <DialogTitle className="font-semi-bold text-center text-xl">All set!</DialogTitle>
+
+              <DialogDescription className="text-center">
+                We will let you know as soon as this features is launched
+              </DialogDescription>
+            </DialogHeader>
+
+            <UserProfileSkeleton className="mt-4" user={user} rows={1} />
+
+            <div className="to-background -mt-12 flex w-full flex-col items-center bg-gradient-to-b from-transparent to-15% px-4 pt-8 md:-mt-12">
+              <Button className="w-full" onClick={() => onOpenChange?.(false)}>
+                Can't wait!
+              </Button>
+            </div>
+          </>
+        )}
+      </DialogContent>
+    </Dialog>
+  );
+};
--- a/apps/remix/app/components/forms/signin.tsx
+++ b/apps/remix/app/components/forms/signin.tsx
@@ -257,9 +257,7 @@ export const SignInForm = ({

  const onSignInWithGoogleClick = async () => {
    try {
-      await authClient.google.signIn({
-        redirectPath,
-      });
+      await authClient.google.signIn();
    } catch (err) {
      toast({
        title: _(msg`An unknown error occurred`),
@@ -273,9 +271,11 @@ export const SignInForm = ({

  const onSignInWithOIDCClick = async () => {
    try {
-      await authClient.oidc.signIn({
-        redirectPath,
-      });
+      // eslint-disable-next-line no-promise-executor-return
+      await new Promise((resolve) => setTimeout(resolve, 2000));
+      // await signIn('oidc', {
+      //   callbackUrl,
+      // });
    } catch (err) {
      toast({
        title: _(msg`An unknown error occurred`),
--- a/apps/remix/app/components/forms/signup.tsx
+++ b/apps/remix/app/components/forms/signup.tsx
@@ -36,6 +36,8 @@ import { useToast } from '@documenso/ui/primitives/use-toast';
 import { UserProfileSkeleton } from '~/components/general/user-profile-skeleton';
 import { UserProfileTimur } from '~/components/general/user-profile-timur';

+const SIGN_UP_REDIRECT_PATH = '/documents';
+
 type SignUpStep = 'BASIC_DETAILS' | 'CLAIM_USERNAME';

 export const ZSignUpFormSchema = z
@@ -189,7 +191,9 @@ export const SignUpForm = ({

  const onSignUpWithOIDCClick = async () => {
    try {
-      await authClient.oidc.signIn();
+      // eslint-disable-next-line no-promise-executor-return
+      await new Promise((resolve) => setTimeout(resolve, 2000));
+      // await signIn('oidc', { callbackUrl: SIGN_UP_REDIRECT_PATH });
    } catch (err) {
      toast({
        title: _(msg`An unknown error occurred`),
--- a/apps/remix/app/components/forms/token.tsx
+++ b/apps/remix/app/components/forms/token.tsx
@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useState, useTransition } from 'react';

 import { zodResolver } from '@hookform/resolvers/zod';
 import { msg } from '@lingui/core/macro';
@@ -38,8 +38,6 @@ import {
 import { Switch } from '@documenso/ui/primitives/switch';
 import { useToast } from '@documenso/ui/primitives/use-toast';

-import { useOptionalCurrentTeam } from '~/providers/team';
-
 export const EXPIRATION_DATES = {
  ONE_WEEK: msg`7 days`,
  ONE_MONTH: msg`1 month`,
@@ -61,13 +59,14 @@ type NewlyCreatedToken = {

 export type ApiTokenFormProps = {
  className?: string;
+  teamId?: number;
  tokens?: Pick<ApiToken, 'id'>[];
 };

-export const ApiTokenForm = ({ className, tokens }: ApiTokenFormProps) => {
-  const [, copy] = useCopyToClipboard();
+export const ApiTokenForm = ({ className, teamId, tokens }: ApiTokenFormProps) => {
+  const [isTransitionPending, startTransition] = useTransition();

-  const team = useOptionalCurrentTeam();
+  const [, copy] = useCopyToClipboard();

  const { _ } = useLingui();
  const { toast } = useToast();
@@ -114,7 +113,7 @@ export const ApiTokenForm = ({ className, tokens }: ApiTokenFormProps) => {
  const onSubmit = async ({ tokenName, expirationDate }: TCreateTokenMutationSchema) => {
    try {
      await createTokenMutation({
-        teamId: team?.id,
+        teamId,
        tokenName,
        expirationDate: noExpirationDate ? null : expirationDate,
      });
@@ -239,7 +238,7 @@ export const ApiTokenForm = ({ className, tokens }: ApiTokenFormProps) => {
              type="submit"
              className="hidden md:inline-flex"
              disabled={!form.formState.isDirty}
-              loading={form.formState.isSubmitting}
+              loading={form.formState.isSubmitting || isTransitionPending}
            >
              <Trans>Create token</Trans>
            </Button>
@@ -248,7 +247,7 @@ export const ApiTokenForm = ({ className, tokens }: ApiTokenFormProps) => {
              <Button
                type="submit"
                disabled={!form.formState.isDirty}
-                loading={form.formState.isSubmitting}
+                loading={form.formState.isSubmitting || isTransitionPending}
              >
                <Trans>Create token</Trans>
              </Button>
--- a/apps/remix/app/components/general/app-command-menu.tsx
+++ b/apps/remix/app/components/general/app-command-menu.tsx
@@ -80,7 +80,7 @@ export function AppCommandMenu({ open, onOpenChange }: AppCommandMenuProps) {
  const [search, setSearch] = useState('');
  const [pages, setPages] = useState<string[]>([]);

-  const { data: searchDocumentsData, isPending: isSearchingDocuments } =
+  const { data: searchDocumentsData, isLoading: isSearchingDocuments } =
    trpcReact.document.searchDocuments.useQuery(
      {
        query: search,
--- a/apps/remix/app/components/general/billing-plans.tsx
+++ b/apps/remix/app/components/general/billing-plans.tsx
@@ -1,138 +0,0 @@
-import { useState } from 'react';
-
-import type { MessageDescriptor } from '@lingui/core';
-import { msg } from '@lingui/core/macro';
-import { useLingui } from '@lingui/react';
-import { Trans } from '@lingui/react/macro';
-import { AnimatePresence, motion } from 'framer-motion';
-
-import type { PriceIntervals } from '@documenso/ee/server-only/stripe/get-prices-by-interval';
-import { useIsMounted } from '@documenso/lib/client-only/hooks/use-is-mounted';
-import { toHumanPrice } from '@documenso/lib/universal/stripe/to-human-price';
-import { trpc } from '@documenso/trpc/react';
-import { Button } from '@documenso/ui/primitives/button';
-import { Card, CardContent, CardTitle } from '@documenso/ui/primitives/card';
-import { Tabs, TabsList, TabsTrigger } from '@documenso/ui/primitives/tabs';
-import { useToast } from '@documenso/ui/primitives/use-toast';
-
-type Interval = keyof PriceIntervals;
-
-const INTERVALS: Interval[] = ['day', 'week', 'month', 'year'];
-
-// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-const isInterval = (value: unknown): value is Interval => INTERVALS.includes(value as Interval);
-
-const FRIENDLY_INTERVALS: Record<Interval, MessageDescriptor> = {
-  day: msg`Daily`,
-  week: msg`Weekly`,
-  month: msg`Monthly`,
-  year: msg`Yearly`,
-};
-
-const MotionCard = motion(Card);
-
-export type BillingPlansProps = {
-  prices: PriceIntervals;
-};
-
-export const BillingPlans = ({ prices }: BillingPlansProps) => {
-  const { _ } = useLingui();
-  const { toast } = useToast();
-
-  const isMounted = useIsMounted();
-
-  const [interval, setInterval] = useState<Interval>('month');
-  const [checkoutSessionPriceId, setCheckoutSessionPriceId] = useState<string | null>(null);
-
-  const { mutateAsync: createCheckoutSession } = trpc.profile.createCheckoutSession.useMutation();
-
-  const onSubscribeClick = async (priceId: string) => {
-    try {
-      setCheckoutSessionPriceId(priceId);
-
-      const url = await createCheckoutSession({ priceId });
-
-      if (!url) {
-        throw new Error('Unable to create session');
-      }
-
-      window.open(url);
-    } catch (_err) {
-      toast({
-        title: _(msg`Something went wrong`),
-        description: _(msg`An error occurred while trying to create a checkout session.`),
-        variant: 'destructive',
-      });
-    } finally {
-      setCheckoutSessionPriceId(null);
-    }
-  };
-
-  return (
-    <div>
-      <Tabs value={interval} onValueChange={(value) => isInterval(value) && setInterval(value)}>
-        <TabsList>
-          {INTERVALS.map(
-            (interval) =>
-              prices[interval].length > 0 && (
-                <TabsTrigger key={interval} className="min-w-[150px]" value={interval}>
-                  {_(FRIENDLY_INTERVALS[interval])}
-                </TabsTrigger>
-              ),
-          )}
-        </TabsList>
-      </Tabs>
-
-      <div className="mt-8 grid gap-8 lg:grid-cols-2 2xl:grid-cols-3">
-        <AnimatePresence mode="wait">
-          {prices[interval].map((price) => (
-            <MotionCard
-              key={price.id}
-              initial={{ opacity: isMounted ? 0 : 1, y: isMounted ? 20 : 0 }}
-              animate={{ opacity: 1, y: 0, transition: { duration: 0.3 } }}
-              exit={{ opacity: 0, transition: { duration: 0.3 } }}
-            >
-              <CardContent className="flex h-full flex-col p-6">
-                <CardTitle>{price.product.name}</CardTitle>
-
-                <div className="text-muted-foreground mt-2 text-lg font-medium">
-                  ${toHumanPrice(price.unit_amount ?? 0)} {price.currency.toUpperCase()}{' '}
-                  <span className="text-xs">per {interval}</span>
-                </div>
-
-                <div className="text-muted-foreground mt-1.5 text-sm">
-                  {price.product.description}
-                </div>
-
-                {price.product.features && price.product.features.length > 0 && (
-                  <div className="text-muted-foreground mt-4">
-                    <div className="text-sm font-medium">Includes:</div>
-
-                    <ul className="mt-1 divide-y text-sm">
-                      {price.product.features.map((feature, index) => (
-                        <li key={index} className="py-2">
-                          {feature.name}
-                        </li>
-                      ))}
-                    </ul>
-                  </div>
-                )}
-
-                <div className="flex-1" />
-
-                <Button
-                  className="mt-4"
-                  disabled={checkoutSessionPriceId !== null}
-                  loading={checkoutSessionPriceId === price.id}
-                  onClick={() => void onSubscribeClick(price.id)}
-                >
-                  <Trans>Subscribe</Trans>
-                </Button>
-              </CardContent>
-            </MotionCard>
-          ))}
-        </AnimatePresence>
-      </div>
-    </div>
-  );
-};
--- a/apps/remix/app/components/general/billing-portal-button.tsx
+++ b/apps/remix/app/components/general/billing-portal-button.tsx
@@ -1,48 +0,0 @@
-import { msg } from '@lingui/core/macro';
-import { useLingui } from '@lingui/react';
-import { Trans } from '@lingui/react/macro';
-
-import { trpc } from '@documenso/trpc/react';
-import { Button } from '@documenso/ui/primitives/button';
-import { useToast } from '@documenso/ui/primitives/use-toast';
-
-export type BillingPortalButtonProps = {
-  buttonProps?: React.ComponentProps<typeof Button>;
-  children?: React.ReactNode;
-};
-
-export const BillingPortalButton = ({ buttonProps, children }: BillingPortalButtonProps) => {
-  const { _ } = useLingui();
-  const { toast } = useToast();
-
-  const { mutateAsync: createBillingPortal, isPending } =
-    trpc.profile.createBillingPortal.useMutation({
-      onSuccess: (sessionUrl) => {
-        window.open(sessionUrl, '_blank');
-      },
-      onError: (err) => {
-        let description = _(
-          msg`We are unable to proceed to the billing portal at this time. Please try again, or contact support.`,
-        );
-
-        if (err.message === 'CUSTOMER_NOT_FOUND') {
-          description = _(
-            msg`You do not currently have a customer record, this should not happen. Please contact support for assistance.`,
-          );
-        }
-
-        toast({
-          title: _(msg`Something went wrong`),
-          description,
-          variant: 'destructive',
-          duration: 10000,
-        });
-      },
-    });
-
-  return (
-    <Button {...buttonProps} onClick={async () => createBillingPortal()} loading={isPending}>
-      {children || <Trans>Manage Subscription</Trans>}
-    </Button>
-  );
-};
--- a/apps/remix/app/components/general/direct-template/direct-template-configure-form.tsx
+++ b/apps/remix/app/components/general/direct-template/direct-template-configure-form.tsx
@@ -56,8 +56,7 @@ export const DirectTemplateConfigureForm = ({
 }: DirectTemplateConfigureFormProps) => {
  const { _ } = useLingui();

-  const { sessionData } = useOptionalSession();
-  const user = sessionData?.user;
+  const { user } = useOptionalSession();

  const { recipients } = template;
  const { derivedRecipientAccessAuth } = useRequiredDocumentSigningAuthContext();
--- a/apps/remix/app/components/general/direct-template/direct-template-signing-form.tsx
+++ b/apps/remix/app/components/general/direct-template/direct-template-signing-form.tsx
@@ -51,8 +51,6 @@ import { DocumentSigningRadioField } from '~/components/general/document-signing
 import { DocumentSigningSignatureField } from '~/components/general/document-signing/document-signing-signature-field';
 import { DocumentSigningTextField } from '~/components/general/document-signing/document-signing-text-field';

-import { DocumentSigningRecipientProvider } from '../document-signing/document-signing-recipient-provider';
-
 export type DirectTemplateSigningFormProps = {
  flowStep: DocumentFlowStep;
  directRecipient: Recipient;
@@ -171,7 +169,7 @@ export const DirectTemplateSigningForm = ({
  };

  return (
-    <DocumentSigningRecipientProvider recipient={directRecipient}>
+    <>
      <DocumentFlowFormContainerHeader title={flowStep.title} description={flowStep.description} />

      <DocumentFlowFormContainerContent>
@@ -188,15 +186,16 @@ export const DirectTemplateSigningForm = ({
                <DocumentSigningSignatureField
                  key={field.id}
                  field={field}
+                  recipient={directRecipient}
                  onSignField={onSignField}
                  onUnsignField={onUnsignField}
-                  typedSignatureEnabled={template.templateMeta?.typedSignatureEnabled}
                />
              ))
              .with(FieldType.INITIALS, () => (
                <DocumentSigningInitialsField
                  key={field.id}
                  field={field}
+                  recipient={directRecipient}
                  onSignField={onSignField}
                  onUnsignField={onUnsignField}
                />
@@ -205,6 +204,7 @@ export const DirectTemplateSigningForm = ({
                <DocumentSigningNameField
                  key={field.id}
                  field={field}
+                  recipient={directRecipient}
                  onSignField={onSignField}
                  onUnsignField={onUnsignField}
                />
@@ -213,6 +213,7 @@ export const DirectTemplateSigningForm = ({
                <DocumentSigningDateField
                  key={field.id}
                  field={field}
+                  recipient={directRecipient}
                  dateFormat={template.templateMeta?.dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT}
                  timezone={template.templateMeta?.timezone ?? DEFAULT_DOCUMENT_TIME_ZONE}
                  onSignField={onSignField}
@@ -223,6 +224,7 @@ export const DirectTemplateSigningForm = ({
                <DocumentSigningEmailField
                  key={field.id}
                  field={field}
+                  recipient={directRecipient}
                  onSignField={onSignField}
                  onUnsignField={onUnsignField}
                />
@@ -239,6 +241,7 @@ export const DirectTemplateSigningForm = ({
                      ...field,
                      fieldMeta: parsedFieldMeta,
                    }}
+                    recipient={directRecipient}
                    onSignField={onSignField}
                    onUnsignField={onUnsignField}
                  />
@@ -256,6 +259,7 @@ export const DirectTemplateSigningForm = ({
                      ...field,
                      fieldMeta: parsedFieldMeta,
                    }}
+                    recipient={directRecipient}
                    onSignField={onSignField}
                    onUnsignField={onUnsignField}
                  />
@@ -273,6 +277,7 @@ export const DirectTemplateSigningForm = ({
                      ...field,
                      fieldMeta: parsedFieldMeta,
                    }}
+                    recipient={directRecipient}
                    onSignField={onSignField}
                    onUnsignField={onUnsignField}
                  />
@@ -290,6 +295,7 @@ export const DirectTemplateSigningForm = ({
                      ...field,
                      fieldMeta: parsedFieldMeta,
                    }}
+                    recipient={directRecipient}
                    onSignField={onSignField}
                    onUnsignField={onUnsignField}
                  />
@@ -307,6 +313,7 @@ export const DirectTemplateSigningForm = ({
                      ...field,
                      fieldMeta: parsedFieldMeta,
                    }}
+                    recipient={directRecipient}
                    onSignField={onSignField}
                    onUnsignField={onUnsignField}
                  />
@@ -344,7 +351,6 @@ export const DirectTemplateSigningForm = ({
                    onChange={(value) => {
                      setSignature(value);
                    }}
-                    allowTypedSignature={template.templateMeta?.typedSignatureEnabled}
                  />
                </CardContent>
              </Card>
@@ -377,6 +383,6 @@ export const DirectTemplateSigningForm = ({
          />
        </div>
      </DocumentFlowFormContainerFooter>
-    </DocumentSigningRecipientProvider>
+    </>
  );
 };
--- a/apps/remix/app/components/general/document-signing/document-signing-checkbox-field.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-checkbox-field.tsx
@@ -2,6 +2,7 @@ import { useEffect, useMemo, useState } from 'react';

 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
+import type { Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';

@@ -24,16 +25,17 @@ import { useToast } from '@documenso/ui/primitives/use-toast';

 import { useRequiredDocumentSigningAuthContext } from './document-signing-auth-provider';
 import { DocumentSigningFieldContainer } from './document-signing-field-container';
-import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';

 export type DocumentSigningCheckboxFieldProps = {
  field: FieldWithSignatureAndFieldMeta;
+  recipient: Recipient;
  onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
  onUnsignField?: (value: TRemovedSignedFieldWithTokenMutationSchema) => Promise<void> | void;
 };

 export const DocumentSigningCheckboxField = ({
  field,
+  recipient,
  onSignField,
  onUnsignField,
 }: DocumentSigningCheckboxFieldProps) => {
@@ -41,8 +43,6 @@ export const DocumentSigningCheckboxField = ({
  const { toast } = useToast();
  const { revalidate } = useRevalidator();

-  const { recipient, isAssistantMode } = useDocumentSigningRecipientContext();
-
  const { executeActionAuthProcedure } = useRequiredDocumentSigningAuthContext();

  const parsedFieldMeta = ZCheckboxFieldMeta.parse(field.fieldMeta);
@@ -52,19 +52,12 @@ export const DocumentSigningCheckboxField = ({
    value: item.value.length > 0 ? item.value : `empty-value-${item.id}`,
  }));

-  const parsedCheckedValues = useMemo(
-    () => fromCheckboxValue(field.customText),
-    [field.customText],
-  );
-
  const [checkedValues, setCheckedValues] = useState(
-    field.inserted && parsedCheckedValues.length > 0
-      ? parsedCheckedValues
-      : values
-          ?.map((item) =>
-            item.checked ? (item.value.length > 0 ? item.value : `empty-value-${item.id}`) : '',
-          )
-          .filter(Boolean) || [],
+    values
+      ?.map((item) =>
+        item.checked ? (item.value.length > 0 ? item.value : `empty-value-${item.id}`) : '',
+      )
+      .filter(Boolean) || [],
  );

  const isReadOnly = parsedFieldMeta.readOnly;
@@ -125,9 +118,7 @@ export const DocumentSigningCheckboxField = ({

      toast({
        title: _(msg`Error`),
-        description: isAssistantMode
-          ? _(msg`An error occurred while signing as assistant.`)
-          : _(msg`An error occurred while signing the document.`),
+        description: _(msg`An error occurred while signing the document.`),
        variant: 'destructive',
      });
    }
@@ -156,7 +147,7 @@ export const DocumentSigningCheckboxField = ({

      toast({
        title: _(msg`Error`),
-        description: _(msg`An error occurred while removing the field.`),
+        description: _(msg`An error occurred while removing the signature.`),
        variant: 'destructive',
      });
    }
@@ -179,28 +170,37 @@ export const DocumentSigningCheckboxField = ({
    let updatedValues: string[] = [];

    try {
-      const itemValue = item.value.length > 0 ? item.value : `empty-value-${item.id}`;
-      const isChecked = checkedValues.includes(itemValue);
+      const isChecked = checkedValues.includes(
+        item.value.length > 0 ? item.value : `empty-value-${item.id}`,
+      );

      if (!isChecked) {
-        updatedValues = [...checkedValues, itemValue];
-      } else {
-        updatedValues = checkedValues.filter((v) => v !== itemValue);
-      }
+        updatedValues = [
+          ...checkedValues,
+          item.value.length > 0 ? item.value : `empty-value-${item.id}`,
+        ];

-      setCheckedValues(updatedValues);
-
-      await removeSignedFieldWithToken({
-        token: recipient.token,
-        fieldId: field.id,
-      });
-
-      if (updatedValues.length > 0) {
-        await signFieldWithToken({
+        await removeSignedFieldWithToken({
+          token: recipient.token,
+          fieldId: field.id,
+        });
+
+        if (isLengthConditionMet) {
+          await signFieldWithToken({
+            token: recipient.token,
+            fieldId: field.id,
+            value: toCheckboxValue(checkedValues),
+            isBase64: true,
+          });
+        }
+      } else {
+        updatedValues = checkedValues.filter(
+          (v) => v !== item.value && v !== `empty-value-${item.id}`,
+        );
+
+        await removeSignedFieldWithToken({
          token: recipient.token,
          fieldId: field.id,
-          value: toCheckboxValue(updatedValues),
-          isBase64: true,
        });
      }
    } catch (err) {
@@ -212,16 +212,11 @@ export const DocumentSigningCheckboxField = ({
        variant: 'destructive',
      });
    } finally {
+      setCheckedValues(updatedValues);
      await revalidate();
    }
  };

-  useEffect(() => {
-    if (field.inserted && parsedCheckedValues.length > 0) {
-      setCheckedValues(parsedCheckedValues);
-    }
-  }, [field.inserted, parsedCheckedValues]);
-
  useEffect(() => {
    if (shouldAutoSignField) {
      void executeActionAuthProcedure({
@@ -231,6 +226,11 @@ export const DocumentSigningCheckboxField = ({
    }
  }, [checkedValues, isLengthConditionMet, field.inserted]);

+  const parsedCheckedValues = useMemo(
+    () => fromCheckboxValue(field.customText),
+    [field.customText],
+  );
+
  return (
    <DocumentSigningFieldContainer
      field={field}
@@ -254,17 +254,16 @@ export const DocumentSigningCheckboxField = ({
          <div className="z-50 flex flex-col gap-y-2">
            {values?.map((item: { id: number; value: string; checked: boolean }, index: number) => {
              const itemValue = item.value || `empty-value-${item.id}`;
-              const checkboxId = `checkbox-field-${field.id}-${index}`;

              return (
                <div key={index} className="flex items-center gap-x-1.5">
                  <Checkbox
                    className="h-4 w-4"
-                    id={checkboxId}
+                    id={`checkbox-${index}`}
                    checked={checkedValues.includes(itemValue)}
                    onCheckedChange={() => handleCheckboxChange(item.value, item.id)}
                  />
-                  <Label htmlFor={checkboxId}>
+                  <Label htmlFor={`checkbox-${index}`}>
                    {item.value.includes('empty-value-') ? '' : item.value}
                  </Label>
                </div>
@@ -275,21 +274,20 @@ export const DocumentSigningCheckboxField = ({
      )}

      {field.inserted && (
-        <div className="flex flex-col gap-y-2">
+        <div className="flex flex-col gap-y-1">
          {values?.map((item: { id: number; value: string; checked: boolean }, index: number) => {
            const itemValue = item.value || `empty-value-${item.id}`;
-            const checkboxId = `checkbox-field-${field.id}-${index}-inserted`;

            return (
              <div key={index} className="flex items-center gap-x-1.5">
                <Checkbox
-                  className="h-4 w-4"
-                  id={checkboxId}
-                  checked={checkedValues.includes(itemValue)}
+                  className="h-3 w-3"
+                  id={`checkbox-${index}`}
+                  checked={parsedCheckedValues.includes(itemValue)}
                  disabled={isLoading}
                  onCheckedChange={() => void handleCheckboxOptionClick(item)}
                />
-                <Label htmlFor={checkboxId}>
+                <Label htmlFor={`checkbox-${index}`} className="text-xs">
                  {item.value.includes('empty-value-') ? '' : item.value}
                </Label>
              </div>
--- a/apps/remix/app/components/general/document-signing/document-signing-date-field.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-date-field.tsx
@@ -1,6 +1,7 @@
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
+import type { Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';

@@ -12,21 +13,19 @@ import { DEFAULT_DOCUMENT_TIME_ZONE } from '@documenso/lib/constants/time-zones'
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
 import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
-import { ZDateFieldMeta } from '@documenso/lib/types/field-meta';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
 import type {
  TRemovedSignedFieldWithTokenMutationSchema,
  TSignFieldWithTokenMutationSchema,
 } from '@documenso/trpc/server/field-router/schema';
-import { cn } from '@documenso/ui/lib/utils';
 import { useToast } from '@documenso/ui/primitives/use-toast';

 import { DocumentSigningFieldContainer } from './document-signing-field-container';
-import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';

 export type DocumentSigningDateFieldProps = {
  field: FieldWithSignature;
+  recipient: Recipient;
  dateFormat?: string | null;
  timezone?: string | null;
  onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
@@ -35,6 +34,7 @@ export type DocumentSigningDateFieldProps = {

 export const DocumentSigningDateField = ({
  field,
+  recipient,
  dateFormat = DEFAULT_DOCUMENT_DATE_FORMAT,
  timezone = DEFAULT_DOCUMENT_TIME_ZONE,
  onSignField,
@@ -44,8 +44,6 @@ export const DocumentSigningDateField = ({
  const { toast } = useToast();
  const { revalidate } = useRevalidator();

-  const { recipient, isAssistantMode } = useDocumentSigningRecipientContext();
-
  const { mutateAsync: signFieldWithToken, isPending: isSignFieldWithTokenLoading } =
    trpc.field.signFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);

@@ -56,11 +54,10 @@ export const DocumentSigningDateField = ({

  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;

-  const safeFieldMeta = ZDateFieldMeta.safeParse(field.fieldMeta);
-  const parsedFieldMeta = safeFieldMeta.success ? safeFieldMeta.data : null;
-
  const localDateString = convertToLocalSystemFormat(field.customText, dateFormat, timezone);
+
  const isDifferentTime = field.inserted && localDateString !== field.customText;
+
  const tooltipText = _(
    msg`"${field.customText}" will appear on the document as it has a timezone of "${timezone || ''}".`,
  );
@@ -93,9 +90,7 @@ export const DocumentSigningDateField = ({

      toast({
        title: _(msg`Error`),
-        description: isAssistantMode
-          ? _(msg`An error occurred while signing as assistant.`)
-          : _(msg`An error occurred while signing the document.`),
+        description: _(msg`An error occurred while signing the document.`),
        variant: 'destructive',
      });
    }
@@ -121,7 +116,7 @@ export const DocumentSigningDateField = ({

      toast({
        title: _(msg`Error`),
-        description: _(msg`An error occurred while removing the field.`),
+        description: _(msg`An error occurred while removing the signature.`),
        variant: 'destructive',
      });
    }
@@ -148,21 +143,9 @@ export const DocumentSigningDateField = ({
      )}

      {field.inserted && (
-        <div className="flex h-full w-full items-center">
-          <p
-            className={cn(
-              'text-muted-foreground dark:text-background/80 w-full text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
-              {
-                'text-left': parsedFieldMeta?.textAlign === 'left',
-                'text-center':
-                  !parsedFieldMeta?.textAlign || parsedFieldMeta?.textAlign === 'center',
-                'text-right': parsedFieldMeta?.textAlign === 'right',
-              },
-            )}
-          >
-            {localDateString}
-          </p>
-        </div>
+        <p className="text-muted-foreground dark:text-background/80 text-[clamp(0.425rem,25cqw,0.825rem)] duration-200">
+          {localDateString}
+        </p>
      )}
    </DocumentSigningFieldContainer>
  );
--- a/apps/remix/app/components/general/document-signing/document-signing-dropdown-field.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-dropdown-field.tsx
@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react';

 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
+import type { Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';

@@ -27,16 +28,17 @@ import { useToast } from '@documenso/ui/primitives/use-toast';

 import { useRequiredDocumentSigningAuthContext } from './document-signing-auth-provider';
 import { DocumentSigningFieldContainer } from './document-signing-field-container';
-import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';

 export type DocumentSigningDropdownFieldProps = {
  field: FieldWithSignatureAndFieldMeta;
+  recipient: Recipient;
  onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
  onUnsignField?: (value: TRemovedSignedFieldWithTokenMutationSchema) => Promise<void> | void;
 };

 export const DocumentSigningDropdownField = ({
  field,
+  recipient,
  onSignField,
  onUnsignField,
 }: DocumentSigningDropdownFieldProps) => {
@@ -44,8 +46,6 @@ export const DocumentSigningDropdownField = ({
  const { toast } = useToast();
  const { revalidate } = useRevalidator();

-  const { recipient, isAssistantMode } = useDocumentSigningRecipientContext();
-
  const { executeActionAuthProcedure } = useRequiredDocumentSigningAuthContext();

  const parsedFieldMeta = ZDropdownFieldMeta.parse(field.fieldMeta);
@@ -99,9 +99,7 @@ export const DocumentSigningDropdownField = ({

      toast({
        title: _(msg`Error`),
-        description: isAssistantMode
-          ? _(msg`An error occurred while signing as assistant.`)
-          : _(msg`An error occurred while signing the document.`),
+        description: _(msg`An error occurred while signing the document.`),
        variant: 'destructive',
      });
    }
@@ -133,7 +131,7 @@ export const DocumentSigningDropdownField = ({

      toast({
        title: _(msg`Error`),
-        description: _(msg`An error occurred while removing the field.`),
+        description: _(msg`An error occurred while removing the signature.`),
        variant: 'destructive',
      });
    }
--- a/apps/remix/app/components/general/document-signing/document-signing-email-field.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-email-field.tsx
@@ -1,34 +1,34 @@
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
+import type { Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';

 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
 import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
-import { ZEmailFieldMeta } from '@documenso/lib/types/field-meta';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
 import type {
  TRemovedSignedFieldWithTokenMutationSchema,
  TSignFieldWithTokenMutationSchema,
 } from '@documenso/trpc/server/field-router/schema';
-import { cn } from '@documenso/ui/lib/utils';
 import { useToast } from '@documenso/ui/primitives/use-toast';

 import { DocumentSigningFieldContainer } from './document-signing-field-container';
 import { useRequiredDocumentSigningContext } from './document-signing-provider';
-import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';

 export type DocumentSigningEmailFieldProps = {
  field: FieldWithSignature;
+  recipient: Recipient;
  onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
  onUnsignField?: (value: TRemovedSignedFieldWithTokenMutationSchema) => Promise<void> | void;
 };

 export const DocumentSigningEmailField = ({
  field,
+  recipient,
  onSignField,
  onUnsignField,
 }: DocumentSigningEmailFieldProps) => {
@@ -38,8 +38,6 @@ export const DocumentSigningEmailField = ({

  const { email: providedEmail } = useRequiredDocumentSigningContext();

-  const { recipient, targetSigner, isAssistantMode } = useDocumentSigningRecipientContext();
-
  const { mutateAsync: signFieldWithToken, isPending: isSignFieldWithTokenLoading } =
    trpc.field.signFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);

@@ -50,9 +48,6 @@ export const DocumentSigningEmailField = ({

  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;

-  const safeFieldMeta = ZEmailFieldMeta.safeParse(field.fieldMeta);
-  const parsedFieldMeta = safeFieldMeta.success ? safeFieldMeta.data : null;
-
  const onSign = async (authOptions?: TRecipientActionAuth) => {
    try {
      const value = providedEmail ?? '';
@@ -84,9 +79,7 @@ export const DocumentSigningEmailField = ({

      toast({
        title: _(msg`Error`),
-        description: isAssistantMode
-          ? _(msg`An error occurred while signing as assistant.`)
-          : _(msg`An error occurred while signing the document.`),
+        description: _(msg`An error occurred while signing the document.`),
        variant: 'destructive',
      });
    }
@@ -112,7 +105,7 @@ export const DocumentSigningEmailField = ({

      toast({
        title: _(msg`Error`),
-        description: _(msg`An error occurred while removing the field.`),
+        description: _(msg`An error occurred while removing the signature.`),
        variant: 'destructive',
      });
    }
@@ -133,21 +126,9 @@ export const DocumentSigningEmailField = ({
      )}

      {field.inserted && (
-        <div className="flex h-full w-full items-center">
-          <p
-            className={cn(
-              'text-muted-foreground dark:text-background/80 w-full text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
-              {
-                'text-left': parsedFieldMeta?.textAlign === 'left',
-                'text-center':
-                  !parsedFieldMeta?.textAlign || parsedFieldMeta?.textAlign === 'center',
-                'text-right': parsedFieldMeta?.textAlign === 'right',
-              },
-            )}
-          >
-            {field.customText}
-          </p>
-        </div>
+        <p className="text-muted-foreground dark:text-background/80 text-[clamp(0.425rem,25cqw,0.825rem)] duration-200">
+          {field.customText}
+        </p>
      )}
    </DocumentSigningFieldContainer>
  );
--- a/apps/remix/app/components/general/document-signing/document-signing-field-container.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-field-container.tsx
@@ -44,7 +44,6 @@ export type DocumentSigningFieldContainerProps = {
    | 'Email'
    | 'Name'
    | 'Signature'
-    | 'Text'
    | 'Radio'
    | 'Dropdown'
    | 'Number'
--- a/apps/remix/app/components/general/document-signing/document-signing-form.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-form.tsx
@@ -1,10 +1,8 @@
-import { useId, useMemo, useState } from 'react';
+import { useMemo, useState } from 'react';

-import { msg } from '@lingui/core/macro';
-import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { type Field, FieldType, type Recipient, RecipientRole } from '@prisma/client';
-import { Controller, useForm } from 'react-hook-form';
+import { useForm } from 'react-hook-form';
 import { useNavigate } from 'react-router';

 import { useAnalytics } from '@documenso/lib/client-only/hooks/use-analytics';
@@ -13,7 +11,6 @@ import type { DocumentAndSender } from '@documenso/lib/server-only/document/get-
 import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import { isFieldUnsignedAndRequired } from '@documenso/lib/utils/advanced-fields-helpers';
 import { sortFieldsByPosition, validateFieldsInserted } from '@documenso/lib/utils/fields';
-import type { RecipientWithFields } from '@documenso/prisma/types/recipient-with-fields';
 import { trpc } from '@documenso/trpc/react';
 import { FieldToolTip } from '@documenso/ui/components/field/field-tooltip';
 import { cn } from '@documenso/ui/lib/utils';
@@ -21,11 +18,8 @@ import { Button } from '@documenso/ui/primitives/button';
 import { Card, CardContent } from '@documenso/ui/primitives/card';
 import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
-import { RadioGroup, RadioGroupItem } from '@documenso/ui/primitives/radio-group';
 import { SignaturePad } from '@documenso/ui/primitives/signature-pad';
-import { useToast } from '@documenso/ui/primitives/use-toast';

-import { AssistantConfirmationDialog } from '../../dialogs/assistant-confirmation-dialog';
 import { DocumentSigningCompleteDialog } from './document-signing-complete-dialog';
 import { useRequiredDocumentSigningContext } from './document-signing-provider';

@@ -35,8 +29,6 @@ export type DocumentSigningFormProps = {
  fields: Field[];
  redirectUrl?: string | null;
  isRecipientsTurn: boolean;
-  allRecipients?: RecipientWithFields[];
-  setSelectedSignerId?: (id: number | null) => void;
 };

 export const DocumentSigningForm = ({
@@ -45,36 +37,20 @@ export const DocumentSigningForm = ({
  fields,
  redirectUrl,
  isRecipientsTurn,
-  allRecipients = [],
-  setSelectedSignerId,
 }: DocumentSigningFormProps) => {
-  const { sessionData } = useOptionalSession();
-  const user = sessionData?.user;
-
-  const { _ } = useLingui();
-  const { toast } = useToast();
-
  const navigate = useNavigate();
  const analytics = useAnalytics();

-  const assistantSignersId = useId();
+  const { user } = useOptionalSession();

  const { fullName, signature, setFullName, setSignature, signatureValid, setSignatureValid } =
    useRequiredDocumentSigningContext();

  const [validateUninsertedFields, setValidateUninsertedFields] = useState(false);
-  const [isConfirmationDialogOpen, setIsConfirmationDialogOpen] = useState(false);
-  const [isAssistantSubmitting, setIsAssistantSubmitting] = useState(false);

  const { mutateAsync: completeDocumentWithToken } =
    trpc.recipient.completeDocumentWithToken.useMutation();

-  const assistantForm = useForm<{ selectedSignerId: number | undefined }>({
-    defaultValues: {
-      selectedSignerId: undefined,
-    },
-  });
-
  const { handleSubmit, formState } = useForm();

  // Keep the loading state going if successful since the redirect may take some time.
@@ -89,11 +65,7 @@ export const DocumentSigningForm = ({

  const uninsertedFields = useMemo(() => {
    return sortFieldsByPosition(fieldsRequiringValidation.filter((field) => !field.inserted));
-  }, [fieldsRequiringValidation]);
-
-  const uninsertedRecipientFields = useMemo(() => {
-    return fieldsRequiringValidation.filter((field) => field.recipientId === recipient.id);
-  }, [fieldsRequiringValidation, recipient]);
+  }, [fields]);

  const fieldsValidated = () => {
    setValidateUninsertedFields(true);
@@ -114,31 +86,12 @@ export const DocumentSigningForm = ({
    }

    await completeDocument();
-  };

-  const onAssistantFormSubmit = () => {
-    if (uninsertedRecipientFields.length > 0) {
-      return;
-    }
-
-    setIsConfirmationDialogOpen(true);
-  };
-
-  const handleAssistantConfirmDialogSubmit = async () => {
-    setIsAssistantSubmitting(true);
-
-    try {
-      await completeDocument();
-    } catch (err) {
-      toast({
-        title: 'Error',
-        description: 'An error occurred while completing the document. Please try again.',
-        variant: 'destructive',
-      });
-
-      setIsAssistantSubmitting(false);
-      setIsConfirmationDialogOpen(false);
-    }
+    // Reauth is currently not required for completing the document.
+    // await executeActionAuthProcedure({
+    //   onReauthFormSubmit: completeDocument,
+    //   actionTarget: 'DOCUMENT',
+    // });
  };

  const completeDocument = async (authOptions?: TRecipientActionAuth) => {
@@ -162,7 +115,7 @@ export const DocumentSigningForm = ({
  };

  return (
-    <div
+    <form
      className={cn(
        'dark:bg-background border-border bg-widget sticky flex h-full flex-col rounded-xl border px-4 py-6',
        {
@@ -170,6 +123,7 @@ export const DocumentSigningForm = ({
          'top-4 max-h-[min(68rem,calc(100vh-2rem))]': !user,
        },
      )}
+      onSubmit={handleSubmit(onFormSubmit)}
    >
      {validateUninsertedFields && uninsertedFields[0] && (
        <FieldToolTip key={uninsertedFields[0].id} field={uninsertedFields[0]} color="warning">
@@ -177,13 +131,17 @@ export const DocumentSigningForm = ({
        </FieldToolTip>
      )}

-      <div className="custom-scrollbar -mx-2 flex flex-1 flex-col overflow-y-auto overflow-x-hidden px-2">
-        <div className="flex flex-1 flex-col">
+      <fieldset
+        disabled={isSubmitting}
+        className={cn(
+          'custom-scrollbar -mx-2 flex flex-1 flex-col overflow-y-auto overflow-x-hidden px-2',
+        )}
+      >
+        <div className={cn('flex flex-1 flex-col')}>
          <h3 className="text-foreground text-2xl font-semibold">
            {recipient.role === RecipientRole.VIEWER && <Trans>View Document</Trans>}
            {recipient.role === RecipientRole.SIGNER && <Trans>Sign Document</Trans>}
            {recipient.role === RecipientRole.APPROVER && <Trans>Approve Document</Trans>}
-            {recipient.role === RecipientRole.ASSISTANT && <Trans>Assist Document</Trans>}
          </h3>

          {recipient.role === RecipientRole.VIEWER ? (
@@ -220,185 +178,91 @@ export const DocumentSigningForm = ({
                </div>
              </div>
            </>
-          ) : recipient.role === RecipientRole.ASSISTANT ? (
-            <>
-              <form onSubmit={assistantForm.handleSubmit(onAssistantFormSubmit)}>
-                <p className="text-muted-foreground mt-2 text-sm">
-                  <Trans>
-                    Complete the fields for the following signers. Once reviewed, they will inform
-                    you if any modifications are needed.
-                  </Trans>
-                </p>
-
-                <hr className="border-border my-4" />
-
-                <fieldset className="dark:bg-background border-border rounded-2xl border bg-white p-3">
-                  <Controller
-                    name="selectedSignerId"
-                    control={assistantForm.control}
-                    rules={{ required: 'Please select a signer' }}
-                    render={({ field }) => (
-                      <RadioGroup
-                        className="gap-0 space-y-3 shadow-none"
-                        value={field.value?.toString()}
-                        onValueChange={(value) => {
-                          field.onChange(value);
-                          setSelectedSignerId?.(Number(value));
-                        }}
-                      >
-                        {allRecipients
-                          .filter((r) => r.fields.length > 0)
-                          .map((r) => (
-                            <div
-                              key={`${assistantSignersId}-${r.id}`}
-                              className="bg-widget border-border relative flex flex-col gap-4 rounded-lg border p-4"
-                            >
-                              <div className="flex items-center justify-between">
-                                <div className="flex items-center gap-3">
-                                  <RadioGroupItem
-                                    id={`${assistantSignersId}-${r.id}`}
-                                    value={r.id.toString()}
-                                    className="after:absolute after:inset-0"
-                                  />
-
-                                  <div className="grid grow gap-1">
-                                    <Label
-                                      className="inline-flex items-start"
-                                      htmlFor={`${assistantSignersId}-${r.id}`}
-                                    >
-                                      {r.name}
-
-                                      {r.id === recipient.id && (
-                                        <span className="text-muted-foreground ml-2">
-                                          {_(msg`(You)`)}
-                                        </span>
-                                      )}
-                                    </Label>
-                                    <p className="text-muted-foreground text-xs">{r.email}</p>
-                                  </div>
-                                </div>
-                                <div className="text-muted-foreground text-xs leading-[inherit]">
-                                  {r.fields.length} {r.fields.length === 1 ? 'field' : 'fields'}
-                                </div>
-                              </div>
-                            </div>
-                          ))}
-                      </RadioGroup>
-                    )}
-                  />
-                </fieldset>
-
-                <div className="mt-6 flex flex-col gap-4 md:flex-row">
-                  <Button
-                    type="submit"
-                    className="w-full"
-                    size="lg"
-                    loading={isAssistantSubmitting}
-                    disabled={isAssistantSubmitting || uninsertedRecipientFields.length > 0}
-                  >
-                    {isAssistantSubmitting ? <Trans>Submitting...</Trans> : <Trans>Continue</Trans>}
-                  </Button>
-                </div>
-
-                <AssistantConfirmationDialog
-                  hasUninsertedFields={uninsertedFields.length > 0}
-                  isOpen={isConfirmationDialogOpen}
-                  onClose={() => !isAssistantSubmitting && setIsConfirmationDialogOpen(false)}
-                  onConfirm={handleAssistantConfirmDialogSubmit}
-                  isSubmitting={isAssistantSubmitting}
-                />
-              </form>
-            </>
          ) : (
            <>
-              <form onSubmit={handleSubmit(onFormSubmit)}>
-                <p className="text-muted-foreground mt-2 text-sm">
-                  <Trans>Please review the document before signing.</Trans>
-                </p>
+              <p className="text-muted-foreground mt-2 text-sm">
+                <Trans>Please review the document before signing.</Trans>
+              </p>

-                <hr className="border-border mb-8 mt-4" />
+              <hr className="border-border mb-8 mt-4" />

-                <fieldset
-                  disabled={isSubmitting}
-                  className="-mx-2 flex flex-1 flex-col gap-4 overflow-y-auto px-2"
-                >
-                  <div className="flex flex-1 flex-col gap-y-4">
-                    <div>
-                      <Label htmlFor="full-name">
-                        <Trans>Full Name</Trans>
-                      </Label>
+              <div className="-mx-2 flex flex-1 flex-col gap-4 overflow-y-auto px-2">
+                <div className="flex flex-1 flex-col gap-y-4">
+                  <div>
+                    <Label htmlFor="full-name">
+                      <Trans>Full Name</Trans>
+                    </Label>

-                      <Input
-                        type="text"
-                        id="full-name"
-                        className="bg-background mt-2"
-                        value={fullName}
-                        onChange={(e) => setFullName(e.target.value.trimStart())}
-                      />
-                    </div>
-
-                    <div>
-                      <Label htmlFor="Signature">
-                        <Trans>Signature</Trans>
-                      </Label>
-
-                      <Card className="mt-2" gradient degrees={-120}>
-                        <CardContent className="p-0">
-                          <SignaturePad
-                            className="h-44 w-full"
-                            disabled={isSubmitting}
-                            defaultValue={signature ?? undefined}
-                            onValidityChange={(isValid) => {
-                              setSignatureValid(isValid);
-                            }}
-                            onChange={(value) => {
-                              if (signatureValid) {
-                                setSignature(value);
-                              }
-                            }}
-                            allowTypedSignature={document.documentMeta?.typedSignatureEnabled}
-                          />
-                        </CardContent>
-                      </Card>
-
-                      {hasSignatureField && !signatureValid && (
-                        <div className="text-destructive mt-2 text-sm">
-                          <Trans>
-                            Signature is too small. Please provide a more complete signature.
-                          </Trans>
-                        </div>
-                      )}
-                    </div>
-                  </div>
-
-                  <div className="flex flex-col gap-4 md:flex-row">
-                    <Button
-                      type="button"
-                      className="dark:bg-muted dark:hover:bg-muted/80 w-full bg-black/5 hover:bg-black/10"
-                      variant="secondary"
-                      size="lg"
-                      disabled={typeof window !== 'undefined' && window.history.length <= 1}
-                      onClick={async () => navigate(-1)}
-                    >
-                      <Trans>Cancel</Trans>
-                    </Button>
-
-                    <DocumentSigningCompleteDialog
-                      isSubmitting={isSubmitting}
-                      onSignatureComplete={handleSubmit(onFormSubmit)}
-                      documentTitle={document.title}
-                      fields={fields}
-                      fieldsValidated={fieldsValidated}
-                      role={recipient.role}
-                      disabled={!isRecipientsTurn}
+                    <Input
+                      type="text"
+                      id="full-name"
+                      className="bg-background mt-2"
+                      value={fullName}
+                      onChange={(e) => setFullName(e.target.value.trimStart())}
                    />
                  </div>
-                </fieldset>
-              </form>
+
+                  <div>
+                    <Label htmlFor="Signature">
+                      <Trans>Signature</Trans>
+                    </Label>
+
+                    <Card className="mt-2" gradient degrees={-120}>
+                      <CardContent className="p-0">
+                        <SignaturePad
+                          className="h-44 w-full"
+                          disabled={isSubmitting}
+                          defaultValue={signature ?? undefined}
+                          onValidityChange={(isValid) => {
+                            setSignatureValid(isValid);
+                          }}
+                          onChange={(value) => {
+                            if (signatureValid) {
+                              setSignature(value);
+                            }
+                          }}
+                          allowTypedSignature={document.documentMeta?.typedSignatureEnabled}
+                        />
+                      </CardContent>
+                    </Card>
+
+                    {hasSignatureField && !signatureValid && (
+                      <div className="text-destructive mt-2 text-sm">
+                        <Trans>
+                          Signature is too small. Please provide a more complete signature.
+                        </Trans>
+                      </div>
+                    )}
+                  </div>
+                </div>
+
+                <div className="flex flex-col gap-4 md:flex-row">
+                  <Button
+                    type="button"
+                    className="dark:bg-muted dark:hover:bg-muted/80 w-full bg-black/5 hover:bg-black/10"
+                    variant="secondary"
+                    size="lg"
+                    disabled={typeof window !== 'undefined' && window.history.length <= 1}
+                    onClick={async () => navigate(-1)}
+                  >
+                    <Trans>Cancel</Trans>
+                  </Button>
+
+                  <DocumentSigningCompleteDialog
+                    isSubmitting={isSubmitting}
+                    onSignatureComplete={handleSubmit(onFormSubmit)}
+                    documentTitle={document.title}
+                    fields={fields}
+                    fieldsValidated={fieldsValidated}
+                    role={recipient.role}
+                    disabled={!isRecipientsTurn}
+                  />
+                </div>
+              </div>
            </>
          )}
        </div>
-      </div>
-    </div>
+      </fieldset>
+    </form>
  );
 };
--- a/apps/remix/app/components/general/document-signing/document-signing-initials-field.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-initials-field.tsx
@@ -1,6 +1,7 @@
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
+import type { Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';

@@ -18,16 +19,17 @@ import { useToast } from '@documenso/ui/primitives/use-toast';

 import { DocumentSigningFieldContainer } from './document-signing-field-container';
 import { useRequiredDocumentSigningContext } from './document-signing-provider';
-import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';

 export type DocumentSigningInitialsFieldProps = {
  field: FieldWithSignature;
+  recipient: Recipient;
  onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
  onUnsignField?: (value: TRemovedSignedFieldWithTokenMutationSchema) => Promise<void> | void;
 };

 export const DocumentSigningInitialsField = ({
  field,
+  recipient,
  onSignField,
  onUnsignField,
 }: DocumentSigningInitialsFieldProps) => {
@@ -36,8 +38,6 @@ export const DocumentSigningInitialsField = ({
  const { revalidate } = useRevalidator();

  const { fullName } = useRequiredDocumentSigningContext();
-  const { recipient, isAssistantMode } = useDocumentSigningRecipientContext();
-
  const initials = extractInitials(fullName);

  const { mutateAsync: signFieldWithToken, isPending: isSignFieldWithTokenLoading } =
@@ -81,9 +81,7 @@ export const DocumentSigningInitialsField = ({

      toast({
        title: _(msg`Error`),
-        description: isAssistantMode
-          ? _(msg`An error occurred while signing as assistant.`)
-          : _(msg`An error occurred while signing the document.`),
+        description: _(msg`An error occurred while signing the document.`),
        variant: 'destructive',
      });
    }
--- a/apps/remix/app/components/general/document-signing/document-signing-name-field.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-name-field.tsx
@@ -3,20 +3,19 @@ import { useState } from 'react';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
+import { type Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';

 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
 import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
-import { ZNameFieldMeta } from '@documenso/lib/types/field-meta';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
 import type {
  TRemovedSignedFieldWithTokenMutationSchema,
  TSignFieldWithTokenMutationSchema,
 } from '@documenso/trpc/server/field-router/schema';
-import { cn } from '@documenso/ui/lib/utils';
 import { Button } from '@documenso/ui/primitives/button';
 import { Dialog, DialogContent, DialogFooter, DialogTitle } from '@documenso/ui/primitives/dialog';
 import { Input } from '@documenso/ui/primitives/input';
@@ -26,16 +25,17 @@ import { useToast } from '@documenso/ui/primitives/use-toast';
 import { useRequiredDocumentSigningAuthContext } from './document-signing-auth-provider';
 import { DocumentSigningFieldContainer } from './document-signing-field-container';
 import { useRequiredDocumentSigningContext } from './document-signing-provider';
-import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';

 export type DocumentSigningNameFieldProps = {
  field: FieldWithSignature;
+  recipient: Recipient;
  onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
  onUnsignField?: (value: TRemovedSignedFieldWithTokenMutationSchema) => Promise<void> | void;
 };

 export const DocumentSigningNameField = ({
  field,
+  recipient,
  onSignField,
  onUnsignField,
 }: DocumentSigningNameFieldProps) => {
@@ -46,8 +46,6 @@ export const DocumentSigningNameField = ({
  const { fullName: providedFullName, setFullName: setProvidedFullName } =
    useRequiredDocumentSigningContext();

-  const { recipient, isAssistantMode } = useDocumentSigningRecipientContext();
-
  const { executeActionAuthProcedure } = useRequiredDocumentSigningAuthContext();

  const { mutateAsync: signFieldWithToken, isPending: isSignFieldWithTokenLoading } =
@@ -60,14 +58,11 @@ export const DocumentSigningNameField = ({

  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;

-  const safeFieldMeta = ZNameFieldMeta.safeParse(field.fieldMeta);
-  const parsedFieldMeta = safeFieldMeta.success ? safeFieldMeta.data : null;
-
  const [showFullNameModal, setShowFullNameModal] = useState(false);
  const [localFullName, setLocalFullName] = useState('');

  const onPreSign = () => {
-    if (!providedFullName && !isAssistantMode) {
+    if (!providedFullName) {
      setShowFullNameModal(true);
      return false;
    }
@@ -90,9 +85,9 @@ export const DocumentSigningNameField = ({

  const onSign = async (authOptions?: TRecipientActionAuth, name?: string) => {
    try {
-      const value = name || providedFullName || '';
+      const value = name || providedFullName;

-      if (!value && !isAssistantMode) {
+      if (!value) {
        setShowFullNameModal(true);
        return;
      }
@@ -124,9 +119,7 @@ export const DocumentSigningNameField = ({

      toast({
        title: _(msg`Error`),
-        description: isAssistantMode
-          ? _(msg`An error occurred while signing as assistant.`)
-          : _(msg`An error occurred while signing the document.`),
+        description: _(msg`An error occurred while signing the document.`),
        variant: 'destructive',
      });
    }
@@ -152,7 +145,7 @@ export const DocumentSigningNameField = ({

      toast({
        title: _(msg`Error`),
-        description: _(msg`An error occurred while removing the field.`),
+        description: _(msg`An error occurred while removing the signature.`),
        variant: 'destructive',
      });
    }
@@ -179,21 +172,9 @@ export const DocumentSigningNameField = ({
      )}

      {field.inserted && (
-        <div className="flex h-full w-full items-center">
-          <p
-            className={cn(
-              'text-muted-foreground dark:text-background/80 w-full text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
-              {
-                'text-left': parsedFieldMeta?.textAlign === 'left',
-                'text-center':
-                  !parsedFieldMeta?.textAlign || parsedFieldMeta?.textAlign === 'center',
-                'text-right': parsedFieldMeta?.textAlign === 'right',
-              },
-            )}
-          >
-            {field.customText}
-          </p>
-        </div>
+        <p className="text-muted-foreground dark:text-background/80 text-[clamp(0.425rem,25cqw,0.825rem)] duration-200">
+          {field.customText}
+        </p>
      )}

      <Dialog open={showFullNameModal} onOpenChange={setShowFullNameModal}>
--- a/apps/remix/app/components/general/document-signing/document-signing-number-field.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-number-field.tsx
@@ -3,6 +3,7 @@ import { useEffect, useState } from 'react';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
+import type { Recipient } from '@prisma/client';
 import { Hash, Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';

@@ -25,7 +26,6 @@ import { useToast } from '@documenso/ui/primitives/use-toast';

 import { useRequiredDocumentSigningAuthContext } from './document-signing-auth-provider';
 import { DocumentSigningFieldContainer } from './document-signing-field-container';
-import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';

 type ValidationErrors = {
  isNumber: string[];
@@ -37,12 +37,14 @@ type ValidationErrors = {

 export type DocumentSigningNumberFieldProps = {
  field: FieldWithSignature;
+  recipient: Recipient;
  onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
  onUnsignField?: (value: TRemovedSignedFieldWithTokenMutationSchema) => Promise<void> | void;
 };

 export const DocumentSigningNumberField = ({
  field,
+  recipient,
  onSignField,
  onUnsignField,
 }: DocumentSigningNumberFieldProps) => {
@@ -50,13 +52,10 @@ export const DocumentSigningNumberField = ({
  const { toast } = useToast();
  const { revalidate } = useRevalidator();

-  const { recipient, targetSigner, isAssistantMode } = useDocumentSigningRecipientContext();
-
-  const [showNumberModal, setShowNumberModal] = useState(false);
-
-  const safeFieldMeta = ZNumberFieldMeta.safeParse(field.fieldMeta);
-  const parsedFieldMeta = safeFieldMeta.success ? safeFieldMeta.data : null;
+  const [showRadioModal, setShowRadioModal] = useState(false);

+  const parsedFieldMeta = field.fieldMeta ? ZNumberFieldMeta.parse(field.fieldMeta) : null;
+  const isReadOnly = parsedFieldMeta?.readOnly;
  const defaultValue = parsedFieldMeta?.value;
  const [localNumber, setLocalNumber] = useState(
    parsedFieldMeta?.value ? String(parsedFieldMeta.value) : '0',
@@ -107,7 +106,7 @@ export const DocumentSigningNumberField = ({
  };

  const onDialogSignClick = () => {
-    setShowNumberModal(false);
+    setShowRadioModal(false);

    void executeActionAuthProcedure({
      onReauthFormSubmit: async (authOptions) => await onSign(authOptions),
@@ -150,20 +149,14 @@ export const DocumentSigningNumberField = ({

      toast({
        title: _(msg`Error`),
-        description: isAssistantMode
-          ? _(msg`An error occurred while signing as assistant.`)
-          : _(msg`An error occurred while signing the document.`),
+        description: _(msg`An error occurred while signing the document.`),
        variant: 'destructive',
      });
    }
  };

  const onPreSign = () => {
-    if (isAssistantMode) {
-      return true;
-    }
-
-    setShowNumberModal(true);
+    setShowRadioModal(true);

    if (localNumber && parsedFieldMeta) {
      const validationErrors = validateNumberField(localNumber, parsedFieldMeta, true);
@@ -201,23 +194,23 @@ export const DocumentSigningNumberField = ({

      toast({
        title: _(msg`Error`),
-        description: _(msg`An error occurred while removing the field.`),
+        description: _(msg`An error occurred while removing the signature.`),
        variant: 'destructive',
      });
    }
  };

  useEffect(() => {
-    if (!showNumberModal) {
+    if (!showRadioModal) {
      setLocalNumber(parsedFieldMeta?.value ? String(parsedFieldMeta.value) : '0');
      setErrors(initialErrors);
    }
-  }, [showNumberModal]);
+  }, [showRadioModal]);

  useEffect(() => {
    if (
      (!field.inserted && defaultValue && localNumber) ||
-      (!field.inserted && parsedFieldMeta?.readOnly && defaultValue)
+      (!field.inserted && isReadOnly && defaultValue)
    ) {
      void executeActionAuthProcedure({
        onReauthFormSubmit: async (authOptions) => await onSign(authOptions),
@@ -230,8 +223,8 @@ export const DocumentSigningNumberField = ({

  if (parsedFieldMeta?.label) {
    fieldDisplayName =
-      parsedFieldMeta.label.length > 20
-        ? parsedFieldMeta.label.substring(0, 20) + '...'
+      parsedFieldMeta.label.length > 10
+        ? parsedFieldMeta.label.substring(0, 10) + '...'
        : parsedFieldMeta.label;
  }

@@ -243,7 +236,7 @@ export const DocumentSigningNumberField = ({
      onPreSign={onPreSign}
      onSign={onSign}
      onRemove={onRemove}
-      type="Number"
+      type="Signature"
    >
      {isLoading && (
        <div className="bg-background absolute inset-0 flex items-center justify-center rounded-md">
@@ -269,24 +262,12 @@ export const DocumentSigningNumberField = ({
      )}

      {field.inserted && (
-        <div className="flex h-full w-full items-center">
-          <p
-            className={cn(
-              'text-muted-foreground dark:text-background/80 w-full text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
-              {
-                'text-left': parsedFieldMeta?.textAlign === 'left',
-                'text-center':
-                  !parsedFieldMeta?.textAlign || parsedFieldMeta?.textAlign === 'center',
-                'text-right': parsedFieldMeta?.textAlign === 'right',
-              },
-            )}
-          >
-            {field.customText}
-          </p>
-        </div>
+        <p className="text-muted-foreground dark:text-background/80 text-[clamp(0.425rem,25cqw,0.825rem)] duration-200">
+          {field.customText}
+        </p>
      )}

-      <Dialog open={showNumberModal} onOpenChange={setShowNumberModal}>
+      <Dialog open={showRadioModal} onOpenChange={setShowRadioModal}>
        <DialogContent>
          <DialogTitle>
            {parsedFieldMeta?.label ? parsedFieldMeta?.label : <Trans>Number</Trans>}
@@ -342,7 +323,7 @@ export const DocumentSigningNumberField = ({
                className="dark:bg-muted dark:hover:bg-muted/80 flex-1 bg-black/5 hover:bg-black/10"
                variant="secondary"
                onClick={() => {
-                  setShowNumberModal(false);
+                  setShowRadioModal(false);
                  setLocalNumber('');
                }}
              >
--- a/apps/remix/app/components/general/document-signing/document-signing-page-view.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-page-view.tsx
@@ -1,7 +1,5 @@
-import { useState } from 'react';
-
 import { Trans } from '@lingui/react/macro';
-import type { Field } from '@prisma/client';
+import type { Field, Recipient } from '@prisma/client';
 import { FieldType, RecipientRole } from '@prisma/client';
 import { match } from 'ts-pattern';

@@ -18,7 +16,6 @@ import {
 } from '@documenso/lib/types/field-meta';
 import type { CompletedField } from '@documenso/lib/types/fields';
 import type { FieldWithSignatureAndFieldMeta } from '@documenso/prisma/types/field-with-signature-and-fieldmeta';
-import type { RecipientWithFields } from '@documenso/prisma/types/recipient-with-fields';
 import { Card, CardContent } from '@documenso/ui/primitives/card';
 import { ElementVisible } from '@documenso/ui/primitives/element-visible';
 import { LazyPDFViewer } from '@documenso/ui/primitives/lazy-pdf-viewer';
@@ -38,15 +35,12 @@ import { DocumentSigningSignatureField } from '~/components/general/document-sig
 import { DocumentSigningTextField } from '~/components/general/document-signing/document-signing-text-field';
 import { DocumentReadOnlyFields } from '~/components/general/document/document-read-only-fields';

-import { DocumentSigningRecipientProvider } from './document-signing-recipient-provider';
-
 export type SigningPageViewProps = {
  document: DocumentAndSender;
-  recipient: RecipientWithFields;
+  recipient: Recipient;
  fields: Field[];
  completedFields: CompletedField[];
  isRecipientsTurn: boolean;
-  allRecipients?: RecipientWithFields[];
 };

 export const DocumentSigningPageView = ({
@@ -55,12 +49,9 @@ export const DocumentSigningPageView = ({
  fields,
  completedFields,
  isRecipientsTurn,
-  allRecipients = [],
 }: SigningPageViewProps) => {
  const { documentData, documentMeta } = document;

-  const [selectedSignerId, setSelectedSignerId] = useState<number | null>(allRecipients?.[0]?.id);
-
  const shouldUseTeamDetails =
    document.teamId && document.team?.teamGlobalSettings?.includeSenderDetails === false;

@@ -72,174 +63,183 @@ export const DocumentSigningPageView = ({
    senderEmail = document.team?.teamEmail?.email ? `(${document.team.teamEmail.email})` : '';
  }

-  const selectedSigner = allRecipients?.find((r) => r.id === selectedSignerId);
-
  return (
-    <DocumentSigningRecipientProvider recipient={recipient} targetSigner={selectedSigner ?? null}>
-      <div className="mx-auto w-full max-w-screen-xl">
-        <h1
-          className="mt-4 block max-w-[20rem] truncate text-2xl font-semibold md:max-w-[30rem] md:text-3xl"
-          title={document.title}
-        >
-          {document.title}
-        </h1>
+    <div className="mx-auto w-full max-w-screen-xl">
+      <h1
+        className="mt-4 block max-w-[20rem] truncate text-2xl font-semibold md:max-w-[30rem] md:text-3xl"
+        title={document.title}
+      >
+        {document.title}
+      </h1>

-        <div className="mt-2.5 flex flex-wrap items-center justify-between gap-x-6">
-          <div className="max-w-[50ch]">
-            <span className="text-muted-foreground truncate" title={senderName}>
-              {senderName} {senderEmail}
-            </span>{' '}
-            <span className="text-muted-foreground">
-              {match(recipient.role)
-                .with(RecipientRole.VIEWER, () =>
-                  document.teamId && !shouldUseTeamDetails ? (
-                    <Trans>
-                      on behalf of "{document.team?.name}" has invited you to view this document
-                    </Trans>
-                  ) : (
-                    <Trans>has invited you to view this document</Trans>
-                  ),
-                )
-                .with(RecipientRole.SIGNER, () =>
-                  document.teamId && !shouldUseTeamDetails ? (
-                    <Trans>
-                      on behalf of "{document.team?.name}" has invited you to sign this document
-                    </Trans>
-                  ) : (
-                    <Trans>has invited you to sign this document</Trans>
-                  ),
-                )
-                .with(RecipientRole.APPROVER, () =>
-                  document.teamId && !shouldUseTeamDetails ? (
-                    <Trans>
-                      on behalf of "{document.team?.name}" has invited you to approve this document
-                    </Trans>
-                  ) : (
-                    <Trans>has invited you to approve this document</Trans>
-                  ),
-                )
-                .with(RecipientRole.ASSISTANT, () =>
-                  document.teamId && !shouldUseTeamDetails ? (
-                    <Trans>
-                      on behalf of "{document.team?.name}" has invited you to assist this document
-                    </Trans>
-                  ) : (
-                    <Trans>has invited you to assist this document</Trans>
-                  ),
-                )
-                .otherwise(() => null)}
-            </span>
-          </div>
-
-          <DocumentSigningRejectDialog document={document} token={recipient.token} />
+      <div className="mt-2.5 flex flex-wrap items-center justify-between gap-x-6">
+        <div className="max-w-[50ch]">
+          <span className="text-muted-foreground truncate" title={senderName}>
+            {senderName} {senderEmail}
+          </span>{' '}
+          <span className="text-muted-foreground">
+            {match(recipient.role)
+              .with(RecipientRole.VIEWER, () =>
+                document.teamId && !shouldUseTeamDetails ? (
+                  <Trans>
+                    on behalf of "{document.team?.name}" has invited you to view this document
+                  </Trans>
+                ) : (
+                  <Trans>has invited you to view this document</Trans>
+                ),
+              )
+              .with(RecipientRole.SIGNER, () =>
+                document.teamId && !shouldUseTeamDetails ? (
+                  <Trans>
+                    on behalf of "{document.team?.name}" has invited you to sign this document
+                  </Trans>
+                ) : (
+                  <Trans>has invited you to sign this document</Trans>
+                ),
+              )
+              .with(RecipientRole.APPROVER, () =>
+                document.teamId && !shouldUseTeamDetails ? (
+                  <Trans>
+                    on behalf of "{document.team?.name}" has invited you to approve this document
+                  </Trans>
+                ) : (
+                  <Trans>has invited you to approve this document</Trans>
+                ),
+              )
+              .otherwise(() => null)}
+          </span>
        </div>

-        <div className="mt-8 grid grid-cols-12 gap-y-8 lg:gap-x-8 lg:gap-y-0">
-          <Card
-            className="col-span-12 rounded-xl before:rounded-xl lg:col-span-7 xl:col-span-8"
-            gradient
-          >
-            <CardContent className="p-2">
-              <LazyPDFViewer
-                key={documentData.id}
-                documentData={documentData}
-                document={document}
-                password={documentMeta?.password}
-              />
-            </CardContent>
-          </Card>
-
-          <div className="col-span-12 lg:col-span-5 xl:col-span-4">
-            <DocumentSigningForm
-              document={document}
-              recipient={recipient}
-              fields={fields}
-              redirectUrl={documentMeta?.redirectUrl}
-              isRecipientsTurn={isRecipientsTurn}
-              allRecipients={allRecipients}
-              setSelectedSignerId={setSelectedSignerId}
-            />
-          </div>
-        </div>
-
-        <DocumentReadOnlyFields fields={completedFields} />
-
-        {recipient.role !== RecipientRole.ASSISTANT && (
-          <DocumentSigningAutoSign recipient={recipient} fields={fields} />
-        )}
-
-        <ElementVisible target={PDF_VIEWER_PAGE_SELECTOR}>
-          {fields
-            .filter(
-              (field) =>
-                recipient.role !== RecipientRole.ASSISTANT ||
-                field.recipientId === selectedSigner?.id,
-            )
-            .map((field) =>
-              match(field.type)
-                .with(FieldType.SIGNATURE, () => (
-                  <DocumentSigningSignatureField
-                    key={field.id}
-                    field={field}
-                    typedSignatureEnabled={documentMeta?.typedSignatureEnabled}
-                  />
-                ))
-                .with(FieldType.INITIALS, () => (
-                  <DocumentSigningInitialsField key={field.id} field={field} />
-                ))
-                .with(FieldType.NAME, () => (
-                  <DocumentSigningNameField key={field.id} field={field} />
-                ))
-                .with(FieldType.DATE, () => (
-                  <DocumentSigningDateField
-                    key={field.id}
-                    field={field}
-                    dateFormat={documentMeta?.dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT}
-                    timezone={documentMeta?.timezone ?? DEFAULT_DOCUMENT_TIME_ZONE}
-                  />
-                ))
-                .with(FieldType.EMAIL, () => (
-                  <DocumentSigningEmailField key={field.id} field={field} />
-                ))
-                .with(FieldType.TEXT, () => {
-                  const fieldWithMeta: FieldWithSignatureAndFieldMeta = {
-                    ...field,
-                    fieldMeta: field.fieldMeta ? ZTextFieldMeta.parse(field.fieldMeta) : null,
-                  };
-                  return <DocumentSigningTextField key={field.id} field={fieldWithMeta} />;
-                })
-                .with(FieldType.NUMBER, () => {
-                  const fieldWithMeta: FieldWithSignatureAndFieldMeta = {
-                    ...field,
-                    fieldMeta: field.fieldMeta ? ZNumberFieldMeta.parse(field.fieldMeta) : null,
-                  };
-                  return <DocumentSigningNumberField key={field.id} field={fieldWithMeta} />;
-                })
-                .with(FieldType.RADIO, () => {
-                  const fieldWithMeta: FieldWithSignatureAndFieldMeta = {
-                    ...field,
-                    fieldMeta: field.fieldMeta ? ZRadioFieldMeta.parse(field.fieldMeta) : null,
-                  };
-                  return <DocumentSigningRadioField key={field.id} field={fieldWithMeta} />;
-                })
-                .with(FieldType.CHECKBOX, () => {
-                  const fieldWithMeta: FieldWithSignatureAndFieldMeta = {
-                    ...field,
-                    fieldMeta: field.fieldMeta ? ZCheckboxFieldMeta.parse(field.fieldMeta) : null,
-                  };
-                  return <DocumentSigningCheckboxField key={field.id} field={fieldWithMeta} />;
-                })
-                .with(FieldType.DROPDOWN, () => {
-                  const fieldWithMeta: FieldWithSignatureAndFieldMeta = {
-                    ...field,
-                    fieldMeta: field.fieldMeta ? ZDropdownFieldMeta.parse(field.fieldMeta) : null,
-                  };
-                  return <DocumentSigningDropdownField key={field.id} field={fieldWithMeta} />;
-                })
-                .otherwise(() => null),
-            )}
-        </ElementVisible>
+        <DocumentSigningRejectDialog document={document} token={recipient.token} />
      </div>
-    </DocumentSigningRecipientProvider>
+
+      <div className="mt-8 grid grid-cols-12 gap-y-8 lg:gap-x-8 lg:gap-y-0">
+        <Card
+          className="col-span-12 rounded-xl before:rounded-xl lg:col-span-7 xl:col-span-8"
+          gradient
+        >
+          <CardContent className="p-2">
+            <LazyPDFViewer
+              key={documentData.id}
+              documentData={documentData}
+              document={document}
+              password={documentMeta?.password}
+            />
+          </CardContent>
+        </Card>
+
+        <div className="col-span-12 lg:col-span-5 xl:col-span-4">
+          <DocumentSigningForm
+            document={document}
+            recipient={recipient}
+            fields={fields}
+            redirectUrl={documentMeta?.redirectUrl}
+            isRecipientsTurn={isRecipientsTurn}
+          />
+        </div>
+      </div>
+
+      <DocumentReadOnlyFields fields={completedFields} />
+
+      <DocumentSigningAutoSign recipient={recipient} fields={fields} />
+
+      <ElementVisible target={PDF_VIEWER_PAGE_SELECTOR}>
+        {fields.map((field) =>
+          match(field.type)
+            .with(FieldType.SIGNATURE, () => (
+              <DocumentSigningSignatureField
+                key={field.id}
+                field={field}
+                recipient={recipient}
+                typedSignatureEnabled={documentMeta?.typedSignatureEnabled}
+              />
+            ))
+            .with(FieldType.INITIALS, () => (
+              <DocumentSigningInitialsField key={field.id} field={field} recipient={recipient} />
+            ))
+            .with(FieldType.NAME, () => (
+              <DocumentSigningNameField key={field.id} field={field} recipient={recipient} />
+            ))
+            .with(FieldType.DATE, () => (
+              <DocumentSigningDateField
+                key={field.id}
+                field={field}
+                recipient={recipient}
+                dateFormat={documentMeta?.dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT}
+                timezone={documentMeta?.timezone ?? DEFAULT_DOCUMENT_TIME_ZONE}
+              />
+            ))
+            .with(FieldType.EMAIL, () => (
+              <DocumentSigningEmailField key={field.id} field={field} recipient={recipient} />
+            ))
+            .with(FieldType.TEXT, () => {
+              const fieldWithMeta: FieldWithSignatureAndFieldMeta = {
+                ...field,
+                fieldMeta: field.fieldMeta ? ZTextFieldMeta.parse(field.fieldMeta) : null,
+              };
+              return (
+                <DocumentSigningTextField
+                  key={field.id}
+                  field={fieldWithMeta}
+                  recipient={recipient}
+                />
+              );
+            })
+            .with(FieldType.NUMBER, () => {
+              const fieldWithMeta: FieldWithSignatureAndFieldMeta = {
+                ...field,
+                fieldMeta: field.fieldMeta ? ZNumberFieldMeta.parse(field.fieldMeta) : null,
+              };
+              return (
+                <DocumentSigningNumberField
+                  key={field.id}
+                  field={fieldWithMeta}
+                  recipient={recipient}
+                />
+              );
+            })
+            .with(FieldType.RADIO, () => {
+              const fieldWithMeta: FieldWithSignatureAndFieldMeta = {
+                ...field,
+                fieldMeta: field.fieldMeta ? ZRadioFieldMeta.parse(field.fieldMeta) : null,
+              };
+              return (
+                <DocumentSigningRadioField
+                  key={field.id}
+                  field={fieldWithMeta}
+                  recipient={recipient}
+                />
+              );
+            })
+            .with(FieldType.CHECKBOX, () => {
+              const fieldWithMeta: FieldWithSignatureAndFieldMeta = {
+                ...field,
+                fieldMeta: field.fieldMeta ? ZCheckboxFieldMeta.parse(field.fieldMeta) : null,
+              };
+              return (
+                <DocumentSigningCheckboxField
+                  key={field.id}
+                  field={fieldWithMeta}
+                  recipient={recipient}
+                />
+              );
+            })
+            .with(FieldType.DROPDOWN, () => {
+              const fieldWithMeta: FieldWithSignatureAndFieldMeta = {
+                ...field,
+                fieldMeta: field.fieldMeta ? ZDropdownFieldMeta.parse(field.fieldMeta) : null,
+              };
+              return (
+                <DocumentSigningDropdownField
+                  key={field.id}
+                  field={fieldWithMeta}
+                  recipient={recipient}
+                />
+              );
+            })
+            .otherwise(() => null),
+        )}
+      </ElementVisible>
+    </div>
  );
 };
--- a/apps/remix/app/components/general/document-signing/document-signing-radio-field.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-radio-field.tsx
@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react';

 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
+import type { Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';

@@ -21,16 +22,17 @@ import { useToast } from '@documenso/ui/primitives/use-toast';

 import { useRequiredDocumentSigningAuthContext } from './document-signing-auth-provider';
 import { DocumentSigningFieldContainer } from './document-signing-field-container';
-import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';

 export type DocumentSigningRadioFieldProps = {
  field: FieldWithSignatureAndFieldMeta;
+  recipient: Recipient;
  onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
  onUnsignField?: (value: TRemovedSignedFieldWithTokenMutationSchema) => Promise<void> | void;
 };

 export const DocumentSigningRadioField = ({
  field,
+  recipient,
  onSignField,
  onUnsignField,
 }: DocumentSigningRadioFieldProps) => {
@@ -38,8 +40,6 @@ export const DocumentSigningRadioField = ({
  const { toast } = useToast();
  const { revalidate } = useRevalidator();

-  const { recipient, targetSigner, isAssistantMode } = useDocumentSigningRecipientContext();
-
  const parsedFieldMeta = ZRadioFieldMeta.parse(field.fieldMeta);
  const values = parsedFieldMeta.values?.map((item) => ({
    ...item,
@@ -100,9 +100,7 @@ export const DocumentSigningRadioField = ({

      toast({
        title: _(msg`Error`),
-        description: isAssistantMode
-          ? _(msg`An error occurred while signing as assistant.`)
-          : _(msg`An error occurred while signing the document.`),
+        description: _(msg`An error occurred while signing the document.`),
        variant: 'destructive',
      });
    }
@@ -129,7 +127,7 @@ export const DocumentSigningRadioField = ({

      toast({
        title: _(msg`Error`),
-        description: _(msg`An error occurred while removing the selection.`),
+        description: _(msg`An error occurred while removing the signature.`),
        variant: 'destructive',
      });
    }
--- a/apps/remix/app/components/general/document-signing/document-signing-recipient-provider.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-recipient-provider.tsx
@@ -1,67 +0,0 @@
-import { type PropsWithChildren, createContext, useContext } from 'react';
-
-import type { Recipient } from '@prisma/client';
-
-import type { RecipientWithFields } from '@documenso/prisma/types/recipient-with-fields';
-
-export interface DocumentSigningRecipientContextValue {
-  /**
-   * The recipient who is currently signing the document.
-   * In regular mode, this is the actual signer.
-   * In assistant mode, this is the recipient who is helping fill out the document.
-   */
-  recipient: Recipient | RecipientWithFields;
-
-  /**
-   * Only present in assistant mode.
-   * The recipient on whose behalf we're filling out the document.
-   */
-  targetSigner: RecipientWithFields | null;
-
-  /**
-   * Whether we're in assistant mode (one recipient filling out for another)
-   */
-  isAssistantMode: boolean;
-}
-
-const DocumentSigningRecipientContext = createContext<DocumentSigningRecipientContextValue | null>(
-  null,
-);
-
-export interface DocumentSigningRecipientProviderProps extends PropsWithChildren {
-  recipient: Recipient | RecipientWithFields;
-  targetSigner?: RecipientWithFields | null;
-}
-
-export const DocumentSigningRecipientProvider = ({
-  children,
-  recipient,
-  targetSigner = null,
-}: DocumentSigningRecipientProviderProps) => {
-  // console.log({
-  //   recipient,
-  //   targetSigner,
-  //   isAssistantMode: !!targetSigner,
-  // });
-  return (
-    <DocumentSigningRecipientContext.Provider
-      value={{
-        recipient,
-        targetSigner,
-        isAssistantMode: !!targetSigner,
-      }}
-    >
-      {children}
-    </DocumentSigningRecipientContext.Provider>
-  );
-};
-
-export function useDocumentSigningRecipientContext() {
-  const context = useContext(DocumentSigningRecipientContext);
-
-  if (!context) {
-    throw new Error('useDocumentSigningRecipientContext must be used within a RecipientProvider');
-  }
-
-  return context;
-}
--- a/apps/remix/app/components/general/document-signing/document-signing-reject-dialog.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-reject-dialog.tsx
@@ -42,14 +42,9 @@ type TRejectDocumentFormSchema = z.infer<typeof ZRejectDocumentFormSchema>;
 export interface DocumentSigningRejectDialogProps {
  document: Pick<Document, 'id'>;
  token: string;
-  onRejected?: (reason: string) => void | Promise<void>;
 }

-export function DocumentSigningRejectDialog({
-  document,
-  token,
-  onRejected,
-}: DocumentSigningRejectDialogProps) {
+export function DocumentSigningRejectDialog({ document, token }: DocumentSigningRejectDialogProps) {
  const { toast } = useToast();
  const navigate = useNavigate();
  const [searchParams] = useSearchParams();
@@ -80,13 +75,9 @@ export function DocumentSigningRejectDialog({
        duration: 5000,
      });

-      setIsOpen(false);
+      await navigate(`/sign/${token}/rejected`);

-      if (onRejected) {
-        await onRejected(reason);
-      } else {
-        await navigate(`/sign/${token}/rejected`);
-      }
+      setIsOpen(false);
    } catch (err) {
      toast({
        title: 'Error',
--- a/apps/remix/app/components/general/document-signing/document-signing-signature-field.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-signature-field.tsx
@@ -3,6 +3,7 @@ import { useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
+import { type Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';

@@ -26,11 +27,11 @@ import { DocumentSigningDisclosure } from '~/components/general/document-signing
 import { useRequiredDocumentSigningAuthContext } from './document-signing-auth-provider';
 import { DocumentSigningFieldContainer } from './document-signing-field-container';
 import { useRequiredDocumentSigningContext } from './document-signing-provider';
-import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';

 type SignatureFieldState = 'empty' | 'signed-image' | 'signed-text';
 export type DocumentSigningSignatureFieldProps = {
  field: FieldWithSignature;
+  recipient: Recipient;
  onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
  onUnsignField?: (value: TRemovedSignedFieldWithTokenMutationSchema) => Promise<void> | void;
  typedSignatureEnabled?: boolean;
@@ -38,6 +39,7 @@ export type DocumentSigningSignatureFieldProps = {

 export const DocumentSigningSignatureField = ({
  field,
+  recipient,
  onSignField,
  onUnsignField,
  typedSignatureEnabled,
@@ -46,8 +48,6 @@ export const DocumentSigningSignatureField = ({
  const { toast } = useToast();
  const { revalidate } = useRevalidator();

-  const { recipient } = useDocumentSigningRecipientContext();
-
  const signatureRef = useRef<HTMLParagraphElement>(null);
  const containerRef = useRef<HTMLDivElement>(null);
  const [fontSize, setFontSize] = useState(2);
--- a/apps/remix/app/components/general/document-signing/document-signing-text-field.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-text-field.tsx
@@ -3,6 +3,7 @@ import { useEffect, useState } from 'react';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Plural, Trans } from '@lingui/react/macro';
+import type { Recipient } from '@prisma/client';
 import { Loader, Type } from 'lucide-react';
 import { useRevalidator } from 'react-router';

@@ -25,27 +26,17 @@ import { useToast } from '@documenso/ui/primitives/use-toast';

 import { useRequiredDocumentSigningAuthContext } from './document-signing-auth-provider';
 import { DocumentSigningFieldContainer } from './document-signing-field-container';
-import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';

 export type DocumentSigningTextFieldProps = {
  field: FieldWithSignatureAndFieldMeta;
-  onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
-  onUnsignField?: (value: TRemovedSignedFieldWithTokenMutationSchema) => Promise<void> | void;
-};
-
-type ValidationErrors = {
-  required: string[];
-  characterLimit: string[];
-};
-
-export type TextFieldProps = {
-  field: FieldWithSignatureAndFieldMeta;
+  recipient: Recipient;
  onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
  onUnsignField?: (value: TRemovedSignedFieldWithTokenMutationSchema) => Promise<void> | void;
 };

 export const DocumentSigningTextField = ({
  field,
+  recipient,
  onSignField,
  onUnsignField,
 }: DocumentSigningTextFieldProps) => {
@@ -53,12 +44,11 @@ export const DocumentSigningTextField = ({
  const { toast } = useToast();
  const { revalidate } = useRevalidator();

-  const { recipient, isAssistantMode } = useDocumentSigningRecipientContext();
-
-  const initialErrors: ValidationErrors = {
+  const initialErrors: Record<string, string[]> = {
    required: [],
    characterLimit: [],
  };
+
  const [errors, setErrors] = useState(initialErrors);
  const userInputHasErrors = Object.values(errors).some((error) => error.length > 0);

@@ -72,8 +62,7 @@ export const DocumentSigningTextField = ({
    isPending: isRemoveSignedFieldWithTokenLoading,
  } = trpc.field.removeSignedFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);

-  const safeFieldMeta = ZTextFieldMeta.safeParse(field.fieldMeta);
-  const parsedFieldMeta = safeFieldMeta.success ? safeFieldMeta.data : null;
+  const parsedFieldMeta = field.fieldMeta ? ZTextFieldMeta.parse(field.fieldMeta) : null;

  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;
  const shouldAutoSignField =
@@ -176,9 +165,7 @@ export const DocumentSigningTextField = ({

      toast({
        title: _(msg`Error`),
-        description: isAssistantMode
-          ? _(msg`An error occurred while signing as assistant.`)
-          : _(msg`An error occurred while signing the document.`),
+        description: _(msg`An error occurred while signing the document.`),
        variant: 'destructive',
      });
    }
@@ -206,7 +193,7 @@ export const DocumentSigningTextField = ({

      toast({
        title: _(msg`Error`),
-        description: _(msg`An error occurred while removing the field.`),
+        description: _(msg`An error occurred while removing the text.`),
        variant: 'destructive',
      });
    }
@@ -246,7 +233,7 @@ export const DocumentSigningTextField = ({
      onPreSign={onPreSign}
      onSign={onSign}
      onRemove={onRemove}
-      type="Text"
+      type="Signature"
    >
      {isLoading && (
        <div className="bg-background absolute inset-0 flex items-center justify-center rounded-md">
@@ -274,23 +261,11 @@ export const DocumentSigningTextField = ({
      )}

      {field.inserted && (
-        <div className="flex h-full w-full items-center">
-          <p
-            className={cn(
-              'text-muted-foreground dark:text-background/80 w-full text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
-              {
-                'text-left': parsedFieldMeta?.textAlign === 'left',
-                'text-center':
-                  !parsedFieldMeta?.textAlign || parsedFieldMeta?.textAlign === 'center',
-                'text-right': parsedFieldMeta?.textAlign === 'right',
-              },
-            )}
-          >
-            {field.customText.length < 20
-              ? field.customText
-              : field.customText.substring(0, 20) + '...'}
-          </p>
-        </div>
+        <p className="text-muted-foreground dark:text-background/80 flex items-center justify-center gap-x-1 text-[clamp(0.425rem,25cqw,0.825rem)] duration-200">
+          {field.customText.length < 20
+            ? field.customText
+            : field.customText.substring(0, 15) + '...'}
+        </p>
      )}

      <Dialog open={showCustomTextModal} onOpenChange={setShowCustomTextModal}>
@@ -306,10 +281,6 @@ export const DocumentSigningTextField = ({
              className={cn('mt-2 w-full rounded-md', {
                'border-2 border-red-300 ring-2 ring-red-200 ring-offset-2 ring-offset-red-200 focus-visible:border-red-400 focus-visible:ring-4 focus-visible:ring-red-200 focus-visible:ring-offset-2 focus-visible:ring-offset-red-200':
                  userInputHasErrors,
-                'text-left': parsedFieldMeta?.textAlign === 'left',
-                'text-center':
-                  !parsedFieldMeta?.textAlign || parsedFieldMeta?.textAlign === 'center',
-                'text-right': parsedFieldMeta?.textAlign === 'right',
              })}
              value={localText}
              onChange={handleTextChange}
--- a/apps/remix/app/components/general/document/document-history-sheet.tsx
+++ b/apps/remix/app/components/general/document/document-history-sheet.tsx
@@ -351,16 +351,6 @@ export const DocumentHistorySheet = ({
                      />
                    ),
                  )
-                  .with({ type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_FIELD_PREFILLED }, ({ data }) => (
-                    <DocumentHistorySheetChanges
-                      values={[
-                        {
-                          key: 'Field prefilled',
-                          value: formatGenericText(data.field.type),
-                        },
-                      ]}
-                    />
-                  ))
                  .exhaustive()}

                {isUserDetailsVisible && (
--- a/apps/remix/app/components/general/document/document-page-view-dropdown.tsx
+++ b/apps/remix/app/components/general/document/document-page-view-dropdown.tsx
@@ -139,7 +139,10 @@ export const DocumentPageViewDropdown = ({ document }: DocumentPageViewDropdownP
          <Trans>Duplicate</Trans>
        </DropdownMenuItem>

-        <DropdownMenuItem onClick={() => setDeleteDialogOpen(true)} disabled={isDeleted}>
+        <DropdownMenuItem
+          onClick={() => setDeleteDialogOpen(true)}
+          disabled={Boolean(!canManageDocument && team?.teamEmail) || isDeleted}
+        >
          <Trash2 className="mr-2 h-4 w-4" />
          <Trans>Delete</Trans>
        </DropdownMenuItem>
--- a/apps/remix/app/components/general/document/document-page-view-recipients.tsx
+++ b/apps/remix/app/components/general/document/document-page-view-recipients.tsx
@@ -11,7 +11,6 @@ import {
  MailOpenIcon,
  PenIcon,
  PlusIcon,
-  UserIcon,
 } from 'lucide-react';
 import { Link } from 'react-router';
 import { match } from 'ts-pattern';
@@ -119,12 +118,6 @@ export const DocumentPageViewRecipients = ({
                          <Trans>Viewed</Trans>
                        </>
                      ))
-                      .with(RecipientRole.ASSISTANT, () => (
-                        <>
-                          <UserIcon className="mr-1 h-3 w-3" />
-                          <Trans>Assisted</Trans>
-                        </>
-                      ))
                      .exhaustive()}
                  </Badge>
                )}
--- a/apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
+++ b/apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
@@ -67,7 +67,7 @@ export const DocumentRecipientLinkCopyDialog = ({
      setOpen(true);
      updateSearchParams({ action: null });
    }
-  }, [actionSearchParam, open]);
+  }, [actionSearchParam, open, setOpen, updateSearchParams]);

  return (
    <Dialog open={open} onOpenChange={(value) => setOpen(value)}>
--- a/apps/remix/app/components/general/document/document-upload.tsx
+++ b/apps/remix/app/components/general/document/document-upload.tsx
@@ -85,7 +85,7 @@ export const DocumentUploadDropzone = ({ className }: DocumentUploadDropzoneProp
        timestamp: new Date().toISOString(),
      });

-      await navigate(`${formatDocumentsPath(team?.url)}/${id}/edit`);
+      void navigate(`${formatDocumentsPath(team?.url)}/${id}/edit`);
    } catch (err) {
      const error = AppError.parseError(err);

--- a/apps/remix/app/components/general/generic-error-layout.tsx
+++ b/apps/remix/app/components/general/generic-error-layout.tsx
@@ -8,37 +8,22 @@ import { Link, useNavigate } from 'react-router';

 import backgroundPattern from '@documenso/assets/images/background-pattern.png';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
+import { cn } from '@documenso/ui/lib/utils';
 import { Button } from '@documenso/ui/primitives/button';

 import { useOptionalCurrentTeam } from '~/providers/team';

-type ErrorCodeMap = Record<
-  number,
-  { subHeading: MessageDescriptor; heading: MessageDescriptor; message: MessageDescriptor }
->;
-
 export type GenericErrorLayoutProps = {
  children?: React.ReactNode;
  errorCode?: number;
-  errorCodeMap?: ErrorCodeMap;
-  /**
-   * The primary button to display. If left as undefined, the default /documents link will be displayed.
-   *
-   * Set to null if you want no button.
-   */
-  primaryButton?: React.ReactNode | null;
-
-  /**
-   * The secondary button to display. If left as undefined, the default back button will be displayed.
-   *
-   * Set to null if you want no button.
-   */
-  secondaryButton?: React.ReactNode | null;
 };

-export const defaultErrorCodeMap: ErrorCodeMap = {
+export const ErrorLayoutCodes: Record<
+  number,
+  { subHeading: MessageDescriptor; heading: MessageDescriptor; message: MessageDescriptor }
+> = {
  404: {
-    subHeading: msg`404 not found`,
+    subHeading: msg`404 Page not found`,
    heading: msg`Oops! Something went wrong.`,
    message: msg`The page you are looking for was moved, removed, renamed or might never have existed.`,
  },
@@ -49,23 +34,17 @@ export const defaultErrorCodeMap: ErrorCodeMap = {
  },
 };

-export const GenericErrorLayout = ({
-  children,
-  errorCode,
-  errorCodeMap = defaultErrorCodeMap,
-  primaryButton,
-  secondaryButton,
-}: GenericErrorLayoutProps) => {
+export const GenericErrorLayout = ({ children, errorCode }: GenericErrorLayoutProps) => {
  const navigate = useNavigate();
  const { _ } = useLingui();

  const team = useOptionalCurrentTeam();

  const { subHeading, heading, message } =
-    errorCodeMap[errorCode || 404] ?? defaultErrorCodeMap[500];
+    ErrorLayoutCodes[errorCode || 404] ?? ErrorLayoutCodes[404];

  return (
-    <div className="fixed inset-0 z-0 flex h-screen w-screen items-center justify-center">
+    <div className={cn('relative max-w-[100vw] overflow-hidden')}>
      <div className="absolute -inset-24 -z-10">
        <motion.div
          className="flex h-full w-full items-center justify-center"
@@ -84,7 +63,7 @@ export const GenericErrorLayout = ({
        </motion.div>
      </div>

-      <div className="inset-0 mx-auto flex h-full flex-grow items-center justify-center px-6 py-32">
+      <div className="container mx-auto flex h-full min-h-screen items-center justify-center px-6 py-32">
        <div>
          <p className="text-muted-foreground font-semibold">{_(subHeading)}</p>

@@ -93,28 +72,22 @@ export const GenericErrorLayout = ({
          <p className="text-muted-foreground mt-4 text-sm">{_(message)}</p>

          <div className="mt-6 flex gap-x-2.5 gap-y-4 md:items-center">
-            {secondaryButton ||
-              (secondaryButton !== null && (
-                <Button
-                  variant="ghost"
-                  className="w-32"
-                  onClick={() => {
-                    void navigate(-1);
-                  }}
-                >
-                  <ChevronLeft className="mr-2 h-4 w-4" />
-                  <Trans>Go Back</Trans>
-                </Button>
-              ))}
+            <Button
+              variant="ghost"
+              className="w-32"
+              onClick={() => {
+                void navigate(-1);
+              }}
+            >
+              <ChevronLeft className="mr-2 h-4 w-4" />
+              <Trans>Go Back</Trans>
+            </Button>

-            {primaryButton ||
-              (primaryButton !== null && (
-                <Button asChild>
-                  <Link to={formatDocumentsPath(team?.url)}>
-                    <Trans>Documents</Trans>
-                  </Link>
-                </Button>
-              ))}
+            <Button asChild>
+              <Link to={formatDocumentsPath(team?.url)}>
+                <Trans>Documents</Trans>
+              </Link>
+            </Button>

            {children}
          </div>
--- a/apps/remix/app/components/general/menu-switcher.tsx
+++ b/apps/remix/app/components/general/menu-switcher.tsx
@@ -10,9 +10,9 @@ import { Link, useLocation } from 'react-router';
 import { authClient } from '@documenso/auth/client';
 import type { SessionUser } from '@documenso/auth/server/lib/session/session';
 import { TEAM_MEMBER_ROLE_MAP, TEAM_URL_REGEX } from '@documenso/lib/constants/teams';
+import { isAdmin } from '@documenso/lib/next-auth/guards/is-admin';
 import type { TGetTeamsResponse } from '@documenso/lib/server-only/team/get-teams';
 import { formatAvatarUrl } from '@documenso/lib/utils/avatars';
-import { isAdmin } from '@documenso/lib/utils/is-admin';
 import { extractInitials } from '@documenso/lib/utils/recipient-formatter';
 import { canExecuteTeamAction } from '@documenso/lib/utils/teams';
 import { trpc } from '@documenso/trpc/react';
@@ -262,7 +262,7 @@ export const MenuSwitcher = ({ user, teams: initialTeamsData }: MenuSwitcherProp
        {selectedTeam &&
          canExecuteTeamAction('MANAGE_TEAM', selectedTeam.currentTeamMember.role) && (
            <DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
-              <Link to={`/t/${selectedTeam.url}/settings`}>
+              <Link to={`/t/${selectedTeam.url}/settings/`}>
                <Trans>Team settings</Trans>
              </Link>
            </DropdownMenuItem>
--- a/apps/remix/app/components/general/portal.tsx
+++ b/apps/remix/app/components/general/portal.tsx
@@ -1,18 +0,0 @@
-import { useEffect, useState } from 'react';
-
-import { createPortal } from 'react-dom';
-
-type PortalComponentProps = {
-  children: React.ReactNode;
-  target: string;
-};
-
-export const PortalComponent = ({ children, target }: PortalComponentProps) => {
-  const [portalRoot, setPortalRoot] = useState<HTMLElement | null>(null);
-
-  useEffect(() => {
-    setPortalRoot(document.getElementById(target));
-  }, [target]);
-
-  return portalRoot ? createPortal(children, portalRoot) : null;
-};
--- a/apps/remix/app/components/general/refresh-on-focus.tsx
+++ b/apps/remix/app/components/general/refresh-on-focus.tsx
@@ -3,12 +3,10 @@ import { useCallback, useEffect } from 'react';
 import { useRevalidator } from 'react-router';

 export const RefreshOnFocus = () => {
-  const { revalidate, state } = useRevalidator();
+  const { revalidate } = useRevalidator();

  const onFocus = useCallback(() => {
-    if (state === 'idle') {
-      void revalidate();
-    }
+    void revalidate();
  }, [revalidate]);

  useEffect(() => {
--- a/apps/remix/app/components/general/settings-header.tsx
+++ b/apps/remix/app/components/general/settings-header.tsx
@@ -3,8 +3,8 @@ import React from 'react';
 import { cn } from '@documenso/ui/lib/utils';

 export type SettingsHeaderProps = {
-  title: string | React.ReactNode;
-  subtitle: string | React.ReactNode;
+  title: string;
+  subtitle: string;
  hideDivider?: boolean;
  children?: React.ReactNode;
  className?: string;
--- a/apps/remix/app/components/general/teams/team-layout-billing-banner.tsx
+++ b/apps/remix/app/components/general/teams/team-layout-billing-banner.tsx
@@ -4,7 +4,7 @@ import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import type { TeamMemberRole } from '@prisma/client';
-import { SubscriptionStatus } from '@prisma/client';
+import { type Subscription, SubscriptionStatus } from '@prisma/client';
 import { AlertTriangle } from 'lucide-react';
 import { match } from 'ts-pattern';

@@ -22,13 +22,13 @@ import {
 import { useToast } from '@documenso/ui/primitives/use-toast';

 export type TeamLayoutBillingBannerProps = {
-  subscriptionStatus: SubscriptionStatus;
+  subscription: Subscription;
  teamId: number;
  userRole: TeamMemberRole;
 };

 export const TeamLayoutBillingBanner = ({
-  subscriptionStatus,
+  subscription,
  teamId,
  userRole,
 }: TeamLayoutBillingBannerProps) => {
@@ -59,7 +59,7 @@ export const TeamLayoutBillingBanner = ({
    }
  };

-  if (subscriptionStatus === SubscriptionStatus.ACTIVE) {
+  if (subscription.status === SubscriptionStatus.ACTIVE) {
    return null;
  }

@@ -68,16 +68,16 @@ export const TeamLayoutBillingBanner = ({
      <div
        className={cn({
          'bg-yellow-200 text-yellow-900 dark:bg-yellow-400':
-            subscriptionStatus === SubscriptionStatus.PAST_DUE,
+            subscription.status === SubscriptionStatus.PAST_DUE,
          'bg-destructive text-destructive-foreground':
-            subscriptionStatus === SubscriptionStatus.INACTIVE,
+            subscription.status === SubscriptionStatus.INACTIVE,
        })}
      >
        <div className="mx-auto flex max-w-screen-xl items-center justify-center gap-x-4 px-4 py-2 text-sm font-medium">
          <div className="flex items-center">
            <AlertTriangle className="mr-2.5 h-5 w-5" />

-            {match(subscriptionStatus)
+            {match(subscription.status)
              .with(SubscriptionStatus.PAST_DUE, () => <Trans>Payment overdue</Trans>)
              .with(SubscriptionStatus.INACTIVE, () => <Trans>Teams restricted</Trans>)
              .exhaustive()}
@@ -87,9 +87,9 @@ export const TeamLayoutBillingBanner = ({
            variant="ghost"
            className={cn({
              'text-yellow-900 hover:bg-yellow-100 hover:text-yellow-900 dark:hover:bg-yellow-500':
-                subscriptionStatus === SubscriptionStatus.PAST_DUE,
+                subscription.status === SubscriptionStatus.PAST_DUE,
              'text-destructive-foreground hover:bg-destructive-foreground hover:text-white':
-                subscriptionStatus === SubscriptionStatus.INACTIVE,
+                subscription.status === SubscriptionStatus.INACTIVE,
            })}
            disabled={isPending}
            onClick={() => setIsOpen(true)}
@@ -106,7 +106,7 @@ export const TeamLayoutBillingBanner = ({
            <Trans>Payment overdue</Trans>
          </DialogTitle>

-          {match(subscriptionStatus)
+          {match(subscription.status)
            .with(SubscriptionStatus.PAST_DUE, () => (
              <DialogDescription>
                <Trans>
--- a/apps/remix/app/components/tables/admin-leaderboard-table.tsx
+++ b/apps/remix/app/components/tables/admin-leaderboard-table.tsx
@@ -2,7 +2,7 @@ import { useEffect, useMemo, useState, useTransition } from 'react';

 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
-import { ChevronDownIcon, ChevronUpIcon, ChevronsUpDown, Loader } from 'lucide-react';
+import { ChevronDownIcon as CaretSortIcon, Loader } from 'lucide-react';

 import { useDebouncedValue } from '@documenso/lib/client-only/hooks/use-debounced-value';
 import { useUpdateSearchParams } from '@documenso/lib/client-only/hooks/use-update-search-params';
@@ -52,15 +52,7 @@ export const AdminLeaderboardTable = ({
            onClick={() => handleColumnSort('name')}
          >
            {_(msg`Name`)}
-            {sortBy === 'name' ? (
-              sortOrder === 'asc' ? (
-                <ChevronUpIcon className="ml-2 h-4 w-4" />
-              ) : (
-                <ChevronDownIcon className="ml-2 h-4 w-4" />
-              )
-            ) : (
-              <ChevronsUpDown className="ml-2 h-4 w-4" />
-            )}
+            <CaretSortIcon className="ml-2 h-4 w-4" />
          </div>
        ),
        accessorKey: 'name',
@@ -86,15 +78,7 @@ export const AdminLeaderboardTable = ({
            onClick={() => handleColumnSort('signingVolume')}
          >
            {_(msg`Signing Volume`)}
-            {sortBy === 'signingVolume' ? (
-              sortOrder === 'asc' ? (
-                <ChevronUpIcon className="ml-2 h-4 w-4" />
-              ) : (
-                <ChevronDownIcon className="ml-2 h-4 w-4" />
-              )
-            ) : (
-              <ChevronsUpDown className="ml-2 h-4 w-4" />
-            )}
+            <CaretSortIcon className="ml-2 h-4 w-4" />
          </div>
        ),
        accessorKey: 'signingVolume',
@@ -108,15 +92,7 @@ export const AdminLeaderboardTable = ({
              onClick={() => handleColumnSort('createdAt')}
            >
              {_(msg`Created`)}
-              {sortBy === 'createdAt' ? (
-                sortOrder === 'asc' ? (
-                  <ChevronUpIcon className="ml-2 h-4 w-4" />
-                ) : (
-                  <ChevronDownIcon className="ml-2 h-4 w-4" />
-                )
-              ) : (
-                <ChevronsUpDown className="ml-2 h-4 w-4" />
-              )}
+              <CaretSortIcon className="ml-2 h-4 w-4" />
            </div>
          );
        },
@@ -124,7 +100,7 @@ export const AdminLeaderboardTable = ({
        cell: ({ row }) => i18n.date(row.original.createdAt),
      },
    ] satisfies DataTableColumnDef<SigningVolume>[];
-  }, [sortOrder, sortBy]);
+  }, [sortOrder]);

  useEffect(() => {
    startTransition(() => {
@@ -155,9 +131,6 @@ export const AdminLeaderboardTable = ({
  const handleColumnSort = (column: 'name' | 'createdAt' | 'signingVolume') => {
    startTransition(() => {
      updateSearchParams({
-        search: debouncedSearchString,
-        page,
-        perPage,
        sortBy: column,
        sortOrder: sortBy === column && sortOrder === 'asc' ? 'desc' : 'asc',
      });
--- a/apps/remix/app/components/tables/documents-table-action-dropdown.tsx
+++ b/apps/remix/app/components/tables/documents-table-action-dropdown.tsx
@@ -157,7 +157,7 @@ export const DocumentsTableActionDropdown = ({ row }: DocumentsTableActionDropdo
        </DropdownMenuItem>

        {/* We don't want to allow teams moving documents across at the moment. */}
-        {!team && !row.teamId && (
+        {!team && (
          <DropdownMenuItem onClick={() => setMoveDialogOpen(true)}>
            <MoveRight className="mr-2 h-4 w-4" />
            <Trans>Move to Team</Trans>
@@ -170,7 +170,10 @@ export const DocumentsTableActionDropdown = ({ row }: DocumentsTableActionDropdo
          Void
        </DropdownMenuItem> */}

-        <DropdownMenuItem onClick={() => setDeleteDialogOpen(true)}>
+        <DropdownMenuItem
+          onClick={() => setDeleteDialogOpen(true)}
+          disabled={Boolean(!canManageDocument && team?.teamEmail)}
+        >
          <Trash2 className="mr-2 h-4 w-4" />
          {canManageDocument ? _(msg`Delete`) : _(msg`Hide`)}
        </DropdownMenuItem>
--- a/apps/remix/app/components/tables/templates-table-action-dropdown.tsx
+++ b/apps/remix/app/components/tables/templates-table-action-dropdown.tsx
@@ -2,7 +2,7 @@ import { useState } from 'react';

 import { Trans } from '@lingui/react/macro';
 import type { Recipient, Template, TemplateDirectLink } from '@prisma/client';
-import { Copy, Edit, MoreHorizontal, MoveRight, Share2Icon, Trash2, Upload } from 'lucide-react';
+import { Copy, Edit, MoreHorizontal, MoveRight, Share2Icon, Trash2 } from 'lucide-react';
 import { Link } from 'react-router';

 import { useSession } from '@documenso/lib/client-only/providers/session';
@@ -14,7 +14,6 @@ import {
  DropdownMenuTrigger,
 } from '@documenso/ui/primitives/dropdown-menu';

-import { TemplateBulkSendDialog } from '../dialogs/template-bulk-send-dialog';
 import { TemplateDeleteDialog } from '../dialogs/template-delete-dialog';
 import { TemplateDirectLinkDialog } from '../dialogs/template-direct-link-dialog';
 import { TemplateDuplicateDialog } from '../dialogs/template-duplicate-dialog';
@@ -83,24 +82,13 @@ export const TemplatesTableActionDropdown = ({
          <Trans>Direct link</Trans>
        </DropdownMenuItem>

-        {!teamId && !row.teamId && (
+        {!teamId && (
          <DropdownMenuItem onClick={() => setMoveDialogOpen(true)}>
            <MoveRight className="mr-2 h-4 w-4" />
            <Trans>Move to Team</Trans>
          </DropdownMenuItem>
        )}

-        <TemplateBulkSendDialog
-          templateId={row.id}
-          recipients={row.recipients}
-          trigger={
-            <div className="hover:bg-accent hover:text-accent-foreground relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors">
-              <Upload className="mr-2 h-4 w-4" />
-              <Trans>Bulk Send via CSV</Trans>
-            </div>
-          }
-        />
-
        <DropdownMenuItem
          disabled={!isOwner && !isTeamTemplate}
          onClick={() => setDeleteDialogOpen(true)}
--- a/apps/remix/app/entry.client.tsx
+++ b/apps/remix/app/entry.client.tsx
@@ -1,29 +1,13 @@
-import { StrictMode, startTransition, useEffect } from 'react';
+import { StrictMode, startTransition } from 'react';

 import { i18n } from '@lingui/core';
 import { detect, fromHtmlTag } from '@lingui/detect-locale';
 import { I18nProvider } from '@lingui/react';
-import posthog from 'posthog-js';
 import { hydrateRoot } from 'react-dom/client';
 import { HydratedRouter } from 'react-router/dom';

-import { extractPostHogConfig } from '@documenso/lib/constants/feature-flags';
 import { dynamicActivate } from '@documenso/lib/utils/i18n';

-function PosthogInit() {
-  const postHogConfig = extractPostHogConfig();
-
-  useEffect(() => {
-    if (postHogConfig) {
-      posthog.init(postHogConfig.key, {
-        api_host: postHogConfig.host,
-      });
-    }
-  }, []);
-
-  return null;
-}
-
 async function main() {
  const locale = detect(fromHtmlTag('lang')) || 'en';

@@ -36,8 +20,6 @@ async function main() {
        <I18nProvider i18n={i18n}>
          <HydratedRouter />
        </I18nProvider>
-
-        <PosthogInit />
      </StrictMode>,
    );
  });
--- a/apps/remix/app/providers/posthog.tsx
+++ b/apps/remix/app/providers/posthog.tsx
@@ -0,0 +1,47 @@
+import { useEffect } from 'react';
+
+import posthog from 'posthog-js';
+import { useLocation, useSearchParams } from 'react-router';
+
+import { useOptionalSession } from '@documenso/lib/client-only/providers/session';
+import { extractPostHogConfig } from '@documenso/lib/constants/feature-flags';
+
+export function PostHogPageview() {
+  const postHogConfig = extractPostHogConfig();
+
+  const { pathname } = useLocation();
+  const [searchParams] = useSearchParams();
+
+  const { user } = useOptionalSession();
+
+  if (typeof window !== 'undefined' && postHogConfig) {
+    posthog.init(postHogConfig.key, {
+      api_host: postHogConfig.host,
+      disable_session_recording: true,
+      loaded: () => {
+        if (user) {
+          posthog.identify(user.email ?? user.id.toString());
+        } else {
+          posthog.reset();
+        }
+      },
+      custom_campaign_params: ['src'],
+    });
+  }
+
+  useEffect(() => {
+    if (!postHogConfig || !pathname) {
+      return;
+    }
+
+    let url = window.origin + pathname;
+    if (searchParams && searchParams.toString()) {
+      url = url + `?${searchParams.toString()}`;
+    }
+    posthog.capture('$pageview', {
+      $current_url: url,
+    });
+  }, [pathname, searchParams, postHogConfig]);
+
+  return null;
+}
--- a/apps/remix/app/providers/team.tsx
+++ b/apps/remix/app/providers/team.tsx
@@ -1,16 +1,14 @@
 import { createContext, useContext } from 'react';
 import React from 'react';

-import type { TGetTeamsResponse } from '@documenso/lib/server-only/team/get-teams';
-
-type TeamProviderValue = TGetTeamsResponse[0];
+import type { TGetTeamByUrlResponse } from '@documenso/lib/server-only/team/get-team';

 interface TeamProviderProps {
  children: React.ReactNode;
-  team: TeamProviderValue;
+  team: TGetTeamByUrlResponse;
 }

-const TeamContext = createContext<TeamProviderValue | null>(null);
+const TeamContext = createContext<TGetTeamByUrlResponse | null>(null);

 export const useCurrentTeam = () => {
  const context = useContext(TeamContext);
--- a/apps/remix/app/root.tsx
+++ b/apps/remix/app/root.tsx
@@ -1,4 +1,4 @@
-import { useEffect } from 'react';
+import { Suspense, useEffect } from 'react';

 import Plausible from 'plausible-tracker';
 import {
@@ -12,13 +12,12 @@ import {
  useLoaderData,
  useLocation,
 } from 'react-router';
-import { PreventFlashOnWrongTheme, ThemeProvider, useTheme } from 'remix-themes';
+import { ThemeProvider } from 'remix-themes';
+import { getOptionalLoaderSession } from 'server/utils/get-loader-session';

-import { getOptionalSession } from '@documenso/auth/server/lib/utils/get-session';
 import { SessionProvider } from '@documenso/lib/client-only/providers/session';
 import { APP_I18N_OPTIONS, type SupportedLanguageCodes } from '@documenso/lib/constants/i18n';
-import { type TGetTeamsResponse, getTeams } from '@documenso/lib/server-only/team/get-teams';
-import { createPublicEnv, env } from '@documenso/lib/utils/env';
+import { createPublicEnv } from '@documenso/lib/utils/env';
 import { extractLocaleData } from '@documenso/lib/utils/i18n';
 import { TrpcProvider } from '@documenso/trpc/react';
 import { Toaster } from '@documenso/ui/primitives/toaster';
@@ -28,13 +27,13 @@ import type { Route } from './+types/root';
 import stylesheet from './app.css?url';
 import { GenericErrorLayout } from './components/general/generic-error-layout';
 import { RefreshOnFocus } from './components/general/refresh-on-focus';
+import { PostHogPageview } from './providers/posthog';
 import { langCookie } from './storage/lang-cookie.server';
 import { themeSessionResolver } from './storage/theme-session.server';
 import { appMetaTags } from './utils/meta';

 const { trackPageview } = Plausible({
  domain: 'documenso.com',
-  trackLocalhost: false,
 });

 export const links: Route.LinksFunction = () => [
@@ -59,21 +58,8 @@ export function meta() {
  return appMetaTags();
 }

-/**
- * Don't revalidate (run the loader on sequential navigations) on the root layout
- *
- * Update values via providers.
- */
-export const shouldRevalidate = () => false;
-
 export async function loader({ request }: Route.LoaderArgs) {
-  const session = await getOptionalSession(request);
-
-  let teams: TGetTeamsResponse = [];
-
-  if (session.isAuthenticated) {
-    teams = await getTeams({ userId: session.user.id });
-  }
+  const session = getOptionalLoaderSession();

  const { getTheme } = await themeSessionResolver(request);

@@ -87,13 +73,7 @@ export async function loader({ request }: Route.LoaderArgs) {
    {
      lang,
      theme: getTheme(),
-      session: session.isAuthenticated
-        ? {
-            user: session.user,
-            session: session.session,
-            teams,
-          }
-        : null,
+      session,
      publicEnv: createPublicEnv(),
    },
    {
@@ -105,30 +85,12 @@ export async function loader({ request }: Route.LoaderArgs) {
 }

 export function Layout({ children }: { children: React.ReactNode }) {
-  const { theme } = useLoaderData<typeof loader>() || {};
+  const { publicEnv, theme, lang } = useLoaderData<typeof loader>() || {};

-  const location = useLocation();
-
-  useEffect(() => {
-    if (env('NODE_ENV') === 'production') {
-      trackPageview();
-    }
-  }, [location.pathname]);
+  // const [theme] = useTheme();

  return (
-    <ThemeProvider specifiedTheme={theme} themeAction="/api/theme">
-      <LayoutContent>{children}</LayoutContent>
-    </ThemeProvider>
-  );
-}
-
-export function LayoutContent({ children }: { children: React.ReactNode }) {
-  const { publicEnv, session, lang, ...data } = useLoaderData<typeof loader>() || {};
-
-  const [theme] = useTheme();
-
-  return (
-    <html translate="no" lang={lang} data-theme={theme} className={theme ?? ''}>
+    <html translate="no" lang={lang} data-theme={theme ?? ''}>
      <head>
        <meta charSet="utf-8" />
        <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
@@ -140,25 +102,18 @@ export function LayoutContent({ children }: { children: React.ReactNode }) {
        <Meta />
        <Links />
        <meta name="google" content="notranslate" />
-        <PreventFlashOnWrongTheme ssrTheme={Boolean(data.theme)} />
+        {/* <PreventFlashOnWrongTheme ssrTheme={Boolean(theme)} /> */}

-        {/* Fix: https://stackoverflow.com/questions/21147149/flash-of-unstyled-content-fouc-in-firefox-only-is-ff-slow-renderer */}
-        <script>0</script>
+        <Suspense>
+          <PostHogPageview />
+        </Suspense>
      </head>
      <body>
-        <SessionProvider initialSession={session}>
-          <TooltipProvider>
-            <TrpcProvider>
-              {children}
-
-              <Toaster />
-            </TrpcProvider>
-          </TooltipProvider>
-        </SessionProvider>
-
+        {children}
        <ScrollRestoration />
        <Scripts />

+        {/* Todo: Do we want this here? */}
        <RefreshOnFocus />

        <script
@@ -171,15 +126,38 @@ export function LayoutContent({ children }: { children: React.ReactNode }) {
  );
 }

-export default function App() {
-  return <Outlet />;
+export default function App({ loaderData }: Route.ComponentProps) {
+  const location = useLocation();
+
+  useEffect(() => {
+    trackPageview();
+  }, [location.pathname]);
+
+  return (
+    <SessionProvider session={loaderData.session}>
+      {/* Todo: Themes (this won't work for now) */}
+      <ThemeProvider specifiedTheme={loaderData.theme} themeAction="/api/theme">
+        <TooltipProvider>
+          <TrpcProvider>
+            <Outlet />
+
+            <Toaster />
+          </TrpcProvider>
+        </TooltipProvider>
+      </ThemeProvider>
+    </SessionProvider>
+  );
 }

 export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) {
+  console.error('[RootErrorBoundary]', error);
+
  const errorCode = isRouteErrorResponse(error) ? error.status : 500;

-  if (errorCode !== 404) {
-    console.error('[RootErrorBoundary]', error);
+  if (isRouteErrorResponse(error)) {
+    console.log(error.data);
+    console.log(error.status);
+    console.log(error.statusText);
  }

  return <GenericErrorLayout errorCode={errorCode} />;
--- a/apps/remix/app/routes/_authenticated+/_layout.tsx
+++ b/apps/remix/app/routes/_authenticated+/_layout.tsx
@@ -1,9 +1,8 @@
-import { Outlet, redirect } from 'react-router';
+import { Outlet } from 'react-router';
+import { getLoaderSession } from 'server/utils/get-loader-session';

-import { getOptionalSession } from '@documenso/auth/server/lib/utils/get-session';
 import { getLimits } from '@documenso/ee/server-only/limits/client';
 import { LimitsProvider } from '@documenso/ee/server-only/limits/provider/client';
-import { useSession } from '@documenso/lib/client-only/providers/session';
 import { getSiteSettings } from '@documenso/lib/server-only/site-settings/get-site-settings';
 import { SITE_SETTINGS_BANNER_ID } from '@documenso/lib/server-only/site-settings/schemas/banner';

@@ -13,44 +12,33 @@ import { VerifyEmailBanner } from '~/components/general/verify-email-banner';

 import type { Route } from './+types/_layout';

-/**
- * Don't revalidate (run the loader on sequential navigations)
- *
- * Update values via providers.
- */
-export const shouldRevalidate = () => false;
-
 export const loader = async ({ request }: Route.LoaderArgs) => {
+  const { user, teams, currentTeam } = getLoaderSession();
+
  const requestHeaders = Object.fromEntries(request.headers.entries());

-  const session = await getOptionalSession(request);
-
-  if (!session.isAuthenticated) {
-    throw redirect('/signin');
-  }
-
+  // Todo: Should only load this on first render.
  const [limits, banner] = await Promise.all([
-    getLimits({ headers: requestHeaders }),
+    getLimits({ headers: requestHeaders, teamId: currentTeam?.id }),
    getSiteSettings().then((settings) =>
      settings.find((setting) => setting.id === SITE_SETTINGS_BANNER_ID),
    ),
  ]);

  return {
+    user,
+    teams,
    banner,
    limits,
+    teamId: currentTeam?.id,
  };
 };

 export default function Layout({ loaderData }: Route.ComponentProps) {
-  const { user, teams } = useSession();
-
-  const { banner, limits } = loaderData;
+  const { user, teams, banner, limits, teamId } = loaderData;

  return (
-    <LimitsProvider initialValue={limits}>
-      <div id="portal-header"></div>
-
+    <LimitsProvider initialValue={limits} teamId={teamId}>
      {!user.emailVerified && <VerifyEmailBanner email={user.email} />}

      {banner && <AppBanner banner={banner} />}
--- a/apps/remix/app/routes/_authenticated+/admin+/_layout.tsx
+++ b/apps/remix/app/routes/_authenticated+/admin+/_layout.tsx
@@ -1,16 +1,14 @@
 import { Trans } from '@lingui/react/macro';
 import { BarChart3, FileStack, Settings, Trophy, Users, Wallet2 } from 'lucide-react';
 import { Link, Outlet, redirect, useLocation } from 'react-router';
+import { getLoaderSession } from 'server/utils/get-loader-session';

-import { getSession } from '@documenso/auth/server/lib/utils/get-session';
-import { isAdmin } from '@documenso/lib/utils/is-admin';
+import { isAdmin } from '@documenso/lib/next-auth/guards/is-admin';
 import { cn } from '@documenso/ui/lib/utils';
 import { Button } from '@documenso/ui/primitives/button';

-import type { Route } from './+types/_layout';
-
-export async function loader({ request }: Route.LoaderArgs) {
-  const { user } = await getSession(request);
+export function loader() {
+  const { user } = getLoaderSession();

  if (!user || !isAdmin(user)) {
    throw redirect('/documents');
--- a/apps/remix/app/routes/_authenticated+/admin+/documents.$id.tsx
+++ b/apps/remix/app/routes/_authenticated+/admin+/documents.$id.tsx
@@ -31,6 +31,9 @@ import type { Route } from './+types/documents.$id';

 export async function loader({ params }: Route.LoaderArgs) {
  const id = Number(params.id);
+  // Todo: Is it possible for this to return data to the frontend w/out auth layout due to race condition?
+  // Todo: Is it possible for this to return data to the frontend w/out auth layout due to race condition?
+  // Todo: Is it possible for this to return data to the frontend w/out auth layout due to race condition?

  if (isNaN(id)) {
    throw redirect('/admin/documents');
--- a/apps/remix/app/routes/_authenticated+/documents+/$id._index.tsx
+++ b/apps/remix/app/routes/_authenticated+/documents+/$id._index.tsx
@@ -3,14 +3,13 @@ import { Plural, Trans } from '@lingui/react/macro';
 import { DocumentStatus, TeamMemberRole } from '@prisma/client';
 import { ChevronLeft, Clock9, Users2 } from 'lucide-react';
 import { Link, redirect } from 'react-router';
+import { getLoaderSession } from 'server/utils/get-loader-session';
 import { match } from 'ts-pattern';

-import { getSession } from '@documenso/auth/server/lib/utils/get-session';
 import { useSession } from '@documenso/lib/client-only/providers/session';
 import { getDocumentById } from '@documenso/lib/server-only/document/get-document-by-id';
 import { getFieldsForDocument } from '@documenso/lib/server-only/field/get-fields-for-document';
 import { getRecipientsForDocument } from '@documenso/lib/server-only/recipient/get-recipients-for-document';
-import { type TGetTeamByUrlResponse, getTeamByUrl } from '@documenso/lib/server-only/team/get-team';
 import { DocumentVisibility } from '@documenso/lib/types/document-visibility';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
 import { Badge } from '@documenso/ui/primitives/badge';
@@ -33,16 +32,10 @@ import {
 import { StackAvatarsWithTooltip } from '~/components/general/stack-avatars-with-tooltip';
 import { superLoaderJson, useSuperLoaderData } from '~/utils/super-json-loader';

-import type { Route } from './+types/documents.$id._index';
+import type { Route } from './+types/$id._index';

-export async function loader({ params, request }: Route.LoaderArgs) {
-  const { user } = await getSession(request);
-
-  let team: TGetTeamByUrlResponse | null = null;
-
-  if (params.teamUrl) {
-    team = await getTeamByUrl({ userId: user.id, teamUrl: params.teamUrl });
-  }
+export async function loader({ params }: Route.LoaderArgs) {
+  const { user, currentTeam: team } = getLoaderSession();

  const { id } = params;

@@ -88,7 +81,27 @@ export async function loader({ params, request }: Route.LoaderArgs) {
    throw redirect(documentRootPath);
  }

-  // Todo: Get full document instead?
+  const { documentMeta } = document;
+
+  // Todo: We don't handle encrypted files right.
+  // if (documentMeta?.password) {
+  //   const key = DOCUMENSO_ENCRYPTION_KEY;
+
+  //   if (!key) {
+  //     throw new Error('Missing DOCUMENSO_ENCRYPTION_KEY');
+  //   }
+
+  //   const securePassword = Buffer.from(
+  //     symmetricDecrypt({
+  //       key,
+  //       data: documentMeta.password,
+  //     }),
+  //   ).toString('utf-8');
+
+  //   documentMeta.password = securePassword;
+  // }
+
+  // Todo: Get full document instead???
  const [recipients, fields] = await Promise.all([
    getRecipientsForDocument({
      documentId,
--- a/apps/remix/app/routes/_authenticated+/documents+/$id.edit.tsx
+++ b/apps/remix/app/routes/_authenticated+/documents+/$id.edit.tsx
@@ -2,12 +2,11 @@ import { Plural, Trans } from '@lingui/react/macro';
 import { DocumentStatus as InternalDocumentStatus, TeamMemberRole } from '@prisma/client';
 import { ChevronLeft, Users2 } from 'lucide-react';
 import { Link, redirect } from 'react-router';
+import { getLoaderSession } from 'server/utils/get-loader-session';
 import { match } from 'ts-pattern';

-import { getSession } from '@documenso/auth/server/lib/utils/get-session';
 import { isUserEnterprise } from '@documenso/ee/server-only/util/is-document-enterprise';
 import { getDocumentWithDetailsById } from '@documenso/lib/server-only/document/get-document-with-details-by-id';
-import { type TGetTeamByUrlResponse, getTeamByUrl } from '@documenso/lib/server-only/team/get-team';
 import { DocumentVisibility } from '@documenso/lib/types/document-visibility';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';

@@ -16,16 +15,10 @@ import { DocumentStatus } from '~/components/general/document/document-status';
 import { StackAvatarsWithTooltip } from '~/components/general/stack-avatars-with-tooltip';
 import { superLoaderJson, useSuperLoaderData } from '~/utils/super-json-loader';

-import type { Route } from './+types/documents.$id.edit';
+import type { Route } from './+types/$id.edit';

-export async function loader({ params, request }: Route.LoaderArgs) {
-  const { user } = await getSession(request);
-
-  let team: TGetTeamByUrlResponse | null = null;
-
-  if (params.teamUrl) {
-    team = await getTeamByUrl({ userId: user.id, teamUrl: params.teamUrl });
-  }
+export async function loader({ params }: Route.LoaderArgs) {
+  const { user, currentTeam: team } = getLoaderSession();

  const { id } = params;

@@ -75,6 +68,24 @@ export async function loader({ params, request }: Route.LoaderArgs) {
    throw redirect(`${documentRootPath}/${documentId}`);
  }

+  // Todo: We don't handle encrypted files right.
+  // if (documentMeta?.password) {
+  //   const key = DOCUMENSO_ENCRYPTION_KEY;
+
+  //   if (!key) {
+  //     throw new Error('Missing DOCUMENSO_ENCRYPTION_KEY');
+  //   }
+
+  //   const securePassword = Buffer.from(
+  //     symmetricDecrypt({
+  //       key,
+  //       data: documentMeta.password,
+  //     }),
+  //   ).toString('utf-8');
+
+  //   documentMeta.password = securePassword;
+  // }
+
  const isDocumentEnterprise = await isUserEnterprise({
    userId: user.id,
    teamId: team?.id,
--- a/apps/remix/app/routes/_authenticated+/documents+/$id.logs.tsx
+++ b/apps/remix/app/routes/_authenticated+/documents+/$id.logs.tsx
@@ -6,11 +6,10 @@ import type { Recipient } from '@prisma/client';
 import { ChevronLeft } from 'lucide-react';
 import { DateTime } from 'luxon';
 import { Link, redirect } from 'react-router';
+import { getLoaderSession } from 'server/utils/get-loader-session';

-import { getSession } from '@documenso/auth/server/lib/utils/get-session';
 import { getDocumentById } from '@documenso/lib/server-only/document/get-document-by-id';
 import { getRecipientsForDocument } from '@documenso/lib/server-only/recipient/get-recipients-for-document';
-import { type TGetTeamByUrlResponse, getTeamByUrl } from '@documenso/lib/server-only/team/get-team';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
 import { Card } from '@documenso/ui/primitives/card';

@@ -22,19 +21,13 @@ import {
 } from '~/components/general/document/document-status';
 import { DocumentLogsTable } from '~/components/tables/document-logs-table';

-import type { Route } from './+types/documents.$id.logs';
-
-export async function loader({ params, request }: Route.LoaderArgs) {
-  const { user } = await getSession(request);
-
-  let team: TGetTeamByUrlResponse | null = null;
-
-  if (params.teamUrl) {
-    team = await getTeamByUrl({ userId: user.id, teamUrl: params.teamUrl });
-  }
+import type { Route } from './+types/$id.logs';

+export async function loader({ params }: Route.LoaderArgs) {
  const { id } = params;

+  const { user, currentTeam: team } = getLoaderSession();
+
  const documentId = Number(id);

  const documentRootPath = formatDocumentsPath(team?.url);
@@ -43,7 +36,7 @@ export async function loader({ params, request }: Route.LoaderArgs) {
    throw redirect(documentRootPath);
  }

-  // Todo: Get full document instead?
+  // Todo:  Get detailed?
  const [document, recipients] = await Promise.all([
    getDocumentById({
      documentId,
--- a/apps/remix/app/routes/_authenticated+/documents+/_index.tsx
+++ b/apps/remix/app/routes/_authenticated+/documents+/_index.tsx
@@ -59,26 +59,15 @@ export default function DocumentsPage() {
    [searchParams],
  );

-  const { data, isLoading, isLoadingError, refetch } = trpc.document.findDocumentsInternal.useQuery(
-    {
-      ...findDocumentSearchParams,
-    },
-  );
-
-  // Refetch the documents when the team URL changes.
-  useEffect(() => {
-    void refetch();
-  }, [team?.url]);
+  const { data, isLoading, isLoadingError } = trpc.document.findDocumentsInternal.useQuery({
+    ...findDocumentSearchParams,
+  });

  const getTabHref = (value: keyof typeof ExtendedDocumentStatus) => {
    const params = new URLSearchParams(searchParams);

    params.set('status', value);

-    if (value === ExtendedDocumentStatus.ALL) {
-      params.delete('status');
-    }
-
    if (params.has('page')) {
      params.delete('page');
    }
--- a/apps/remix/app/components/general/skeletons/document-edit-skeleton.tsx
+++ b/apps/remix/app/components/general/skeletons/document-edit-skeleton.tsx
@@ -4,7 +4,7 @@ import { Link } from 'react-router';

 import { Skeleton } from '@documenso/ui/primitives/skeleton';

-export default function DocumentEditSkeleton() {
+export default function Loading() {
  return (
    <div className="mx-auto -mt-4 flex w-full max-w-screen-xl flex-col px-4 md:px-8">
      <Link to="/documents" className="flex grow-0 items-center text-[#7AC455] hover:opacity-80">
--- a/apps/remix/app/routes/_authenticated+/settings+/billing.tsx
+++ b/apps/remix/app/routes/_authenticated+/settings+/billing.tsx
@@ -1,156 +0,0 @@
-import { Trans, useLingui } from '@lingui/react/macro';
-import { SubscriptionStatus } from '@prisma/client';
-import { redirect } from 'react-router';
-import { match } from 'ts-pattern';
-
-import { getSession } from '@documenso/auth/server/lib/utils/get-session';
-import { getStripeCustomerByUser } from '@documenso/ee/server-only/stripe/get-customer';
-import { getPricesByInterval } from '@documenso/ee/server-only/stripe/get-prices-by-interval';
-import { getPrimaryAccountPlanPrices } from '@documenso/ee/server-only/stripe/get-primary-account-plan-prices';
-import { getProductByPriceId } from '@documenso/ee/server-only/stripe/get-product-by-price-id';
-import { IS_BILLING_ENABLED } from '@documenso/lib/constants/app';
-import { STRIPE_PLAN_TYPE } from '@documenso/lib/constants/billing';
-import { type Stripe } from '@documenso/lib/server-only/stripe';
-import { getSubscriptionsByUserId } from '@documenso/lib/server-only/subscription/get-subscriptions-by-user-id';
-
-import { BillingPlans } from '~/components/general/billing-plans';
-import { BillingPortalButton } from '~/components/general/billing-portal-button';
-import { appMetaTags } from '~/utils/meta';
-
-import type { Route } from './+types/billing';
-
-export function meta() {
-  return appMetaTags('Billing');
-}
-
-export async function loader({ request }: Route.LoaderArgs) {
-  const { user } = await getSession(request);
-
-  // Redirect if subscriptions are not enabled.
-  if (!IS_BILLING_ENABLED()) {
-    throw redirect('/settings/profile');
-  }
-
-  if (!user.customerId) {
-    await getStripeCustomerByUser(user).then((result) => result.user);
-  }
-
-  const [subscriptions, prices, primaryAccountPlanPrices] = await Promise.all([
-    getSubscriptionsByUserId({ userId: user.id }),
-    getPricesByInterval({ plans: [STRIPE_PLAN_TYPE.REGULAR, STRIPE_PLAN_TYPE.PLATFORM] }),
-    getPrimaryAccountPlanPrices(),
-  ]);
-
-  const primaryAccountPlanPriceIds = primaryAccountPlanPrices.map(({ id }) => id);
-
-  let subscriptionProduct: Stripe.Product | null = null;
-
-  const primaryAccountPlanSubscriptions = subscriptions.filter(({ priceId }) =>
-    primaryAccountPlanPriceIds.includes(priceId),
-  );
-
-  const subscription =
-    primaryAccountPlanSubscriptions.find(({ status }) => status === SubscriptionStatus.ACTIVE) ??
-    primaryAccountPlanSubscriptions[0];
-
-  if (subscription?.priceId) {
-    subscriptionProduct = await getProductByPriceId({ priceId: subscription.priceId }).catch(
-      () => null,
-    );
-  }
-
-  const isMissingOrInactiveOrFreePlan =
-    !subscription || subscription.status === SubscriptionStatus.INACTIVE;
-
-  return {
-    prices,
-    subscription,
-    subscriptionProductName: subscriptionProduct?.name,
-    isMissingOrInactiveOrFreePlan,
-  };
-}
-
-export default function TeamsSettingBillingPage({ loaderData }: Route.ComponentProps) {
-  const { prices, subscription, subscriptionProductName, isMissingOrInactiveOrFreePlan } =
-    loaderData;
-
-  const { i18n } = useLingui();
-
-  return (
-    <div>
-      <div className="flex flex-row items-end justify-between">
-        <div>
-          <h3 className="text-2xl font-semibold">
-            <Trans>Billing</Trans>
-          </h3>
-
-          <div className="text-muted-foreground mt-2 text-sm">
-            {isMissingOrInactiveOrFreePlan && (
-              <p>
-                <Trans>
-                  You are currently on the <span className="font-semibold">Free Plan</span>.
-                </Trans>
-              </p>
-            )}
-
-            {/* Todo: Translation */}
-            {!isMissingOrInactiveOrFreePlan &&
-              match(subscription.status)
-                .with('ACTIVE', () => (
-                  <p>
-                    {subscriptionProductName ? (
-                      <span>
-                        You are currently subscribed to{' '}
-                        <span className="font-semibold">{subscriptionProductName}</span>
-                      </span>
-                    ) : (
-                      <span>You currently have an active plan</span>
-                    )}
-
-                    {subscription.periodEnd && (
-                      <span>
-                        {' '}
-                        which is set to{' '}
-                        {subscription.cancelAtPeriodEnd ? (
-                          <span>
-                            end on{' '}
-                            <span className="font-semibold">
-                              {i18n.date(subscription.periodEnd)}.
-                            </span>
-                          </span>
-                        ) : (
-                          <span>
-                            automatically renew on{' '}
-                            <span className="font-semibold">
-                              {i18n.date(subscription.periodEnd)}.
-                            </span>
-                          </span>
-                        )}
-                      </span>
-                    )}
-                  </p>
-                ))
-                .with('PAST_DUE', () => (
-                  <p>
-                    <Trans>
-                      Your current plan is past due. Please update your payment information.
-                    </Trans>
-                  </p>
-                ))
-                .otherwise(() => null)}
-          </div>
-        </div>
-
-        {isMissingOrInactiveOrFreePlan && (
-          <BillingPortalButton>
-            <Trans>Manage billing</Trans>
-          </BillingPortalButton>
-        )}
-      </div>
-
-      <hr className="my-4" />
-
-      {isMissingOrInactiveOrFreePlan ? <BillingPlans prices={prices} /> : <BillingPortalButton />}
-    </div>
-  );
-}
--- a/apps/remix/app/routes/_authenticated+/settings+/public-profile+/index.tsx
+++ b/apps/remix/app/routes/_authenticated+/settings+/public-profile+/index.tsx
@@ -5,8 +5,8 @@ import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import type { TemplateDirectLink } from '@prisma/client';
 import { TemplateType } from '@prisma/client';
+import { getLoaderSession } from 'server/utils/get-loader-session';

-import { getSession } from '@documenso/auth/server/lib/utils/get-session';
 import { useSession } from '@documenso/lib/client-only/providers/session';
 import { getUserPublicProfile } from '@documenso/lib/server-only/user/get-user-public-profile';
 import { trpc } from '@documenso/trpc/react';
@@ -21,10 +21,10 @@ import { ManagePublicTemplateDialog } from '~/components/dialogs/public-profile-
 import type { TPublicProfileFormSchema } from '~/components/forms/public-profile-form';
 import { PublicProfileForm } from '~/components/forms/public-profile-form';
 import { SettingsHeader } from '~/components/general/settings-header';
-import { SettingsPublicProfileTemplatesTable } from '~/components/tables/settings-public-profile-templates-table';
 import { useOptionalCurrentTeam } from '~/providers/team';

-import type { Route } from './+types/public-profile';
+import { SettingsPublicProfileTemplatesTable } from '../../../../components/tables/settings-public-profile-templates-table';
+import type { Route } from './+types/index';

 type DirectTemplate = FindTemplateRow & {
  directLink: Pick<TemplateDirectLink, 'token' | 'enabled'>;
@@ -44,8 +44,8 @@ const teamProfileText = {
  templatesSubtitle: msg`Show templates in your team public profile for your audience to sign and get started quickly`,
 };

-export async function loader({ request }: Route.LoaderArgs) {
-  const { user } = await getSession(request);
+export async function loader() {
+  const { user } = getLoaderSession();

  const { profile } = await getUserPublicProfile({
    userId: user.id,
@@ -60,7 +60,7 @@ export default function PublicProfilePage({ loaderData }: Route.ComponentProps)
  const { _ } = useLingui();
  const { toast } = useToast();

-  const { user, refreshSession } = useSession();
+  const { user } = useSession();
  const team = useOptionalCurrentTeam();

  const [isPublicProfileVisible, setIsPublicProfileVisible] = useState(profile.enabled);
@@ -96,9 +96,6 @@ export default function PublicProfilePage({ loaderData }: Route.ComponentProps)
      });
    } else {
      await updateUserProfile(data);
-
-      // Need to refresh session because we're editing the user's profile.
-      await refreshSession();
    }

    if (data.enabled === undefined && !isPublicProfileVisible) {
--- a/apps/remix/app/routes/_authenticated+/settings+/security+/activity+/index.tsx
+++ b/apps/remix/app/routes/_authenticated+/settings+/security+/activity+/index.tsx
@@ -18,7 +18,10 @@ export default function SettingsSecurityActivity() {
        title={_(msg`Security activity`)}
        subtitle={_(msg`View all security activity related to your account.`)}
        hideDivider={true}
-      />
+      >
+        {/* Todo */}
+        {/* <ActivityPageBackButton /> */}
+      </SettingsHeader>

      <div className="mt-4">
        <SettingsSecurityActivityTable />
--- a/apps/remix/app/routes/_authenticated+/settings+/security+/index.tsx
+++ b/apps/remix/app/routes/_authenticated+/settings+/security+/index.tsx
@@ -2,8 +2,8 @@ import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { Link } from 'react-router';
+import { getLoaderSession } from 'server/utils/get-loader-session';

-import { getSession } from '@documenso/auth/server/lib/utils/get-session';
 import { useSession } from '@documenso/lib/client-only/providers/session';
 import { prisma } from '@documenso/prisma';
 import { Alert, AlertDescription, AlertTitle } from '@documenso/ui/primitives/alert';
@@ -16,51 +16,39 @@ import { PasswordForm } from '~/components/forms/password';
 import { SettingsHeader } from '~/components/general/settings-header';
 import { appMetaTags } from '~/utils/meta';

-import type { Route } from './+types/security._index';
+import type { Route } from './+types';

 export function meta() {
  return appMetaTags('Security');
 }

-export async function loader({ request }: Route.LoaderArgs) {
-  const { user } = await getSession(request);
+export async function loader() {
+  const { user } = getLoaderSession();

-  // Todo: Use providers instead after RR7 migration.
-  // const accounts = await prisma.account.findMany({
-  //   where: {
-  //     userId: user.id,
-  //   },
-  //   select: {
-  //     provider: true,
-  //   },
-  // });
+  const accounts = await prisma.account.findMany({
+    where: {
+      userId: user.id,
+    },
+    select: {
+      provider: true,
+    },
+  });

-  // const providers = accounts.map((account) => account.provider);
-  // let hasEmailPasswordAccount = providers.includes('DOCUMENSO');
-
-  const hasEmailPasswordAccount: boolean = await prisma.user
-    .count({
-      where: {
-        id: user.id,
-        password: {
-          not: null,
-        },
-      },
-    })
-    .then((value) => value > 0);
+  const providers = accounts.map((account) => account.provider);

  return {
-    // providers,
-    hasEmailPasswordAccount,
+    providers,
  };
 }

 export default function SettingsSecurity({ loaderData }: Route.ComponentProps) {
-  const { hasEmailPasswordAccount } = loaderData;
+  const { providers } = loaderData;

  const { _ } = useLingui();
  const { user } = useSession();

+  const hasEmailPasswordAccount = providers.includes('DOCUMENSO');
+
  return (
    <div>
      <SettingsHeader
--- a/apps/remix/app/routes/_authenticated+/settings+/security+/passkeys+/index.tsx
+++ b/apps/remix/app/routes/_authenticated+/settings+/security+/passkeys+/index.tsx
--- a/apps/remix/app/routes/_authenticated+/settings+/teams+/index.tsx
+++ b/apps/remix/app/routes/_authenticated+/settings+/teams+/index.tsx
@@ -7,10 +7,11 @@ import { AnimateGenericFadeInOut } from '@documenso/ui/components/animate/animat

 import { TeamCreateDialog } from '~/components/dialogs/team-create-dialog';
 import { SettingsHeader } from '~/components/general/settings-header';
-import { TeamEmailUsage } from '~/components/general/teams/team-email-usage';
-import { TeamInvitations } from '~/components/general/teams/team-invitations';
 import { UserSettingsTeamsPageDataTable } from '~/components/tables/user-settings-teams-page-table';

+import { TeamEmailUsage } from './team-email-usage';
+import { TeamInvitations } from './team-invitations';
+
 export default function TeamsSettingsPage() {
  const { _ } = useLingui();

--- a/apps/remix/app/routes/_authenticated+/settings+/teams+/team-email-usage.tsx
+++ b/apps/remix/app/routes/_authenticated+/settings+/teams+/team-email-usage.tsx
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
David Nguyen	12f3b7629e	fix: wip	2025-02-12 23:17:43 +11:00
David Nguyen	1d7f3723bc	fix: meta	2025-02-12 19:10:41 +11:00
David Nguyen	4c57095ee1	fix: wip	2025-02-12 18:39:00 +11:00
David Nguyen	15922d447b	fix: wip	2025-02-12 16:41:35 +11:00
David Nguyen	548d92c2fc	fix: wip	2025-02-11 02:04:00 +11:00
David Nguyen	d24f67d922	fix: wip	2025-02-10 03:33:22 +11:00
David Nguyen	5b395fc9ad	fix: wip	2025-02-09 21:57:26 +11:00
David Nguyen	e128e9369e	fix: auth	2025-02-09 00:46:25 +11:00
David Nguyen	f5bfec1990	fix: dev	2025-02-08 20:38:47 +11:00
David Nguyen	82b5795636	fix: build	2025-02-08 20:35:20 +11:00
David Nguyen	4aec21a37f	fix: migrate lingui	2025-02-07 19:40:21 +11:00
David Nguyen	19dc43dca1	fix: migrate lingui	2025-02-07 19:33:58 +11:00
David Nguyen	d3392dada7	fix: minimal vite config	2025-02-07 16:33:30 +11:00
David Nguyen	8373af3f41	fix: wip	2025-02-07 00:58:50 +11:00
David Nguyen	e5cc6455dd	fix: wip	2025-02-06 15:36:25 +11:00
David Nguyen	b127fae0e0	fix: wip	2025-02-06 15:14:16 +11:00
David Nguyen	6fa3751a72	fix: wip	2025-02-06 14:09:44 +11:00
David Nguyen	d164b90aa3	fix: wip	2025-02-06 11:54:54 +11:00
David Nguyen	738201eb55	fix: errors	2025-02-06 01:57:23 +11:00
David Nguyen	7effe66387	fix: wip	2025-02-05 23:37:21 +11:00
David Nguyen	9c7910a070	fix: chao nextjs	2025-02-05 15:55:20 +11:00
David Nguyen	f55ccb21dd	fix: wip	2025-02-05 14:59:08 +11:00
David Nguyen	6b4c33a1bf	fix: wip	2025-02-05 01:29:26 +11:00
David Nguyen	f4b2f8614e	fix: wip	2025-02-05 00:57:10 +11:00
David Nguyen	1057ae6d2a	fix: wip	2025-02-05 00:57:00 +11:00
David Nguyen	540cc5bfc1	fix: wip	2025-02-04 22:25:11 +11:00
David Nguyen	381a9d3fb8	fix: wip	2025-02-04 16:24:26 +11:00
David Nguyen	e5a9d9ddf0	fix: add embed	2025-02-03 23:56:27 +11:00
David Nguyen	d1913dbf9c	fix: wip	2025-02-03 20:09:35 +11:00
David Nguyen	8bffa7c3ed	fix: wip	2025-02-03 19:52:23 +11:00
David Nguyen	b2af10173a	fix: wip	2025-02-03 14:10:28 +11:00
David Nguyen	28fb35327d	fix: wip	2025-01-31 23:29:42 +11:00
David Nguyen	e20cb7e179	fix: wip	2025-01-31 23:17:50 +11:00
David Nguyen	aec44b78d0	fix: wip	2025-01-31 18:57:45 +11:00
David Nguyen	d7d0fca501	fix: wip	2025-01-31 14:09:02 +11:00
Mythie	f7a98180d7	wip	2025-01-30 14:54:15 +11:00