fix: test

.env.example

@@ -27,16 +27,6 @@ E2E_TEST_AUTHENTICATE_USERNAME="Test User"
 E2E_TEST_AUTHENTICATE_USER_EMAIL="testuser@mail.com"
 E2E_TEST_AUTHENTICATE_USER_PASSWORD="test_Password123"
 
-# [[SIGNING]]
-# OPTIONAL: Defines the signing transport to use. Available options: local (default)
-NEXT_PRIVATE_SIGNING_TRANSPORT="local"
-# OPTIONAL: Defines the passphrase for the signing certificate.
-NEXT_PRIVATE_SIGNING_PASSPHRASE=
-# OPTIONAL: Defines the file contents for the signing certificate as a base64 encoded string.
-NEXT_PRIVATE_SIGNING_LOCAL_FILE_CONTENTS=
-# OPTIONAL: Defines the file path for the signing certificate. defaults to ./example/cert.p12
-NEXT_PRIVATE_SIGNING_LOCAL_FILE_PATH=
-
 # [[STORAGE]]
 # OPTIONAL: Defines the storage transport to use. Available options: database (default) | s3
 NEXT_PUBLIC_UPLOAD_TRANSPORT="database"

.github/workflows/publish.yml

@@ -1,133 +0,0 @@
-name: Publish Docker
-
-on:
-  push:
-    branches: ['release']
-
-jobs:
-  build_and_publish_platform_containers:
-    name: Build and publish platform containers
-    runs-on: ${{ matrix.os }}
-    strategy:
-      fail-fast: false
-      matrix:
-        os:
-          - warp-ubuntu-latest-x64-4x
-          - warp-ubuntu-latest-arm64-4x
-
-    steps:
-      - uses: actions/checkout@v4
-        with:
-          fetch-tags: true
-
-      - name: Login to DockerHub
-        uses: docker/login-action@v3
-        with:
-          username: ${{ secrets.DOCKERHUB_USERNAME }}
-          password: ${{ secrets.DOCKERHUB_TOKEN }}
-
-      - name: Login to GitHub Container Registry
-        uses: docker/login-action@v3
-        with:
-          registry: ghcr.io
-          username: ${{ github.repository_owner }}
-          password: ${{ secrets.GH_TOKEN }}
-
-      - name: Build the docker image
-        env:
-          BUILD_PLATFORM: ${{ matrix.os == 'warp-ubuntu-latest-arm64-4x' && 'arm64' || 'amd64' }}
-        run: |
-          APP_VERSION="$(git name-rev --tags --name-only $(git rev-parse HEAD) | head -n 1 | sed 's/\^0//')"
-          GIT_SHA="$(git rev-parse HEAD)"
-
-          docker build \
-            -f ./docker/Dockerfile \
-            --progress=plain \
-            -t "documenso/documenso-$BUILD_PLATFORM:latest" \
-            -t "documenso/documenso-$BUILD_PLATFORM:$GIT_SHA" \
-            -t "documenso/documenso-$BUILD_PLATFORM:$APP_VERSION" \
-            -t "ghcr.io/documenso/documenso-$BUILD_PLATFORM:latest" \
-            -t "ghcr.io/documenso/documenso-$BUILD_PLATFORM:$GIT_SHA" \
-            -t "ghcr.io/documenso/documenso-$BUILD_PLATFORM:$APP_VERSION" \
-            .
-
-      - name: Push the docker image to DockerHub
-        run: docker push --all-tags "documenso/documenso-$BUILD_PLATFORM"
-        env:
-          BUILD_PLATFORM: ${{ matrix.os == 'warp-ubuntu-latest-arm64-4x' && 'arm64' || 'amd64' }}
-
-      - name: Push the docker image to GitHub Container Registry
-        run: docker push --all-tags "ghcr.io/documenso/documenso-$BUILD_PLATFORM"
-        env:
-          BUILD_PLATFORM: ${{ matrix.os == 'warp-ubuntu-latest-arm64-4x' && 'arm64' || 'amd64' }}
-
-  create_and_publish_manifest:
-    name: Create and publish manifest
-    runs-on: ubuntu-latest
-    needs: build_and_publish_platform_containers
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-        with:
-          fetch-tags: true
-
-      - name: Login to DockerHub
-        uses: docker/login-action@v3
-        with:
-          username: ${{ secrets.DOCKERHUB_USERNAME }}
-          password: ${{ secrets.DOCKERHUB_TOKEN }}
-
-      - name: Login to GitHub Container Registry
-        uses: docker/login-action@v3
-        with:
-          registry: ghcr.io
-          username: ${{ github.repository_owner }}
-          password: ${{ secrets.GH_TOKEN }}
-
-      - name: Create and push DockerHub manifest
-        run: |
-          APP_VERSION="$(git name-rev --tags --name-only $(git rev-parse HEAD) | head -n 1 | sed 's/\^0//')"
-          GIT_SHA="$(git rev-parse HEAD)"
-
-          docker manifest create \
-            documenso/documenso:latest \
-            --amend documenso/documenso-amd64:latest \
-            --amend documenso/documenso-arm64:latest \
-
-          docker manifest create \
-            documenso/documenso:$GIT_SHA \
-            --amend documenso/documenso-amd64:$GIT_SHA \
-            --amend documenso/documenso-arm64:$GIT_SHA \
-
-          docker manifest create \
-            documenso/documenso:$APP_VERSION \
-            --amend documenso/documenso-amd64:$APP_VERSION \
-            --amend documenso/documenso-arm64:$APP_VERSION \
-
-          docker manifest push documenso/documenso:latest
-          docker manifest push documenso/documenso:$GIT_SHA
-          docker manifest push documenso/documenso:$APP_VERSION
-
-      - name: Create and push Github Container Registry manifest
-        run: |
-          APP_VERSION="$(git name-rev --tags --name-only $(git rev-parse HEAD) | head -n 1 | sed 's/\^0//')"
-          GIT_SHA="$(git rev-parse HEAD)"
-
-          docker manifest create \
-            ghcr.io/documenso/documenso:latest \
-            --amend ghcr.io/documenso/documenso-amd64:latest \
-            --amend ghcr.io/documenso/documenso-arm64:latest \
-
-          docker manifest create \
-            ghcr.io/documenso/documenso:$GIT_SHA \
-            --amend ghcr.io/documenso/documenso-amd64:$GIT_SHA \
-            --amend ghcr.io/documenso/documenso-arm64:$GIT_SHA \
-
-          docker manifest create \
-            ghcr.io/documenso/documenso:$APP_VERSION \
-            --amend ghcr.io/documenso/documenso-amd64:$APP_VERSION \
-            --amend ghcr.io/documenso/documenso-arm64:$APP_VERSION \
-
-          docker manifest push ghcr.io/documenso/documenso:latest
-          docker manifest push ghcr.io/documenso/documenso:$GIT_SHA
-          docker manifest push ghcr.io/documenso/documenso:$APP_VERSION

README.md

@@ -1,3 +1,5 @@
+> 🚨 It is Launch Week #2 - Day 1: We launches teams 🎉 https://documen.so/day1
+
 <img src="https://github.com/documenso/documenso/assets/13398220/a643571f-0239-46a6-a73e-6bef38d1228b" alt="Documenso Logo">
 
 <p align="center" style="margin-top: 20px">
@@ -27,11 +29,20 @@
    <a href="https://vscode.dev/redirect?url=vscode://ms-vscode-remote.remote-containers/cloneInVolume?url=https://github.com/documenso/documenso">
    <img alt="open in devcontainer" src="https://img.shields.io/static/v1?label=Dev%20Containers&message=Enabled&color=blue&logo=visualstudiocode" />
    </a>
-   <a href="CODE_OF_CONDUCT.md"><img src="https://img.shields.io/badge/Contributor%20Covenant-2.1-4baaaa.svg" alt="Contributor Covenant"></a>
+   <a href="code_of_conduct.md"><img src="https://img.shields.io/badge/Contributor%20Covenant-2.1-4baaaa.svg" alt="Contributor Covenant"></a>
 </p>
 
-<div align="center">
-  <img src="https://github.com/documenso/documenso/assets/13398220/d96ed533-6f34-4a97-be9b-442bdb189c69" style="width: 80%;" />
+<div>
+  <img style="display: block; height: 120px; width: 24%"
+    src="https://github.com/documenso/documenso/assets/1309312/67e08c98-c153-4115-aa2d-77979bb12c94)">
+  <img style="display: block; height: 120px; width: 24%"
+    src="https://github.com/documenso/documenso/assets/1309312/040cfbae-3438-4ca3-87f2-ce52c793dcaf">
+  <img style="display: block; height: 120px; width: 24%"
+    src="https://github.com/documenso/documenso/assets/1309312/72d445be-41e5-4936-bdba-87ef8e70fa09">
+  <img style="display: block; height: 120px; width: 24%"
+    src="https://github.com/documenso/documenso/assets/1309312/d7b86c0f-a755-4476-a022-a608db2c4633">
+  <img style="display: block; height: 120px; width: 24%"
+    src=https://github.com/documenso/documenso/assets/1309312/c0f55116-ab82-433f-a266-f3fc8571d69f">
 </div>
 
 ## About this project
@@ -198,16 +209,7 @@ If you're a visual learner and prefer to watch a video walkthrough of setting up
 
 ## Docker
 
-We provide a Docker container for Documenso, which is published on both DockerHub and GitHub Container Registry.
-
-- DockerHub: [https://hub.docker.com/r/documenso/documenso](https://hub.docker.com/r/documenso/documenso)
-- GitHub Container Registry: [https://ghcr.io/documenso/documenso](https://ghcr.io/documenso/documenso)
-
-You can pull the Docker image from either of these registries and run it with your preferred container hosting provider.
-
-Please note that you will need to provide environment variables for connecting to the database, mailserver, and so forth.
-
-For detailed instructions on how to configure and run the Docker container, please refer to the [Docker README](./docker/README.md) in the `docker` directory.
+🚧 Docker containers and images are current in progress. We are actively working on bringing a simple Docker build and publish pipeline for Documenso.
 
 ## Self Hosting
 

apps/marketing/content/blog/public-api.mdx

@@ -1,292 +0,0 @@
----
-title: 'Building the Documenso Public API - The Why and How'
-description: 'This article talks about the need for the public API and the process of building it. It also discusses the requirements we had to meet and the constraints we had to work within.'
-authorName: 'Catalin'
-authorImage: '/blog/blog-author-catalin.webp'
-authorRole: 'I like to code and write'
-date: 2024-03-08
-tags:
-  - Development
-  - API
----
-
-This article covers the process of building the public API for Documenso. It starts by explaining why the API was needed for a digital document signing company in the first place. Then, it'll dive into the steps we took to build it. Lastly, it'll present the requirements we had to meet and the constraints we had to work within.
-
-## Why the public API
-
-We decided to build the public API to open a new way of interacting with Documenso. While the web app does the job well, there are use cases where it's not enough. In those cases, the users might want to interact with the platform programmatically. Usually, that's for integrating Documenso with other applications.
-
-With the new public API that's now possible. You can integrate Documenso's functionalities within other applications to automate tasks, create custom solutions, and build custom workflows, to name just a few.
-
-The API provides 12 endpoints at the time of writing this article:
-
-- (GET) `/api/v1/documents` - retrieve all the documents
-- (POST) `/api/v1/documents` - upload a new document and getting a presigned URL
-- (GET) `/api/v1/documents/{id}` - fetch a specific document
-- (DELETE) `/api/v1/documents/{id}` - delete a specific document
-- (POST) `/api/v1/templates/{templateId}/create-document` - create a new document from an existing template
-- (POST) `/api/v1/documents/{id}/send` - send a document for signing
-- (POST) `/api/v1/documents/{id}/recipients` - create a document recipient
-- (PATCH) `/api/v1/documents/{id}/recipients/{recipientId}` - update the details of a document recipient
-- (DELETE) `/api/v1/documents/{id}/recipients/{recipientId}` - delete a specific recipient from a document
-- (POST) `/api/v1/documents/{id}/fields` - create a field for a document
-- (PATCH) `/api/v1/documents/{id}/fields` - update the details of a document field
-- (DELETE) `/api/v1/documents/{id}/fields` - delete a field from a document
-
-> Check out the [API documentation](https://app.documenso.com/api/v1/openapi).
-
-Moreover, it also enables us to enhance the platform by bringing other integrations to Documenso, such as Zapier.
-
-In conclusion, the new public API extends Documenso's capabilities, provides more flexibility for users, and opens up a broader world of possibilities.
-
-## Picking the right approach & tech
-
-Once we decided to build the API, we had to choose the approach and technologies to use. There were 2 options:
-
-1. Build an additional application
-2. Launch the API in the existing codebase
-
-### 1. Build an additional application
-
-That would mean creating a new codebase and building the API from scratch. Having a separate app for the API would result in benefits such as:
-
-- lower latency responses
-- supporting larger field uploads
-- separation between the apps (Documenso and the API)
-- customizability and flexibility
-- easier testing and debugging
-
-This approach has significant benefits. However, one major drawback is that it requires additional resources.
-
-We'd have to spend a lot of time just on the core stuff, such as building and configuring the basic server. After that, we'd spend time implementing the endpoints and authorization, among other things. When the building is done, there will be another application to deploy and manage. All of this would stretch our already limited resources.
-
-So, we asked ourselves if there is another way of doing it without sacrificing the API quality and the developer experience.
-
-### 2. Launch the API in the existing codebase
-
-The other option was to launch the API in the existing codebase. Rather than writing everything from scratch, we could use most of our existing code.
-
-Since we're using tRPC for our internal API (backend), we looked for solutions that work well with tRPC. We narrowed down the choices to:
-
-- [trpc-openapi](https://github.com/jlalmes/trpc-openapi)
-- [ts-rest](https://ts-rest.com/)
-
-Both technologies allow you to build public APIs. The `trpc-openapi` technology allows you to easily turn tRPC procedures into REST endpoints. It's more like a plugin for tRPC.
-
-On the other hand, `ts-rest` is more of a standalone solution. `ts-rest` enables you to create a contract for the API, which can be used both on the client and server. You can consume and implement the contract in your application, thus providing end-to-end type safety and RPC-like client.
-
-> You can see a [comparison between trpc-openapi and ts-rest](https://catalins.tech/public-api-trpc/) here.
-
-So, the main difference between the 2 is that `trpc-openapi` is like a plugin that extends tRPC's capabilities, whereas `ts-rest` provides the tools for building a standalone API.
-
-### Our choice
-
-After analyzing and comparing the 2 options, we decided to go with `ts-rest` because of its benefits. Here's a paragraph from the `ts-rest` documentation that hits the nail on the head:
-
-> tRPC has many plugins to solve this issue by mapping the API implementation to a REST-like API, however, these approaches are often a bit clunky and reduce the safety of the system overall, ts-rest does this heavy lifting in the client and server implementations rather than requiring a second layer of abstraction and API endpoint(s) to be defined.
-
-## API Requirements
-
-We defined the following requirements for the API:
-
-- The API should use path-based versioning (e.g. `/v1`)
-- The system should use bearer tokens for API authentication
-  - The API token should be a random string of 32 to 40 characters
-- The system should hash the token and store the hashed value
-- The system should only display the API token when it's created
-- The API should have self-generated documentation like Swagger
-- Users should be able to create an API key
-  - Users should be able to choose a token name
-  - Users should be able to choose an expiration date for the token
-    - User should be able to choose between 7 days, 1 month, 3 months, 6 months, 12 months, never
-- System should display all the user's tokens in the settings page
-  - System should display the token name, creation date, expiration date and a delete button
-- Users should be able to delete an API key
-- Users should be able to retrieve all the documents from their account
-- Users should be able to upload a new document
-  - Users should receive an S3 pre-signed URL after a successful upload
-- Users should be able to retrieve a specific document from their account by its id
-- Users should be able to delete a specific document from their account by its id
-- Users should be able to create a new document from an existing document template
-- Users should be able to send a document for signing to 1 or more recipients
-- Users should be able to create a recipient for a document
-- Users should be able to update the details of a recipient
-- Users should be able to delete a recipient from a document
-- Users should be able to create a field (e.g. signature, email, name, date) for a document
-- Users should be able to update a field for a document
-- Users should be able to delete a field from a document
-
-## Constraints
-
-We also faced the following constraints while developing the API:
-
-**1. Resources**
-
-Limited resources were one of the main constraints. We're a new startup with a relatively small team. Building and maintaining an additional application would strain our limited resources.
-
-**2. Technology stack**
-
-Another constraint was the technology stack. Our tech stack includes TypeScript, Prisma, and tRPC, among others. We also use Vercel for hosting.
-
-As a result, we wanted to use technologies we are comfortable with. This allowed us to leverage our existing knowledge and ensured consistency across our applications.
-
-Using familiar technologies also meant we could develop the API faster, as we didn't have to spend time learning new technologies. We could also leverage existing code and tools used in our main application.
-
-It's worth mentioning that this is not a permanent decision. We're open to moving the API to another codebase/tech stack when it makes sense (e.g. API is heavily used and needs better performance).
-
-**3. File uploads**
-
-Due to our current architecture, we support file uploads with a maximum size of 50 MB. To circumvent this, we created an additional step for uploading documents.
-
-Users make a POST request to the `/api/v1/documents` endpoint and the API responds with an S3 pre-signed URL. The users then make a 2nd request to the pre-signed URL with their document.
-
-## How we built the API
-
-![API package diagram](api-package.webp)
-
-Our codebase is a monorepo, so we created a new API package in the `packages` directory. It contains both the API implementation and its documentation. The main 2 blocks of the implementation consist of the API contract and the code for the API endpoints.
-
-![API implementation diagram](api-implementation.webp)
-
-In a few words, the API contract defines the API structure, the format of the requests and responses, how to authenticate API calls, the available endpoints and their associated HTTP verbs. You can explore the [API contract](https://github.com/documenso/documenso/blob/main/packages/api/v1/contract.ts) on GitHub.
-
-Then, there's the implementation part, which is the actual code for each endpoint defined in the API contract. The implementation is where the API contract is brought to life and made functional.
-
-Let's take the endpoint `/api/v1/documents` as an example.
-
-```ts
-export const ApiContractV1 = c.router(
-  {
-    getDocuments: {
-      method: 'GET',
-      path: '/api/v1/documents',
-      query: ZGetDocumentsQuerySchema,
-      responses: {
-        200: ZSuccessfulResponseSchema,
-        401: ZUnsuccessfulResponseSchema,
-        404: ZUnsuccessfulResponseSchema,
-      },
-      summary: 'Get all documents',
-    },
-    ...
-  }
-);
-```
-
-The API contract specifies the following things for `getDocuments`:
-
-- the allowed HTTP request method is GET, so trying to make a POST request, for example, results in an error
-- the path is `/api/v1/documents`
-- the query parameters the user can pass with the request
-  - in this case - `page` and `perPage`
-- the allowed responses and their schema
-  - `200` returns an object containing an array of all documents and a field `totalPages`, which is self-explanatory
-  - `401` returns an object with a message such as "Unauthorized"
-  - `404` returns an object with a message such as "Not found"
-
-The implementation of this endpoint needs to match the contract completely; otherwise, `ts-rest` will complain, and your API might not work as intended.
-
-The `getDocuments` function from the `implementation.ts` file runs when the user hits the endpoint.
-
-```ts
-export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
-  getDocuments: authenticatedMiddleware(async (args, user, team) => {
-    const page = Number(args.query.page) || 1;
-    const perPage = Number(args.query.perPage) || 10;
-
-    const { data: documents, totalPages } = await findDocuments({
-      page,
-      perPage,
-      userId: user.id,
-      teamId: team?.id,
-    });
-
-    return {
-      status: 200,
-      body: {
-        documents,
-        totalPages,
-      },
-    };
-  }),
-  ...
-});
-```
-
-There is a middleware, too, `authenticatedMiddleware`, that handles the authentication for API requests. It ensures that the API token exists and the token used has the appropriate privileges for the resource it accesses.
-
-That's how the other endpoints work as well. The code differs, but the principles are the same. You can explore the [API implementation](https://github.com/documenso/documenso/blob/main/packages/api/v1/implementation.ts) and the [middleware code](https://github.com/documenso/documenso/blob/main/packages/api/v1/middleware/authenticated.ts) on GitHub.
-
-### Documentation
-
-For the documentation, we decided to use Swagger UI, which automatically generates the documentation from the OpenAPI specification.
-
-The OpenAPI specification describes an API containing the available endpoints and their HTTP request methods, authentication methods, and so on. Its purpose is to help both machines and humans understand the API without having to look at the code.
-The Documenso OpenAPI specification is live [here](https://documenso.com/api/v1/openapi.json).
-
-Thankfully, `ts-rest` makes it seamless to generate the OpenAPI specification.
-
-```ts
-import { generateOpenApi } from '@ts-rest/open-api';
-
-import { ApiContractV1 } from './contract';
-
-export const OpenAPIV1 = generateOpenApi(
-  ApiContractV1,
-  {
-    info: {
-      title: 'Documenso API',
-      version: '1.0.0',
-      description: 'The Documenso API for retrieving, creating, updating and deleting documents.',
-    },
-  },
-  {
-    setOperationId: true,
-  },
-);
-```
-
-Then, the Swagger UI takes the OpenAPI specification as a prop and generates the documentation. The code below shows the component responsible for generating the documentation.
-
-```ts
-'use client';
-
-import SwaggerUI from 'swagger-ui-react';
-import 'swagger-ui-react/swagger-ui.css';
-
-import { OpenAPIV1 } from '@documenso/api/v1/openapi';
-
-export const OpenApiDocsPage = () => {
-  return <SwaggerUI spec={OpenAPIV1} displayOperationId={true} />;
-};
-
-export default OpenApiDocsPage;
-```
-
-Lastly, we create an API endpoint to display the Swagger documentation. The code below dynamically imports the `OpenApiDocsPage` component and displays it.
-
-```ts
-'use client';
-
-import dynamic from 'next/dynamic';
-
-const Docs = dynamic(async () => import('@documenso/api/v1/api-documentation'), {
-  ssr: false,
-});
-
-export default function OpenApiDocsPage() {
-  return <Docs />;
-}
-```
-
-You can access and play around with the documentation at [documenso.com/api/v1/openapi](https://documenso.com/api/v1/openapi). You should see a page like the one shown in the screenshot below.
-
-![The documentation for the Documenso API](docs.webp)
-
-> This article shows how to [generate Swagger documentation for a Next.js API](https://catalins.tech/generate-swagger-documentation-next-js-api/).
-
-So, that's how we went about building the first iteration of the public API after taking into consideration all the constraints and the current needs. The [GitHub pull request for the API](https://github.com/documenso/documenso/pull/674) is publicly available on GitHub. You can go through it at your own pace.
-
-## Conclusion
-
-The current architecture and approach work well for our current stage and needs. However, as we continue to grow and evolve, our architecture and approach will likely need to adapt. We monitor API usage and performance regularly and collect feedback from users. This enables us to find areas for improvement, understand our users' needs, and make informed decisions about the next steps.

apps/marketing/content/blog/removing-server-actions.mdx

@@ -1,56 +0,0 @@
----
-title: 'Embracing the Future and Moving Back Again: From Server Actions to tRPC'
-description: 'This article talks about the need for the public API and the process of building it. It also talks about the requirements, constraints, challenges and lessons learnt from building it.'
-authorName: 'Lucas Smith'
-authorImage: '/blog/blog-author-lucas.png'
-authorRole: 'Co-Founder'
-date: 2024-03-07
-tags:
-  - Development
----
-
-On October 26, 2022, during the Next.js Conf, Vercel unveiled Next.js 13, introducing a bunch of new features and a whole new paradigm shift for creating Next.js apps.
-
-React Server Components (RSCs) have been known for some time but haven't yet been implemented in a React meta-framework. With Next.js now adding them, the world of server-side rendering React applications was about to change.
-
-## The promise of React Server Components
-
-Described by Vercel as a tool for writing UIs rendered or optionally cached on the server, RSC promised direct integration with databases and server-specific capabilities, a departure from the typical React and SSR models.
-
-This feature initially appeared as a game-changer, promising simpler data fetching and routing, thanks to async server components and additional nested layout support.
-
-After experimenting with it for about six months on other projects, I came to the conclusion that while it was a little rough at the edges, it was indeed a game changer and something that should be adopted in Next.js projects moving forward.
-
-## A new new paradigm: Server Actions
-
-Vercel didn't stop at adding Server Components. A short while after the initial Next.js 13 release, they introduced "Server Actions." Server Actions allow for the calling of server-side functions without API routes, reducing the amount of ceremony required for adding a new mutation or event to your application.
-
-## Betting on new technology
-
-Following the release of both Server Actions and Server Components, we at Documenso embarked on a rewrite of the application. We had accumulated a bit of technical debt from the initial MVP, which was best shed as we also improved the design with help from our new designer.
-
-Having had much success with Server Components on other projects, I opted to go all in on both Server Components and Server Actions for the new version of the application. I was excited to see how much simpler and more efficient the application would be with these new technologies.
-
-Following our relaunch, we felt quite happy with our choices of server actions, which even let us cocktail certain client—and server-side logic into a single component without needing a bunch of effort on our end.
-
-## Navigating challenges with Server Actions
-
-While initially successful, we soon encountered issues with Server Actions, particularly when monitoring the application. Unfortunately, server actions make it much harder to monitor network requests and identify failed server actions since they use the route that they are currently on.
-
-Despite this issue, things were manageable; however, a critical issue arose when the usage of server actions caused bundle corruption, resulting in a top-level await insertion that would cause builds and tests to fail.
-
-This last issue was a deal breaker since it highlighted how much magic we were relying on with server actions. I like to avoid adding more magic where possible since, with bundlers and meta-frameworks, we are already handing off a lot of heavy lifting and getting a lot of magic in return.
-
-## Going all in on tRPC
-
-My quick and final solution to the issues we were facing was to fully embrace [tRPC](https://trpc.io/), which we already used in other app areas. The migration took less than a day and resolved all our issues while adding a lot more visibility to failing actions since they now had a dedicated API route.
-
-For those unfamiliar with tRPC, it is a framework for building end-to-end typesafe APIs with TypeScript and Next.js. It's an awesome library that lets you call your defined API safely within the client, causing build time errors when things inevitably drift.
-
-I've been a big fan of tRPC for some time now, so the decision to drop server actions and instead use more of tRPC was easy for me.
-
-## Lessons learned and the future
-
-While I believe server actions are a great idea, and I'm sure they will be improved in the future, I've relearned the lesson that it's best to avoid magic where possible.
-
-This doesn't mean we won't consider moving certain things back to server actions in the future. But for now, we will wait and watch how others use them and how they evolve.

apps/marketing/contentlayer.config.ts

@@ -12,7 +12,6 @@ export const BlogPost = defineDocumentType(() => ({
     authorName: { type: 'string', required: true },
     authorImage: { type: 'string', required: false },
     authorRole: { type: 'string', required: true },
-    cta: { type: 'boolean', required: false, default: true },
   },
   computedFields: {
     href: { type: 'string', resolve: (post) => `/${post._raw.flattenedPath}` },

apps/marketing/next.config.js

@@ -21,7 +21,6 @@ const FONT_CAVEAT_BYTES = fs.readFileSync(
 const config = {
   experimental: {
     outputFileTracingRoot: path.join(__dirname, '../../'),
-    serverComponentsExternalPackages: ['@node-rs/bcrypt'],
     serverActions: {
       bodySizeLimit: '50mb',
     },

apps/marketing/package.json

@@ -36,7 +36,7 @@
     "react-hook-form": "^7.43.9",
     "react-icons": "^4.11.0",
     "recharts": "^2.7.2",
-    "sharp": "^0.33.1",
+    "sharp": "0.33.1",
     "typescript": "5.2.2",
     "zod": "^3.22.4"
   },

apps/marketing/src/app/(marketing)/blog/[post]/opengraph-image.tsx

@@ -1,21 +1,25 @@
 import { ImageResponse } from 'next/og';
-import { NextResponse } from 'next/server';
+
+import { allBlogPosts } from 'contentlayer/generated';
 
 export const runtime = 'edge';
 
-const IMAGE_SIZE = {
+export const contentType = 'image/png';
+
+export const IMAGE_SIZE = {
   width: 1200,
   height: 630,
 };
 
-export async function GET(_request: Request) {
-  const url = new URL(_request.url);
+type BlogPostOpenGraphImageProps = {
+  params: { post: string };
+};
 
-  const title = url.searchParams.get('title');
-  const author = url.searchParams.get('author');
+export default async function BlogPostOpenGraphImage({ params }: BlogPostOpenGraphImageProps) {
+  const blogPost = allBlogPosts.find((post) => post._raw.flattenedPath === `blog/${params.post}`);
 
-  if (!title || !author) {
-    return NextResponse.json({ error: 'Not found' }, { status: 404 });
+  if (!blogPost) {
+    return null;
   }
 
   // The long urls are needed for a compiler optimisation on the Next.js side, lifting this up
@@ -45,10 +49,10 @@ export async function GET(_request: Request) {
         <img src={logoImage} alt="logo" tw="h-8" />
 
         <h1 tw="mt-8 text-6xl text-center flex items-center justify-center w-full max-w-[800px] font-bold text-center mx-auto">
-          {title}
+          {blogPost.title}
         </h1>
 
-        <p tw="font-normal">Written by {author}</p>
+        <p tw="font-normal">Written by {blogPost.authorName}</p>
       </div>
     ),
     {

apps/marketing/src/app/(marketing)/blog/[post]/page.tsx

@@ -7,8 +7,6 @@ import { ChevronLeft } from 'lucide-react';
 import type { MDXComponents } from 'mdx/types';
 import { useMDXComponent } from 'next-contentlayer/hooks';
 
-import { CallToAction } from '~/components/(marketing)/call-to-action';
-
 export const dynamic = 'force-dynamic';
 
 export const generateMetadata = ({ params }: { params: { post: string } }) => {
@@ -20,23 +18,11 @@ export const generateMetadata = ({ params }: { params: { post: string } }) => {
     };
   }
 
-  // Use the url constructor to ensure that things are escaped as they should be
-  const searchParams = new URLSearchParams({
-    title: blogPost.title,
-    author: blogPost.authorName,
-  });
-
   return {
     title: {
       absolute: `${blogPost.title} - Documenso Blog`,
     },
     description: blogPost.description,
-    openGraph: {
-      images: [`${blogPost.href}/opengraph?${searchParams.toString()}`],
-    },
-    twitter: {
-      images: [`${blogPost.href}/opengraph?${searchParams.toString()}`],
-    },
   };
 };
 
@@ -56,57 +42,53 @@ export default function BlogPostPage({ params }: { params: { post: string } }) {
   const MDXContent = useMDXComponent(post.body.code);
 
   return (
-    <div>
-      <article className="prose dark:prose-invert mx-auto py-8">
-        <div className="mb-6 text-center">
-          <time dateTime={post.date} className="text-muted-foreground mb-1 text-xs">
-            {new Date(post.date).toLocaleDateString()}
-          </time>
+    <article className="prose dark:prose-invert mx-auto py-8">
+      <div className="mb-6 text-center">
+        <time dateTime={post.date} className="text-muted-foreground mb-1 text-xs">
+          {new Date(post.date).toLocaleDateString()}
+        </time>
 
-          <h1 className="text-3xl font-bold">{post.title}</h1>
+        <h1 className="text-3xl font-bold">{post.title}</h1>
 
-          <div className="not-prose relative -mt-2 flex items-center gap-x-4 border-b border-t py-4">
-            <div className="bg-foreground h-10 w-10 rounded-full">
-              {post.authorImage && (
-                <img
-                  src={post.authorImage}
-                  alt={`Image of ${post.authorName}`}
-                  className="bg-foreground/10 h-10 w-10 rounded-full"
-                />
-              )}
-            </div>
+        <div className="not-prose relative -mt-2 flex items-center gap-x-4 border-b border-t py-4">
+          <div className="bg-foreground h-10 w-10 rounded-full">
+            {post.authorImage && (
+              <img
+                src={post.authorImage}
+                alt={`Image of ${post.authorName}`}
+                className="bg-foreground/10 h-10 w-10 rounded-full"
+              />
+            )}
+          </div>
 
-            <div className="text-sm leading-6">
-              <p className="text-foreground text-left font-semibold">{post.authorName}</p>
-              <p className="text-muted-foreground">{post.authorRole}</p>
-            </div>
+          <div className="text-sm leading-6">
+            <p className="text-foreground text-left font-semibold">{post.authorName}</p>
+            <p className="text-muted-foreground">{post.authorRole}</p>
           </div>
         </div>
+      </div>
 
-        <MDXContent components={mdxComponents} />
+      <MDXContent components={mdxComponents} />
 
-        {post.tags.length > 0 && (
-          <ul className="not-prose flex list-none flex-row space-x-2 px-0">
-            {post.tags.map((tag, i) => (
-              <li
-                key={`tag-${i}`}
-                className="bg-muted hover:bg-muted/60 text-foreground relative z-10 whitespace-nowrap rounded-full px-3 py-1.5 text-sm font-medium"
-              >
-                {tag}
-              </li>
-            ))}
-          </ul>
-        )}
+      {post.tags.length > 0 && (
+        <ul className="not-prose flex list-none flex-row space-x-2 px-0">
+          {post.tags.map((tag, i) => (
+            <li
+              key={`tag-${i}`}
+              className="bg-muted hover:bg-muted/60 text-foreground relative z-10 whitespace-nowrap rounded-full px-3 py-1.5 text-sm font-medium"
+            >
+              {tag}
+            </li>
+          ))}
+        </ul>
+      )}
 
-        <hr />
+      <hr />
 
-        <Link href="/blog" className="text-muted-foreground flex items-center hover:opacity-60">
-          <ChevronLeft className="mr-2 h-6 w-6" />
-          Back to all posts
-        </Link>
-      </article>
-
-      {post.cta && <CallToAction className="mt-8" utmSource={`blog_${params.post}`} />}
-    </div>
+      <Link href="/blog" className="text-muted-foreground flex items-center hover:opacity-60">
+        <ChevronLeft className="mr-2 h-6 w-6" />
+        Back to all posts
+      </Link>
+    </article>
   );
 }

apps/marketing/src/app/(marketing)/open/cap-table.tsx

@@ -1,7 +1,6 @@
 'use client';
 
-import type { HTMLAttributes } from 'react';
-import { useEffect, useState } from 'react';
+import { HTMLAttributes, useEffect, useState } from 'react';
 
 import { Cell, Legend, Pie, PieChart, Tooltip } from 'recharts';
 

apps/marketing/src/app/(marketing)/open/monthly-new-users-chart.tsx

@@ -14,7 +14,7 @@ export type MonthlyNewUsersChartProps = {
 export const MonthlyNewUsersChart = ({ className, data }: MonthlyNewUsersChartProps) => {
   const formattedData = [...data].reverse().map(({ month, count }) => {
     return {
-      month: DateTime.fromFormat(month, 'yyyy-MM').toFormat('LLLL'),
+      month: DateTime.fromFormat(month, 'yyyy-MM').toFormat('LLL'),
       count: Number(count),
     };
   });
@@ -32,9 +32,6 @@ export const MonthlyNewUsersChart = ({ className, data }: MonthlyNewUsersChartPr
             <YAxis />
 
             <Tooltip
-              labelStyle={{
-                color: 'hsl(var(--primary-foreground))',
-              }}
               formatter={(value) => [Number(value).toLocaleString('en-US'), 'New Users']}
               cursor={{ fill: 'hsl(var(--primary) / 10%)' }}
             />

apps/marketing/src/app/(marketing)/open/monthly-total-users-chart.tsx

@@ -14,7 +14,7 @@ export type MonthlyTotalUsersChartProps = {
 export const MonthlyTotalUsersChart = ({ className, data }: MonthlyTotalUsersChartProps) => {
   const formattedData = [...data].reverse().map(({ month, cume_count: count }) => {
     return {
-      month: DateTime.fromFormat(month, 'yyyy-MM').toFormat('LLLL'),
+      month: DateTime.fromFormat(month, 'yyyy-MM').toFormat('LLL'),
       count: Number(count),
     };
   });
@@ -32,9 +32,6 @@ export const MonthlyTotalUsersChart = ({ className, data }: MonthlyTotalUsersCha
             <YAxis />
 
             <Tooltip
-              labelStyle={{
-                color: 'hsl(var(--primary-foreground))',
-              }}
               formatter={(value) => [Number(value).toLocaleString('en-US'), 'Total Users']}
               cursor={{ fill: 'hsl(var(--primary) / 10%)' }}
             />

apps/marketing/src/app/(marketing)/open/page.tsx

@@ -7,7 +7,6 @@ import { getUserMonthlyGrowth } from '@documenso/lib/server-only/user/get-user-m
 import { FUNDING_RAISED } from '~/app/(marketing)/open/data';
 import { MetricCard } from '~/app/(marketing)/open/metric-card';
 import { SalaryBands } from '~/app/(marketing)/open/salary-bands';
-import { CallToAction } from '~/components/(marketing)/call-to-action';
 
 import { BarMetric } from './bar-metrics';
 import { CapTable } from './cap-table';
@@ -16,7 +15,6 @@ import { MonthlyNewUsersChart } from './monthly-new-users-chart';
 import { MonthlyTotalUsersChart } from './monthly-total-users-chart';
 import { TeamMembers } from './team-members';
 import { OpenPageTooltip } from './tooltip';
-import { Typefully } from './typefully';
 
 export const metadata: Metadata = {
   title: 'Open Startup',
@@ -142,118 +140,112 @@ export default async function OpenPage() {
   const MONTHLY_USERS = await getUserMonthlyGrowth();
 
   return (
-    <div>
-      <div className="mx-auto mt-6 max-w-screen-lg sm:mt-12">
-        <div className="flex flex-col items-center justify-center">
-          <h1 className="text-3xl font-bold lg:text-5xl">Open Startup</h1>
+    <div className="mx-auto mt-6 max-w-screen-lg sm:mt-12">
+      <div className="flex flex-col items-center justify-center">
+        <h1 className="text-3xl font-bold lg:text-5xl">Open Startup</h1>
 
-          <p className="text-muted-foreground mt-4 max-w-[60ch] text-center text-lg leading-normal">
-            All our metrics, finances, and learnings are public. We believe in transparency and want
-            to share our journey with you. You can read more about why here:{' '}
-            <a
-              className="font-bold"
-              href="https://documenso.com/blog/pre-seed"
-              target="_blank"
-              rel="noreferrer"
-            >
-              Announcing Open Metrics
-            </a>
-          </p>
-        </div>
-
-        <div className="mt-12 grid grid-cols-12 gap-8">
-          <div className="col-span-12 grid grid-cols-4 gap-4">
-            <MetricCard
-              className="col-span-2 lg:col-span-1"
-              title="Stargazers"
-              value={stargazersCount.toLocaleString('en-US')}
-            />
-            <MetricCard
-              className="col-span-2 lg:col-span-1"
-              title="Forks"
-              value={forksCount.toLocaleString('en-US')}
-            />
-            <MetricCard
-              className="col-span-2 lg:col-span-1"
-              title="Open Issues"
-              value={openIssues.toLocaleString('en-US')}
-            />
-            <MetricCard
-              className="col-span-2 lg:col-span-1"
-              title="Merged PR's"
-              value={mergedPullRequests.toLocaleString('en-US')}
-            />
-          </div>
-
-          <TeamMembers className="col-span-12" />
-
-          <SalaryBands className="col-span-12" />
-
-          <FundingRaised data={FUNDING_RAISED} className="col-span-12 lg:col-span-6" />
-
-          <CapTable className="col-span-12 lg:col-span-6" />
-
-          <BarMetric<EarlyAdoptersType>
-            data={EARLY_ADOPTERS_DATA}
-            metricKey="earlyAdopters"
-            title="Early Adopters"
-            label="Early Adopters"
-            className="col-span-12 lg:col-span-6"
-            extraInfo={<OpenPageTooltip />}
-          />
-
-          <BarMetric<StargazersType>
-            data={STARGAZERS_DATA}
-            metricKey="stars"
-            title="Github: Total Stars"
-            label="Stars"
-            className="col-span-12 lg:col-span-6"
-          />
-
-          <BarMetric<StargazersType>
-            data={STARGAZERS_DATA}
-            metricKey="mergedPRs"
-            title="Github: Total Merged PRs"
-            label="Merged PRs"
-            chartHeight={300}
-            className="col-span-12 lg:col-span-6"
-          />
-
-          <BarMetric<StargazersType>
-            data={STARGAZERS_DATA}
-            metricKey="forks"
-            title="Github: Total Forks"
-            label="Forks"
-            chartHeight={300}
-            className="col-span-12 lg:col-span-6"
-          />
-
-          <BarMetric<StargazersType>
-            data={STARGAZERS_DATA}
-            metricKey="openIssues"
-            title="Github: Total Open Issues"
-            label="Open Issues"
-            chartHeight={300}
-            className="col-span-12 lg:col-span-6"
-          />
-
-          <MonthlyTotalUsersChart data={MONTHLY_USERS} className="col-span-12 lg:col-span-6" />
-          <MonthlyNewUsersChart data={MONTHLY_USERS} className="col-span-12 lg:col-span-6" />
-
-          <Typefully className="col-span-12 lg:col-span-6" />
-
-          <div className="col-span-12 mt-12 flex flex-col items-center justify-center">
-            <h2 className="text-2xl font-bold">Where's the rest?</h2>
-
-            <p className="text-muted-foreground mt-4 max-w-[55ch] text-center text-lg leading-normal">
-              We're still working on getting all our metrics together. We'll update this page as
-              soon as we have more to share.
-            </p>
-          </div>
-        </div>
+        <p className="text-muted-foreground mt-4 max-w-[60ch] text-center text-lg leading-normal">
+          All our metrics, finances, and learnings are public. We believe in transparency and want
+          to share our journey with you. You can read more about why here:{' '}
+          <a
+            className="font-bold"
+            href="https://documenso.com/blog/pre-seed"
+            target="_blank"
+            rel="noreferrer"
+          >
+            Announcing Open Metrics
+          </a>
+        </p>
       </div>
 
-      <CallToAction className="mt-12" utmSource="open-page" />
+      <div className="mt-12 grid grid-cols-12 gap-8">
+        <div className="col-span-12 grid grid-cols-4 gap-4">
+          <MetricCard
+            className="col-span-2 lg:col-span-1"
+            title="Stargazers"
+            value={stargazersCount.toLocaleString('en-US')}
+          />
+          <MetricCard
+            className="col-span-2 lg:col-span-1"
+            title="Forks"
+            value={forksCount.toLocaleString('en-US')}
+          />
+          <MetricCard
+            className="col-span-2 lg:col-span-1"
+            title="Open Issues"
+            value={openIssues.toLocaleString('en-US')}
+          />
+          <MetricCard
+            className="col-span-2 lg:col-span-1"
+            title="Merged PR's"
+            value={mergedPullRequests.toLocaleString('en-US')}
+          />
+        </div>
+
+        <TeamMembers className="col-span-12" />
+
+        <SalaryBands className="col-span-12" />
+
+        <FundingRaised data={FUNDING_RAISED} className="col-span-12 lg:col-span-6" />
+
+        <CapTable className="col-span-12 lg:col-span-6" />
+
+        <BarMetric<EarlyAdoptersType>
+          data={EARLY_ADOPTERS_DATA}
+          metricKey="earlyAdopters"
+          title="Early Adopters"
+          label="Early Adopters"
+          className="col-span-12 lg:col-span-6"
+          extraInfo={<OpenPageTooltip />}
+        />
+
+        <BarMetric<StargazersType>
+          data={STARGAZERS_DATA}
+          metricKey="stars"
+          title="Github: Total Stars"
+          label="Stars"
+          className="col-span-12 lg:col-span-6"
+        />
+
+        <BarMetric<StargazersType>
+          data={STARGAZERS_DATA}
+          metricKey="mergedPRs"
+          title="Github: Total Merged PRs"
+          label="Merged PRs"
+          chartHeight={300}
+          className="col-span-12 lg:col-span-6"
+        />
+
+        <BarMetric<StargazersType>
+          data={STARGAZERS_DATA}
+          metricKey="forks"
+          title="Github: Total Forks"
+          label="Forks"
+          chartHeight={300}
+          className="col-span-12 lg:col-span-6"
+        />
+
+        <BarMetric<StargazersType>
+          data={STARGAZERS_DATA}
+          metricKey="openIssues"
+          title="Github: Total Open Issues"
+          label="Open Issues"
+          chartHeight={300}
+          className="col-span-12 lg:col-span-6"
+        />
+
+        <MonthlyTotalUsersChart data={MONTHLY_USERS} className="col-span-12 lg:col-span-6" />
+        <MonthlyNewUsersChart data={MONTHLY_USERS} className="col-span-12 lg:col-span-6" />
+
+        <div className="col-span-12 mt-12 flex flex-col items-center justify-center">
+          <h2 className="text-2xl font-bold">Where's the rest?</h2>
+
+          <p className="text-muted-foreground mt-4 max-w-[55ch] text-center text-lg leading-normal">
+            We're still working on getting all our metrics together. We'll update this page as soon
+            as we have more to share.
+          </p>
+        </div>
+      </div>
     </div>
   );
 }

apps/marketing/src/app/(marketing)/open/typefully.tsx

@@ -1,39 +0,0 @@
-'use client';
-
-import type { HTMLAttributes } from 'react';
-
-import Link from 'next/link';
-
-import { FaXTwitter } from 'react-icons/fa6';
-
-import { cn } from '@documenso/ui/lib/utils';
-import { Button } from '@documenso/ui/primitives/button';
-
-export type TypefullyProps = HTMLAttributes<HTMLDivElement>;
-
-export const Typefully = ({ className, ...props }: TypefullyProps) => {
-  return (
-    <div className={cn('flex flex-col', className)} {...props}>
-      <h3 className="px-4 text-lg font-semibold">Twitter Stats</h3>
-
-      <div className="border-border mt-2.5 flex flex-1 items-center justify-center rounded-2xl border py-8 shadow-sm hover:shadow">
-        <div className="flex flex-col items-center gap-y-4 text-center">
-          <FaXTwitter className="h-12 w-12" />
-          <Link href="https://typefully.com/documenso/stats" target="_blank">
-            <h1>Documenso on X</h1>
-          </Link>
-          <Button className="rounded-full" size="sm" asChild>
-            <Link href="https://typefully.com/documenso/stats" target="_blank">
-              View all stats
-            </Link>
-          </Button>
-          <Button className="rounded-full bg-white" size="sm" asChild>
-            <Link href="https://twitter.com/documenso" target="_blank">
-              Follow us on X
-            </Link>
-          </Button>
-        </div>
-      </div>
-    </div>
-  );
-};

apps/marketing/src/app/(marketing)/singleplayer/client.tsx

@@ -161,7 +161,6 @@ export const SinglePlayerClient = () => {
     signingStatus: 'NOT_SIGNED',
     sendStatus: 'NOT_SENT',
     role: 'SIGNER',
-    authOptions: null,
   };
 
   const onFileDrop = async (file: File) => {
@@ -204,7 +203,7 @@ export const SinglePlayerClient = () => {
             target="_blank"
             className="hover:text-foreground/80 font-semibold transition-colors"
           >
-            early adopter plan
+            community plan
           </Link>{' '}
           for exclusive features, including the ability to collaborate with multiple signers.
         </p>

apps/marketing/src/components/(marketing)/call-to-action.tsx

@@ -1,31 +0,0 @@
-import Link from 'next/link';
-
-import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
-import { Button } from '@documenso/ui/primitives/button';
-import { Card, CardContent } from '@documenso/ui/primitives/card';
-
-type CallToActionProps = {
-  className?: string;
-  utmSource?: string;
-};
-
-export const CallToAction = ({ className, utmSource = 'generic-cta' }: CallToActionProps) => {
-  return (
-    <Card spotlight className={className}>
-      <CardContent className="flex flex-col items-center justify-center p-12">
-        <h2 className="text-center text-2xl font-bold">Join the Open Signing Movement</h2>
-
-        <p className="text-muted-foreground mt-4 max-w-[55ch] text-center leading-normal">
-          Create your account and start using state-of-the-art document signing. Open and beautiful
-          signing is within your grasp.
-        </p>
-
-        <Button className="mt-8 rounded-full no-underline" size="lg" asChild>
-          <Link href={`${NEXT_PUBLIC_WEBAPP_URL()}/signup?utm_source=${utmSource}`} target="_blank">
-            Get started
-          </Link>
-        </Button>
-      </CardContent>
-    </Card>
-  );
-};

apps/marketing/src/components/(marketing)/callout.tsx

@@ -40,7 +40,7 @@ export const Callout = ({ starCount }: CalloutProps) => {
         className="rounded-full bg-transparent backdrop-blur-sm"
         onClick={onSignUpClick}
       >
-        Claim Early Adopter Plan
+        Claim Community Plan
         <span className="bg-primary dark:text-background -mr-2.5 ml-2.5 rounded-full px-2 py-1.5 text-xs font-medium">
           $30/mo
         </span>

apps/marketing/src/components/(marketing)/hero.tsx

@@ -114,7 +114,7 @@ export const Hero = ({ className, ...props }: HeroProps) => {
             className="rounded-full bg-transparent backdrop-blur-sm"
             onClick={onSignUpClick}
           >
-            Claim Early Adopter Plan
+            Claim Community Plan
             <span className="bg-primary dark:text-background -mr-2.5 ml-2.5 rounded-full px-2 py-1.5 text-xs font-medium">
               $30/mo
             </span>
@@ -225,8 +225,7 @@ export const Hero = ({ className, ...props }: HeroProps) => {
               <span className="bg-primary text-black">
                 (in a non-legally binding, but heartfelt way)
               </span>{' '}
-              and lock in the early adopter plan for forever, including everything we build this
-              year.
+              and lock in the community plan for forever, including everything we build this year.
             </p>
 
             <div className="flex h-24 items-center">

apps/marketing/src/components/(marketing)/pricing-table.tsx

@@ -102,7 +102,7 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
         </div>
 
         <div
-          data-plan="early-adopter"
+          data-plan="community"
           className="border-primary bg-background shadow-foreground/5 flex flex-col items-center justify-center rounded-lg border-2 px-8 py-12 shadow-[0px_0px_0px_4px_#E3E3E380]"
         >
           <p className="text-foreground text-4xl font-medium">Early Adopters</p>
@@ -119,7 +119,7 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
 
           <Button className="mt-6 rounded-full text-base" asChild>
             <Link
-              href={`${NEXT_PUBLIC_WEBAPP_URL()}/signup?utm_source=pricing-early-adopter`}
+              href={`${NEXT_PUBLIC_WEBAPP_URL()}/signup?utm_source=pricing-community`}
               target="_blank"
             >
               Signup Now

apps/marketing/src/components/(marketing)/widget.tsx

@@ -199,7 +199,7 @@ export const Widget = ({ className, children, ...props }: WidgetProps) => {
             className="bg-foreground/5 col-span-12 flex flex-col rounded-2xl p-6 lg:col-span-5"
             onSubmit={handleSubmit(onFormSubmit)}
           >
-            <h3 className="text-xl font-semibold">Sign up to Early Adopter Plan</h3>
+            <h3 className="text-xl font-semibold">Sign up to Community Plan</h3>
             <p className="text-muted-foreground mt-2 text-xs">
               with Timur Ercan & Lucas Smith from Documenso
             </p>

apps/web/next.config.js

@@ -22,7 +22,6 @@ const config = {
   output: process.env.DOCKER_OUTPUT ? 'standalone' : undefined,
   experimental: {
     outputFileTracingRoot: path.join(__dirname, '../../'),
-    serverComponentsExternalPackages: ['@node-rs/bcrypt'],
     serverActions: {
       bodySizeLimit: '50mb',
     },

apps/web/package.json

@@ -19,11 +19,10 @@
     "@documenso/ee": "*",
     "@documenso/lib": "*",
     "@documenso/prisma": "*",
+    "@documenso/tailwind-config": "*",
     "@documenso/trpc": "*",
     "@documenso/ui": "*",
     "@hookform/resolvers": "^3.1.0",
-    "@simplewebauthn/browser": "^9.0.1",
-    "@simplewebauthn/server": "^9.0.3",
     "@tanstack/react-query": "^4.29.5",
     "formidable": "^2.1.1",
     "framer-motion": "^10.12.8",
@@ -45,22 +44,20 @@
     "react-icons": "^4.11.0",
     "react-rnd": "^10.4.1",
     "remeda": "^1.27.1",
-    "sharp": "^0.33.1",
+    "sharp": "0.33.1",
     "ts-pattern": "^5.0.5",
+    "typescript": "5.2.2",
     "ua-parser-js": "^1.0.37",
     "uqr": "^0.1.2",
     "zod": "^3.22.4"
   },
   "devDependencies": {
-    "@documenso/tailwind-config": "*",
-    "@simplewebauthn/types": "^9.0.1",
     "@types/formidable": "^2.0.6",
     "@types/luxon": "^3.3.1",
     "@types/node": "20.1.0",
     "@types/react": "18.2.18",
     "@types/react-dom": "18.2.7",
-    "@types/ua-parser-js": "^0.7.39",
-    "typescript": "5.2.2"
+    "@types/ua-parser-js": "^0.7.39"
   },
   "overrides": {
     "next-auth": {
@@ -70,4 +67,4 @@
       "next": "$next"
     }
   }
-}
+}

apps/web/src/app/(dashboard)/documents/[id]/edit-document.tsx

@@ -7,6 +7,7 @@ import { useRouter, useSearchParams } from 'next/navigation';
 import {
   type DocumentData,
   type DocumentMeta,
+  DocumentStatus,
   type Field,
   type Recipient,
   type User,
@@ -17,12 +18,12 @@ import { cn } from '@documenso/ui/lib/utils';
 import { Card, CardContent } from '@documenso/ui/primitives/card';
 import { AddFieldsFormPartial } from '@documenso/ui/primitives/document-flow/add-fields';
 import type { TAddFieldsFormSchema } from '@documenso/ui/primitives/document-flow/add-fields.types';
-import { AddSettingsFormPartial } from '@documenso/ui/primitives/document-flow/add-settings';
-import type { TAddSettingsFormSchema } from '@documenso/ui/primitives/document-flow/add-settings.types';
 import { AddSignersFormPartial } from '@documenso/ui/primitives/document-flow/add-signers';
 import type { TAddSignersFormSchema } from '@documenso/ui/primitives/document-flow/add-signers.types';
 import { AddSubjectFormPartial } from '@documenso/ui/primitives/document-flow/add-subject';
 import type { TAddSubjectFormSchema } from '@documenso/ui/primitives/document-flow/add-subject.types';
+import { AddTitleFormPartial } from '@documenso/ui/primitives/document-flow/add-title';
+import type { TAddTitleFormSchema } from '@documenso/ui/primitives/document-flow/add-title.types';
 import { DocumentFlowFormContainer } from '@documenso/ui/primitives/document-flow/document-flow-root';
 import type { DocumentFlowStep } from '@documenso/ui/primitives/document-flow/types';
 import { LazyPDFViewer } from '@documenso/ui/primitives/lazy-pdf-viewer';
@@ -42,8 +43,8 @@ export type EditDocumentFormProps = {
   documentRootPath: string;
 };
 
-type EditDocumentStep = 'settings' | 'signers' | 'fields' | 'subject';
-const EditDocumentSteps: EditDocumentStep[] = ['settings', 'signers', 'fields', 'subject'];
+type EditDocumentStep = 'title' | 'signers' | 'fields' | 'subject';
+const EditDocumentSteps: EditDocumentStep[] = ['title', 'signers', 'fields', 'subject'];
 
 export const EditDocumentForm = ({
   className,
@@ -61,8 +62,7 @@ export const EditDocumentForm = ({
   const searchParams = useSearchParams();
   const team = useOptionalCurrentTeam();
 
-  const { mutateAsync: setSettingsForDocument } =
-    trpc.document.setSettingsForDocument.useMutation();
+  const { mutateAsync: addTitle } = trpc.document.setTitleForDocument.useMutation();
   const { mutateAsync: addFields } = trpc.field.addFields.useMutation();
   const { mutateAsync: addSigners } = trpc.recipient.addSigners.useMutation();
   const { mutateAsync: sendDocument } = trpc.document.sendDocument.useMutation();
@@ -70,9 +70,9 @@ export const EditDocumentForm = ({
     trpc.document.setPasswordForDocument.useMutation();
 
   const documentFlow: Record<EditDocumentStep, DocumentFlowStep> = {
-    settings: {
-      title: 'General',
-      description: 'Configure general settings for the document.',
+    title: {
+      title: 'Add Title',
+      description: 'Add the title to the document.',
       stepIndex: 1,
     },
     signers: {
@@ -96,7 +96,8 @@ export const EditDocumentForm = ({
     // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
     const searchParamStep = searchParams?.get('step') as EditDocumentStep | undefined;
 
-    let initialStep: EditDocumentStep = 'settings';
+    let initialStep: EditDocumentStep =
+      document.status === DocumentStatus.DRAFT ? 'title' : 'signers';
 
     if (
       searchParamStep &&
@@ -109,23 +110,13 @@ export const EditDocumentForm = ({
     return initialStep;
   });
 
-  const onAddSettingsFormSubmit = async (data: TAddSettingsFormSchema) => {
+  const onAddTitleFormSubmit = async (data: TAddTitleFormSchema) => {
     try {
-      const { timezone, dateFormat, redirectUrl } = data.meta;
-
-      await setSettingsForDocument({
+      // Custom invocation server action
+      await addTitle({
         documentId: document.id,
         teamId: team?.id,
-        data: {
-          title: data.title,
-          globalAccessAuth: data.globalAccessAuth ?? null,
-          globalActionAuth: data.globalActionAuth ?? null,
-        },
-        meta: {
-          timezone,
-          dateFormat,
-          redirectUrl,
-        },
+        title: data.title,
       });
 
       router.refresh();
@@ -136,7 +127,7 @@ export const EditDocumentForm = ({
 
       toast({
         title: 'Error',
-        description: 'An error occurred while updating the general settings.',
+        description: 'An error occurred while updating title.',
         variant: 'destructive',
       });
     }
@@ -148,11 +139,7 @@ export const EditDocumentForm = ({
       await addSigners({
         documentId: document.id,
         teamId: team?.id,
-        signers: data.signers.map((signer) => ({
-          ...signer,
-          // Explicitly set to null to indicate we want to remove auth if required.
-          actionAuth: signer.actionAuth || null,
-        })),
+        signers: data.signers,
       });
 
       router.refresh();
@@ -190,7 +177,7 @@ export const EditDocumentForm = ({
   };
 
   const onAddSubjectFormSubmit = async (data: TAddSubjectFormSchema) => {
-    const { subject, message } = data.meta;
+    const { subject, message, timezone, dateFormat, redirectUrl } = data.meta;
 
     try {
       await sendDocument({
@@ -199,6 +186,9 @@ export const EditDocumentForm = ({
         meta: {
           subject,
           message,
+          dateFormat,
+          timezone,
+          redirectUrl,
         },
       });
 
@@ -255,23 +245,23 @@ export const EditDocumentForm = ({
             currentStep={currentDocumentFlow.stepIndex}
             setCurrentStep={(step) => setStep(EditDocumentSteps[step - 1])}
           >
-            <AddSettingsFormPartial
+            <AddTitleFormPartial
               key={recipients.length}
-              documentFlow={documentFlow.settings}
+              documentFlow={documentFlow.title}
               document={document}
               recipients={recipients}
               fields={fields}
-              onSubmit={onAddSettingsFormSubmit}
+              onSubmit={onAddTitleFormSubmit}
             />
 
             <AddSignersFormPartial
               key={recipients.length}
               documentFlow={documentFlow.signers}
+              document={document}
               recipients={recipients}
               fields={fields}
               onSubmit={onAddSignersFormSubmit}
             />
-
             <AddFieldsFormPartial
               key={fields.length}
               documentFlow={documentFlow.fields}
@@ -279,7 +269,6 @@ export const EditDocumentForm = ({
               fields={fields}
               onSubmit={onAddFieldsFormSubmit}
             />
-
             <AddSubjectFormPartial
               key={recipients.length}
               documentFlow={documentFlow.subject}

apps/web/src/app/(dashboard)/documents/data-table.tsx

@@ -76,13 +76,14 @@ export const DocumentsDataTable = ({
           {
             header: 'Recipient',
             accessorKey: 'recipient',
-            cell: ({ row }) => <StackAvatarsWithTooltip recipients={row.original.Recipient} />,
+            cell: ({ row }) => {
+              return <StackAvatarsWithTooltip recipients={row.original.Recipient} />;
+            },
           },
           {
             header: 'Status',
             accessorKey: 'status',
             cell: ({ row }) => <DocumentStatus status={row.getValue('status')} />,
-            size: 140,
           },
           {
             header: 'Actions',

apps/web/src/app/(dashboard)/documents/upload-document.tsx

@@ -2,6 +2,7 @@
 
 import { useMemo, useState } from 'react';
 
+import Link from 'next/link';
 import { useRouter } from 'next/navigation';
 
 import { Loader } from 'lucide-react';
@@ -138,6 +139,27 @@ export const UploadDocument = ({ className, team }: UploadDocumentProps) => {
           <Loader className="text-muted-foreground h-12 w-12 animate-spin" />
         </div>
       )}
+
+      {team?.id === undefined && remaining.documents === 0 && (
+        <div className="bg-background/60 absolute inset-0 flex items-center justify-center rounded-lg backdrop-blur-sm">
+          <div className="text-center">
+            <h2 className="text-muted-foreground/80 text-xl font-semibold">
+              You have reached your document limit.
+            </h2>
+
+            <p className="text-muted-foreground/60 mt-2 text-sm">
+              You can upload up to {quota.documents} documents per month on your current plan.
+            </p>
+
+            <Link
+              className="text-primary hover:text-primary/80 mt-6 block font-medium"
+              href="/settings/billing"
+            >
+              Upgrade your account to upload more documents.
+            </Link>
+          </div>
+        </div>
+      )}
     </div>
   );
 };

apps/web/src/app/(dashboard)/settings/profile/delete-account-dialog.tsx

@@ -1,7 +1,5 @@
 'use client';
 
-import { useState } from 'react';
-
 import { signOut } from 'next-auth/react';
 
 import type { User } from '@documenso/prisma/client';
@@ -18,8 +16,6 @@ import {
   DialogTitle,
   DialogTrigger,
 } from '@documenso/ui/primitives/dialog';
-import { Input } from '@documenso/ui/primitives/input';
-import { Label } from '@documenso/ui/primitives/label';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
 export type DeleteAccountDialogProps = {
@@ -32,8 +28,6 @@ export const DeleteAccountDialog = ({ className, user }: DeleteAccountDialogProp
 
   const hasTwoFactorAuthentication = user.twoFactorEnabled;
 
-  const [enteredEmail, setEnteredEmail] = useState<string>('');
-
   const { mutateAsync: deleteAccount, isLoading: isDeletingAccount } =
     trpc.profile.deleteAccount.useMutation();
 
@@ -82,11 +76,10 @@ export const DeleteAccountDialog = ({ className, user }: DeleteAccountDialogProp
         </div>
 
         <div className="flex-shrink-0">
-          <Dialog onOpenChange={() => setEnteredEmail('')}>
+          <Dialog>
             <DialogTrigger asChild>
               <Button variant="destructive">Delete Account</Button>
             </DialogTrigger>
-
             <DialogContent>
               <DialogHeader className="space-y-4">
                 <DialogTitle>Delete Account</DialogTitle>
@@ -112,31 +105,14 @@ export const DeleteAccountDialog = ({ className, user }: DeleteAccountDialogProp
                 </DialogDescription>
               </DialogHeader>
 
-              {!hasTwoFactorAuthentication && (
-                <div className="mt-4">
-                  <Label>
-                    Please type{' '}
-                    <span className="text-muted-foreground font-semibold">{user.email}</span> to
-                    confirm.
-                  </Label>
-
-                  <Input
-                    type="text"
-                    className="mt-2"
-                    aria-label="Confirm Email"
-                    value={enteredEmail}
-                    onChange={(e) => setEnteredEmail(e.target.value)}
-                  />
-                </div>
-              )}
               <DialogFooter>
                 <Button
                   onClick={onDeleteAccount}
                   loading={isDeletingAccount}
                   variant="destructive"
-                  disabled={hasTwoFactorAuthentication || enteredEmail !== user.email}
+                  disabled={hasTwoFactorAuthentication}
                 >
-                  {isDeletingAccount ? 'Deleting account...' : 'Confirm Deletion'}
+                  {isDeletingAccount ? 'Deleting account...' : 'Delete Account'}
                 </Button>
               </DialogFooter>
             </DialogContent>

apps/web/src/app/(dashboard)/settings/security/activity/page.tsx

@@ -15,14 +15,15 @@ export default function SettingsSecurityActivityPage() {
       <SettingsHeader
         title="Security activity"
         subtitle="View all recent security activity related to your account."
-        hideDivider={true}
       >
-        <ActivityPageBackButton />
+        <div>
+          <ActivityPageBackButton />
+        </div>
       </SettingsHeader>
 
-      <div className="mt-4">
-        <UserSecurityActivityDataTable />
-      </div>
+      <hr className="my-4" />
+
+      <UserSecurityActivityDataTable />
     </div>
   );
 }

apps/web/src/app/(dashboard)/settings/security/page.tsx

@@ -3,7 +3,6 @@ import Link from 'next/link';
 
 import { IDENTITY_PROVIDER_NAME } from '@documenso/lib/constants/auth';
 import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
-import { getServerComponentFlag } from '@documenso/lib/server-only/feature-flags/get-server-component-feature-flag';
 import { Alert, AlertDescription, AlertTitle } from '@documenso/ui/primitives/alert';
 import { Button } from '@documenso/ui/primitives/button';
 
@@ -19,8 +18,6 @@ export const metadata: Metadata = {
 export default async function SecuritySettingsPage() {
   const { user } = await getRequiredServerComponentSession();
 
-  const isPasskeyEnabled = await getServerComponentFlag('app_passkey');
-
   return (
     <div>
       <SettingsHeader
@@ -50,25 +47,6 @@ export default async function SecuritySettingsPage() {
             <AuthenticatorApp isTwoFactorEnabled={user.twoFactorEnabled} />
           </Alert>
 
-          {isPasskeyEnabled && (
-            <Alert
-              className="mt-6 flex flex-col justify-between p-6 sm:flex-row sm:items-center"
-              variant="neutral"
-            >
-              <div className="mb-4 sm:mb-0">
-                <AlertTitle>Passkeys</AlertTitle>
-
-                <AlertDescription className="mr-4">
-                  Allows authenticating using biometrics, password managers, hardware keys, etc.
-                </AlertDescription>
-              </div>
-
-              <Button asChild variant="outline" className="bg-background">
-                <Link href="/settings/security/passkeys">Manage passkeys</Link>
-              </Button>
-            </Alert>
-          )}
-
           {user.twoFactorEnabled && (
             <Alert
               className="mt-6 flex flex-col justify-between p-6 sm:flex-row sm:items-center"
@@ -113,7 +91,7 @@ export default async function SecuritySettingsPage() {
           </AlertDescription>
         </div>
 
-        <Button asChild variant="outline" className="bg-background">
+        <Button asChild>
           <Link href="/settings/security/activity">View activity</Link>
         </Button>
       </Alert>

apps/web/src/app/(dashboard)/settings/security/passkeys/create-passkey-dialog.tsx

@@ -1,237 +0,0 @@
-'use client';
-
-import { useEffect, useState } from 'react';
-
-import { zodResolver } from '@hookform/resolvers/zod';
-import type * as DialogPrimitive from '@radix-ui/react-dialog';
-import { startRegistration } from '@simplewebauthn/browser';
-import { KeyRoundIcon } from 'lucide-react';
-import { useForm } from 'react-hook-form';
-import { match } from 'ts-pattern';
-import { UAParser } from 'ua-parser-js';
-import { z } from 'zod';
-
-import { MAXIMUM_PASSKEYS } from '@documenso/lib/constants/auth';
-import { AppError } from '@documenso/lib/errors/app-error';
-import { trpc } from '@documenso/trpc/react';
-import { Alert, AlertDescription, AlertTitle } from '@documenso/ui/primitives/alert';
-import { Button } from '@documenso/ui/primitives/button';
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} 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';
-
-export type CreatePasskeyDialogProps = {
-  trigger?: React.ReactNode;
-  onSuccess?: () => void;
-} & Omit<DialogPrimitive.DialogProps, 'children'>;
-
-const ZCreatePasskeyFormSchema = z.object({
-  passkeyName: z.string().min(3),
-});
-
-type TCreatePasskeyFormSchema = z.infer<typeof ZCreatePasskeyFormSchema>;
-
-const parser = new UAParser();
-
-export const CreatePasskeyDialog = ({ trigger, onSuccess, ...props }: CreatePasskeyDialogProps) => {
-  const [open, setOpen] = useState(false);
-  const [formError, setFormError] = useState<string | null>(null);
-
-  const { toast } = useToast();
-
-  const form = useForm<TCreatePasskeyFormSchema>({
-    resolver: zodResolver(ZCreatePasskeyFormSchema),
-    defaultValues: {
-      passkeyName: '',
-    },
-  });
-
-  const { mutateAsync: createPasskeyRegistrationOptions, isLoading } =
-    trpc.auth.createPasskeyRegistrationOptions.useMutation();
-
-  const { mutateAsync: createPasskey } = trpc.auth.createPasskey.useMutation();
-
-  const onFormSubmit = async ({ passkeyName }: TCreatePasskeyFormSchema) => {
-    setFormError(null);
-
-    try {
-      const passkeyRegistrationOptions = await createPasskeyRegistrationOptions();
-
-      const registrationResult = await startRegistration(passkeyRegistrationOptions);
-
-      await createPasskey({
-        passkeyName,
-        verificationResponse: registrationResult,
-      });
-
-      toast({
-        description: 'Successfully created passkey',
-        duration: 5000,
-      });
-
-      onSuccess?.();
-      setOpen(false);
-    } catch (err) {
-      if (err.name === 'NotAllowedError') {
-        return;
-      }
-
-      const error = AppError.parseError(err);
-
-      setFormError(err.code || error.code);
-    }
-  };
-
-  const extractDefaultPasskeyName = () => {
-    if (!window || !window.navigator) {
-      return;
-    }
-
-    parser.setUA(window.navigator.userAgent);
-
-    const result = parser.getResult();
-    const operatingSystem = result.os.name;
-    const browser = result.browser.name;
-
-    let passkeyName = '';
-
-    if (operatingSystem && browser) {
-      passkeyName = `${browser} (${operatingSystem})`;
-    }
-
-    return passkeyName;
-  };
-
-  useEffect(() => {
-    if (!open) {
-      const defaultPasskeyName = extractDefaultPasskeyName();
-
-      form.reset({
-        passkeyName: defaultPasskeyName,
-      });
-
-      setFormError(null);
-    }
-  }, [open, form]);
-
-  return (
-    <Dialog
-      {...props}
-      open={open}
-      onOpenChange={(value) => !form.formState.isSubmitting && setOpen(value)}
-    >
-      <DialogTrigger onClick={(e) => e.stopPropagation()} asChild={true}>
-        {trigger ?? (
-          <Button variant="secondary" loading={isLoading}>
-            <KeyRoundIcon className="-ml-1 mr-1 h-5 w-5" />
-            Add passkey
-          </Button>
-        )}
-      </DialogTrigger>
-
-      <DialogContent position="center">
-        <DialogHeader>
-          <DialogTitle>Add passkey</DialogTitle>
-
-          <DialogDescription className="mt-4">
-            Passkeys allow you to sign in and authenticate using biometrics, password managers, etc.
-          </DialogDescription>
-        </DialogHeader>
-
-        <Form {...form}>
-          <form onSubmit={form.handleSubmit(onFormSubmit)}>
-            <fieldset
-              className="flex h-full flex-col space-y-4"
-              disabled={form.formState.isSubmitting}
-            >
-              <FormField
-                control={form.control}
-                name="passkeyName"
-                render={({ field }) => (
-                  <FormItem>
-                    <FormLabel required>Passkey name</FormLabel>
-                    <FormControl>
-                      <Input className="bg-background" placeholder="eg. Mac" {...field} />
-                    </FormControl>
-                    <FormMessage />
-                  </FormItem>
-                )}
-              />
-
-              <Alert variant="neutral">
-                <AlertDescription>
-                  When you click continue, you will be prompted to add the first available
-                  authenticator on your system.
-                </AlertDescription>
-
-                <AlertDescription className="mt-2">
-                  If you do not want to use the authenticator prompted, you can close it, which will
-                  then display the next available authenticator.
-                </AlertDescription>
-              </Alert>
-
-              {formError && (
-                <Alert variant="destructive">
-                  {match(formError)
-                    .with('ERROR_AUTHENTICATOR_PREVIOUSLY_REGISTERED', () => (
-                      <AlertDescription>This passkey has already been registered.</AlertDescription>
-                    ))
-                    .with('TOO_MANY_PASSKEYS', () => (
-                      <AlertDescription>
-                        You cannot have more than {MAXIMUM_PASSKEYS} passkeys.
-                      </AlertDescription>
-                    ))
-                    .with('InvalidStateError', () => (
-                      <>
-                        <AlertTitle className="text-sm">
-                          Passkey creation cancelled due to one of the following reasons:
-                        </AlertTitle>
-                        <AlertDescription>
-                          <ul className="mt-1 list-inside list-disc">
-                            <li>Cancelled by user</li>
-                            <li>Passkey already exists for the provided authenticator</li>
-                            <li>Exceeded timeout</li>
-                          </ul>
-                        </AlertDescription>
-                      </>
-                    ))
-                    .otherwise(() => (
-                      <AlertDescription>
-                        Something went wrong. Please try again or contact support.
-                      </AlertDescription>
-                    ))}
-                </Alert>
-              )}
-
-              <DialogFooter>
-                <Button type="button" variant="secondary" onClick={() => setOpen(false)}>
-                  Cancel
-                </Button>
-
-                <Button type="submit" loading={form.formState.isSubmitting}>
-                  Continue
-                </Button>
-              </DialogFooter>
-            </fieldset>
-          </form>
-        </Form>
-      </DialogContent>
-    </Dialog>
-  );
-};

apps/web/src/app/(dashboard)/settings/security/passkeys/page.tsx

@@ -1,33 +0,0 @@
-import type { Metadata } from 'next';
-import { redirect } from 'next/navigation';
-
-import { getServerComponentFlag } from '@documenso/lib/server-only/feature-flags/get-server-component-feature-flag';
-
-import { SettingsHeader } from '~/components/(dashboard)/settings/layout/header';
-
-import { CreatePasskeyDialog } from './create-passkey-dialog';
-import { UserPasskeysDataTable } from './user-passkeys-data-table';
-
-export const metadata: Metadata = {
-  title: 'Manage passkeys',
-};
-
-export default async function SettingsManagePasskeysPage() {
-  const isPasskeyEnabled = await getServerComponentFlag('app_passkey');
-
-  if (!isPasskeyEnabled) {
-    redirect('/settings/security');
-  }
-
-  return (
-    <div>
-      <SettingsHeader title="Passkeys" subtitle="Manage your passkeys." hideDivider={true}>
-        <CreatePasskeyDialog />
-      </SettingsHeader>
-
-      <div className="mt-4">
-        <UserPasskeysDataTable />
-      </div>
-    </div>
-  );
-}

apps/web/src/app/(dashboard)/settings/security/passkeys/user-passkeys-data-table-actions.tsx

@@ -1,202 +0,0 @@
-import { useState } from 'react';
-
-import { zodResolver } from '@hookform/resolvers/zod';
-import { useForm } from 'react-hook-form';
-import { z } from 'zod';
-
-import { trpc } from '@documenso/trpc/react';
-import { cn } from '@documenso/ui/lib/utils';
-import { Button } from '@documenso/ui/primitives/button';
-import {
-  Dialog,
-  DialogClose,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} 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';
-
-export type UserPasskeysDataTableActionsProps = {
-  className?: string;
-  passkeyId: string;
-  passkeyName: string;
-};
-
-const ZUpdatePasskeySchema = z.object({
-  name: z.string(),
-});
-
-type TUpdatePasskeySchema = z.infer<typeof ZUpdatePasskeySchema>;
-
-export const UserPasskeysDataTableActions = ({
-  className,
-  passkeyId,
-  passkeyName,
-}: UserPasskeysDataTableActionsProps) => {
-  const { toast } = useToast();
-
-  const [isDeleteDialogOpen, setIsDeleteDialogOpen] = useState(false);
-  const [isUpdateDialogOpen, setIsUpdateDialogOpen] = useState(false);
-
-  const form = useForm<TUpdatePasskeySchema>({
-    resolver: zodResolver(ZUpdatePasskeySchema),
-    defaultValues: {
-      name: passkeyName,
-    },
-  });
-
-  const { mutateAsync: updatePasskey, isLoading: isUpdatingPasskey } =
-    trpc.auth.updatePasskey.useMutation({
-      onSuccess: () => {
-        toast({
-          title: 'Success',
-          description: 'Passkey has been updated',
-        });
-      },
-      onError: () => {
-        toast({
-          title: 'Something went wrong',
-          description:
-            'We are unable to update this passkey at the moment. Please try again later.',
-          duration: 10000,
-          variant: 'destructive',
-        });
-      },
-    });
-
-  const { mutateAsync: deletePasskey, isLoading: isDeletingPasskey } =
-    trpc.auth.deletePasskey.useMutation({
-      onSuccess: () => {
-        toast({
-          title: 'Success',
-          description: 'Passkey has been removed',
-        });
-      },
-      onError: () => {
-        toast({
-          title: 'Something went wrong',
-          description:
-            'We are unable to remove this passkey at the moment. Please try again later.',
-          duration: 10000,
-          variant: 'destructive',
-        });
-      },
-    });
-
-  return (
-    <div className={cn('flex justify-end space-x-2', className)}>
-      <Dialog
-        open={isUpdateDialogOpen}
-        onOpenChange={(value) => !isUpdatingPasskey && setIsUpdateDialogOpen(value)}
-      >
-        <DialogTrigger onClick={(e) => e.stopPropagation()} asChild>
-          <Button variant="outline">Edit</Button>
-        </DialogTrigger>
-
-        <DialogContent position="center">
-          <DialogHeader>
-            <DialogTitle>Update passkey</DialogTitle>
-
-            <DialogDescription className="mt-4">
-              You are currently updating the <strong>{passkeyName}</strong> passkey.
-            </DialogDescription>
-          </DialogHeader>
-
-          <Form {...form}>
-            <form
-              onSubmit={form.handleSubmit(async ({ name }) =>
-                updatePasskey({
-                  passkeyId,
-                  name,
-                }),
-              )}
-            >
-              <fieldset className="flex h-full flex-col" disabled={isUpdatingPasskey}>
-                <FormField
-                  control={form.control}
-                  name="name"
-                  render={({ field }) => (
-                    <FormItem className="w-full">
-                      <FormLabel required>Name</FormLabel>
-                      <FormControl>
-                        <Input {...field} />
-                      </FormControl>
-                      <FormMessage />
-                    </FormItem>
-                  )}
-                />
-
-                <DialogFooter className="mt-4">
-                  <DialogClose asChild>
-                    <Button type="button" variant="secondary">
-                      Cancel
-                    </Button>
-                  </DialogClose>
-
-                  <Button type="submit" loading={isUpdatingPasskey}>
-                    Update
-                  </Button>
-                </DialogFooter>
-              </fieldset>
-            </form>
-          </Form>
-        </DialogContent>
-      </Dialog>
-
-      <Dialog
-        open={isDeleteDialogOpen}
-        onOpenChange={(value) => !isDeletingPasskey && setIsDeleteDialogOpen(value)}
-      >
-        <DialogTrigger onClick={(e) => e.stopPropagation()} asChild={true}>
-          <Button variant="destructive">Delete</Button>
-        </DialogTrigger>
-
-        <DialogContent position="center">
-          <DialogHeader>
-            <DialogTitle>Delete passkey</DialogTitle>
-
-            <DialogDescription className="mt-4">
-              Are you sure you want to remove the <strong>{passkeyName}</strong> passkey.
-            </DialogDescription>
-          </DialogHeader>
-
-          <form
-            onSubmit={(e) => {
-              e.preventDefault();
-
-              void deletePasskey({
-                passkeyId,
-              });
-            }}
-          >
-            <fieldset className="flex h-full flex-col space-y-4" disabled={isDeletingPasskey}>
-              <DialogFooter>
-                <DialogClose asChild>
-                  <Button type="button" variant="secondary">
-                    Cancel
-                  </Button>
-                </DialogClose>
-
-                <Button type="submit" variant="destructive" loading={isDeletingPasskey}>
-                  Delete
-                </Button>
-              </DialogFooter>
-            </fieldset>
-          </form>
-        </DialogContent>
-      </Dialog>
-    </div>
-  );
-};

apps/web/src/app/(dashboard)/settings/security/passkeys/user-passkeys-data-table.tsx

@@ -1,120 +0,0 @@
-'use client';
-
-import { usePathname, useRouter, useSearchParams } from 'next/navigation';
-
-import { DateTime } from 'luxon';
-
-import { useUpdateSearchParams } from '@documenso/lib/client-only/hooks/use-update-search-params';
-import { ZBaseTableSearchParamsSchema } from '@documenso/lib/types/search-params';
-import { trpc } from '@documenso/trpc/react';
-import { DataTable } from '@documenso/ui/primitives/data-table';
-import { DataTablePagination } from '@documenso/ui/primitives/data-table-pagination';
-import { Skeleton } from '@documenso/ui/primitives/skeleton';
-import { TableCell } from '@documenso/ui/primitives/table';
-
-import { UserPasskeysDataTableActions } from './user-passkeys-data-table-actions';
-
-export const UserPasskeysDataTable = () => {
-  const pathname = usePathname();
-  const router = useRouter();
-  const searchParams = useSearchParams();
-  const updateSearchParams = useUpdateSearchParams();
-
-  const parsedSearchParams = ZBaseTableSearchParamsSchema.parse(
-    Object.fromEntries(searchParams ?? []),
-  );
-
-  const { data, isLoading, isInitialLoading, isLoadingError } = trpc.auth.findPasskeys.useQuery(
-    {
-      page: parsedSearchParams.page,
-      perPage: parsedSearchParams.perPage,
-    },
-    {
-      keepPreviousData: true,
-    },
-  );
-
-  const onPaginationChange = (page: number, perPage: number) => {
-    updateSearchParams({
-      page,
-      perPage,
-    });
-  };
-
-  const results = data ?? {
-    data: [],
-    perPage: 10,
-    currentPage: 1,
-    totalPages: 1,
-  };
-
-  return (
-    <DataTable
-      columns={[
-        {
-          header: 'Name',
-          accessorKey: 'name',
-        },
-        {
-          header: 'Created',
-          accessorKey: 'createdAt',
-          cell: ({ row }) => DateTime.fromJSDate(row.original.createdAt).toRelative(),
-        },
-
-        {
-          header: 'Last used',
-          accessorKey: 'updatedAt',
-          cell: ({ row }) =>
-            row.original.lastUsedAt
-              ? DateTime.fromJSDate(row.original.lastUsedAt).toRelative()
-              : 'Never',
-        },
-        {
-          id: 'actions',
-          cell: ({ row }) => (
-            <UserPasskeysDataTableActions
-              className="justify-end"
-              passkeyId={row.original.id}
-              passkeyName={row.original.name}
-            />
-          ),
-        },
-      ]}
-      data={results.data}
-      perPage={results.perPage}
-      currentPage={results.currentPage}
-      totalPages={results.totalPages}
-      onPaginationChange={onPaginationChange}
-      hasFilters={parsedSearchParams.page !== undefined || parsedSearchParams.perPage !== undefined}
-      onClearFilters={() => router.push(pathname ?? '/')}
-      error={{
-        enable: isLoadingError,
-      }}
-      skeleton={{
-        enable: isLoading && isInitialLoading,
-        rows: 3,
-        component: (
-          <>
-            <TableCell>
-              <Skeleton className="h-4 w-20 rounded-full" />
-            </TableCell>
-            <TableCell>
-              <Skeleton className="h-4 w-12 rounded-full" />
-            </TableCell>
-            <TableCell>
-              <Skeleton className="h-4 w-12 rounded-full" />
-            </TableCell>
-            <TableCell>
-              <div className="flex flex-row space-x-2">
-                <Skeleton className="h-8 w-16 rounded" />
-                <Skeleton className="h-8 w-16 rounded" />
-              </div>
-            </TableCell>
-          </>
-        ),
-      }}
-    >
-      {(table) => <DataTablePagination table={table} />}
-    </DataTable>
-  );
-};

apps/web/src/app/(dashboard)/templates/data-table-templates.tsx

@@ -25,11 +25,7 @@ type TemplateWithRecipient = Template & {
 };
 
 type TemplatesDataTableProps = {
-  templates: Array<
-    TemplateWithRecipient & {
-      team: { id: number; url: string } | null;
-    }
-  >;
+  templates: TemplateWithRecipient[];
   perPage: number;
   page: number;
   totalPages: number;

apps/web/src/app/(dashboard)/templates/data-table-title.tsx

@@ -1,35 +1,23 @@
-'use client';
-
 import Link from 'next/link';
 
 import { useSession } from 'next-auth/react';
 
-import { formatTemplatesPath } from '@documenso/lib/utils/teams';
-import type { Template } from '@documenso/prisma/client';
-
-import { useOptionalCurrentTeam } from '~/providers/team';
+import { Template } from '@documenso/prisma/client';
 
 export type DataTableTitleProps = {
-  row: Template & {
-    team: { id: number; url: string } | null;
-  };
+  row: Template;
 };
 
 export const DataTableTitle = ({ row }: DataTableTitleProps) => {
   const { data: session } = useSession();
-  const team = useOptionalCurrentTeam();
 
   if (!session) {
     return null;
   }
 
-  const isCurrentTeamTemplate = team?.url && row.team?.url === team?.url;
-
-  const templatesPath = formatTemplatesPath(isCurrentTeamTemplate ? team?.url : undefined);
-
   return (
     <Link
-      href={`${templatesPath}/${row.id}`}
+      href={`/templates/${row.id}`}
       className="block max-w-[10rem] cursor-pointer truncate font-medium hover:underline md:max-w-[20rem]"
     >
       {row.title}

apps/web/src/app/(signing)/sign/[token]/complete/page.tsx

@@ -6,9 +6,7 @@ import { getServerSession } from 'next-auth';
 import { match } from 'ts-pattern';
 
 import signingCelebration from '@documenso/assets/images/signing-celebration.png';
-import { getServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
 import { getDocumentAndSenderByToken } from '@documenso/lib/server-only/document/get-document-by-token';
-import { isRecipientAuthorized } from '@documenso/lib/server-only/document/is-recipient-authorized';
 import { getFieldsForToken } from '@documenso/lib/server-only/field/get-fields-for-token';
 import { getRecipientByToken } from '@documenso/lib/server-only/recipient/get-recipient-by-token';
 import { getRecipientSignatures } from '@documenso/lib/server-only/recipient/get-recipient-signatures';
@@ -19,7 +17,6 @@ import { SigningCard3D } from '@documenso/ui/components/signing-card';
 
 import { truncateTitle } from '~/helpers/truncate-title';
 
-import { SigningAuthPageView } from '../signing-auth-page';
 import { DocumentPreviewButton } from './document-preview-button';
 
 export type CompletedSigningPageProps = {
@@ -35,11 +32,8 @@ export default async function CompletedSigningPage({
     return notFound();
   }
 
-  const { user } = await getServerComponentSession();
-
   const document = await getDocumentAndSenderByToken({
     token,
-    requireAccessAuth: false,
   }).catch(() => null);
 
   if (!document || !document.documentData) {
@@ -59,17 +53,6 @@ export default async function CompletedSigningPage({
     return notFound();
   }
 
-  const isDocumentAccessValid = await isRecipientAuthorized({
-    type: 'ACCESS',
-    document,
-    recipient,
-    userId: user?.id,
-  });
-
-  if (!isDocumentAccessValid) {
-    return <SigningAuthPageView email={recipient.email} />;
-  }
-
   const signatures = await getRecipientSignatures({ recipientId: recipient.id });
 
   const recipientName =

apps/web/src/app/(signing)/sign/[token]/date-field.tsx

@@ -11,8 +11,6 @@ import {
   convertToLocalSystemFormat,
 } from '@documenso/lib/constants/date-formats';
 import { DEFAULT_DOCUMENT_TIME_ZONE } from '@documenso/lib/constants/time-zones';
-import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
-import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import type { Recipient } from '@documenso/prisma/client';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
@@ -55,23 +53,16 @@ export const DateField = ({
 
   const tooltipText = `"${field.customText}" will appear on the document as it has a timezone of "${timezone}".`;
 
-  const onSign = async (authOptions?: TRecipientActionAuth) => {
+  const onSign = async () => {
     try {
       await signFieldWithToken({
         token: recipient.token,
         fieldId: field.id,
         value: dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT,
-        authOptions,
       });
 
       startTransition(() => router.refresh());
     } catch (err) {
-      const error = AppError.parseError(err);
-
-      if (error.code === AppErrorCode.UNAUTHORIZED) {
-        throw error;
-      }
-
       console.error(err);
 
       toast({

apps/web/src/app/(signing)/sign/[token]/document-action-auth-account.tsx

@@ -1,83 +0,0 @@
-import { useState } from 'react';
-
-import { DateTime } from 'luxon';
-import { signOut } from 'next-auth/react';
-
-import { RecipientRole } from '@documenso/prisma/client';
-import { trpc } from '@documenso/trpc/react';
-import { Alert, AlertDescription } from '@documenso/ui/primitives/alert';
-import { Button } from '@documenso/ui/primitives/button';
-import { DialogFooter } from '@documenso/ui/primitives/dialog';
-
-import { useRequiredDocumentAuthContext } from './document-auth-provider';
-
-export type DocumentActionAuthAccountProps = {
-  actionTarget?: 'FIELD' | 'DOCUMENT';
-  actionVerb?: string;
-  onOpenChange: (value: boolean) => void;
-};
-
-export const DocumentActionAuthAccount = ({
-  actionTarget = 'FIELD',
-  actionVerb = 'sign',
-  onOpenChange,
-}: DocumentActionAuthAccountProps) => {
-  const { recipient } = useRequiredDocumentAuthContext();
-
-  const [isSigningOut, setIsSigningOut] = useState(false);
-
-  const { mutateAsync: encryptSecondaryData } = trpc.crypto.encryptSecondaryData.useMutation();
-
-  const handleChangeAccount = async (email: string) => {
-    try {
-      setIsSigningOut(true);
-
-      const encryptedEmail = await encryptSecondaryData({
-        data: email,
-        expiresAt: DateTime.now().plus({ days: 1 }).toMillis(),
-      });
-
-      await signOut({
-        callbackUrl: `/signin?email=${encodeURIComponent(encryptedEmail)}`,
-      });
-    } catch {
-      setIsSigningOut(false);
-
-      // Todo: Alert.
-    }
-  };
-
-  return (
-    <fieldset disabled={isSigningOut} className="space-y-4">
-      <Alert>
-        <AlertDescription>
-          {actionTarget === 'DOCUMENT' && recipient.role === RecipientRole.VIEWER ? (
-            <span>
-              To mark this document as viewed, you need to be logged in as{' '}
-              <strong>{recipient.email}</strong>
-            </span>
-          ) : (
-            <span>
-              To {actionVerb.toLowerCase()} this {actionTarget.toLowerCase()}, you need to be logged
-              in as <strong>{recipient.email}</strong>
-            </span>
-          )}
-        </AlertDescription>
-      </Alert>
-
-      <DialogFooter>
-        <Button type="button" variant="secondary" onClick={() => onOpenChange(false)}>
-          Cancel
-        </Button>
-
-        <Button
-          type="submit"
-          onClick={async () => handleChangeAccount(recipient.email)}
-          loading={isSigningOut}
-        >
-          Login
-        </Button>
-      </DialogFooter>
-    </fieldset>
-  );
-};

apps/web/src/app/(signing)/sign/[token]/document-action-auth-dialog.tsx

@@ -1,110 +0,0 @@
-import { useMemo } from 'react';
-
-import { P, match } from 'ts-pattern';
-
-import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
-import {
-  DocumentAuth,
-  type TRecipientActionAuth,
-  type TRecipientActionAuthTypes,
-} from '@documenso/lib/types/document-auth';
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogHeader,
-  DialogTitle,
-} from '@documenso/ui/primitives/dialog';
-
-import { DocumentActionAuthAccount } from './document-action-auth-account';
-import { DocumentActionAuthPasskey } from './document-action-auth-passkey';
-import { useRequiredDocumentAuthContext } from './document-auth-provider';
-
-export type DocumentActionAuthDialogProps = {
-  title?: string;
-  documentAuthType: TRecipientActionAuthTypes;
-  description?: string;
-  actionTarget?: 'FIELD' | 'DOCUMENT';
-  open: boolean;
-  onOpenChange: (value: boolean) => void;
-
-  /**
-   * The callback to run when the reauth form is filled out.
-   */
-  onReauthFormSubmit: (values?: TRecipientActionAuth) => Promise<void> | void;
-};
-
-export const DocumentActionAuthDialog = ({
-  title,
-  description,
-  documentAuthType,
-  actionTarget = 'FIELD',
-  open,
-  onOpenChange,
-  onReauthFormSubmit,
-}: DocumentActionAuthDialogProps) => {
-  const { recipient, user, isCurrentlyAuthenticating } = useRequiredDocumentAuthContext();
-
-  const handleOnOpenChange = (value: boolean) => {
-    if (isCurrentlyAuthenticating) {
-      return;
-    }
-
-    onOpenChange(value);
-  };
-
-  const actionVerb =
-    actionTarget === 'DOCUMENT' ? RECIPIENT_ROLES_DESCRIPTION[recipient.role].actionVerb : 'Sign';
-
-  const defaultTitleDescription = useMemo(() => {
-    if (recipient.role === 'VIEWER' && actionTarget === 'DOCUMENT') {
-      return {
-        title: 'Mark document as viewed',
-        description: 'Reauthentication is required to mark this document as viewed.',
-      };
-    }
-
-    return {
-      title: `${actionVerb} ${actionTarget.toLowerCase()}`,
-      description: `Reauthentication is required to ${actionVerb.toLowerCase()} this ${actionTarget.toLowerCase()}`,
-    };
-  }, [recipient.role, actionVerb, actionTarget]);
-
-  return (
-    <Dialog open={open} onOpenChange={handleOnOpenChange}>
-      <DialogContent>
-        <DialogHeader>
-          <DialogTitle>{title || defaultTitleDescription.title}</DialogTitle>
-
-          <DialogDescription>
-            {description || defaultTitleDescription.description}
-          </DialogDescription>
-        </DialogHeader>
-
-        {match({ documentAuthType, user })
-          .with(
-            { documentAuthType: DocumentAuth.ACCOUNT },
-            { user: P.when((user) => !user || user.email !== recipient.email) }, // Assume all current auths requires them to be logged in.
-            () => (
-              <DocumentActionAuthAccount
-                actionVerb={actionVerb}
-                actionTarget={actionTarget}
-                onOpenChange={onOpenChange}
-              />
-            ),
-          )
-          .with({ documentAuthType: DocumentAuth.PASSKEY }, () => (
-            <DocumentActionAuthPasskey
-              actionTarget={actionTarget}
-              actionVerb={actionVerb}
-              open={open}
-              onOpenChange={onOpenChange}
-              onReauthFormSubmit={onReauthFormSubmit}
-            />
-          ))
-          .with({ documentAuthType: DocumentAuth.EXPLICIT_NONE }, () => null)
-          .exhaustive()}
-      </DialogContent>
-    </Dialog>
-  );
-};

apps/web/src/app/(signing)/sign/[token]/document-action-auth-passkey.tsx

@@ -1,255 +0,0 @@
-import { useEffect, useState } from 'react';
-
-import { zodResolver } from '@hookform/resolvers/zod';
-import { browserSupportsWebAuthn, startAuthentication } from '@simplewebauthn/browser';
-import { Loader } from 'lucide-react';
-import { useForm } from 'react-hook-form';
-import { z } from 'zod';
-
-import { AppError } from '@documenso/lib/errors/app-error';
-import { DocumentAuth, type TRecipientActionAuth } from '@documenso/lib/types/document-auth';
-import { RecipientRole } from '@documenso/prisma/client';
-import { trpc } from '@documenso/trpc/react';
-import { Alert, AlertDescription, AlertTitle } from '@documenso/ui/primitives/alert';
-import { Button } from '@documenso/ui/primitives/button';
-import { DialogFooter } from '@documenso/ui/primitives/dialog';
-import {
-  Form,
-  FormControl,
-  FormField,
-  FormItem,
-  FormLabel,
-  FormMessage,
-} from '@documenso/ui/primitives/form/form';
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from '@documenso/ui/primitives/select';
-
-import { CreatePasskeyDialog } from '~/app/(dashboard)/settings/security/passkeys/create-passkey-dialog';
-
-import { useRequiredDocumentAuthContext } from './document-auth-provider';
-
-export type DocumentActionAuthPasskeyProps = {
-  actionTarget?: 'FIELD' | 'DOCUMENT';
-  actionVerb?: string;
-  open: boolean;
-  onOpenChange: (value: boolean) => void;
-  onReauthFormSubmit: (values?: TRecipientActionAuth) => Promise<void> | void;
-};
-
-const ZPasskeyAuthFormSchema = z.object({
-  passkeyId: z.string(),
-});
-
-type TPasskeyAuthFormSchema = z.infer<typeof ZPasskeyAuthFormSchema>;
-
-export const DocumentActionAuthPasskey = ({
-  actionTarget = 'FIELD',
-  actionVerb = 'sign',
-  onReauthFormSubmit,
-  open,
-  onOpenChange,
-}: DocumentActionAuthPasskeyProps) => {
-  const {
-    recipient,
-    passkeyData,
-    preferredPasskeyId,
-    setPreferredPasskeyId,
-    isCurrentlyAuthenticating,
-    setIsCurrentlyAuthenticating,
-    refetchPasskeys,
-  } = useRequiredDocumentAuthContext();
-
-  const form = useForm<TPasskeyAuthFormSchema>({
-    resolver: zodResolver(ZPasskeyAuthFormSchema),
-    defaultValues: {
-      passkeyId: preferredPasskeyId || '',
-    },
-  });
-
-  const { mutateAsync: createPasskeyAuthenticationOptions } =
-    trpc.auth.createPasskeyAuthenticationOptions.useMutation();
-
-  const [formErrorCode, setFormErrorCode] = useState<string | null>(null);
-
-  const onFormSubmit = async ({ passkeyId }: TPasskeyAuthFormSchema) => {
-    try {
-      setPreferredPasskeyId(passkeyId);
-      setIsCurrentlyAuthenticating(true);
-
-      const { options, tokenReference } = await createPasskeyAuthenticationOptions({
-        preferredPasskeyId: passkeyId,
-      });
-
-      const authenticationResponse = await startAuthentication(options);
-
-      await onReauthFormSubmit({
-        type: DocumentAuth.PASSKEY,
-        authenticationResponse,
-        tokenReference,
-      });
-
-      setIsCurrentlyAuthenticating(false);
-
-      onOpenChange(false);
-    } catch (err) {
-      setIsCurrentlyAuthenticating(false);
-
-      if (err.name === 'NotAllowedError') {
-        return;
-      }
-
-      const error = AppError.parseError(err);
-      setFormErrorCode(error.code);
-
-      // Todo: Alert.
-    }
-  };
-
-  useEffect(() => {
-    form.reset({
-      passkeyId: preferredPasskeyId || '',
-    });
-
-    setFormErrorCode(null);
-  }, [open, form, preferredPasskeyId]);
-
-  if (!browserSupportsWebAuthn()) {
-    return (
-      <div className="space-y-4">
-        <Alert variant="warning">
-          <AlertDescription>
-            Your browser does not support passkeys, which is required to {actionVerb.toLowerCase()}{' '}
-            this {actionTarget.toLowerCase()}.
-          </AlertDescription>
-        </Alert>
-
-        <DialogFooter>
-          <Button type="button" variant="secondary" onClick={() => onOpenChange(false)}>
-            Close
-          </Button>
-        </DialogFooter>
-      </div>
-    );
-  }
-
-  if (
-    passkeyData.isInitialLoading ||
-    (passkeyData.isRefetching && passkeyData.passkeys.length === 0)
-  ) {
-    return (
-      <div className="flex h-28 items-center justify-center">
-        <Loader className="text-muted-foreground h-6 w-6 animate-spin" />
-      </div>
-    );
-  }
-
-  if (passkeyData.isError) {
-    return (
-      <div className="h-28 space-y-4">
-        <Alert variant="destructive">
-          <AlertDescription>Something went wrong while loading your passkeys.</AlertDescription>
-        </Alert>
-
-        <DialogFooter>
-          <Button type="button" variant="secondary" onClick={() => onOpenChange(false)}>
-            Cancel
-          </Button>
-
-          <Button type="button" onClick={() => void refetchPasskeys()}>
-            Retry
-          </Button>
-        </DialogFooter>
-      </div>
-    );
-  }
-
-  if (passkeyData.passkeys.length === 0) {
-    return (
-      <div className="space-y-4">
-        <Alert>
-          <AlertDescription>
-            {recipient.role === RecipientRole.VIEWER && actionTarget === 'DOCUMENT'
-              ? 'You need to setup a passkey to mark this document as viewed.'
-              : `You need to setup a passkey to ${actionVerb.toLowerCase()} this ${actionTarget.toLowerCase()}.`}
-          </AlertDescription>
-        </Alert>
-
-        <DialogFooter>
-          <Button type="button" variant="secondary" onClick={() => onOpenChange(false)}>
-            Cancel
-          </Button>
-
-          <CreatePasskeyDialog
-            onSuccess={async () => refetchPasskeys()}
-            trigger={<Button>Setup</Button>}
-          />
-        </DialogFooter>
-      </div>
-    );
-  }
-
-  return (
-    <Form {...form}>
-      <form onSubmit={form.handleSubmit(onFormSubmit)}>
-        <fieldset disabled={isCurrentlyAuthenticating}>
-          <div className="space-y-4">
-            <FormField
-              control={form.control}
-              name="passkeyId"
-              render={({ field }) => (
-                <FormItem>
-                  <FormLabel required>Passkey</FormLabel>
-
-                  <FormControl>
-                    <Select {...field} onValueChange={field.onChange}>
-                      <SelectTrigger className="bg-background text-muted-foreground">
-                        <SelectValue
-                          data-testid="documentAccessSelectValue"
-                          placeholder="Select passkey"
-                        />
-                      </SelectTrigger>
-
-                      <SelectContent position="popper">
-                        {passkeyData.passkeys.map((passkey) => (
-                          <SelectItem key={passkey.id} value={passkey.id}>
-                            {passkey.name}
-                          </SelectItem>
-                        ))}
-                      </SelectContent>
-                    </Select>
-                  </FormControl>
-
-                  <FormMessage />
-                </FormItem>
-              )}
-            />
-
-            {formErrorCode && (
-              <Alert variant="destructive">
-                <AlertTitle>Unauthorized</AlertTitle>
-                <AlertDescription>
-                  We were unable to verify your details. Please try again or contact support
-                </AlertDescription>
-              </Alert>
-            )}
-
-            <DialogFooter>
-              <Button type="button" variant="secondary" onClick={() => onOpenChange(false)}>
-                Cancel
-              </Button>
-
-              <Button type="submit" loading={isCurrentlyAuthenticating}>
-                Sign
-              </Button>
-            </DialogFooter>
-          </div>
-        </fieldset>
-      </form>
-    </Form>
-  );
-};

apps/web/src/app/(signing)/sign/[token]/document-auth-provider.tsx

@@ -1,223 +0,0 @@
-'use client';
-
-import { createContext, useContext, useEffect, useMemo, useState } from 'react';
-
-import { match } from 'ts-pattern';
-
-import { MAXIMUM_PASSKEYS } from '@documenso/lib/constants/auth';
-import { DOCUMENT_AUTH_TYPES } from '@documenso/lib/constants/document-auth';
-import type {
-  TDocumentAuthOptions,
-  TRecipientAccessAuthTypes,
-  TRecipientActionAuthTypes,
-  TRecipientAuthOptions,
-} from '@documenso/lib/types/document-auth';
-import { DocumentAuth } from '@documenso/lib/types/document-auth';
-import { extractDocumentAuthMethods } from '@documenso/lib/utils/document-auth';
-import type { Document, Passkey, Recipient, User } from '@documenso/prisma/client';
-import { trpc } from '@documenso/trpc/react';
-
-import type { DocumentActionAuthDialogProps } from './document-action-auth-dialog';
-import { DocumentActionAuthDialog } from './document-action-auth-dialog';
-
-type PasskeyData = {
-  passkeys: Omit<Passkey, 'credentialId' | 'credentialPublicKey'>[];
-  isInitialLoading: boolean;
-  isRefetching: boolean;
-  isError: boolean;
-};
-
-export type DocumentAuthContextValue = {
-  executeActionAuthProcedure: (_value: ExecuteActionAuthProcedureOptions) => Promise<void>;
-  document: Document;
-  documentAuthOption: TDocumentAuthOptions;
-  setDocument: (_value: Document) => void;
-  recipient: Recipient;
-  recipientAuthOption: TRecipientAuthOptions;
-  setRecipient: (_value: Recipient) => void;
-  derivedRecipientAccessAuth: TRecipientAccessAuthTypes | null;
-  derivedRecipientActionAuth: TRecipientActionAuthTypes | null;
-  isAuthRedirectRequired: boolean;
-  isCurrentlyAuthenticating: boolean;
-  setIsCurrentlyAuthenticating: (_value: boolean) => void;
-  passkeyData: PasskeyData;
-  preferredPasskeyId: string | null;
-  setPreferredPasskeyId: (_value: string | null) => void;
-  user?: User | null;
-  refetchPasskeys: () => Promise<void>;
-};
-
-const DocumentAuthContext = createContext<DocumentAuthContextValue | null>(null);
-
-export const useDocumentAuthContext = () => {
-  return useContext(DocumentAuthContext);
-};
-
-export const useRequiredDocumentAuthContext = () => {
-  const context = useDocumentAuthContext();
-
-  if (!context) {
-    throw new Error('Document auth context is required');
-  }
-
-  return context;
-};
-
-export interface DocumentAuthProviderProps {
-  document: Document;
-  recipient: Recipient;
-  user?: User | null;
-  children: React.ReactNode;
-}
-
-export const DocumentAuthProvider = ({
-  document: initialDocument,
-  recipient: initialRecipient,
-  user,
-  children,
-}: DocumentAuthProviderProps) => {
-  const [document, setDocument] = useState(initialDocument);
-  const [recipient, setRecipient] = useState(initialRecipient);
-
-  const [isCurrentlyAuthenticating, setIsCurrentlyAuthenticating] = useState(false);
-  const [preferredPasskeyId, setPreferredPasskeyId] = useState<string | null>(null);
-
-  const {
-    documentAuthOption,
-    recipientAuthOption,
-    derivedRecipientAccessAuth,
-    derivedRecipientActionAuth,
-  } = useMemo(
-    () =>
-      extractDocumentAuthMethods({
-        documentAuth: document.authOptions,
-        recipientAuth: recipient.authOptions,
-      }),
-    [document, recipient],
-  );
-
-  const passkeyQuery = trpc.auth.findPasskeys.useQuery(
-    {
-      perPage: MAXIMUM_PASSKEYS,
-    },
-    {
-      keepPreviousData: true,
-      enabled: derivedRecipientActionAuth === DocumentAuth.PASSKEY,
-    },
-  );
-
-  const passkeyData: PasskeyData = {
-    passkeys: passkeyQuery.data?.data || [],
-    isInitialLoading: passkeyQuery.isInitialLoading,
-    isRefetching: passkeyQuery.isRefetching,
-    isError: passkeyQuery.isError,
-  };
-
-  const [documentAuthDialogPayload, setDocumentAuthDialogPayload] =
-    useState<ExecuteActionAuthProcedureOptions | null>(null);
-
-  /**
-   * The pre calculated auth payload if the current user is authenticated correctly
-   * for the `derivedRecipientActionAuth`.
-   *
-   * Will be `null` if the user still requires authentication, or if they don't need
-   * authentication.
-   */
-  const preCalculatedActionAuthOptions = match(derivedRecipientActionAuth)
-    .with(DocumentAuth.ACCOUNT, () => {
-      if (recipient.email !== user?.email) {
-        return null;
-      }
-
-      return {
-        type: DocumentAuth.ACCOUNT,
-      };
-    })
-    .with(DocumentAuth.EXPLICIT_NONE, () => ({
-      type: DocumentAuth.EXPLICIT_NONE,
-    }))
-    .with(DocumentAuth.PASSKEY, null, () => null)
-    .exhaustive();
-
-  const executeActionAuthProcedure = async (options: ExecuteActionAuthProcedureOptions) => {
-    // Directly run callback if no auth required.
-    if (!derivedRecipientActionAuth) {
-      await options.onReauthFormSubmit();
-      return;
-    }
-
-    // Run callback with precalculated auth options if available.
-    if (preCalculatedActionAuthOptions) {
-      setDocumentAuthDialogPayload(null);
-      await options.onReauthFormSubmit(preCalculatedActionAuthOptions);
-      return;
-    }
-
-    // Request the required auth from the user.
-    setDocumentAuthDialogPayload({
-      ...options,
-    });
-  };
-
-  useEffect(() => {
-    const { passkeys } = passkeyData;
-
-    if (!preferredPasskeyId && passkeys.length > 0) {
-      setPreferredPasskeyId(passkeys[0].id);
-    }
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [passkeyData.passkeys]);
-
-  const isAuthRedirectRequired = Boolean(
-    DOCUMENT_AUTH_TYPES[derivedRecipientActionAuth || '']?.isAuthRedirectRequired &&
-      !preCalculatedActionAuthOptions,
-  );
-
-  const refetchPasskeys = async () => {
-    await passkeyQuery.refetch();
-  };
-
-  return (
-    <DocumentAuthContext.Provider
-      value={{
-        user,
-        document,
-        setDocument,
-        executeActionAuthProcedure,
-        recipient,
-        setRecipient,
-        documentAuthOption,
-        recipientAuthOption,
-        derivedRecipientAccessAuth,
-        derivedRecipientActionAuth,
-        isAuthRedirectRequired,
-        isCurrentlyAuthenticating,
-        setIsCurrentlyAuthenticating,
-        passkeyData,
-        preferredPasskeyId,
-        setPreferredPasskeyId,
-        refetchPasskeys,
-      }}
-    >
-      {children}
-
-      {documentAuthDialogPayload && derivedRecipientActionAuth && (
-        <DocumentActionAuthDialog
-          open={true}
-          onOpenChange={() => setDocumentAuthDialogPayload(null)}
-          onReauthFormSubmit={documentAuthDialogPayload.onReauthFormSubmit}
-          actionTarget={documentAuthDialogPayload.actionTarget}
-          documentAuthType={derivedRecipientActionAuth}
-        />
-      )}
-    </DocumentAuthContext.Provider>
-  );
-};
-
-type ExecuteActionAuthProcedureOptions = Omit<
-  DocumentActionAuthDialogProps,
-  'open' | 'onOpenChange' | 'documentAuthType' | 'recipientRole'
->;
-
-DocumentAuthProvider.displayName = 'DocumentAuthProvider';

apps/web/src/app/(signing)/sign/[token]/email-field.tsx

@@ -6,8 +6,6 @@ import { useRouter } from 'next/navigation';
 
 import { Loader } from 'lucide-react';
 
-import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
-import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import type { Recipient } from '@documenso/prisma/client';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
@@ -40,24 +38,17 @@ export const EmailField = ({ field, recipient }: EmailFieldProps) => {
 
   const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading || isPending;
 
-  const onSign = async (authOptions?: TRecipientActionAuth) => {
+  const onSign = async () => {
     try {
       await signFieldWithToken({
         token: recipient.token,
         fieldId: field.id,
         value: providedEmail ?? '',
         isBase64: false,
-        authOptions,
       });
 
       startTransition(() => router.refresh());
     } catch (err) {
-      const error = AppError.parseError(err);
-
-      if (error.code === AppErrorCode.UNAUTHORIZED) {
-        throw error;
-      }
-
       console.error(err);
 
       toast({

apps/web/src/app/(signing)/sign/[token]/form.tsx

@@ -8,7 +8,6 @@ import { useSession } from 'next-auth/react';
 import { useForm } from 'react-hook-form';
 
 import { useAnalytics } from '@documenso/lib/client-only/hooks/use-analytics';
-import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import { sortFieldsByPosition, validateFieldsInserted } from '@documenso/lib/utils/fields';
 import { type Document, type Field, type Recipient, RecipientRole } from '@documenso/prisma/client';
 import { trpc } from '@documenso/trpc/react';
@@ -20,7 +19,6 @@ import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
 import { SignaturePad } from '@documenso/ui/primitives/signature-pad';
 
-import { useRequiredDocumentAuthContext } from './document-auth-provider';
 import { useRequiredSigningContext } from './provider';
 import { SignDialog } from './sign-dialog';
 
@@ -37,7 +35,6 @@ export const SigningForm = ({ document, recipient, fields, redirectUrl }: Signin
   const { data: session } = useSession();
 
   const { fullName, signature, setFullName, setSignature } = useRequiredSigningContext();
-  const { executeActionAuthProcedure } = useRequiredDocumentAuthContext();
 
   const [validateUninsertedFields, setValidateUninsertedFields] = useState(false);
 
@@ -67,17 +64,9 @@ export const SigningForm = ({ document, recipient, fields, redirectUrl }: Signin
       return;
     }
 
-    await executeActionAuthProcedure({
-      onReauthFormSubmit: completeDocument,
-      actionTarget: 'DOCUMENT',
-    });
-  };
-
-  const completeDocument = async (authOptions?: TRecipientActionAuth) => {
     await completeDocumentWithToken({
       token: recipient.token,
       documentId: document.id,
-      authOptions,
     });
 
     analytics.capture('App: Recipient has completed signing', {

apps/web/src/app/(signing)/sign/[token]/name-field.tsx

@@ -6,8 +6,6 @@ import { useRouter } from 'next/navigation';
 
 import { Loader } from 'lucide-react';
 
-import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
-import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import type { Recipient } from '@documenso/prisma/client';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
@@ -17,7 +15,6 @@ import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
-import { useRequiredDocumentAuthContext } from './document-auth-provider';
 import { useRequiredSigningContext } from './provider';
 import { SigningFieldContainer } from './signing-field-container';
 
@@ -34,8 +31,6 @@ export const NameField = ({ field, recipient }: NameFieldProps) => {
   const { fullName: providedFullName, setFullName: setProvidedFullName } =
     useRequiredSigningContext();
 
-  const { executeActionAuthProcedure } = useRequiredDocumentAuthContext();
-
   const [isPending, startTransition] = useTransition();
 
   const { mutateAsync: signFieldWithToken, isLoading: isSignFieldWithTokenLoading } =
@@ -51,32 +46,9 @@ export const NameField = ({ field, recipient }: NameFieldProps) => {
   const [showFullNameModal, setShowFullNameModal] = useState(false);
   const [localFullName, setLocalFullName] = useState('');
 
-  const onPreSign = () => {
-    if (!providedFullName) {
-      setShowFullNameModal(true);
-      return false;
-    }
-
-    return true;
-  };
-
-  /**
-   * When the user clicks the sign button in the dialog where they enter their full name.
-   */
-  const onDialogSignClick = () => {
-    setShowFullNameModal(false);
-    setProvidedFullName(localFullName);
-
-    void executeActionAuthProcedure({
-      onReauthFormSubmit: async (authOptions) => await onSign(authOptions, localFullName),
-    });
-  };
-
-  const onSign = async (authOptions?: TRecipientActionAuth, name?: string) => {
+  const onSign = async (source: 'local' | 'provider' = 'provider') => {
     try {
-      const value = name || providedFullName;
-
-      if (!value) {
+      if (!providedFullName && !localFullName) {
         setShowFullNameModal(true);
         return;
       }
@@ -84,19 +56,18 @@ export const NameField = ({ field, recipient }: NameFieldProps) => {
       await signFieldWithToken({
         token: recipient.token,
         fieldId: field.id,
-        value,
+        value: source === 'local' && localFullName ? localFullName : providedFullName ?? '',
         isBase64: false,
-        authOptions,
       });
 
+      if (source === 'local' && !providedFullName) {
+        setProvidedFullName(localFullName);
+      }
+
+      setLocalFullName('');
+
       startTransition(() => router.refresh());
     } catch (err) {
-      const error = AppError.parseError(err);
-
-      if (error.code === AppErrorCode.UNAUTHORIZED) {
-        throw error;
-      }
-
       console.error(err);
 
       toast({
@@ -127,13 +98,7 @@ export const NameField = ({ field, recipient }: NameFieldProps) => {
   };
 
   return (
-    <SigningFieldContainer
-      field={field}
-      onPreSign={onPreSign}
-      onSign={onSign}
-      onRemove={onRemove}
-      type="Name"
-    >
+    <SigningFieldContainer field={field} onSign={onSign} onRemove={onRemove} type="Name">
       {isLoading && (
         <div className="bg-background absolute inset-0 flex items-center justify-center rounded-md">
           <Loader className="text-primary h-5 w-5 animate-spin md:h-8 md:w-8" />
@@ -182,7 +147,10 @@ export const NameField = ({ field, recipient }: NameFieldProps) => {
                 type="button"
                 className="flex-1"
                 disabled={!localFullName}
-                onClick={() => onDialogSignClick()}
+                onClick={() => {
+                  setShowFullNameModal(false);
+                  void onSign('local');
+                }}
               >
                 Sign
               </Button>

apps/web/src/app/(signing)/sign/[token]/page.tsx

@@ -1,24 +1,35 @@
 import { headers } from 'next/headers';
 import { notFound, redirect } from 'next/navigation';
 
+import { match } from 'ts-pattern';
+
 import { DOCUMENSO_ENCRYPTION_KEY } from '@documenso/lib/constants/crypto';
+import { DEFAULT_DOCUMENT_DATE_FORMAT } from '@documenso/lib/constants/date-formats';
+import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
+import { DEFAULT_DOCUMENT_TIME_ZONE } from '@documenso/lib/constants/time-zones';
 import { getServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
 import { getDocumentAndSenderByToken } from '@documenso/lib/server-only/document/get-document-by-token';
-import { isRecipientAuthorized } from '@documenso/lib/server-only/document/is-recipient-authorized';
 import { viewedDocument } from '@documenso/lib/server-only/document/viewed-document';
 import { getFieldsForToken } from '@documenso/lib/server-only/field/get-fields-for-token';
 import { getRecipientByToken } from '@documenso/lib/server-only/recipient/get-recipient-by-token';
 import { getRecipientSignatures } from '@documenso/lib/server-only/recipient/get-recipient-signatures';
 import { symmetricDecrypt } from '@documenso/lib/universal/crypto';
 import { extractNextHeaderRequestMetadata } from '@documenso/lib/universal/extract-request-metadata';
-import { extractDocumentAuthMethods } from '@documenso/lib/utils/document-auth';
-import { DocumentStatus, SigningStatus } from '@documenso/prisma/client';
+import { DocumentStatus, FieldType, RecipientRole, SigningStatus } from '@documenso/prisma/client';
+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';
 
-import { DocumentAuthProvider } from './document-auth-provider';
+import { truncateTitle } from '~/helpers/truncate-title';
+
+import { DateField } from './date-field';
+import { EmailField } from './email-field';
+import { SigningForm } from './form';
+import { NameField } from './name-field';
 import { NoLongerAvailable } from './no-longer-available';
 import { SigningProvider } from './provider';
-import { SigningAuthPageView } from './signing-auth-page';
-import { SigningPageView } from './signing-page-view';
+import { SignatureField } from './signature-field';
+import { TextField } from './text-field';
 
 export type SigningPageProps = {
   params: {
@@ -31,8 +42,6 @@ export default async function SigningPage({ params: { token } }: SigningPageProp
     return notFound();
   }
 
-  const { user } = await getServerComponentSession();
-
   const requestHeaders = Object.fromEntries(headers().entries());
 
   const requestMetadata = extractNextHeaderRequestMetadata(requestHeaders);
@@ -40,40 +49,21 @@ export default async function SigningPage({ params: { token } }: SigningPageProp
   const [document, fields, recipient] = await Promise.all([
     getDocumentAndSenderByToken({
       token,
-      userId: user?.id,
-      requireAccessAuth: false,
     }).catch(() => null),
     getFieldsForToken({ token }),
     getRecipientByToken({ token }).catch(() => null),
+    viewedDocument({ token, requestMetadata }).catch(() => null),
   ]);
 
   if (!document || !document.documentData || !recipient) {
     return notFound();
   }
 
-  const { derivedRecipientAccessAuth } = extractDocumentAuthMethods({
-    documentAuth: document.authOptions,
-    recipientAuth: recipient.authOptions,
-  });
+  const truncatedTitle = truncateTitle(document.title);
 
-  const isDocumentAccessValid = await isRecipientAuthorized({
-    type: 'ACCESS',
-    document,
-    recipient,
-    userId: user?.id,
-  });
+  const { documentData, documentMeta } = document;
 
-  if (!isDocumentAccessValid) {
-    return <SigningAuthPageView email={recipient.email} />;
-  }
-
-  await viewedDocument({
-    token,
-    requestMetadata,
-    recipientAccessAuth: derivedRecipientAccessAuth,
-  }).catch(() => null);
-
-  const { documentMeta } = document;
+  const { user } = await getServerComponentSession();
 
   if (
     document.status === DocumentStatus.COMPLETED ||
@@ -119,9 +109,73 @@ export default async function SigningPage({ params: { token } }: SigningPageProp
       fullName={user?.email === recipient.email ? user.name : recipient.name}
       signature={user?.email === recipient.email ? user.signature : undefined}
     >
-      <DocumentAuthProvider document={document} recipient={recipient} user={user}>
-        <SigningPageView recipient={recipient} document={document} fields={fields} />
-      </DocumentAuthProvider>
+      <div className="mx-auto w-full max-w-screen-xl">
+        <h1 className="mt-4 truncate text-2xl font-semibold md:text-3xl" title={document.title}>
+          {truncatedTitle}
+        </h1>
+
+        <div className="mt-2.5 flex items-center gap-x-6">
+          <p className="text-muted-foreground">
+            {document.User.name} ({document.User.email}) has invited you to{' '}
+            {recipient.role === RecipientRole.VIEWER && 'view'}
+            {recipient.role === RecipientRole.SIGNER && 'sign'}
+            {recipient.role === RecipientRole.APPROVER && 'approve'} this document.
+          </p>
+        </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">
+            <SigningForm
+              document={document}
+              recipient={recipient}
+              fields={fields}
+              redirectUrl={documentMeta?.redirectUrl}
+            />
+          </div>
+        </div>
+
+        <ElementVisible target={PDF_VIEWER_PAGE_SELECTOR}>
+          {fields.map((field) =>
+            match(field.type)
+              .with(FieldType.SIGNATURE, () => (
+                <SignatureField key={field.id} field={field} recipient={recipient} />
+              ))
+              .with(FieldType.NAME, () => (
+                <NameField key={field.id} field={field} recipient={recipient} />
+              ))
+              .with(FieldType.DATE, () => (
+                <DateField
+                  key={field.id}
+                  field={field}
+                  recipient={recipient}
+                  dateFormat={documentMeta?.dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT}
+                  timezone={documentMeta?.timezone ?? DEFAULT_DOCUMENT_TIME_ZONE}
+                />
+              ))
+              .with(FieldType.EMAIL, () => (
+                <EmailField key={field.id} field={field} recipient={recipient} />
+              ))
+              .with(FieldType.TEXT, () => (
+                <TextField key={field.id} field={field} recipient={recipient} />
+              ))
+              .otherwise(() => null),
+          )}
+        </ElementVisible>
+      </div>
     </SigningProvider>
   );
 }

apps/web/src/app/(signing)/sign/[token]/sign-dialog.tsx

@@ -12,8 +12,6 @@ import {
 
 import { truncateTitle } from '~/helpers/truncate-title';
 
-import { useRequiredDocumentAuthContext } from './document-auth-provider';
-
 export type SignDialogProps = {
   isSubmitting: boolean;
   document: Document;
@@ -31,34 +29,12 @@ export const SignDialog = ({
   onSignatureComplete,
   role,
 }: SignDialogProps) => {
-  const { executeActionAuthProcedure, isAuthRedirectRequired, isCurrentlyAuthenticating } =
-    useRequiredDocumentAuthContext();
-
   const [showDialog, setShowDialog] = useState(false);
   const truncatedTitle = truncateTitle(document.title);
   const isComplete = fields.every((field) => field.inserted);
 
-  const handleOpenChange = async (open: boolean) => {
-    if (isSubmitting || !isComplete) {
-      return;
-    }
-
-    if (isAuthRedirectRequired) {
-      await executeActionAuthProcedure({
-        actionTarget: 'DOCUMENT',
-        onReauthFormSubmit: () => {
-          // Do nothing since the user should be redirected.
-        },
-      });
-
-      return;
-    }
-
-    setShowDialog(open);
-  };
-
   return (
-    <Dialog open={showDialog} onOpenChange={handleOpenChange}>
+    <Dialog open={showDialog && isComplete} onOpenChange={setShowDialog}>
       <DialogTrigger asChild>
         <Button
           className="w-full"
@@ -104,7 +80,7 @@ export const SignDialog = ({
               type="button"
               className="flex-1"
               disabled={!isComplete}
-              loading={isSubmitting || isCurrentlyAuthenticating}
+              loading={isSubmitting}
               onClick={onSignatureComplete}
             >
               {role === RecipientRole.VIEWER && 'Mark as Viewed'}

apps/web/src/app/(signing)/sign/[token]/signature-field.tsx

@@ -1,13 +1,11 @@
 'use client';
 
-import { useMemo, useState, useTransition } from 'react';
+import { useEffect, useMemo, useState, useTransition } from 'react';
 
 import { useRouter } from 'next/navigation';
 
 import { Loader } from 'lucide-react';
 
-import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
-import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import type { Recipient } from '@documenso/prisma/client';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
@@ -17,7 +15,6 @@ import { Label } from '@documenso/ui/primitives/label';
 import { SignaturePad } from '@documenso/ui/primitives/signature-pad';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
-import { useRequiredDocumentAuthContext } from './document-auth-provider';
 import { useRequiredSigningContext } from './provider';
 import { SigningFieldContainer } from './signing-field-container';
 
@@ -32,12 +29,9 @@ export const SignatureField = ({ field, recipient }: SignatureFieldProps) => {
   const router = useRouter();
 
   const { toast } = useToast();
-
   const { signature: providedSignature, setSignature: setProvidedSignature } =
     useRequiredSigningContext();
 
-  const { executeActionAuthProcedure } = useRequiredDocumentAuthContext();
-
   const [isPending, startTransition] = useTransition();
 
   const { mutateAsync: signFieldWithToken, isLoading: isSignFieldWithTokenLoading } =
@@ -54,6 +48,7 @@ export const SignatureField = ({ field, recipient }: SignatureFieldProps) => {
 
   const [showSignatureModal, setShowSignatureModal] = useState(false);
   const [localSignature, setLocalSignature] = useState<string | null>(null);
+  const [isLocalSignatureSet, setIsLocalSignatureSet] = useState(false);
 
   const state = useMemo<SignatureFieldState>(() => {
     if (!field.inserted) {
@@ -67,37 +62,23 @@ export const SignatureField = ({ field, recipient }: SignatureFieldProps) => {
     return 'signed-text';
   }, [field.inserted, signature?.signatureImageAsBase64]);
 
-  const onPreSign = () => {
-    if (!providedSignature) {
-      setShowSignatureModal(true);
-      return false;
+  useEffect(() => {
+    if (!showSignatureModal && !isLocalSignatureSet) {
+      setLocalSignature(null);
     }
+  }, [showSignatureModal, isLocalSignatureSet]);
 
-    return true;
-  };
-
-  /**
-   * When the user clicks the sign button in the dialog where they enter their signature.
-   */
-  const onDialogSignClick = () => {
-    setShowSignatureModal(false);
-    setProvidedSignature(localSignature);
-
-    if (!localSignature) {
-      return;
-    }
-
-    void executeActionAuthProcedure({
-      onReauthFormSubmit: async (authOptions) => await onSign(authOptions, localSignature),
-    });
-  };
-
-  const onSign = async (authOptions?: TRecipientActionAuth, signature?: string) => {
+  const onSign = async (source: 'local' | 'provider' = 'provider') => {
     try {
-      const value = signature || providedSignature;
+      if (!providedSignature && !localSignature) {
+        setIsLocalSignatureSet(false);
+        setShowSignatureModal(true);
+        return;
+      }
+
+      const value = source === 'local' && localSignature ? localSignature : providedSignature ?? '';
 
       if (!value) {
-        setShowSignatureModal(true);
         return;
       }
 
@@ -106,17 +87,16 @@ export const SignatureField = ({ field, recipient }: SignatureFieldProps) => {
         fieldId: field.id,
         value,
         isBase64: true,
-        authOptions,
       });
 
+      if (source === 'local' && !providedSignature) {
+        setProvidedSignature(localSignature);
+      }
+
+      setLocalSignature(null);
+
       startTransition(() => router.refresh());
     } catch (err) {
-      const error = AppError.parseError(err);
-
-      if (error.code === AppErrorCode.UNAUTHORIZED) {
-        throw error;
-      }
-
       console.error(err);
 
       toast({
@@ -147,13 +127,7 @@ export const SignatureField = ({ field, recipient }: SignatureFieldProps) => {
   };
 
   return (
-    <SigningFieldContainer
-      field={field}
-      onPreSign={onPreSign}
-      onSign={onSign}
-      onRemove={onRemove}
-      type="Signature"
-    >
+    <SigningFieldContainer field={field} onSign={onSign} onRemove={onRemove} type="Signature">
       {isLoading && (
         <div className="bg-background absolute inset-0 flex items-center justify-center rounded-md">
           <Loader className="text-primary h-5 w-5 animate-spin md:h-8 md:w-8" />
@@ -216,7 +190,11 @@ export const SignatureField = ({ field, recipient }: SignatureFieldProps) => {
                 type="button"
                 className="flex-1"
                 disabled={!localSignature}
-                onClick={() => onDialogSignClick()}
+                onClick={() => {
+                  setShowSignatureModal(false);
+                  setIsLocalSignatureSet(true);
+                  void onSign('local');
+                }}
               >
                 Sign
               </Button>

apps/web/src/app/(signing)/sign/[token]/signing-auth-page.tsx

@@ -1,67 +0,0 @@
-'use client';
-
-import { useState } from 'react';
-
-import { DateTime } from 'luxon';
-import { signOut } from 'next-auth/react';
-
-import { trpc } from '@documenso/trpc/react';
-import { Button } from '@documenso/ui/primitives/button';
-import { useToast } from '@documenso/ui/primitives/use-toast';
-
-export type SigningAuthPageViewProps = {
-  email: string;
-};
-
-export const SigningAuthPageView = ({ email }: SigningAuthPageViewProps) => {
-  const { toast } = useToast();
-
-  const [isSigningOut, setIsSigningOut] = useState(false);
-
-  const { mutateAsync: encryptSecondaryData } = trpc.crypto.encryptSecondaryData.useMutation();
-
-  const handleChangeAccount = async (email: string) => {
-    try {
-      setIsSigningOut(true);
-
-      const encryptedEmail = await encryptSecondaryData({
-        data: email,
-        expiresAt: DateTime.now().plus({ days: 1 }).toMillis(),
-      });
-
-      await signOut({
-        callbackUrl: `/signin?email=${encodeURIComponent(encryptedEmail)}`,
-      });
-    } catch {
-      toast({
-        title: 'Something went wrong',
-        description: 'We were unable to log you out at this time.',
-        duration: 10000,
-        variant: 'destructive',
-      });
-    }
-
-    setIsSigningOut(false);
-  };
-
-  return (
-    <div className="mx-auto flex h-[70vh] w-full max-w-md flex-col items-center justify-center">
-      <div>
-        <h1 className="text-3xl font-semibold">Authentication required</h1>
-
-        <p className="text-muted-foreground mt-2 text-sm">
-          You need to be logged in as <strong>{email}</strong> to view this page.
-        </p>
-
-        <Button
-          className="mt-4 w-full"
-          type="submit"
-          onClick={async () => handleChangeAccount(email)}
-          loading={isSigningOut}
-        >
-          Login
-        </Button>
-      </div>
-    </div>
-  );
-};

apps/web/src/app/(signing)/sign/[token]/signing-field-container.tsx

@@ -2,37 +2,15 @@
 
 import React from 'react';
 
-import { type TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { FieldRootContainer } from '@documenso/ui/components/field/field';
 import { Tooltip, TooltipContent, TooltipTrigger } from '@documenso/ui/primitives/tooltip';
 
-import { useRequiredDocumentAuthContext } from './document-auth-provider';
-
 export type SignatureFieldProps = {
   field: FieldWithSignature;
   loading?: boolean;
   children: React.ReactNode;
-
-  /**
-   * A function that is called before the field requires to be signed, or reauthed.
-   *
-   * Example, you may want to show a dialog prior to signing where they can enter a value.
-   *
-   * Once that action is complete, you will need to call `executeActionAuthProcedure` to proceed
-   * regardless if it requires reauth or not.
-   *
-   * If the function returns true, we will proceed with the signing process. Otherwise if
-   * false is returned we will not proceed.
-   */
-  onPreSign?: () => Promise<boolean> | boolean;
-
-  /**
-   * The function required to be executed to insert the field.
-   *
-   * The auth values will be passed in if available.
-   */
-  onSign?: (documentAuthValue?: TRecipientActionAuth) => Promise<void> | void;
+  onSign?: () => Promise<void> | void;
   onRemove?: () => Promise<void> | void;
   type?: 'Date' | 'Email' | 'Name' | 'Signature';
   tooltipText?: string | null;
@@ -41,42 +19,18 @@ export type SignatureFieldProps = {
 export const SigningFieldContainer = ({
   field,
   loading,
-  onPreSign,
   onSign,
   onRemove,
   children,
   type,
   tooltipText,
 }: SignatureFieldProps) => {
-  const { executeActionAuthProcedure, isAuthRedirectRequired } = useRequiredDocumentAuthContext();
-
-  const handleInsertField = async () => {
-    if (field.inserted || !onSign) {
+  const onSignFieldClick = async () => {
+    if (field.inserted) {
       return;
     }
 
-    if (isAuthRedirectRequired) {
-      await executeActionAuthProcedure({
-        onReauthFormSubmit: () => {
-          // Do nothing since the user should be redirected.
-        },
-      });
-
-      return;
-    }
-
-    // Handle any presign requirements, and halt if required.
-    if (onPreSign) {
-      const preSignResult = await onPreSign();
-
-      if (preSignResult === false) {
-        return;
-      }
-    }
-
-    await executeActionAuthProcedure({
-      onReauthFormSubmit: onSign,
-    });
+    await onSign?.();
   };
 
   const onRemoveSignedFieldClick = async () => {
@@ -93,7 +47,7 @@ export const SigningFieldContainer = ({
         <button
           type="submit"
           className="absolute inset-0 z-10 h-full w-full"
-          onClick={async () => handleInsertField()}
+          onClick={onSignFieldClick}
         />
       )}
 

apps/web/src/app/(signing)/sign/[token]/signing-page-view.tsx

@@ -1,102 +0,0 @@
-import { match } from 'ts-pattern';
-
-import { DEFAULT_DOCUMENT_DATE_FORMAT } from '@documenso/lib/constants/date-formats';
-import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
-import { DEFAULT_DOCUMENT_TIME_ZONE } from '@documenso/lib/constants/time-zones';
-import type { DocumentAndSender } from '@documenso/lib/server-only/document/get-document-by-token';
-import type { Field, Recipient } from '@documenso/prisma/client';
-import { FieldType, RecipientRole } from '@documenso/prisma/client';
-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';
-
-import { truncateTitle } from '~/helpers/truncate-title';
-
-import { DateField } from './date-field';
-import { EmailField } from './email-field';
-import { SigningForm } from './form';
-import { NameField } from './name-field';
-import { SignatureField } from './signature-field';
-import { TextField } from './text-field';
-
-export type SigningPageViewProps = {
-  document: DocumentAndSender;
-  recipient: Recipient;
-  fields: Field[];
-};
-
-export const SigningPageView = ({ document, recipient, fields }: SigningPageViewProps) => {
-  const truncatedTitle = truncateTitle(document.title);
-
-  const { documentData, documentMeta } = document;
-
-  return (
-    <div className="mx-auto w-full max-w-screen-xl">
-      <h1 className="mt-4 truncate text-2xl font-semibold md:text-3xl" title={document.title}>
-        {truncatedTitle}
-      </h1>
-
-      <div className="mt-2.5 flex items-center gap-x-6">
-        <p className="text-muted-foreground">
-          {document.User.name} ({document.User.email}) has invited you to{' '}
-          {recipient.role === RecipientRole.VIEWER && 'view'}
-          {recipient.role === RecipientRole.SIGNER && 'sign'}
-          {recipient.role === RecipientRole.APPROVER && 'approve'} this document.
-        </p>
-      </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">
-          <SigningForm
-            document={document}
-            recipient={recipient}
-            fields={fields}
-            redirectUrl={documentMeta?.redirectUrl}
-          />
-        </div>
-      </div>
-
-      <ElementVisible target={PDF_VIEWER_PAGE_SELECTOR}>
-        {fields.map((field) =>
-          match(field.type)
-            .with(FieldType.SIGNATURE, () => (
-              <SignatureField key={field.id} field={field} recipient={recipient} />
-            ))
-            .with(FieldType.NAME, () => (
-              <NameField key={field.id} field={field} recipient={recipient} />
-            ))
-            .with(FieldType.DATE, () => (
-              <DateField
-                key={field.id}
-                field={field}
-                recipient={recipient}
-                dateFormat={documentMeta?.dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT}
-                timezone={documentMeta?.timezone ?? DEFAULT_DOCUMENT_TIME_ZONE}
-              />
-            ))
-            .with(FieldType.EMAIL, () => (
-              <EmailField key={field.id} field={field} recipient={recipient} />
-            ))
-            .with(FieldType.TEXT, () => (
-              <TextField key={field.id} field={field} recipient={recipient} />
-            ))
-            .otherwise(() => null),
-        )}
-      </ElementVisible>
-    </div>
-  );
-};

apps/web/src/app/(signing)/sign/[token]/text-field.tsx

@@ -6,8 +6,6 @@ import { useRouter } from 'next/navigation';
 
 import { Loader } from 'lucide-react';
 
-import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
-import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import type { Recipient } from '@documenso/prisma/client';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
@@ -17,7 +15,6 @@ import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
-import { useRequiredDocumentAuthContext } from './document-auth-provider';
 import { SigningFieldContainer } from './signing-field-container';
 
 export type TextFieldProps = {
@@ -30,8 +27,6 @@ export const TextField = ({ field, recipient }: TextFieldProps) => {
 
   const { toast } = useToast();
 
-  const { executeActionAuthProcedure } = useRequiredDocumentAuthContext();
-
   const [isPending, startTransition] = useTransition();
 
   const { mutateAsync: signFieldWithToken, isLoading: isSignFieldWithTokenLoading } =
@@ -46,35 +41,22 @@ export const TextField = ({ field, recipient }: TextFieldProps) => {
 
   const [showCustomTextModal, setShowCustomTextModal] = useState(false);
   const [localText, setLocalCustomText] = useState('');
+  const [isLocalSignatureSet, setIsLocalSignatureSet] = useState(false);
 
   useEffect(() => {
-    if (!showCustomTextModal) {
+    if (!showCustomTextModal && !isLocalSignatureSet) {
       setLocalCustomText('');
     }
-  }, [showCustomTextModal]);
+  }, [showCustomTextModal, isLocalSignatureSet]);
 
-  /**
-   * When the user clicks the sign button in the dialog where they enter the text field.
-   */
-  const onDialogSignClick = () => {
-    setShowCustomTextModal(false);
-
-    void executeActionAuthProcedure({
-      onReauthFormSubmit: async (authOptions) => await onSign(authOptions),
-    });
-  };
-
-  const onPreSign = () => {
-    if (!localText) {
-      setShowCustomTextModal(true);
-      return false;
-    }
-
-    return true;
-  };
-
-  const onSign = async (authOptions?: TRecipientActionAuth) => {
+  const onSign = async () => {
     try {
+      if (!localText) {
+        setIsLocalSignatureSet(false);
+        setShowCustomTextModal(true);
+        return;
+      }
+
       if (!localText) {
         return;
       }
@@ -84,19 +66,12 @@ export const TextField = ({ field, recipient }: TextFieldProps) => {
         fieldId: field.id,
         value: localText,
         isBase64: true,
-        authOptions,
       });
 
       setLocalCustomText('');
 
       startTransition(() => router.refresh());
     } catch (err) {
-      const error = AppError.parseError(err);
-
-      if (error.code === AppErrorCode.UNAUTHORIZED) {
-        throw error;
-      }
-
       console.error(err);
 
       toast({
@@ -127,13 +102,7 @@ export const TextField = ({ field, recipient }: TextFieldProps) => {
   };
 
   return (
-    <SigningFieldContainer
-      field={field}
-      onPreSign={onPreSign}
-      onSign={onSign}
-      onRemove={onRemove}
-      type="Signature"
-    >
+    <SigningFieldContainer field={field} onSign={onSign} onRemove={onRemove} type="Signature">
       {isLoading && (
         <div className="bg-background absolute inset-0 flex items-center justify-center rounded-md">
           <Loader className="text-primary h-5 w-5 animate-spin md:h-8 md:w-8" />
@@ -180,7 +149,11 @@ export const TextField = ({ field, recipient }: TextFieldProps) => {
                 type="button"
                 className="flex-1"
                 disabled={!localText}
-                onClick={() => onDialogSignClick()}
+                onClick={() => {
+                  setShowCustomTextModal(false);
+                  setIsLocalSignatureSet(true);
+                  void onSign();
+                }}
               >
                 Save Text
               </Button>

apps/web/src/app/(teams)/t/[teamUrl]/settings/billing/page.tsx

@@ -54,7 +54,7 @@ export default async function TeamsSettingBillingPage({ params }: TeamsSettingsB
         <CardContent className="flex flex-row items-center justify-between p-4">
           <div className="flex flex-col text-sm">
             <p className="text-foreground font-semibold">
-              Current plan: {teamSubscription ? 'Team' : 'Early Adopter Team'}
+              Current plan: {teamSubscription ? 'Team' : 'Community Team'}
             </p>
 
             <p className="text-muted-foreground mt-0.5">

apps/web/src/app/(unauthenticated)/layout.tsx

@@ -10,7 +10,7 @@ type UnauthenticatedLayoutProps = {
 
 export default function UnauthenticatedLayout({ children }: UnauthenticatedLayoutProps) {
   return (
-    <main className="relative flex min-h-screen flex-col items-center justify-center overflow-hidden px-4 py-12 md:p-12 lg:p-24">
+    <main className="relative flex min-h-screen flex-col items-center justify-center overflow-hidden  px-4 py-12 md:p-12 lg:p-24">
       <div>
         <div className="absolute -inset-[min(600px,max(400px,60vw))] -z-[1] flex items-center justify-center opacity-70">
           <Image

apps/web/src/app/(unauthenticated)/signup/page.tsx

@@ -34,7 +34,7 @@ export default function SignUpPage({ searchParams }: SignUpPageProps) {
 
   return (
     <SignUpFormV2
-      className="w-screen max-w-screen-2xl px-4 md:px-16 lg:-my-16"
+      className="w-screen max-w-screen-2xl px-4 md:px-16"
       initialEmail={email || undefined}
       isGoogleSSOEnabled={IS_GOOGLE_SSO_ENABLED}
     />

apps/web/src/components/(dashboard)/avatar/stack-avatars-with-tooltip.tsx

@@ -1,12 +1,13 @@
-'use client';
-
-import { useRef, useState } from 'react';
-
 import { getRecipientType } from '@documenso/lib/client-only/recipient-type';
 import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
 import { recipientAbbreviation } from '@documenso/lib/utils/recipient-formatter';
 import type { Recipient } from '@documenso/prisma/client';
-import { Popover, PopoverContent, PopoverTrigger } from '@documenso/ui/primitives/popover';
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from '@documenso/ui/primitives/tooltip';
 
 import { AvatarWithRecipient } from './avatar-with-recipient';
 import { StackAvatar } from './stack-avatar';
@@ -23,11 +24,6 @@ export const StackAvatarsWithTooltip = ({
   position,
   children,
 }: StackAvatarsWithTooltipProps) => {
-  const [open, setOpen] = useState(false);
-
-  const isControlled = useRef(false);
-  const isMouseOverTimeout = useRef<NodeJS.Timeout | null>(null);
-
   const waitingRecipients = recipients.filter(
     (recipient) => getRecipientType(recipient) === 'waiting',
   );
@@ -44,105 +40,66 @@ export const StackAvatarsWithTooltip = ({
     (recipient) => getRecipientType(recipient) === 'unsigned',
   );
 
-  const onMouseEnter = () => {
-    if (isMouseOverTimeout.current) {
-      clearTimeout(isMouseOverTimeout.current);
-    }
-
-    if (isControlled.current) {
-      return;
-    }
-
-    isMouseOverTimeout.current = setTimeout(() => {
-      setOpen((o) => (!o ? true : o));
-    }, 200);
-  };
-
-  const onMouseLeave = () => {
-    if (isMouseOverTimeout.current) {
-      clearTimeout(isMouseOverTimeout.current);
-    }
-
-    if (isControlled.current) {
-      return;
-    }
-
-    setTimeout(() => {
-      setOpen((o) => (o ? false : o));
-    }, 200);
-  };
-
-  const onOpenChange = (newOpen: boolean) => {
-    isControlled.current = newOpen;
-
-    setOpen(newOpen);
-  };
-
   return (
-    <Popover open={open} onOpenChange={onOpenChange}>
-      <PopoverTrigger
-        className="flex cursor-pointer"
-        onMouseEnter={onMouseEnter}
-        onMouseLeave={onMouseLeave}
-      >
-        {children || <StackAvatars recipients={recipients} />}
-      </PopoverTrigger>
+    <TooltipProvider>
+      <Tooltip delayDuration={200}>
+        <TooltipTrigger className="flex cursor-pointer">
+          {children || <StackAvatars recipients={recipients} />}
+        </TooltipTrigger>
 
-      <PopoverContent
-        side={position}
-        onMouseEnter={onMouseEnter}
-        onMouseLeave={onMouseLeave}
-        className="flex flex-col gap-y-5 py-2"
-      >
-        {completedRecipients.length > 0 && (
-          <div>
-            <h1 className="text-base font-medium">Completed</h1>
-            {completedRecipients.map((recipient: Recipient) => (
-              <div key={recipient.id} className="my-1 flex items-center gap-2">
-                <StackAvatar
-                  first={true}
-                  key={recipient.id}
-                  type={getRecipientType(recipient)}
-                  fallbackText={recipientAbbreviation(recipient)}
-                />
-                <div className="">
-                  <p className="text-muted-foreground text-sm">{recipient.email}</p>
-                  <p className="text-muted-foreground/70 text-xs">
-                    {RECIPIENT_ROLES_DESCRIPTION[recipient.role].roleName}
-                  </p>
-                </div>
+        <TooltipContent side={position}>
+          <div className="flex flex-col gap-y-5 p-1">
+            {completedRecipients.length > 0 && (
+              <div>
+                <h1 className="text-base font-medium">Completed</h1>
+                {completedRecipients.map((recipient: Recipient) => (
+                  <div key={recipient.id} className="my-1 flex items-center gap-2">
+                    <StackAvatar
+                      first={true}
+                      key={recipient.id}
+                      type={getRecipientType(recipient)}
+                      fallbackText={recipientAbbreviation(recipient)}
+                    />
+                    <div className="">
+                      <p className="text-muted-foreground text-sm">{recipient.email}</p>
+                      <p className="text-muted-foreground/70 text-xs">
+                        {RECIPIENT_ROLES_DESCRIPTION[recipient.role].roleName}
+                      </p>
+                    </div>
+                  </div>
+                ))}
               </div>
-            ))}
-          </div>
-        )}
+            )}
 
-        {waitingRecipients.length > 0 && (
-          <div>
-            <h1 className="text-base font-medium">Waiting</h1>
-            {waitingRecipients.map((recipient: Recipient) => (
-              <AvatarWithRecipient key={recipient.id} recipient={recipient} />
-            ))}
-          </div>
-        )}
+            {waitingRecipients.length > 0 && (
+              <div>
+                <h1 className="text-base font-medium">Waiting</h1>
+                {waitingRecipients.map((recipient: Recipient) => (
+                  <AvatarWithRecipient key={recipient.id} recipient={recipient} />
+                ))}
+              </div>
+            )}
 
-        {openedRecipients.length > 0 && (
-          <div>
-            <h1 className="text-base font-medium">Opened</h1>
-            {openedRecipients.map((recipient: Recipient) => (
-              <AvatarWithRecipient key={recipient.id} recipient={recipient} />
-            ))}
-          </div>
-        )}
+            {openedRecipients.length > 0 && (
+              <div>
+                <h1 className="text-base font-medium">Opened</h1>
+                {openedRecipients.map((recipient: Recipient) => (
+                  <AvatarWithRecipient key={recipient.id} recipient={recipient} />
+                ))}
+              </div>
+            )}
 
-        {uncompletedRecipients.length > 0 && (
-          <div>
-            <h1 className="text-base font-medium">Uncompleted</h1>
-            {uncompletedRecipients.map((recipient: Recipient) => (
-              <AvatarWithRecipient key={recipient.id} recipient={recipient} />
-            ))}
+            {uncompletedRecipients.length > 0 && (
+              <div>
+                <h1 className="text-base font-medium">Uncompleted</h1>
+                {uncompletedRecipients.map((recipient: Recipient) => (
+                  <AvatarWithRecipient key={recipient.id} recipient={recipient} />
+                ))}
+              </div>
+            )}
           </div>
-        )}
-      </PopoverContent>
-    </Popover>
+        </TooltipContent>
+      </Tooltip>
+    </TooltipProvider>
   );
 };

apps/web/src/components/(dashboard)/layout/menu-switcher.tsx

@@ -93,7 +93,7 @@ export const MenuSwitcher = ({ user, teams: initialTeamsData }: MenuSwitcherProp
         <Button
           data-testid="menu-switcher"
           variant="none"
-          className="relative flex h-12 flex-row items-center px-2 py-2 ring-0 focus:outline-none focus-visible:border-0 focus-visible:ring-0 focus-visible:ring-transparent"
+          className="relative flex h-12 flex-row items-center px-2 py-2 ring-0 focus-visible:border-0 focus-visible:ring-0"
         >
           <AvatarWithText
             avatarFallback={formatAvatarFallback(selectedTeam?.name)}

apps/web/src/components/(dashboard)/settings/layout/header.tsx

@@ -5,18 +5,11 @@ import { cn } from '@documenso/ui/lib/utils';
 export type SettingsHeaderProps = {
   title: string;
   subtitle: string;
-  hideDivider?: boolean;
   children?: React.ReactNode;
   className?: string;
 };
 
-export const SettingsHeader = ({
-  children,
-  title,
-  subtitle,
-  className,
-  hideDivider,
-}: SettingsHeaderProps) => {
+export const SettingsHeader = ({ children, title, subtitle, className }: SettingsHeaderProps) => {
   return (
     <>
       <div className={cn('flex flex-row items-center justify-between', className)}>
@@ -29,7 +22,7 @@ export const SettingsHeader = ({
         {children}
       </div>
 
-      {!hideDivider && <hr className="my-4" />}
+      <hr className="my-4" />
     </>
   );
 };

apps/web/src/components/document/document-history-sheet.tsx

@@ -7,7 +7,6 @@ import { match } from 'ts-pattern';
 import { UAParser } from 'ua-parser-js';
 
 import { DOCUMENT_AUDIT_LOG_EMAIL_FORMAT } from '@documenso/lib/constants/document-audit-logs';
-import { DOCUMENT_AUTH_TYPES } from '@documenso/lib/constants/document-auth';
 import { DOCUMENT_AUDIT_LOG_TYPE } from '@documenso/lib/types/document-audit-logs';
 import { formatDocumentAuditLogActionString } from '@documenso/lib/utils/document-audit-logs';
 import { trpc } from '@documenso/trpc/react';
@@ -80,11 +79,7 @@ export const DocumentHistorySheet = ({
    * @param text The text to format
    * @returns The formatted text
    */
-  const formatGenericText = (text?: string | null) => {
-    if (!text) {
-      return '';
-    }
-
+  const formatGenericText = (text: string) => {
     return (text.charAt(0).toUpperCase() + text.slice(1).toLowerCase()).replaceAll('_', ' ');
   };
 
@@ -224,24 +219,6 @@ export const DocumentHistorySheet = ({
                       />
                     ),
                   )
-                  .with(
-                    { type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_GLOBAL_AUTH_ACCESS_UPDATED },
-                    { type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_GLOBAL_AUTH_ACTION_UPDATED },
-                    ({ data }) => (
-                      <DocumentHistorySheetChanges
-                        values={[
-                          {
-                            key: 'Old',
-                            value: DOCUMENT_AUTH_TYPES[data.from || '']?.value || 'None',
-                          },
-                          {
-                            key: 'New',
-                            value: DOCUMENT_AUTH_TYPES[data.to || '']?.value || 'None',
-                          },
-                        ]}
-                      />
-                    ),
-                  )
                   .with({ type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_META_UPDATED }, ({ data }) => {
                     if (data.changes.length === 0) {
                       return null;
@@ -304,7 +281,6 @@ export const DocumentHistorySheet = ({
                       ]}
                     />
                   ))
-
                   .exhaustive()}
 
                 {isUserDetailsVisible && (

apps/web/src/components/form/form-error-message.tsx

@@ -0,0 +1,34 @@
+import { AnimatePresence, motion } from 'framer-motion';
+
+import { cn } from '@documenso/ui/lib/utils';
+
+export type FormErrorMessageProps = {
+  className?: string;
+  error: { message?: string } | undefined;
+};
+
+export const FormErrorMessage = ({ error, className }: FormErrorMessageProps) => {
+  return (
+    <AnimatePresence>
+      {error && (
+        <motion.p
+          initial={{
+            opacity: 0,
+            y: -10,
+          }}
+          animate={{
+            opacity: 1,
+            y: 0,
+          }}
+          exit={{
+            opacity: 0,
+            y: 10,
+          }}
+          className={cn('text-xs text-red-500', className)}
+        >
+          {error.message}
+        </motion.p>
+      )}
+    </AnimatePresence>
+  );
+};

apps/web/src/components/forms/2fa/enable-authenticator-app-dialog.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useMemo } from 'react';
+import { useMemo } from 'react';
 
 import { zodResolver } from '@hookform/resolvers/zod';
 import { useForm } from 'react-hook-form';
@@ -149,13 +149,6 @@ export const EnableAuthenticatorAppDialog = ({
     }
   };
 
-  useEffect(() => {
-    // Reset the form when the Dialog closes
-    if (!open) {
-      setupTwoFactorAuthenticationForm.reset();
-    }
-  }, [open, setupTwoFactorAuthenticationForm]);
-
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="w-full max-w-xl md:max-w-xl lg:max-w-xl">

apps/web/src/components/forms/2fa/recovery-codes.tsx

@@ -16,8 +16,7 @@ export const RecoveryCodes = ({ isTwoFactorEnabled }: RecoveryCodesProps) => {
   return (
     <>
       <Button
-        variant="outline"
-        className="bg-background flex-shrink-0"
+        className="flex-shrink-0"
         onClick={() => setIsOpen(true)}
         disabled={!isTwoFactorEnabled}
       >

apps/web/src/components/forms/2fa/view-recovery-codes-dialog.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useMemo } from 'react';
+import { useMemo } from 'react';
 
 import { zodResolver } from '@hookform/resolvers/zod';
 import { useForm } from 'react-hook-form';
@@ -92,13 +92,6 @@ export const ViewRecoveryCodesDialog = ({ open, onOpenChange }: ViewRecoveryCode
     }
   };
 
-  useEffect(() => {
-    // Reset the form when the Dialog closes
-    if (!open) {
-      viewRecoveryCodesForm.reset();
-    }
-  }, [open, viewRecoveryCodesForm]);
-
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="w-full max-w-xl md:max-w-xl lg:max-w-xl">

apps/web/src/components/forms/signin.tsx

@@ -6,18 +6,12 @@ import Link from 'next/link';
 import { useRouter } from 'next/navigation';
 
 import { zodResolver } from '@hookform/resolvers/zod';
-import { browserSupportsWebAuthn, startAuthentication } from '@simplewebauthn/browser';
-import { KeyRoundIcon } from 'lucide-react';
 import { signIn } from 'next-auth/react';
 import { useForm } from 'react-hook-form';
 import { FcGoogle } from 'react-icons/fc';
-import { match } from 'ts-pattern';
 import { z } from 'zod';
 
-import { useFeatureFlags } from '@documenso/lib/client-only/providers/feature-flag';
-import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
 import { ErrorCode, isErrorCode } from '@documenso/lib/next-auth/error-codes';
-import { trpc } from '@documenso/trpc/react';
 import { ZCurrentPasswordSchema } from '@documenso/trpc/server/auth-router/schema';
 import { cn } from '@documenso/ui/lib/utils';
 import { Button } from '@documenso/ui/primitives/button';
@@ -72,24 +66,14 @@ export type SignInFormProps = {
 
 export const SignInForm = ({ className, initialEmail, isGoogleSSOEnabled }: SignInFormProps) => {
   const { toast } = useToast();
-  const { getFlag } = useFeatureFlags();
-
-  const router = useRouter();
-
   const [isTwoFactorAuthenticationDialogOpen, setIsTwoFactorAuthenticationDialogOpen] =
     useState(false);
+  const router = useRouter();
 
   const [twoFactorAuthenticationMethod, setTwoFactorAuthenticationMethod] = useState<
     'totp' | 'backup'
   >('totp');
 
-  const [isPasskeyLoading, setIsPasskeyLoading] = useState(false);
-
-  const isPasskeyEnabled = getFlag('app_passkey');
-
-  const { mutateAsync: createPasskeySigninOptions } =
-    trpc.auth.createPasskeySigninOptions.useMutation();
-
   const form = useForm<TSignInFormSchema>({
     values: {
       email: initialEmail ?? '',
@@ -123,63 +107,6 @@ export const SignInForm = ({ className, initialEmail, isGoogleSSOEnabled }: Sign
     setTwoFactorAuthenticationMethod(method);
   };
 
-  const onSignInWithPasskey = async () => {
-    if (!browserSupportsWebAuthn()) {
-      toast({
-        title: 'Not supported',
-        description: 'Passkeys are not supported on this browser',
-        duration: 10000,
-        variant: 'destructive',
-      });
-
-      return;
-    }
-
-    try {
-      setIsPasskeyLoading(true);
-
-      const options = await createPasskeySigninOptions();
-
-      const credential = await startAuthentication(options);
-
-      const result = await signIn('webauthn', {
-        credential: JSON.stringify(credential),
-        callbackUrl: LOGIN_REDIRECT_PATH,
-        redirect: false,
-      });
-
-      if (!result?.url || result.error) {
-        throw new AppError(result?.error ?? '');
-      }
-
-      window.location.href = result.url;
-    } catch (err) {
-      setIsPasskeyLoading(false);
-
-      if (err.name === 'NotAllowedError') {
-        return;
-      }
-
-      const error = AppError.parseError(err);
-
-      const errorMessage = match(error.code)
-        .with(
-          AppErrorCode.NOT_SETUP,
-          () =>
-            'This passkey is not configured for this application. Please login and add one in the user settings.',
-        )
-        .with(AppErrorCode.EXPIRED_CODE, () => 'This session has expired. Please try again.')
-        .otherwise(() => 'Please try again later or login using your normal details');
-
-      toast({
-        title: 'Something went wrong',
-        description: errorMessage,
-        duration: 10000,
-        variant: 'destructive',
-      });
-    }
-  };
-
   const onFormSubmit = async ({ email, password, totpCode, backupCode }: TSignInFormSchema) => {
     try {
       const credentials: Record<string, string> = {
@@ -262,10 +189,7 @@ export const SignInForm = ({ className, initialEmail, isGoogleSSOEnabled }: Sign
         className={cn('flex w-full flex-col gap-y-4', className)}
         onSubmit={form.handleSubmit(onFormSubmit)}
       >
-        <fieldset
-          className="flex w-full flex-col gap-y-4"
-          disabled={isSubmitting || isPasskeyLoading}
-        >
+        <fieldset className="flex w-full flex-col gap-y-4" disabled={isSubmitting}>
           <FormField
             control={form.control}
             name="email"
@@ -293,8 +217,6 @@ export const SignInForm = ({ className, initialEmail, isGoogleSSOEnabled }: Sign
                   <PasswordInput {...field} />
                 </FormControl>
 
-                <FormMessage />
-
                 <p className="mt-2 text-right">
                   <Link
                     href="/forgot-password"
@@ -303,28 +225,29 @@ export const SignInForm = ({ className, initialEmail, isGoogleSSOEnabled }: Sign
                     Forgot your password?
                   </Link>
                 </p>
+                <FormMessage />
               </FormItem>
             )}
           />
+        </fieldset>
 
-          <Button
-            type="submit"
-            size="lg"
-            loading={isSubmitting}
-            className="dark:bg-documenso dark:hover:opacity-90"
-          >
-            {isSubmitting ? 'Signing in...' : 'Sign In'}
-          </Button>
+        <Button
+          type="submit"
+          size="lg"
+          loading={isSubmitting}
+          className="dark:bg-documenso dark:hover:opacity-90"
+        >
+          {isSubmitting ? 'Signing in...' : 'Sign In'}
+        </Button>
 
-          {(isGoogleSSOEnabled || isPasskeyEnabled) && (
+        {isGoogleSSOEnabled && (
+          <>
             <div className="relative flex items-center justify-center gap-x-4 py-2 text-xs uppercase">
               <div className="bg-border h-px flex-1" />
               <span className="text-muted-foreground bg-transparent">Or continue with</span>
               <div className="bg-border h-px flex-1" />
             </div>
-          )}
 
-          {isGoogleSSOEnabled && (
             <Button
               type="button"
               size="lg"
@@ -336,23 +259,8 @@ export const SignInForm = ({ className, initialEmail, isGoogleSSOEnabled }: Sign
               <FcGoogle className="mr-2 h-5 w-5" />
               Google
             </Button>
-          )}
-
-          {isPasskeyEnabled && (
-            <Button
-              type="button"
-              size="lg"
-              variant="outline"
-              disabled={isSubmitting}
-              loading={isPasskeyLoading}
-              className="bg-background text-muted-foreground border"
-              onClick={onSignInWithPasskey}
-            >
-              {!isPasskeyLoading && <KeyRoundIcon className="-ml-1 mr-1 h-5 w-5" />}
-              Passkey
-            </Button>
-          )}
-        </fieldset>
+          </>
+        )}
       </form>
 
       <Dialog

apps/web/src/components/forms/v2/signup.tsx

@@ -108,6 +108,17 @@ export const SignUpFormV2 = ({
   const name = form.watch('name');
   const url = form.watch('url');
 
+  // To continue we need to make sure name, email, password and signature are valid
+  const canContinue =
+    form.formState.dirtyFields.name &&
+    form.formState.errors.name === undefined &&
+    form.formState.dirtyFields.email &&
+    form.formState.errors.email === undefined &&
+    form.formState.dirtyFields.password &&
+    form.formState.errors.password === undefined &&
+    form.formState.dirtyFields.signature &&
+    form.formState.errors.signature === undefined;
+
   const { mutateAsync: signup } = trpc.auth.signup.useMutation();
 
   const onFormSubmit = async ({ name, email, password, signature, url }: TSignUpFormV2Schema) => {
@@ -158,14 +169,6 @@ export const SignUpFormV2 = ({
     }
   };
 
-  const onNextClick = async () => {
-    const valid = await form.trigger(['name', 'email', 'password', 'signature']);
-
-    if (valid) {
-      setStep('CLAIM_USERNAME');
-    }
-  };
-
   const onSignUpWithGoogleClick = async () => {
     try {
       await signIn('google', { callbackUrl: SIGN_UP_REDIRECT_PATH });
@@ -221,12 +224,12 @@ export const SignUpFormV2 = ({
         </div>
       </div>
 
-      <div className="border-border dark:bg-background relative z-10 flex min-h-[min(850px,80vh)] w-full max-w-lg flex-col rounded-xl border bg-neutral-100 p-6">
+      <div className="border-border dark:bg-background relative z-10 flex min-h-[min(800px,80vh)] w-full max-w-lg flex-col rounded-xl border bg-neutral-100 p-6">
         {step === 'BASIC_DETAILS' && (
           <div className="h-20">
-            <h1 className="text-xl font-semibold md:text-2xl">Create a new account</h1>
+            <h1 className="text-2xl font-semibold">Create a new account</h1>
 
-            <p className="text-muted-foreground mt-2 text-xs md:text-sm">
+            <p className="text-muted-foreground mt-2 text-sm">
               Create your account and start using state-of-the-art document signing. Open and
               beautiful signing is within your grasp.
             </p>
@@ -235,9 +238,9 @@ export const SignUpFormV2 = ({
 
         {step === 'CLAIM_USERNAME' && (
           <div className="h-20">
-            <h1 className="text-xl font-semibold md:text-2xl">Claim your username now</h1>
+            <h1 className="text-2xl font-semibold">Claim your username now</h1>
 
-            <p className="text-muted-foreground mt-2 text-xs md:text-sm">
+            <p className="text-muted-foreground mt-2 text-sm">
               You will get notified & be able to set up your documenso public profile when we launch
               the feature.
             </p>
@@ -254,8 +257,8 @@ export const SignUpFormV2 = ({
             {step === 'BASIC_DETAILS' && (
               <fieldset
                 className={cn(
-                  'flex h-[550px] w-full flex-col gap-y-4',
-                  isGoogleSSOEnabled && 'h-[650px]',
+                  'flex h-[500px] w-full flex-col gap-y-4',
+                  isGoogleSSOEnabled && 'h-[600px]',
                 )}
                 disabled={isSubmitting}
               >
@@ -357,8 +360,8 @@ export const SignUpFormV2 = ({
             {step === 'CLAIM_USERNAME' && (
               <fieldset
                 className={cn(
-                  'flex h-[550px] w-full flex-col gap-y-4',
-                  isGoogleSSOEnabled && 'h-[650px]',
+                  'flex h-[500px] w-full flex-col gap-y-4',
+                  isGoogleSSOEnabled && 'h-[600px]',
                 )}
                 disabled={isSubmitting}
               >
@@ -375,7 +378,7 @@ export const SignUpFormV2 = ({
 
                       <FormMessage />
 
-                      <div className="bg-muted/50 border-border text-muted-foreground mt-2 inline-block max-w-[16rem] truncate rounded-md border px-2 py-1 text-sm lowercase">
+                      <div className="bg-muted/50 border-border text-muted-foreground mt-2 inline-block truncate rounded-md border px-2 py-1 text-sm lowercase">
                         {baseUrl.host}/u/{field.value || '<username>'}
                       </div>
                     </FormItem>
@@ -428,8 +431,9 @@ export const SignUpFormV2 = ({
                   type="button"
                   size="lg"
                   className="flex-1 disabled:cursor-not-allowed"
+                  disabled={!canContinue}
                   loading={form.formState.isSubmitting}
-                  onClick={onNextClick}
+                  onClick={() => setStep('CLAIM_USERNAME')}
                 >
                   Next
                 </Button>

apps/web/src/components/ui/user-profile-skeleton.tsx

@@ -24,8 +24,9 @@ export const UserProfileSkeleton = ({ className, user, rows = 2 }: UserProfileSk
         className,
       )}
     >
-      <div className="border-border bg-background text-muted-foreground inline-block max-w-full truncate rounded-md border px-2.5 py-1.5 text-sm">
-        {baseUrl.host}/u/{user.url}
+      <div className="border-border bg-background text-muted-foreground inline-flex items-center rounded-md border px-2.5 py-1.5 text-sm">
+        <span>{baseUrl.host}/u/</span>
+        <span className="inline-block max-w-[8rem] truncate lowercase">{user.url}</span>
       </div>
 
       <div className="mt-4">

apps/web/src/components/ui/user-profile-timur.tsx

@@ -25,7 +25,7 @@ export const UserProfileTimur = ({ className, rows = 2 }: UserProfileTimurProps)
         className,
       )}
     >
-      <div className="border-border bg-background text-muted-foreground inline-block max-w-full truncate rounded-md border px-2.5 py-1.5 text-sm">
+      <div className="border-border bg-background text-muted-foreground inline-block rounded-md border px-2.5 py-1.5 text-sm">
         {baseUrl.host}/u/timur
       </div>
 

docker/Dockerfile

@@ -32,7 +32,6 @@ RUN apk add --no-cache libc6-compat
 RUN apk add --no-cache jq
 # Required for node_modules/aws-crt
 RUN apk add --no-cache make cmake g++
-
 WORKDIR /app
 
 # Disable husky from installing hooks
@@ -81,7 +80,6 @@ WORKDIR /app
 # Don't run production as root
 RUN addgroup --system --gid 1001 nodejs
 RUN adduser --system --uid 1001 nextjs
-
 USER nextjs
 
 COPY --from=installer /app/apps/web/next.config.js .
@@ -93,18 +91,4 @@ COPY --from=installer --chown=nextjs:nodejs /app/apps/web/.next/standalone ./
 COPY --from=installer --chown=nextjs:nodejs /app/apps/web/.next/static ./apps/web/.next/static
 COPY --from=installer --chown=nextjs:nodejs /app/apps/web/public ./apps/web/public
 
-# Copy the prisma binary, schema and migrations
-COPY --from=installer --chown=nextjs:nodejs /app/packages/prisma/schema.prisma ./packages/prisma/schema.prisma
-COPY --from=installer --chown=nextjs:nodejs /app/packages/prisma/migrations ./packages/prisma/migrations
-COPY --from=installer --chown=nextjs:nodejs /app/node_modules/prisma/ ./node_modules/prisma/
-COPY --from=installer --chown=nextjs:nodejs /app/node_modules/@prisma/ ./node_modules/@prisma/
-
-# Symlink the prisma binary
-RUN mkdir node_modules/.bin
-RUN ln -s /app/node_modules/prisma/build/index.js ./node_modules/.bin/prisma
-
-
-# Get the start script from docker/start.sh
-COPY --chown=nextjs:nodejs ./docker/start.sh ./start.sh
-
-CMD ["sh", "start.sh"]
+CMD node apps/web/server.js

docker/README.md

@@ -1,140 +0,0 @@
-# Docker Setup for Documenso
-
-The following guide will walk you through setting up Documenso using Docker. You can choose between a production setup using Docker Compose or a standalone container.
-
-## Prerequisites
-
-Before you begin, ensure that you have the following installed:
-
-- Docker
-- Docker Compose (if using the Docker Compose setup)
-
-## Option 1: Production Docker Compose Setup
-
-This setup includes a PostgreSQL database and the Documenso application. You will need to provide your own SMTP details via environment variables.
-
-1. Download the Docker Compose file from the Documenso repository: [compose.yml](https://raw.githubusercontent.com/documenso/documenso/release/docker/production/compose.yml)
-2. Navigate to the directory containing the `compose.yml` file.
-3. Create a `.env` file in the same directory and add your SMTP details as well as a few extra environment variables, following the example below:
-
-```
-NEXTAUTH_SECRET="<your-secret>"
-NEXT_PRIVATE_ENCRYPTION_KEY="<your-key>"
-NEXT_PRIVATE_ENCRYPTION_SECONDARY_KEY="<your-secondary-key>"
-NEXT_PUBLIC_WEBAPP_URL="<your-url>"
-NEXT_PRIVATE_SMTP_TRANSPORT="smtp-auth"
-NEXT_PRIVATE_SMTP_HOST="<your-host>"
-NEXT_PRIVATE_SMTP_PORT=<your-port>
-NEXT_PRIVATE_SMTP_USERNAME="<your-username>"
-NEXT_PRIVATE_SMTP_PASSWORD="<your-password>"
-```
-
-4. Update the volume binding for the cert file in the `compose.yml` file to point to your own key file:
-
-Since the `cert.p12` file is required for signing and encrypting documents, you will need to provide your own key file. Update the volume binding in the `compose.yml` file to point to your key file:
-
-```yaml
-volumes:
-  - /path/to/your/keyfile.p12:/opt/documenso/cert.p12
-```
-
-1. Run the following command to start the containers:
-
-```
-docker-compose --env-file ./.env -d up
-```
-
-This will start the PostgreSQL database and the Documenso application containers.
-
-5. Access the Documenso application by visiting `http://localhost:3000` in your web browser.
-
-## Option 2: Standalone Docker Container
-
-If you prefer to host the Documenso application on your container provider of choice, you can use the pre-built Docker image from DockerHub or GitHub's Package Registry. Note that you will need to provide your own database and SMTP host.
-
-1. Pull the Documenso Docker image:
-
-```
-docker pull documenso/documenso
-```
-
-Or, if using GitHub's Package Registry:
-
-```
-docker pull ghcr.io/documenso/documenso
-```
-
-2. Run the Docker container, providing the necessary environment variables for your database and SMTP host:
-
-```
-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>"
-  -e NEXT_PUBLIC_WEBAPP_URL="<your-next-public-webapp-url>"
-  -e NEXT_PRIVATE_DATABASE_URL="<your-next-private-database-url>"
-  -e NEXT_PRIVATE_DIRECT_DATABASE_URL="<your-next-private-database-url>"
-  -e NEXT_PRIVATE_SMTP_TRANSPORT="<your-next-private-smtp-transport>"
-  -e NEXT_PRIVATE_SMTP_FROM_NAME="<your-next-private-smtp-from-name>"
-  -e NEXT_PRIVATE_SMTP_FROM_ADDRESS="<your-next-private-smtp-from-address>"
-  -v /path/to/your/keyfile.p12:/opt/documenso/cert.p12
-  documenso/documenso
-```
-
-Replace the placeholders with your actual database and SMTP details.
-
-1. Access the Documenso application by visiting the URL you provided in the `NEXT_PUBLIC_WEBAPP_URL` environment variable in your web browser.
-
-## Success
-
-You have now successfully set up Documenso using Docker. You can start organizing and managing your documents efficiently. If you encounter any issues or have further questions, please refer to the official Documenso documentation or seek assistance from the community.
-
-## Advanced Configuration
-
-The environment variables listed above are a subset of those that are available for configuring Documenso. For a complete list of environment variables and their descriptions, refer to the table below:
-
-Here's a markdown table documenting all the provided environment variables:
-
-| Variable                                     | Description                                                                                         |
-| -------------------------------------------- | --------------------------------------------------------------------------------------------------- |
-| `PORT`                                       | The port to run the Documenso application on, 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).      |
-| `NEXT_PRIVATE_GOOGLE_CLIENT_ID`              | The Google client ID for Google authentication (optional).                                          |
-| `NEXT_PRIVATE_GOOGLE_CLIENT_SECRET`          | The Google client secret for Google authentication (optional).                                      |
-| `NEXT_PUBLIC_WEBAPP_URL`                     | The URL for the web application.                                                                    |
-| `NEXT_PRIVATE_DATABASE_URL`                  | The URL for the primary database connection (with connection pooling).                              |
-| `NEXT_PRIVATE_DIRECT_DATABASE_URL`           | The URL for the direct database connection (without connection pooling).                            |
-| `NEXT_PRIVATE_SIGNING_TRANSPORT`             | The signing transport to use. Available options: local (default)                                    |
-| `NEXT_PRIVATE_SIGNING_PASSPHRASE`            | The passphrase for the key file.                                                                    |
-| `NEXT_PRIVATE_SIGNING_LOCAL_FILE_CONTENTS`   | The base64-encoded contents of the key file, will be used instead of file path.                     |
-| `NEXT_PRIVATE_SIGNING_LOCAL_FILE_PATH`       | The path to the key file, default `/opt/documenso/cert.p12`.                                        |
-| `NEXT_PUBLIC_UPLOAD_TRANSPORT`               | The transport to use for file uploads (database or s3).                                             |
-| `NEXT_PRIVATE_UPLOAD_ENDPOINT`               | The endpoint for the S3 storage transport (for third-party S3-compatible providers).                |
-| `NEXT_PRIVATE_UPLOAD_REGION`                 | The region for the S3 storage transport (defaults to us-east-1).                                    |
-| `NEXT_PRIVATE_UPLOAD_BUCKET`                 | The bucket to use for the S3 storage transport.                                                     |
-| `NEXT_PRIVATE_UPLOAD_ACCESS_KEY_ID`          | The access key ID for the S3 storage transport.                                                     |
-| `NEXT_PRIVATE_UPLOAD_SECRET_ACCESS_KEY`      | The secret access key for the S3 storage transport.                                                 |
-| `NEXT_PRIVATE_SMTP_TRANSPORT`                | The transport to use for sending emails (smtp-auth, smtp-api, resend, or mailchannels).             |
-| `NEXT_PRIVATE_SMTP_HOST`                     | The host for the SMTP server for SMTP transports.                                                   |
-| `NEXT_PRIVATE_SMTP_PORT`                     | The port for the SMTP server for SMTP transports.                                                   |
-| `NEXT_PRIVATE_SMTP_USERNAME`                 | The username for the SMTP server for the `smtp-auth` transport.                                     |
-| `NEXT_PRIVATE_SMTP_PASSWORD`                 | The password for the SMTP server for the `smtp-auth` transport.                                     |
-| `NEXT_PRIVATE_SMTP_APIKEY_USER`              | The API key user for the SMTP server for the `smtp-api` transport.                                  |
-| `NEXT_PRIVATE_SMTP_APIKEY`                   | The API key for the SMTP server for the `smtp-api` transport.                                       |
-| `NEXT_PRIVATE_SMTP_SECURE`                   | Whether to force the use of TLS for the SMTP server for SMTP transports.                            |
-| `NEXT_PRIVATE_SMTP_FROM_ADDRESS`             | The email address for the "from" address.                                                           |
-| `NEXT_PRIVATE_SMTP_FROM_NAME`                | The sender name for the "from" address.                                                             |
-| `NEXT_PRIVATE_RESEND_API_KEY`                | The API key for Resend.com for the `resend` transport.                                              |
-| `NEXT_PRIVATE_MAILCHANNELS_API_KEY`          | The optional API key for MailChannels (if using a proxy) for the `mailchannels` transport.          |
-| `NEXT_PRIVATE_MAILCHANNELS_ENDPOINT`         | The optional endpoint for the MailChannels API (if using a proxy) for the `mailchannels` transport. |
-| `NEXT_PRIVATE_MAILCHANNELS_DKIM_DOMAIN`      | The domain for DKIM signing with MailChannels for the `mailchannels` transport.                     |
-| `NEXT_PRIVATE_MAILCHANNELS_DKIM_SELECTOR`    | The selector for DKIM signing with MailChannels for the `mailchannels` transport.                   |
-| `NEXT_PRIVATE_MAILCHANNELS_DKIM_PRIVATE_KEY` | The private key for DKIM signing with MailChannels for the `mailchannels` transport.                |
-| `NEXT_PUBLIC_DOCUMENT_SIZE_UPLOAD_LIMIT`     | The maximum document upload limit displayed to the user (in MB).                                    |
-| `NEXT_PUBLIC_POSTHOG_KEY`                    | The optional PostHog key for analytics and feature flags.                                           |
-| `NEXT_PUBLIC_DISABLE_SIGNUP`                 | Whether to disable user signups through the /signup page.                                           |

docker/build.sh

@@ -5,10 +5,15 @@ command -v docker >/dev/null 2>&1 || {
     exit 1
 }
 
+command -v jq >/dev/null 2>&1 || {
+    echo "jq is not installed. Please install jq and try again."
+    exit 1
+}
+
 SCRIPT_DIR="$(readlink -f "$(dirname "$0")")"
 MONOREPO_ROOT="$(readlink -f "$SCRIPT_DIR/../")"
 
-APP_VERSION="$(git name-rev --tags --name-only $(git rev-parse HEAD) | head -n 1 | sed 's/\^0//')"
+APP_VERSION="$(jq -r '.version' "$MONOREPO_ROOT/apps/web/package.json")"
 GIT_SHA="$(git rev-parse HEAD)"
 
 echo "Building docker image for monorepo at $MONOREPO_ROOT"
@@ -17,10 +22,7 @@ echo "Git SHA: $GIT_SHA"
 
 docker build -f "$SCRIPT_DIR/Dockerfile" \
     --progress=plain \
-    -t "documenso/documenso:latest" \
-    -t "documenso/documenso:$GIT_SHA" \
-    -t "documenso/documenso:$APP_VERSION" \
-    -t "ghcr.io/documenso/documenso:latest" \
-    -t "ghcr.io/documenso/documenso:$GIT_SHA" \
-    -t "ghcr.io/documenso/documenso:$APP_VERSION" \
+    -t "documenso:latest" \
+    -t "documenso:$GIT_SHA" \
+    -t "documenso:$APP_VERSION" \
     "$MONOREPO_ROOT"

docker/buildx-and-push.sh

@@ -1,35 +0,0 @@
-#!/usr/bin/env bash
-
-command -v docker >/dev/null 2>&1 || {
-    echo "Docker is not running. Please start Docker and try again."
-    exit 1
-}
-
-SCRIPT_DIR="$(readlink -f "$(dirname "$0")")"
-MONOREPO_ROOT="$(readlink -f "$SCRIPT_DIR/../")"
-
-# Get the platform from environment variable or set to linux/amd64 if not set
-# quote the string to prevent word splitting
-if [ -z "$PLATFORM" ]; then
-    PLATFORM="linux/amd64"
-fi
-
-APP_VERSION="$(git name-rev --tags --name-only $(git rev-parse HEAD) | head -n 1 | sed 's/\^0//')"
-GIT_SHA="$(git rev-parse HEAD)"
-
-echo "Building docker image for monorepo at $MONOREPO_ROOT"
-echo "App version: $APP_VERSION"
-echo "Git SHA: $GIT_SHA"
-
-docker buildx build \
-    -f "$SCRIPT_DIR/Dockerfile" \
-    --platform=$PLATFORM \
-    --progress=plain \
-    -t "documenso/documenso:latest" \
-    -t "documenso/documenso:$GIT_SHA" \
-    -t "documenso/documenso:$APP_VERSION" \
-    -t "ghcr.io/documenso/documenso:latest" \
-    -t "ghcr.io/documenso/documenso:$GIT_SHA" \
-    -t "ghcr.io/documenso/documenso:$APP_VERSION" \
-    --push \
-    "$MONOREPO_ROOT"

docker/buildx.sh

@@ -1,34 +0,0 @@
-#!/usr/bin/env bash
-
-command -v docker >/dev/null 2>&1 || {
-    echo "Docker is not running. Please start Docker and try again."
-    exit 1
-}
-
-SCRIPT_DIR="$(readlink -f "$(dirname "$0")")"
-MONOREPO_ROOT="$(readlink -f "$SCRIPT_DIR/../")"
-
-# Get the platform from environment variable or set to linux/amd64 if not set
-# quote the string to prevent word splitting
-if [ -z "$PLATFORM" ]; then
-    PLATFORM="linux/amd64"
-fi
-
-APP_VERSION="$(git name-rev --tags --name-only $(git rev-parse HEAD) | head -n 1 | sed 's/\^0//')"
-GIT_SHA="$(git rev-parse HEAD)"
-
-echo "Building docker image for monorepo at $MONOREPO_ROOT"
-echo "App version: $APP_VERSION"
-echo "Git SHA: $GIT_SHA"
-
-docker buildx build \
-    -f "$SCRIPT_DIR/Dockerfile" \
-    --platform=$PLATFORM \
-    --progress=plain \
-    -t "documenso/documenso:latest" \
-    -t "documenso/documenso:$GIT_SHA" \
-    -t "documenso/documenso:$APP_VERSION" \
-    -t "ghcr.io/documenso/documenso:latest" \
-    -t "ghcr.io/documenso/documenso:$GIT_SHA" \
-    -t "ghcr.io/documenso/documenso:$APP_VERSION" \
-    "$MONOREPO_ROOT"

docker/compose-entrypoint.sh

@@ -0,0 +1,12 @@
+#!/usr/bin/env bash
+
+SCRIPT_DIR="$(readlink -f "$(dirname "$0")")"
+MONOREPO_ROOT="$(readlink -f "$SCRIPT_DIR/../")"
+
+cd "$MONOREPO_ROOT"
+
+npm ci
+
+npm run prisma:migrate-dev
+
+npm run dev

docker/compose-services.yml

@@ -1,5 +1,4 @@
-name: documenso-development
-
+name: documenso-services
 services:
   database:
     image: postgres:15

docker/compose-test.yml

@@ -0,0 +1,32 @@
+name: documenso_test
+services:
+  database:
+    image: postgres:15
+    environment:
+      - POSTGRES_USER=documenso
+      - POSTGRES_PASSWORD=password
+      - POSTGRES_DB=documenso
+    ports:
+      - 54322:5432
+
+  inbucket:
+    image: inbucket/inbucket
+    # ports:
+    #   - 9000:9000
+    #   - 2500:2500
+    #   - 1100:1100
+
+  documenso:
+    build:
+      context: ../
+      dockerfile: docker/Dockerfile
+    depends_on:
+      - database
+      - inbucket
+    env_file:
+      - ../.env.example
+    environment:
+      - NEXT_PRIVATE_DATABASE_URL=postgres://documenso:password@database:5432/documenso
+      - NEXT_PRIVATE_DIRECT_DATABASE_URL=postgres://documenso:password@database:5432/documenso
+    ports:
+      - 3000:3000

docker/compose-without-app.yml

@@ -0,0 +1,19 @@
+name: documenso
+services:
+  database:
+    image: postgres:15
+    container_name: database
+    environment:
+      - POSTGRES_USER=documenso
+      - POSTGRES_PASSWORD=password
+      - POSTGRES_DB=documenso
+    ports:
+      - 54320:5432
+
+  inbucket:
+    image: inbucket/inbucket
+    container_name: mailserver
+    ports:
+      - 9000:9000
+      - 2500:2500
+      - 1100:1100

docker/compose.yml

@@ -0,0 +1,40 @@
+services:
+  database:
+    image: postgres:15
+    environment:
+      - POSTGRES_USER=documenso
+      - POSTGRES_PASSWORD=password
+      - POSTGRES_DB=documenso
+    ports:
+      - 5432:5432
+
+  inbucket:
+    image: inbucket/inbucket
+    ports:
+      - 9000:9000
+      - 2500:2500
+      - 1100:1100
+
+  documenso:
+    image: node:18
+    working_dir: /app
+    command: ./docker/compose-entrypoint.sh
+    depends_on:
+      - database
+      - inbucket
+    environment:
+      - NEXT_PRIVATE_DATABASE_URL=postgres://documenso:password@database:5432/documenso
+      - NEXT_PRIVATE_DIRECT_DATABASE_URL=postgres://documenso:password@database:5432/documenso
+      - NEXT_PUBLIC_WEBAPP_URL=http://localhost:3000
+      - NEXTAUTH_SECRET=my-super-secure-secret
+      - NEXTAUTH_URL=http://localhost:3000
+      - SENDGRID_API_KEY=
+      - SMTP_MAIL_HOST=inbucket
+      - SMTP_MAIL_PORT=2500
+      - SMTP_MAIL_USER=username
+      - SMTP_MAIL_PASSWORD=password
+      - MAIL_FROM=admin@example.com
+    ports:
+      - 3000:3000
+    volumes:
+      - ../:/app

docker/production/compose.yml

@@ -1,67 +0,0 @@
-name: documenso-production
-
-services:
-  database:
-    image: postgres:15
-    environment:
-      - POSTGRES_USER=${POSTGRES_USER:?err}
-      - POSTGRES_PASSWORD=${POSTGRES_PASSWORD:?err}
-      - POSTGRES_DB=${POSTGRES_DB:?err}
-    healthcheck:
-      test: ['CMD-SHELL', 'pg_isready -U ${POSTGRES_USER}']
-      interval: 10s
-      timeout: 5s
-      retries: 5
-    volumes:
-      - database:/var/lib/postgresql/data
-
-  documenso:
-    image: documenso/documenso:latest
-    depends_on:
-      database:
-        condition: service_healthy
-    environment:
-      - PORT=${PORT:-3000}
-      - NEXTAUTH_URL=${NEXTAUTH_URL:-${NEXT_PUBLIC_WEBAPP_URL}}
-      - NEXTAUTH_SECRET=${NEXTAUTH_SECRET:?err}
-      - NEXT_PRIVATE_ENCRYPTION_KEY=${NEXT_PRIVATE_ENCRYPTION_KEY:?err}
-      - NEXT_PRIVATE_ENCRYPTION_SECONDARY_KEY=${NEXT_PRIVATE_ENCRYPTION_SECONDARY_KEY:?err}
-      - NEXT_PRIVATE_GOOGLE_CLIENT_ID=${NEXT_PRIVATE_GOOGLE_CLIENT_ID}
-      - NEXT_PRIVATE_GOOGLE_CLIENT_SECRET=${NEXT_PRIVATE_GOOGLE_CLIENT_SECRET}
-      - NEXT_PUBLIC_WEBAPP_URL=${NEXT_PUBLIC_WEBAPP_URL:?err}
-      - NEXT_PUBLIC_MARKETING_URL=${NEXT_PUBLIC_MARKETING_URL:-https://documenso.com}
-      - NEXT_PRIVATE_DATABASE_URL=${NEXT_PRIVATE_DATABASE_URL:?err}
-      - NEXT_PRIVATE_DIRECT_DATABASE_URL=${NEXT_PRIVATE_DIRECT_DATABASE_URL:-${NEXT_PRIVATE_DATABASE_URL}}
-      - NEXT_PUBLIC_UPLOAD_TRANSPORT=${NEXT_PUBLIC_UPLOAD_TRANSPORT:-database}
-      - NEXT_PRIVATE_UPLOAD_ENDPOINT=${NEXT_PRIVATE_UPLOAD_ENDPOINT}
-      - NEXT_PRIVATE_UPLOAD_REGION=${NEXT_PRIVATE_UPLOAD_REGION}
-      - NEXT_PRIVATE_UPLOAD_BUCKET=${NEXT_PRIVATE_UPLOAD_BUCKET}
-      - NEXT_PRIVATE_UPLOAD_ACCESS_KEY_ID=${NEXT_PRIVATE_UPLOAD_ACCESS_KEY_ID}
-      - NEXT_PRIVATE_UPLOAD_SECRET_ACCESS_KEY=${NEXT_PRIVATE_UPLOAD_SECRET_ACCESS_KEY}
-      - NEXT_PRIVATE_SMTP_TRANSPORT=${NEXT_PRIVATE_SMTP_TRANSPORT:?err}
-      - NEXT_PRIVATE_SMTP_HOST=${NEXT_PRIVATE_SMTP_HOST}
-      - NEXT_PRIVATE_SMTP_PORT=${NEXT_PRIVATE_SMTP_PORT}
-      - NEXT_PRIVATE_SMTP_USERNAME=${NEXT_PRIVATE_SMTP_USERNAME}
-      - NEXT_PRIVATE_SMTP_PASSWORD=${NEXT_PRIVATE_SMTP_PASSWORD}
-      - NEXT_PRIVATE_SMTP_APIKEY_USER=${NEXT_PRIVATE_SMTP_APIKEY_USER}
-      - NEXT_PRIVATE_SMTP_APIKEY=${NEXT_PRIVATE_SMTP_APIKEY}
-      - NEXT_PRIVATE_SMTP_SECURE=${NEXT_PRIVATE_SMTP_SECURE}
-      - NEXT_PRIVATE_SMTP_FROM_NAME=${NEXT_PRIVATE_SMTP_FROM_NAME:?err}
-      - NEXT_PRIVATE_SMTP_FROM_ADDRESS=${NEXT_PRIVATE_SMTP_FROM_ADDRESS:?err}
-      - NEXT_PRIVATE_RESEND_API_KEY=${NEXT_PRIVATE_RESEND_API_KEY}
-      - NEXT_PRIVATE_MAILCHANNELS_API_KEY=${NEXT_PRIVATE_MAILCHANNELS_API_KEY}
-      - NEXT_PRIVATE_MAILCHANNELS_ENDPOINT=${NEXT_PRIVATE_MAILCHANNELS_ENDPOINT}
-      - NEXT_PRIVATE_MAILCHANNELS_DKIM_DOMAIN=${NEXT_PRIVATE_MAILCHANNELS_DKIM_DOMAIN}
-      - NEXT_PRIVATE_MAILCHANNELS_DKIM_SELECTOR=${NEXT_PRIVATE_MAILCHANNELS_DKIM_SELECTOR}
-      - NEXT_PRIVATE_MAILCHANNELS_DKIM_PRIVATE_KEY=${NEXT_PRIVATE_MAILCHANNELS_DKIM_PRIVATE_KEY}
-      - NEXT_PUBLIC_DOCUMENT_SIZE_UPLOAD_LIMIT=${NEXT_PUBLIC_DOCUMENT_SIZE_UPLOAD_LIMIT}
-      - NEXT_PUBLIC_POSTHOG_KEY=${NEXT_PUBLIC_POSTHOG_KEY}
-      - NEXT_PUBLIC_DISABLE_SIGNUP=${NEXT_PUBLIC_DISABLE_SIGNUP}
-      - NEXT_PRIVATE_SIGNING_LOCAL_FILE_PATH=${NEXT_PRIVATE_SIGNING_LOCAL_FILE_PATH?:-/opt/documenso/cert.p12}
-    ports:
-      - ${PORT:-3000}:${PORT:-3000}
-    volumes:
-      - /opt/documenso/cert.p12:/opt/documenso/cert.p12
-
-volumes:
-  database:

docker/start.sh

@@ -1,7 +0,0 @@
-#!/bin/sh
-
-set -x
-
-npx prisma migrate deploy --schema ./packages/prisma/schema.prisma
-
-node apps/web/server.js

docker/testing/compose.yml

@@ -1,54 +0,0 @@
-name: documenso-test
-
-services:
-  database:
-    image: postgres:15
-    environment:
-      - POSTGRES_USER=documenso
-      - POSTGRES_PASSWORD=password
-      - POSTGRES_DB=documenso
-    healthcheck:
-      test: ['CMD-SHELL', 'pg_isready -U documenso']
-      interval: 1s
-      timeout: 5s
-      retries: 5
-    ports:
-      - 54322:5432
-
-  inbucket:
-    image: inbucket/inbucket
-    ports:
-      - 9000:9000
-      - 2500:2500
-      - 1100:1100
-
-  documenso:
-    build:
-      context: ../../
-      dockerfile: docker/Dockerfile
-    depends_on:
-      database:
-        condition: service_healthy
-      inbucket:
-        condition: service_started
-    env_file:
-      - ../../.env.example
-    environment:
-      - NEXTAUTH_SECRET=secret
-      - NEXT_PRIVATE_ENCRYPTION_KEY=CAFEBABE
-      - NEXT_PRIVATE_ENCRYPTION_SECONDARY_KEY=DEADBEEF
-      - NEXT_PRIVATE_DATABASE_URL=postgres://documenso:password@database:5432/documenso
-      - NEXT_PRIVATE_DIRECT_DATABASE_URL=postgres://documenso:password@database:5432/documenso
-      - NEXT_PUBLIC_UPLOAD_TRANSPORT=database
-      - NEXT_PRIVATE_SMTP_TRANSPORT=smtp-auth
-      - NEXT_PRIVATE_SMTP_HOST=inbucket
-      - NEXT_PRIVATE_SMTP_PORT=2500
-      - NEXT_PRIVATE_SMTP_USERNAME=documenso
-      - NEXT_PRIVATE_SMTP_PASSWORD=password
-      - NEXT_PRIVATE_SMTP_FROM_NAME="No Reply @ Documenso"
-      - NEXT_PRIVATE_SMTP_FROM_ADDRESS=noreply@documenso.com
-      - NEXT_PRIVATE_SIGNING_LOCAL_FILE_PATH=/opt/documenso/cert.p12
-    ports:
-      - 3000:3000
-    volumes:
-      - ../../apps/web/example/cert.p12:/opt/documenso/cert.p12

package.json

@@ -12,15 +12,15 @@
     "commitlint": "commitlint --edit",
     "clean": "turbo run clean && rimraf node_modules",
     "d": "npm run dx && npm run dev",
-    "dx": "npm i && npm run dx:up && npm run prisma:migrate-dev && npm run prisma:seed",
-    "dx:up": "docker compose -f docker/development/compose.yml up -d",
-    "dx:down": "docker compose -f docker/development/compose.yml down",
+    "dx": "npm i && npm run dx:up && npm run prisma:migrate-dev",
+    "dx:up": "docker compose -f docker/compose-services.yml up -d",
+    "dx:down": "docker compose -f docker/compose-services.yml down",
     "ci": "turbo run test:e2e",
     "prisma:generate": "npm run with:env -- npm run prisma:generate -w @documenso/prisma",
     "prisma:migrate-dev": "npm run with:env -- npm run prisma:migrate-dev -w @documenso/prisma",
     "prisma:migrate-deploy": "npm run with:env -- npm run prisma:migrate-deploy -w @documenso/prisma",
     "prisma:seed": "npm run with:env -- npm run prisma:seed -w @documenso/prisma",
-    "prisma:studio": "npm run with:env -- npm run prisma:studio -w @documenso/prisma",
+    "prisma:studio": "npm run with:env -- npx prisma studio --schema packages/prisma/schema.prisma",
     "with:env": "dotenv -e .env -e .env.local --",
     "reset:hard": "npm run clean && npm i && npm run prisma:generate",
     "precommit": "npm install && git add package.json package-lock.json"

packages/api/v1/api-documentation.tsx

@@ -1,30 +1,11 @@
 'use client';
 
-import { useEffect } from 'react';
-
-import { useTheme } from 'next-themes';
 import SwaggerUI from 'swagger-ui-react';
 import 'swagger-ui-react/swagger-ui.css';
 
 import { OpenAPIV1 } from '@documenso/api/v1/openapi';
 
 export const OpenApiDocsPage = () => {
-  const { resolvedTheme } = useTheme();
-
-  useEffect(() => {
-    const body = document.body;
-
-    if (resolvedTheme === 'dark') {
-      body.classList.add('swagger-dark-theme');
-    } else {
-      body.classList.remove('swagger-dark-theme');
-    }
-
-    return () => {
-      body.classList.remove('swagger-dark-theme');
-    };
-  }, [resolvedTheme]);
-
   return <SwaggerUI spec={OpenAPIV1} displayOperationId={true} />;
 };
 

packages/app-tests/e2e/document-auth/access-auth.spec.ts

@@ -1,97 +0,0 @@
-import { expect, test } from '@playwright/test';
-
-import { createDocumentAuthOptions } from '@documenso/lib/utils/document-auth';
-import { prisma } from '@documenso/prisma';
-import { seedPendingDocument } from '@documenso/prisma/seed/documents';
-import { seedUser, unseedUser } from '@documenso/prisma/seed/users';
-
-import { apiSignin } from '../fixtures/authentication';
-
-test.describe.configure({ mode: 'parallel' });
-
-test('[DOCUMENT_AUTH]: should grant access when not required', async ({ page }) => {
-  const user = await seedUser();
-
-  const recipientWithAccount = await seedUser();
-
-  const document = await seedPendingDocument(user, [
-    recipientWithAccount,
-    'recipientwithoutaccount@documenso.com',
-  ]);
-
-  const recipients = await prisma.recipient.findMany({
-    where: {
-      documentId: document.id,
-    },
-  });
-
-  const tokens = recipients.map((recipient) => recipient.token);
-
-  for (const token of tokens) {
-    await page.goto(`/sign/${token}`);
-    await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
-  }
-
-  await unseedUser(user.id);
-});
-
-test('[DOCUMENT_AUTH]: should allow or deny access when required', async ({ page }) => {
-  const user = await seedUser();
-
-  const recipientWithAccount = await seedUser();
-
-  const document = await seedPendingDocument(
-    user,
-    [recipientWithAccount, 'recipientwithoutaccount@documenso.com'],
-    {
-      createDocumentOptions: {
-        authOptions: createDocumentAuthOptions({
-          globalAccessAuth: 'ACCOUNT',
-          globalActionAuth: null,
-        }),
-      },
-    },
-  );
-
-  const recipients = await prisma.recipient.findMany({
-    where: {
-      documentId: document.id,
-    },
-  });
-
-  // Check that both are denied access.
-  for (const recipient of recipients) {
-    const { email, token } = recipient;
-
-    await page.goto(`/sign/${token}`);
-    await expect(page.getByRole('heading', { name: 'Authentication required' })).toBeVisible();
-    await expect(page.getByRole('paragraph')).toContainText(email);
-  }
-
-  await apiSignin({
-    page,
-    email: recipientWithAccount.email,
-    redirectPath: '/',
-  });
-
-  // Check that the one logged in is granted access.
-  for (const recipient of recipients) {
-    const { email, token } = recipient;
-
-    await page.goto(`/sign/${token}`);
-
-    // Recipient should be granted access.
-    if (recipient.email === recipientWithAccount.email) {
-      await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
-    }
-
-    // Recipient should still be denied.
-    if (recipient.email !== recipientWithAccount.email) {
-      await expect(page.getByRole('heading', { name: 'Authentication required' })).toBeVisible();
-      await expect(page.getByRole('paragraph')).toContainText(email);
-    }
-  }
-
-  await unseedUser(user.id);
-  await unseedUser(recipientWithAccount.id);
-});

packages/app-tests/e2e/document-auth/action-auth.spec.ts

@@ -1,405 +0,0 @@
-import { expect, test } from '@playwright/test';
-
-import { ZRecipientAuthOptionsSchema } from '@documenso/lib/types/document-auth';
-import {
-  createDocumentAuthOptions,
-  createRecipientAuthOptions,
-} from '@documenso/lib/utils/document-auth';
-import { FieldType } from '@documenso/prisma/client';
-import {
-  seedPendingDocumentNoFields,
-  seedPendingDocumentWithFullFields,
-} from '@documenso/prisma/seed/documents';
-import { seedTestEmail, seedUser, unseedUser } from '@documenso/prisma/seed/users';
-
-import { apiSignin, apiSignout } from '../fixtures/authentication';
-
-test.describe.configure({ mode: 'parallel' });
-
-test('[DOCUMENT_AUTH]: should allow signing when no auth setup', async ({ page }) => {
-  const user = await seedUser();
-
-  const recipientWithAccount = await seedUser();
-
-  const { recipients } = await seedPendingDocumentWithFullFields({
-    owner: user,
-    recipients: [recipientWithAccount, seedTestEmail()],
-  });
-
-  // Check that both are granted access.
-  for (const recipient of recipients) {
-    const { token, Field } = recipient;
-
-    const signUrl = `/sign/${token}`;
-
-    await page.goto(signUrl);
-    await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
-
-    // Add signature.
-    const canvas = page.locator('canvas');
-    const box = await canvas.boundingBox();
-    if (box) {
-      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
-      await page.mouse.down();
-      await page.mouse.move(box.x + box.width / 4, box.y + box.height / 4);
-      await page.mouse.up();
-    }
-
-    for (const field of Field) {
-      await page.locator(`#field-${field.id}`).getByRole('button').click();
-
-      if (field.type === FieldType.TEXT) {
-        await page.getByLabel('Custom Text').fill('TEXT');
-        await page.getByRole('button', { name: 'Save Text' }).click();
-      }
-
-      await expect(page.locator(`#field-${field.id}`)).toHaveAttribute('data-inserted', 'true');
-    }
-
-    await page.getByRole('button', { name: 'Complete' }).click();
-    await page.getByRole('button', { name: 'Sign' }).click();
-    await page.waitForURL(`${signUrl}/complete`);
-  }
-
-  await unseedUser(user.id);
-  await unseedUser(recipientWithAccount.id);
-});
-
-test('[DOCUMENT_AUTH]: should allow signing with valid global auth', async ({ page }) => {
-  const user = await seedUser();
-
-  const recipientWithAccount = await seedUser();
-
-  const { recipients } = await seedPendingDocumentWithFullFields({
-    owner: user,
-    recipients: [recipientWithAccount],
-    updateDocumentOptions: {
-      authOptions: createDocumentAuthOptions({
-        globalAccessAuth: null,
-        globalActionAuth: 'ACCOUNT',
-      }),
-    },
-  });
-
-  const recipient = recipients[0];
-
-  const { token, Field } = recipient;
-
-  const signUrl = `/sign/${token}`;
-
-  await apiSignin({
-    page,
-    email: recipientWithAccount.email,
-    redirectPath: signUrl,
-  });
-
-  await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
-
-  // Add signature.
-  const canvas = page.locator('canvas');
-  const box = await canvas.boundingBox();
-  if (box) {
-    await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
-    await page.mouse.down();
-    await page.mouse.move(box.x + box.width / 4, box.y + box.height / 4);
-    await page.mouse.up();
-  }
-
-  for (const field of Field) {
-    await page.locator(`#field-${field.id}`).getByRole('button').click();
-
-    if (field.type === FieldType.TEXT) {
-      await page.getByLabel('Custom Text').fill('TEXT');
-      await page.getByRole('button', { name: 'Save Text' }).click();
-    }
-
-    await expect(page.locator(`#field-${field.id}`)).toHaveAttribute('data-inserted', 'true');
-  }
-
-  await page.getByRole('button', { name: 'Complete' }).click();
-  await page.getByRole('button', { name: 'Sign' }).click();
-  await page.waitForURL(`${signUrl}/complete`);
-
-  await unseedUser(user.id);
-  await unseedUser(recipientWithAccount.id);
-});
-
-test('[DOCUMENT_AUTH]: should deny signing document when required for global auth', async ({
-  page,
-}) => {
-  const user = await seedUser();
-
-  const recipientWithAccount = await seedUser();
-
-  const { recipients } = await seedPendingDocumentNoFields({
-    owner: user,
-    recipients: [recipientWithAccount],
-    updateDocumentOptions: {
-      authOptions: createDocumentAuthOptions({
-        globalAccessAuth: null,
-        globalActionAuth: 'ACCOUNT',
-      }),
-    },
-  });
-
-  const recipient = recipients[0];
-
-  const { token } = recipient;
-
-  await page.goto(`/sign/${token}`);
-  await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
-
-  await page.getByRole('button', { name: 'Complete' }).click();
-  await expect(page.getByRole('paragraph')).toContainText(
-    'Reauthentication is required to sign this document',
-  );
-
-  await unseedUser(user.id);
-  await unseedUser(recipientWithAccount.id);
-});
-
-test('[DOCUMENT_AUTH]: should deny signing fields when required for global auth', async ({
-  page,
-}) => {
-  const user = await seedUser();
-
-  const recipientWithAccount = await seedUser();
-
-  const { recipients } = await seedPendingDocumentWithFullFields({
-    owner: user,
-    recipients: [recipientWithAccount, seedTestEmail()],
-    updateDocumentOptions: {
-      authOptions: createDocumentAuthOptions({
-        globalAccessAuth: null,
-        globalActionAuth: 'ACCOUNT',
-      }),
-    },
-  });
-
-  // Check that both are denied access.
-  for (const recipient of recipients) {
-    const { token, Field } = recipient;
-
-    await page.goto(`/sign/${token}`);
-    await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
-
-    for (const field of Field) {
-      await page.locator(`#field-${field.id}`).getByRole('button').click();
-      await expect(page.getByRole('paragraph')).toContainText(
-        'Reauthentication is required to sign this field',
-      );
-      await page.getByRole('button', { name: 'Cancel' }).click();
-    }
-  }
-
-  await unseedUser(user.id);
-  await unseedUser(recipientWithAccount.id);
-});
-
-test('[DOCUMENT_AUTH]: should allow field signing when required for recipient auth', async ({
-  page,
-}) => {
-  const user = await seedUser();
-
-  const recipientWithInheritAuth = await seedUser();
-  const recipientWithExplicitNoneAuth = await seedUser();
-  const recipientWithExplicitAccountAuth = await seedUser();
-
-  const { recipients } = await seedPendingDocumentWithFullFields({
-    owner: user,
-    recipients: [
-      recipientWithInheritAuth,
-      recipientWithExplicitNoneAuth,
-      recipientWithExplicitAccountAuth,
-    ],
-    recipientsCreateOptions: [
-      {
-        authOptions: createRecipientAuthOptions({
-          accessAuth: null,
-          actionAuth: null,
-        }),
-      },
-      {
-        authOptions: createRecipientAuthOptions({
-          accessAuth: null,
-          actionAuth: 'EXPLICIT_NONE',
-        }),
-      },
-      {
-        authOptions: createRecipientAuthOptions({
-          accessAuth: null,
-          actionAuth: 'ACCOUNT',
-        }),
-      },
-    ],
-    fields: [FieldType.DATE],
-  });
-
-  for (const recipient of recipients) {
-    const { token, Field } = recipient;
-    const { actionAuth } = ZRecipientAuthOptionsSchema.parse(recipient.authOptions);
-
-    // This document has no global action auth, so only account should require auth.
-    const isAuthRequired = actionAuth === 'ACCOUNT';
-
-    const signUrl = `/sign/${token}`;
-
-    await page.goto(signUrl);
-    await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
-
-    if (isAuthRequired) {
-      for (const field of Field) {
-        await page.locator(`#field-${field.id}`).getByRole('button').click();
-        await expect(page.getByRole('paragraph')).toContainText(
-          'Reauthentication is required to sign this field',
-        );
-        await page.getByRole('button', { name: 'Cancel' }).click();
-      }
-
-      // Sign in and it should work.
-      await apiSignin({
-        page,
-        email: recipient.email,
-        redirectPath: signUrl,
-      });
-    }
-
-    // Add signature.
-    const canvas = page.locator('canvas');
-    const box = await canvas.boundingBox();
-    if (box) {
-      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
-      await page.mouse.down();
-      await page.mouse.move(box.x + box.width / 4, box.y + box.height / 4);
-      await page.mouse.up();
-    }
-
-    for (const field of Field) {
-      await page.locator(`#field-${field.id}`).getByRole('button').click();
-
-      if (field.type === FieldType.TEXT) {
-        await page.getByLabel('Custom Text').fill('TEXT');
-        await page.getByRole('button', { name: 'Save Text' }).click();
-      }
-
-      await expect(page.locator(`#field-${field.id}`)).toHaveAttribute('data-inserted', 'true', {
-        timeout: 5000,
-      });
-    }
-
-    await page.getByRole('button', { name: 'Complete' }).click();
-    await page.getByRole('button', { name: 'Sign' }).click();
-    await page.waitForURL(`${signUrl}/complete`);
-
-    if (isAuthRequired) {
-      await apiSignout({ page });
-    }
-  }
-});
-
-test('[DOCUMENT_AUTH]: should allow field signing when required for recipient and global auth', async ({
-  page,
-}) => {
-  const user = await seedUser();
-
-  const recipientWithInheritAuth = await seedUser();
-  const recipientWithExplicitNoneAuth = await seedUser();
-  const recipientWithExplicitAccountAuth = await seedUser();
-
-  const { recipients } = await seedPendingDocumentWithFullFields({
-    owner: user,
-    recipients: [
-      recipientWithInheritAuth,
-      recipientWithExplicitNoneAuth,
-      recipientWithExplicitAccountAuth,
-    ],
-    recipientsCreateOptions: [
-      {
-        authOptions: createRecipientAuthOptions({
-          accessAuth: null,
-          actionAuth: null,
-        }),
-      },
-      {
-        authOptions: createRecipientAuthOptions({
-          accessAuth: null,
-          actionAuth: 'EXPLICIT_NONE',
-        }),
-      },
-      {
-        authOptions: createRecipientAuthOptions({
-          accessAuth: null,
-          actionAuth: 'ACCOUNT',
-        }),
-      },
-    ],
-    fields: [FieldType.DATE],
-    updateDocumentOptions: {
-      authOptions: createDocumentAuthOptions({
-        globalAccessAuth: null,
-        globalActionAuth: 'ACCOUNT',
-      }),
-    },
-  });
-
-  for (const recipient of recipients) {
-    const { token, Field } = recipient;
-    const { actionAuth } = ZRecipientAuthOptionsSchema.parse(recipient.authOptions);
-
-    // This document HAS global action auth, so account and inherit should require auth.
-    const isAuthRequired = actionAuth === 'ACCOUNT' || actionAuth === null;
-
-    const signUrl = `/sign/${token}`;
-
-    await page.goto(signUrl);
-    await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
-
-    if (isAuthRequired) {
-      for (const field of Field) {
-        await page.locator(`#field-${field.id}`).getByRole('button').click();
-        await expect(page.getByRole('paragraph')).toContainText(
-          'Reauthentication is required to sign this field',
-        );
-        await page.getByRole('button', { name: 'Cancel' }).click();
-      }
-
-      // Sign in and it should work.
-      await apiSignin({
-        page,
-        email: recipient.email,
-        redirectPath: signUrl,
-      });
-    }
-
-    // Add signature.
-    const canvas = page.locator('canvas');
-    const box = await canvas.boundingBox();
-    if (box) {
-      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
-      await page.mouse.down();
-      await page.mouse.move(box.x + box.width / 4, box.y + box.height / 4);
-      await page.mouse.up();
-    }
-
-    for (const field of Field) {
-      await page.locator(`#field-${field.id}`).getByRole('button').click();
-
-      if (field.type === FieldType.TEXT) {
-        await page.getByLabel('Custom Text').fill('TEXT');
-        await page.getByRole('button', { name: 'Save Text' }).click();
-      }
-
-      await expect(page.locator(`#field-${field.id}`)).toHaveAttribute('data-inserted', 'true', {
-        timeout: 5000,
-      });
-    }
-
-    await page.getByRole('button', { name: 'Complete' }).click();
-    await page.getByRole('button', { name: 'Sign' }).click();
-    await page.waitForURL(`${signUrl}/complete`);
-
-    if (isAuthRequired) {
-      await apiSignout({ page });
-    }
-  }
-});

packages/app-tests/e2e/document-flow/settings-step.spec.ts

@@ -1,74 +0,0 @@
-import { expect, test } from '@playwright/test';
-
-import {
-  seedBlankDocument,
-  seedDraftDocument,
-  seedPendingDocument,
-} from '@documenso/prisma/seed/documents';
-import { seedUser, unseedUser } from '@documenso/prisma/seed/users';
-
-import { apiSignin } from '../fixtures/authentication';
-
-test.describe.configure({ mode: 'parallel' });
-
-test('[DOCUMENT_FLOW]: add settings', async ({ page }) => {
-  const user = await seedUser();
-  const document = await seedBlankDocument(user);
-
-  await apiSignin({
-    page,
-    email: user.email,
-    redirectPath: `/documents/${document.id}/edit`,
-  });
-
-  // Set title.
-  await page.getByLabel('Title').fill('New Title');
-
-  // Set access auth.
-  await page.getByTestId('documentAccessSelectValue').click();
-  await page.getByLabel('Require account').getByText('Require account').click();
-  await expect(page.getByTestId('documentAccessSelectValue')).toContainText('Require account');
-
-  // Set action auth.
-  await page.getByTestId('documentActionSelectValue').click();
-  await page.getByLabel('Require account').getByText('Require account').click();
-  await expect(page.getByTestId('documentActionSelectValue')).toContainText('Require account');
-
-  // Save the settings by going to the next step.
-  await page.getByRole('button', { name: 'Continue' }).click();
-  await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
-
-  // Return to the settings step to check that the results are saved correctly.
-  await page.getByRole('button', { name: 'Go Back' }).click();
-  await expect(page.getByRole('heading', { name: 'General' })).toBeVisible();
-
-  // Todo: Verify that the values are correct once we fix the issue where going back
-  // does not show the updated values.
-  // await expect(page.getByLabel('Title')).toContainText('New Title');
-  // await expect(page.getByTestId('documentAccessSelectValue')).toContainText('Require account');
-  // await expect(page.getByTestId('documentActionSelectValue')).toContainText('Require account');
-
-  await unseedUser(user.id);
-});
-
-test('[DOCUMENT_FLOW]: title should be disabled depending on document status', async ({ page }) => {
-  const user = await seedUser();
-
-  const pendingDocument = await seedPendingDocument(user, []);
-  const draftDocument = await seedDraftDocument(user, []);
-
-  await apiSignin({
-    page,
-    email: user.email,
-    redirectPath: `/documents/${pendingDocument.id}/edit`,
-  });
-
-  // Should be disabled for pending documents.
-  await expect(page.getByLabel('Title')).toBeDisabled();
-
-  // Should be enabled for draft documents.
-  await page.goto(`/documents/${draftDocument.id}/edit`);
-  await expect(page.getByLabel('Title')).toBeEnabled();
-
-  await unseedUser(user.id);
-});

packages/app-tests/e2e/document-flow/signers-step.spec.ts

@@ -1,63 +0,0 @@
-import { expect, test } from '@playwright/test';
-
-import { seedBlankDocument } from '@documenso/prisma/seed/documents';
-import { seedUser, unseedUser } from '@documenso/prisma/seed/users';
-
-import { apiSignin } from '../fixtures/authentication';
-
-test.describe.configure({ mode: 'parallel' });
-
-// Note: Not complete yet due to issue with back button.
-test('[DOCUMENT_FLOW]: add signers', async ({ page }) => {
-  const user = await seedUser();
-  const document = await seedBlankDocument(user);
-
-  await apiSignin({
-    page,
-    email: user.email,
-    redirectPath: `/documents/${document.id}/edit`,
-  });
-
-  // Save the settings by going to the next step.
-  await page.getByRole('button', { name: 'Continue' }).click();
-  await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
-
-  // Add 2 signers.
-  await page.getByPlaceholder('Email').fill('recipient1@documenso.com');
-  await page.getByPlaceholder('Name').fill('Recipient 1');
-  await page.getByRole('button', { name: 'Add Signer' }).click();
-  await page.getByRole('textbox', { name: 'Email', exact: true }).fill('recipient2@documenso.com');
-  await page.getByRole('textbox', { name: 'Name', exact: true }).fill('Recipient 2');
-
-  // Display advanced settings.
-  await page.getByLabel('Show advanced settings').click();
-
-  // Navigate to the next step and back.
-  await page.getByRole('button', { name: 'Continue' }).click();
-  await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
-  await page.getByRole('button', { name: 'Go Back' }).click();
-  await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
-
-  // Todo: Fix stepper component back issue before finishing test.
-
-  // // Expect that the advanced settings is unchecked, since no advanced settings were applied.
-  // await expect(page.getByLabel('Show advanced settings')).toBeChecked({ checked: false });
-
-  // // Add advanced settings for a single recipient.
-  // await page.getByLabel('Show advanced settings').click();
-  // await page.getByRole('combobox').first().click();
-  // await page.getByLabel('Require account').click();
-
-  // // Navigate to the next step and back.
-  // await page.getByRole('button', { name: 'Continue' }).click();
-  // await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
-  // await page.getByRole('button', { name: 'Go Back' }).click();
-  // await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
-
-  // Expect that the advanced settings is visible, and the checkbox is hidden. Since advanced
-  // settings were applied.
-
-  // Todo: Fix stepper component back issue before finishing test.
-
-  await unseedUser(user.id);
-});

packages/app-tests/e2e/fixtures/authentication.ts

@@ -1,8 +1,8 @@
-import { type Page } from '@playwright/test';
+import type { Page } from '@playwright/test';
 
 import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
 
-type LoginOptions = {
+type ManualLoginOptions = {
   page: Page;
   email?: string;
   password?: string;
@@ -18,7 +18,7 @@ export const manualLogin = async ({
   email = 'example@documenso.com',
   password = 'password',
   redirectPath,
-}: LoginOptions) => {
+}: ManualLoginOptions) => {
   await page.goto(`${WEBAPP_BASE_URL}/signin`);
 
   await page.getByLabel('Email').click();
@@ -33,63 +33,9 @@ export const manualLogin = async ({
   }
 };
 
-export const manualSignout = async ({ page }: LoginOptions) => {
+export const manualSignout = async ({ page }: ManualLoginOptions) => {
   await page.waitForTimeout(1000);
   await page.getByTestId('menu-switcher').click();
   await page.getByRole('menuitem', { name: 'Sign Out' }).click();
   await page.waitForURL(`${WEBAPP_BASE_URL}/signin`);
 };
-
-export const apiSignin = async ({
-  page,
-  email = 'example@documenso.com',
-  password = 'password',
-  redirectPath = '/',
-}: LoginOptions) => {
-  const { request } = page.context();
-
-  const csrfToken = await getCsrfToken(page);
-
-  await request.post(`${WEBAPP_BASE_URL}/api/auth/callback/credentials`, {
-    form: {
-      email,
-      password,
-      json: true,
-      csrfToken,
-    },
-  });
-
-  if (redirectPath) {
-    await page.goto(`${WEBAPP_BASE_URL}${redirectPath}`);
-  }
-};
-
-export const apiSignout = async ({ page }: { page: Page }) => {
-  const { request } = page.context();
-
-  const csrfToken = await getCsrfToken(page);
-
-  await request.post(`${WEBAPP_BASE_URL}/api/auth/signout`, {
-    form: {
-      csrfToken,
-      json: true,
-    },
-  });
-
-  await page.goto(`${WEBAPP_BASE_URL}/signin`);
-};
-
-const getCsrfToken = async (page: Page) => {
-  const { request } = page.context();
-
-  const response = await request.fetch(`${WEBAPP_BASE_URL}/api/auth/csrf`, {
-    method: 'get',
-  });
-
-  const { csrfToken } = await response.json();
-  if (!csrfToken) {
-    throw new Error('Invalid session');
-  }
-
-  return csrfToken;
-};

packages/app-tests/e2e/pr-718-add-stepper-component.spec.ts

@@ -28,8 +28,8 @@ test(`[PR-718]: should be able to create a document`, async ({ page }) => {
   // Wait to be redirected to the edit page
   await page.waitForURL(/\/documents\/\d+/);
 
-  // Set general settings
-  await expect(page.getByRole('heading', { name: 'General' })).toBeVisible();
+  // Set title
+  await expect(page.getByRole('heading', { name: 'Add Title' })).toBeVisible();
 
   await page.getByLabel('Title').fill(documentTitle);
 

packages/app-tests/e2e/teams/manage-team.spec.ts

@@ -4,14 +4,14 @@ import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
 import { seedTeam, unseedTeam } from '@documenso/prisma/seed/teams';
 import { seedUser } from '@documenso/prisma/seed/users';
 
-import { apiSignin } from '../fixtures/authentication';
+import { manualLogin } from '../fixtures/authentication';
 
 test.describe.configure({ mode: 'parallel' });
 
 test('[TEAMS]: create team', async ({ page }) => {
   const user = await seedUser();
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: user.email,
     redirectPath: '/settings/teams',
@@ -38,7 +38,7 @@ test('[TEAMS]: create team', async ({ page }) => {
 test('[TEAMS]: delete team', async ({ page }) => {
   const team = await seedTeam();
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: team.owner.email,
     redirectPath: `/t/${team.url}/settings`,
@@ -56,7 +56,7 @@ test('[TEAMS]: delete team', async ({ page }) => {
 test('[TEAMS]: update team', async ({ page }) => {
   const team = await seedTeam();
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: team.owner.email,
   });

packages/app-tests/e2e/teams/team-documents.spec.ts

@@ -6,7 +6,7 @@ import { seedDocuments, seedTeamDocuments } from '@documenso/prisma/seed/documen
 import { seedTeamEmail, unseedTeam, unseedTeamEmail } from '@documenso/prisma/seed/teams';
 import { seedUser } from '@documenso/prisma/seed/users';
 
-import { apiSignin, apiSignout } from '../fixtures/authentication';
+import { manualLogin, manualSignout } from '../fixtures/authentication';
 
 test.describe.configure({ mode: 'parallel' });
 
@@ -30,7 +30,7 @@ test('[TEAMS]: check team documents count', async ({ page }) => {
 
   // Run the test twice, once with the team owner and once with a team member to ensure the counts are the same.
   for (const user of [team.owner, teamMember2]) {
-    await apiSignin({
+    await manualLogin({
       page,
       email: user.email,
       redirectPath: `/t/${team.url}/documents`,
@@ -55,7 +55,7 @@ test('[TEAMS]: check team documents count', async ({ page }) => {
     await checkDocumentTabCount(page, 'Draft', 1);
     await checkDocumentTabCount(page, 'All', 3);
 
-    await apiSignout({ page });
+    await manualSignout({ page });
   }
 
   await unseedTeam(team.url);
@@ -126,7 +126,7 @@ test('[TEAMS]: check team documents count with internal team email', async ({ pa
 
   // Run the test twice, one with the team owner and once with the team member email to ensure the counts are the same.
   for (const user of [team.owner, teamEmailMember]) {
-    await apiSignin({
+    await manualLogin({
       page,
       email: user.email,
       redirectPath: `/t/${team.url}/documents`,
@@ -151,7 +151,7 @@ test('[TEAMS]: check team documents count with internal team email', async ({ pa
     await checkDocumentTabCount(page, 'Draft', 1);
     await checkDocumentTabCount(page, 'All', 3);
 
-    await apiSignout({ page });
+    await manualSignout({ page });
   }
 
   await unseedTeamEmail({ teamId: team.id });
@@ -216,7 +216,7 @@ test('[TEAMS]: check team documents count with external team email', async ({ pa
     },
   ]);
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: teamMember2.email,
     redirectPath: `/t/${team.url}/documents`,
@@ -248,7 +248,7 @@ test('[TEAMS]: check team documents count with external team email', async ({ pa
 test('[TEAMS]: delete pending team document', async ({ page }) => {
   const { team, teamMember2: currentUser } = await seedTeamDocuments();
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: currentUser.email,
     redirectPath: `/t/${team.url}/documents?status=PENDING`,
@@ -266,7 +266,7 @@ test('[TEAMS]: delete pending team document', async ({ page }) => {
 test('[TEAMS]: resend pending team document', async ({ page }) => {
   const { team, teamMember2: currentUser } = await seedTeamDocuments();
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: currentUser.email,
     redirectPath: `/t/${team.url}/documents?status=PENDING`,

packages/app-tests/e2e/teams/team-email.spec.ts

@@ -4,14 +4,14 @@ import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
 import { seedTeam, seedTeamEmailVerification, unseedTeam } from '@documenso/prisma/seed/teams';
 import { seedUser, unseedUser } from '@documenso/prisma/seed/users';
 
-import { apiSignin } from '../fixtures/authentication';
+import { manualLogin } from '../fixtures/authentication';
 
 test.describe.configure({ mode: 'parallel' });
 
 test('[TEAMS]: send team email request', async ({ page }) => {
   const team = await seedTeam();
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: team.owner.email,
     password: 'password',
@@ -57,7 +57,7 @@ test('[TEAMS]: delete team email', async ({ page }) => {
     createTeamEmail: true,
   });
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: team.owner.email,
     redirectPath: `/t/${team.url}/settings`,
@@ -86,7 +86,7 @@ test('[TEAMS]: team email owner removes access', async ({ page }) => {
     email: team.teamEmail.email,
   });
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: teamEmailOwner.email,
     redirectPath: `/settings/teams`,

packages/app-tests/e2e/teams/team-members.spec.ts

@@ -4,7 +4,7 @@ import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
 import { seedTeam, seedTeamInvite, unseedTeam } from '@documenso/prisma/seed/teams';
 import { seedUser } from '@documenso/prisma/seed/users';
 
-import { apiSignin } from '../fixtures/authentication';
+import { manualLogin } from '../fixtures/authentication';
 
 test.describe.configure({ mode: 'parallel' });
 
@@ -13,7 +13,7 @@ test('[TEAMS]: update team member role', async ({ page }) => {
     createTeamMembers: 1,
   });
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: team.owner.email,
     password: 'password',
@@ -75,7 +75,7 @@ test('[TEAMS]: member can leave team', async ({ page }) => {
 
   const teamMember = team.members[1];
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: teamMember.user.email,
     password: 'password',
@@ -97,7 +97,7 @@ test('[TEAMS]: owner cannot leave team', async ({ page }) => {
     createTeamMembers: 1,
   });
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: team.owner.email,
     password: 'password',

packages/app-tests/e2e/teams/transfer-team.spec.ts

@@ -3,7 +3,7 @@ import { expect, test } from '@playwright/test';
 import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
 import { seedTeam, seedTeamTransfer, unseedTeam } from '@documenso/prisma/seed/teams';
 
-import { apiSignin } from '../fixtures/authentication';
+import { manualLogin } from '../fixtures/authentication';
 
 test.describe.configure({ mode: 'parallel' });
 
@@ -14,7 +14,7 @@ test('[TEAMS]: initiate and cancel team transfer', async ({ page }) => {
 
   const teamMember = team.members[1];
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: team.owner.email,
     password: 'password',

packages/app-tests/e2e/templates/manage-templates.spec.ts

@@ -4,7 +4,7 @@ import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
 import { seedTeam, unseedTeam } from '@documenso/prisma/seed/teams';
 import { seedTemplate } from '@documenso/prisma/seed/templates';
 
-import { apiSignin } from '../fixtures/authentication';
+import { manualLogin } from '../fixtures/authentication';
 
 test.describe.configure({ mode: 'parallel' });
 
@@ -36,7 +36,7 @@ test('[TEMPLATES]: view templates', async ({ page }) => {
     teamId: team.id,
   });
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: owner.email,
     redirectPath: '/templates',
@@ -81,7 +81,7 @@ test('[TEMPLATES]: delete template', async ({ page }) => {
     teamId: team.id,
   });
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: owner.email,
     redirectPath: '/templates',
@@ -135,7 +135,7 @@ test('[TEMPLATES]: duplicate template', async ({ page }) => {
     teamId: team.id,
   });
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: owner.email,
     redirectPath: '/templates',
@@ -181,7 +181,7 @@ test('[TEMPLATES]: use template', async ({ page }) => {
     teamId: team.id,
   });
 
-  await apiSignin({
+  await manualLogin({
     page,
     email: owner.email,
     redirectPath: '/templates',

packages/app-tests/e2e/test-delete-user.spec.ts

@@ -1,27 +0,0 @@
-import { expect, test } from '@playwright/test';
-
-import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
-import { getUserByEmail } from '@documenso/lib/server-only/user/get-user-by-email';
-import { seedUser } from '@documenso/prisma/seed/users';
-
-import { manualLogin } from './fixtures/authentication';
-
-test('delete user', async ({ page }) => {
-  const user = await seedUser();
-
-  await manualLogin({
-    page,
-    email: user.email,
-    redirectPath: '/settings',
-  });
-
-  await page.getByRole('button', { name: 'Delete Account' }).click();
-  await page.getByLabel('Confirm Email').fill(user.email);
-  await expect(page.getByRole('button', { name: 'Confirm Deletion' })).not.toBeDisabled();
-  await page.getByRole('button', { name: 'Confirm Deletion' }).click();
-
-  await page.waitForURL(`${WEBAPP_BASE_URL}/signin`);
-
-  // Verify that the user no longer exists in the database
-  await expect(getUserByEmail({ email: user.email })).rejects.toThrow();
-});

packages/ee/server-only/stripe/transfer-team-subscription.ts

@@ -33,7 +33,7 @@ type TransferStripeSubscriptionOptions = {
  * Will create a new subscription for the new owner and cancel the old one.
  *
  * Returns the subscription that should be associated with the team, null if
- * no subscription is needed (for early adopter plan).
+ * no subscription is needed (for community plan).
  */
 export const transferTeamSubscription = async ({
   user,