Merge branch 'main' into feat/add-website-cta

2025-11-10 04:22:32 +10:00 · 2024-03-11 13:06:46 +02:00
parent e8b209eb82 c2cf25b138
commit 9ac346443d
19 changed files with 242 additions and 159 deletions
--- a/.env.example
+++ b/.env.example
@ -27,6 +27,16 @@ 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"
--- a/apps/marketing/package.json
+++ b/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"
  },
--- a/apps/web/package.json
+++ b/apps/web/package.json
@ -43,7 +43,7 @@
    "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",
    "ua-parser-js": "^1.0.37",
    "uqr": "^0.1.2",
--- a/apps/web/src/app/(dashboard)/documents/data-table.tsx
+++ b/apps/web/src/app/(dashboard)/documents/data-table.tsx
@ -76,14 +76,13 @@ export const DocumentsDataTable = ({
          {
            header: 'Recipient',
            accessorKey: 'recipient',
-            cell: ({ row }) => {
-              return <StackAvatarsWithTooltip recipients={row.original.Recipient} />;
-            },
+            cell: ({ row }) => <StackAvatarsWithTooltip recipients={row.original.Recipient} />,
          },
          {
            header: 'Status',
            accessorKey: 'status',
            cell: ({ row }) => <DocumentStatus status={row.getValue('status')} />,
+            size: 140,
          },
          {
            header: 'Actions',
--- a/apps/web/src/app/(dashboard)/templates/data-table-templates.tsx
+++ b/apps/web/src/app/(dashboard)/templates/data-table-templates.tsx
@ -25,7 +25,11 @@ type TemplateWithRecipient = Template & {
 };

 type TemplatesDataTableProps = {
-  templates: TemplateWithRecipient[];
+  templates: Array<
+    TemplateWithRecipient & {
+      team: { id: number; url: string } | null;
+    }
+  >;
  perPage: number;
  page: number;
  totalPages: number;
--- a/apps/web/src/app/(dashboard)/templates/data-table-title.tsx
+++ b/apps/web/src/app/(dashboard)/templates/data-table-title.tsx
@ -1,23 +1,35 @@
+'use client';
+
 import Link from 'next/link';

 import { useSession } from 'next-auth/react';

-import { Template } from '@documenso/prisma/client';
+import { formatTemplatesPath } from '@documenso/lib/utils/teams';
+import type { Template } from '@documenso/prisma/client';
+
+import { useOptionalCurrentTeam } from '~/providers/team';

 export type DataTableTitleProps = {
-  row: Template;
+  row: Template & {
+    team: { id: number; url: string } | null;
+  };
 };

 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={`/templates/${row.id}`}
+      href={`${templatesPath}/${row.id}`}
      className="block max-w-[10rem] cursor-pointer truncate font-medium hover:underline md:max-w-[20rem]"
    >
      {row.title}
--- a/apps/web/src/components/(dashboard)/avatar/stack-avatars-with-tooltip.tsx
+++ b/apps/web/src/components/(dashboard)/avatar/stack-avatars-with-tooltip.tsx
@ -1,13 +1,12 @@
+'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 {
-  Tooltip,
-  TooltipContent,
-  TooltipProvider,
-  TooltipTrigger,
-} from '@documenso/ui/primitives/tooltip';
+import { Popover, PopoverContent, PopoverTrigger } from '@documenso/ui/primitives/popover';

 import { AvatarWithRecipient } from './avatar-with-recipient';
 import { StackAvatar } from './stack-avatar';
@ -24,6 +23,11 @@ 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',
  );
@ -40,66 +44,105 @@ 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 (
-    <TooltipProvider>
-      <Tooltip delayDuration={200}>
-        <TooltipTrigger className="flex cursor-pointer">
-          {children || <StackAvatars recipients={recipients} />}
-        </TooltipTrigger>
+    <Popover open={open} onOpenChange={onOpenChange}>
+      <PopoverTrigger
+        className="flex cursor-pointer"
+        onMouseEnter={onMouseEnter}
+        onMouseLeave={onMouseLeave}
+      >
+        {children || <StackAvatars recipients={recipients} />}
+      </PopoverTrigger>

-        <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>
-                ))}
+      <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>
              </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>
-            )}
-
-            {uncompletedRecipients.length > 0 && (
-              <div>
-                <h1 className="text-base font-medium">Uncompleted</h1>
-                {uncompletedRecipients.map((recipient: Recipient) => (
-                  <AvatarWithRecipient key={recipient.id} recipient={recipient} />
-                ))}
-              </div>
-            )}
+            ))}
          </div>
-        </TooltipContent>
-      </Tooltip>
-    </TooltipProvider>
+        )}
+
+        {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>
+        )}
+
+        {uncompletedRecipients.length > 0 && (
+          <div>
+            <h1 className="text-base font-medium">Uncompleted</h1>
+            {uncompletedRecipients.map((recipient: Recipient) => (
+              <AvatarWithRecipient key={recipient.id} recipient={recipient} />
+            ))}
+          </div>
+        )}
+      </PopoverContent>
+    </Popover>
  );
 };
--- a/apps/web/src/components/forms/2fa/enable-authenticator-app-dialog.tsx
+++ b/apps/web/src/components/forms/2fa/enable-authenticator-app-dialog.tsx
@ -1,4 +1,4 @@
-import { useMemo } from 'react';
+import { useEffect, useMemo } from 'react';

 import { zodResolver } from '@hookform/resolvers/zod';
 import { useForm } from 'react-hook-form';
@ -149,6 +149,13 @@ 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">
--- a/apps/web/src/components/forms/2fa/view-recovery-codes-dialog.tsx
+++ b/apps/web/src/components/forms/2fa/view-recovery-codes-dialog.tsx
@ -1,4 +1,4 @@
-import { useMemo } from 'react';
+import { useEffect, useMemo } from 'react';

 import { zodResolver } from '@hookform/resolvers/zod';
 import { useForm } from 'react-hook-form';
@ -92,6 +92,13 @@ 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">
--- a/docker/README.md
+++ b/docker/README.md
@ -29,7 +29,16 @@ NEXT_PRIVATE_SMTP_USERNAME="<your-username>"
 NEXT_PRIVATE_SMTP_PASSWORD="<your-password>"
 ```

-4. Run the following command to start the containers:
+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
@ -70,6 +79,7 @@ docker run -d \
  -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
 ```

@ -99,6 +109,10 @@ Here's a markdown table documenting all the provided environment variables:
 | `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).                                    |
--- a/docker/production/compose.yml
+++ b/docker/production/compose.yml
@ -57,8 +57,11 @@ services:
      - 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:
--- a/docker/testing/compose.yml
+++ b/docker/testing/compose.yml
@ -47,5 +47,8 @@ services:
      - 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
--- a/package-lock.json
+++ b/package-lock.json
@ -58,7 +58,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"
      },
@ -74,45 +74,6 @@
      "integrity": "sha512-O+z53uwx64xY7D6roOi4+jApDGFg0qn6WHcxe5QeqjMaTezBO/mxdfFXIVAVVyNWKx84OmPB3L8kbVYOTeN34A==",
      "dev": true
    },
-    "apps/marketing/node_modules/sharp": {
-      "version": "0.33.1",
-      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.33.1.tgz",
-      "integrity": "sha512-iAYUnOdTqqZDb3QjMneBKINTllCJDZ3em6WaWy7NPECM4aHncvqHRm0v0bN9nqJxMiwamv5KIdauJ6lUzKDpTQ==",
-      "hasInstallScript": true,
-      "dependencies": {
-        "color": "^4.2.3",
-        "detect-libc": "^2.0.2",
-        "semver": "^7.5.4"
-      },
-      "engines": {
-        "libvips": ">=8.15.0",
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-darwin-arm64": "0.33.1",
-        "@img/sharp-darwin-x64": "0.33.1",
-        "@img/sharp-libvips-darwin-arm64": "1.0.0",
-        "@img/sharp-libvips-darwin-x64": "1.0.0",
-        "@img/sharp-libvips-linux-arm": "1.0.0",
-        "@img/sharp-libvips-linux-arm64": "1.0.0",
-        "@img/sharp-libvips-linux-s390x": "1.0.0",
-        "@img/sharp-libvips-linux-x64": "1.0.0",
-        "@img/sharp-libvips-linuxmusl-arm64": "1.0.0",
-        "@img/sharp-libvips-linuxmusl-x64": "1.0.0",
-        "@img/sharp-linux-arm": "0.33.1",
-        "@img/sharp-linux-arm64": "0.33.1",
-        "@img/sharp-linux-s390x": "0.33.1",
-        "@img/sharp-linux-x64": "0.33.1",
-        "@img/sharp-linuxmusl-arm64": "0.33.1",
-        "@img/sharp-linuxmusl-x64": "0.33.1",
-        "@img/sharp-wasm32": "0.33.1",
-        "@img/sharp-win32-ia32": "0.33.1",
-        "@img/sharp-win32-x64": "0.33.1"
-      }
-    },
    "apps/marketing/node_modules/typescript": {
      "version": "5.2.2",
      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.2.2.tgz",
@ -159,7 +120,7 @@
        "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",
        "ua-parser-js": "^1.0.37",
        "uqr": "^0.1.2",
@ -182,45 +143,6 @@
      "integrity": "sha512-O+z53uwx64xY7D6roOi4+jApDGFg0qn6WHcxe5QeqjMaTezBO/mxdfFXIVAVVyNWKx84OmPB3L8kbVYOTeN34A==",
      "dev": true
    },
-    "apps/web/node_modules/sharp": {
-      "version": "0.33.1",
-      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.33.1.tgz",
-      "integrity": "sha512-iAYUnOdTqqZDb3QjMneBKINTllCJDZ3em6WaWy7NPECM4aHncvqHRm0v0bN9nqJxMiwamv5KIdauJ6lUzKDpTQ==",
-      "hasInstallScript": true,
-      "dependencies": {
-        "color": "^4.2.3",
-        "detect-libc": "^2.0.2",
-        "semver": "^7.5.4"
-      },
-      "engines": {
-        "libvips": ">=8.15.0",
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-darwin-arm64": "0.33.1",
-        "@img/sharp-darwin-x64": "0.33.1",
-        "@img/sharp-libvips-darwin-arm64": "1.0.0",
-        "@img/sharp-libvips-darwin-x64": "1.0.0",
-        "@img/sharp-libvips-linux-arm": "1.0.0",
-        "@img/sharp-libvips-linux-arm64": "1.0.0",
-        "@img/sharp-libvips-linux-s390x": "1.0.0",
-        "@img/sharp-libvips-linux-x64": "1.0.0",
-        "@img/sharp-libvips-linuxmusl-arm64": "1.0.0",
-        "@img/sharp-libvips-linuxmusl-x64": "1.0.0",
-        "@img/sharp-linux-arm": "0.33.1",
-        "@img/sharp-linux-arm64": "0.33.1",
-        "@img/sharp-linux-s390x": "0.33.1",
-        "@img/sharp-linux-x64": "0.33.1",
-        "@img/sharp-linuxmusl-arm64": "0.33.1",
-        "@img/sharp-linuxmusl-x64": "0.33.1",
-        "@img/sharp-wasm32": "0.33.1",
-        "@img/sharp-win32-ia32": "0.33.1",
-        "@img/sharp-win32-x64": "0.33.1"
-      }
-    },
    "apps/web/node_modules/typescript": {
      "version": "5.2.2",
      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.2.2.tgz",
@ -18560,6 +18482,45 @@
        "sha.js": "bin.js"
      }
    },
+    "node_modules/sharp": {
+      "version": "0.33.1",
+      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.33.1.tgz",
+      "integrity": "sha512-iAYUnOdTqqZDb3QjMneBKINTllCJDZ3em6WaWy7NPECM4aHncvqHRm0v0bN9nqJxMiwamv5KIdauJ6lUzKDpTQ==",
+      "hasInstallScript": true,
+      "dependencies": {
+        "color": "^4.2.3",
+        "detect-libc": "^2.0.2",
+        "semver": "^7.5.4"
+      },
+      "engines": {
+        "libvips": ">=8.15.0",
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-darwin-arm64": "0.33.1",
+        "@img/sharp-darwin-x64": "0.33.1",
+        "@img/sharp-libvips-darwin-arm64": "1.0.0",
+        "@img/sharp-libvips-darwin-x64": "1.0.0",
+        "@img/sharp-libvips-linux-arm": "1.0.0",
+        "@img/sharp-libvips-linux-arm64": "1.0.0",
+        "@img/sharp-libvips-linux-s390x": "1.0.0",
+        "@img/sharp-libvips-linux-x64": "1.0.0",
+        "@img/sharp-libvips-linuxmusl-arm64": "1.0.0",
+        "@img/sharp-libvips-linuxmusl-x64": "1.0.0",
+        "@img/sharp-linux-arm": "0.33.1",
+        "@img/sharp-linux-arm64": "0.33.1",
+        "@img/sharp-linux-s390x": "0.33.1",
+        "@img/sharp-linux-x64": "0.33.1",
+        "@img/sharp-linuxmusl-arm64": "0.33.1",
+        "@img/sharp-linuxmusl-x64": "0.33.1",
+        "@img/sharp-wasm32": "0.33.1",
+        "@img/sharp-win32-ia32": "0.33.1",
+        "@img/sharp-win32-x64": "0.33.1"
+      }
+    },
    "node_modules/shebang-command": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
--- a/packages/eslint-config/index.cjs
+++ b/packages/eslint-config/index.cjs
@ -20,7 +20,7 @@ module.exports = {

  parserOptions: {
    tsconfigRootDir: __dirname,
-    project: ['../../apps/*/tsconfig.json', '../../packages/*/tsconfig.json'],
+    project: ['../../tsconfig.eslint.json'],
    ecmaVersion: 2022,
    ecmaFeatures: {
      jsx: true,
--- a/packages/lib/server-only/template/find-templates.ts
+++ b/packages/lib/server-only/template/find-templates.ts
@ -37,6 +37,12 @@ export const findTemplates = async ({
      where: whereFilter,
      include: {
        templateDocumentData: true,
+        team: {
+          select: {
+            id: true,
+            url: true,
+          },
+        },
        Field: true,
        Recipient: true,
      },
--- a/packages/ui/primitives/data-table.tsx
+++ b/packages/ui/primitives/data-table.tsx
@ -115,7 +115,12 @@ export function DataTable<TData, TValue>({
              table.getRowModel().rows.map((row) => (
                <TableRow key={row.id} data-state={row.getIsSelected() && 'selected'}>
                  {row.getVisibleCells().map((cell) => (
-                    <TableCell key={cell.id}>
+                    <TableCell
+                      key={cell.id}
+                      style={{
+                        width: `${cell.column.getSize()}px`,
+                      }}
+                    >
                      {flexRender(cell.column.columnDef.cell, cell.getContext())}
                    </TableCell>
                  ))}
--- a/packages/ui/primitives/toast.tsx
+++ b/packages/ui/primitives/toast.tsx
@ -79,7 +79,7 @@ const ToastClose = React.forwardRef<
  <ToastPrimitives.Close
    ref={ref}
    className={cn(
-      'text-foreground/50 hover:text-foreground absolute right-2 top-2 rounded-md p-1 opacity-0 transition-opacity focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600',
+      'text-foreground/50 hover:text-foreground absolute right-2 top-2 rounded-md p-1 opacity-100 transition-opacity focus:opacity-100 focus:outline-none focus:ring-2 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600 md:opacity-0 group-hover:md:opacity-100',
      className,
    )}
    toast-close=""
--- a/packages/ui/styles/theme.css
+++ b/packages/ui/styles/theme.css
@ -81,7 +81,7 @@
    --ring: 95.08 71.08% 67.45%;

    --radius: 0.5rem;
-    
+
    --warning: 54 96% 45%;
  }
 }
@ -91,6 +91,11 @@
    @apply border-border;
  }

+  html,
+  body {
+    scrollbar-gutter: stable;
+  }
+
  body {
    @apply bg-background text-foreground;
    font-feature-settings: 'rlig' 1, 'calt' 1;
--- a/tsconfig.eslint.json
+++ b/tsconfig.eslint.json
@ -0,0 +1,4 @@
+{
+  "extends": "./packages/tsconfig/base.json",
+  "include": ["packages/**/*", "apps/**/*"]
+}