diff --git a/apps/marketing/content/blog/why-i-started-documenso.mdx b/apps/marketing/content/blog/why-i-started-documenso.mdx new file mode 100644 index 000000000..2fceddd25 --- /dev/null +++ b/apps/marketing/content/blog/why-i-started-documenso.mdx @@ -0,0 +1,68 @@ +--- +title: Why I started Documenso +description: I started Documenso because I wanted to build a modern tech company in a growing space with a mission bigger than money, I overpaid for a SSL cert 13 years ago, like encryption and want to help make the internet/ world more open. +authorName: 'Timur Ercan' +authorImage: '/blog/blog-author-timur.jpeg' +authorRole: 'Co-Founder' +date: 2024-02-06 +Tags: + - Founders + - Mission + - Open Source +--- + +
+ + +
+ Not the burger from the story. But it could be as well, the place is pretty generic. +
+
+ +> TLDR; I started Documenso because I wanted to build a modern tech company in a growing space with a mission bigger than money, I overpaid for a SSL cert 13 years ago, like encryption, and wanted to help make the world/ Internet more open. + +It's hard to pinpoint when I decided to start Documenso. I first uttered the word "Documenso" while sitting in a restaurant with [Felix](https://twitter.com/flxmgdnz), eating a burger and discussing what's next in late 2022. Shortly after, I sat down with a can of caffeine and started building [Documenso 0.9](https://github.com/documenso/documenso/releases/tag/0.9-developer-preview). Starting Documenso is the most deliberate business decision I ever made. It was deliberate from the personal side and deliberate from the business side. + +Looking at the personal side, I've had some time off and was actively looking for my next move. Looking back, I stumbled into my first company. Less so with the second one, but I joined my co-founders and did not develop the core concept myself. While coming up with Documenso, I was deliberately looking for a few things, based on my previous experiences: + +- An entrepreneurial space that was a big enough opportunity +- A huge macro trend, lifting everything in it's space +- A mode of working that fits my flow (which, luckily for me, is pretty close to the modern startup/ tech scene) +- A more significant impact to be made than just earning lots of money (though there is nothing wrong with that) + +Quick shoutout to everyone feeling even a pinch of imposter syndrome while calling themselves a founder. It was after ten years, slightly after starting Documenso, that I started doing it in my head without cringing. So cut yourself some slack. Considering how long I've been doing this, I would have earned the internal title sooner, and so do you. After grappling with my identity for a second, as is customary for founders, my decision to start this journey came quickly. + +Aside from the personal dimension, I had a clear mindset of what I wanted. The criteria I describe below clicked into place one after another, in no particular order. Having experienced no market demand and a very gritty, grindy market, I was looking for something more fundamental. Something basic, infrastructure-like, with a huge demand. A growing market deeply rooted in the ever-increasing digitalization of the world. + +And to be honest, I just always liked digital signature tools. It's a product that is easy enough to comprehend and build but complex and impactful enough to satisfy a hard need. It's a product you can build very product-driven since the market and domain are well understood. So when asked about what's next for me, I literally said, "Digital, um, let's say… signatures". As it turns out, my first gut feeling was spot on, but how spot on I only realized when I started researching the space. An open source document signing company happens to be the perfect intersection of all the criteria and personal preferences I described above; it's pretty amazing, actually: + +- The global signing market is enormous and rapidly growing +- To put it bluntly, the signing space is vast and dominated by one outdated player. Outdated in terms of tech, pricing, and ecosystem +- The signing space is also ridiculously opaque for a space based on open web tech, open encryption tech, and open signing standards. Even by closed-source standards +- We are currently seeing a renaissance for commercial open source startups, combining venture founder financials with open source mechanics +- Rebuilding a fundamental infrastructure as open source with a meaningful scale has a profoundly transformative effect on any space +- Working in open source requires being open, cooperative, and inclusive. It also requires quite a bit of context jumping, "going with the flow," and empathy +- Apart from fixing the signing space, making Documenso successful would be another domino tile toward open source eating the world, which is great for everyone + +Building a company is so complex it can't be planned out. Basing it on great fundamentals and the expected dynamics is the best founders can do, in my humble opinion. After these fundamental decisions, you are (almost) just along for the ride and need to focus on solving the "conventional" problems of starting a company the best you can. With digital signatures hitting so many points of my personal and professional checklist, this already was a great fit. What got me excited at first, though, apart from the perspective of drinking caffeine and coding, was this: + +Roughly 13 years ago, I was launching my first product. We obviously wanted SSL encryption on the product site, so I had to buy an SSL certificate. ~$200ish, two years validity, from VeriSign, I think. Apart from it being ridiculously complicated to get, it bothered me that we had basically paid $200 for what is essentially a long number someone generated. SSL wasn't even that widespread back then because it was mainly considered important for e-commerce, no wonder considering it cost so much. "Why would I encrypt a blog?". Fast forward to today, and everyone can get a free SSL cert courtesy of [Let's Encrypt](https://letsencrypt.org/) and browsers are basically blocking unencrypted sites. Mostly, it is even built into hosting platforms, so you barely even notice as a developer. + +I had forgotten all about that story until I realized this is where signing is today. A global need fulfilled only by a closed ecosystem, not really state-of-the-art companies, leading to, let's call it, steep prices. I had considered Let's Encrypt a pillar of the open internet for so long that I forgot that they weren't always there. One day, someone said, let's make the internet better. Signing is another domain that should have had an open ecosystem for a long time. Another parallel to that story is the fact that the cryptographic certificates you need for document signing are also stuck in the "pre-Let's Encrypt world." Free document signing certificates via "Let's Sign" are now another to-do on the [long-term roadmap](https://documen.so/roadmap) list for the open signing ecosystem. Effecting this change in any way is a huge driver for me. + +Apart from my personal gripes with the corporate certificate industry, I have always found encryption fascinating. It's such a fundamental force in society when you think about it: Secure Communication, Secure Commerce, and even [internet native, open source money (Bitcoin)](https://github.com/bitcoin/bitcoin) were created using a bit of smart math. All these examples are expressions of very fundamental human behaviors that should be enabled and protected by open infrastructures. + +I never told rthis to anyone before, but since starting Documenso, I realized that I underestimated the impact and importance of open source for quite some time. When I was in University, I distantly remember my mindset of "yeah, open source is nice, but the great, commercially successful products used in the real world are built by closed companies (aka Microsoft)" _shudder_ It was never really a conscious thought, but enough that I started learning MS Silverlight before plain Javascript. It was slowly, over time, that I realized that open web standards are superior to closed ones, and even later, I understood the same holds true for all software. Open source fixes something in the economy I find hard to articulate. I did my best in [Commodifying Signing](https://documenso.com/blog/commodifying-signing). + +To wrap this up, Documenso happens to be the perfect storm of market opportunity, my interests, and my passions. Creating a company in which people want to work for the long term while tackling these issues is a critical side quest of Documenso. This is not only about building the next generation of signing tech; it's also about doing our part to normalize open, healthy, efficient working cultures and tackling relevant problems. + +As always, feel free to connect on [Twitter / X](https://twitter.com/eltimuro) (DM open) or [Discord](https://documen.so/discord) if you have any questions, comments, thoughts or feelings. + +\ +Best from Hamburg\ +Timur diff --git a/apps/marketing/public/blog/burgers.jpeg b/apps/marketing/public/blog/burgers.jpeg new file mode 100644 index 000000000..4fd897e75 Binary files /dev/null and b/apps/marketing/public/blog/burgers.jpeg differ diff --git a/apps/web/src/app/(dashboard)/documents/[id]/document-page-view.tsx b/apps/web/src/app/(dashboard)/documents/[id]/document-page-view.tsx index 3a46ed5e7..6759d91ac 100644 --- a/apps/web/src/app/(dashboard)/documents/[id]/document-page-view.tsx +++ b/apps/web/src/app/(dashboard)/documents/[id]/document-page-view.tsx @@ -25,7 +25,7 @@ export type DocumentPageViewProps = { team?: Team; }; -export default async function DocumentPageView({ params, team }: DocumentPageViewProps) { +export const DocumentPageView = async ({ params, team }: DocumentPageViewProps) => { const { id } = params; const documentId = Number(id); @@ -128,4 +128,4 @@ export default async function DocumentPageView({ params, team }: DocumentPageVie )} ); -} +}; diff --git a/apps/web/src/app/(dashboard)/documents/[id]/page.tsx b/apps/web/src/app/(dashboard)/documents/[id]/page.tsx index e7a34889e..5ad224737 100644 --- a/apps/web/src/app/(dashboard)/documents/[id]/page.tsx +++ b/apps/web/src/app/(dashboard)/documents/[id]/page.tsx @@ -1,4 +1,4 @@ -import DocumentPageView from './document-page-view'; +import { DocumentPageView } from './document-page-view'; export type DocumentPageProps = { params: { diff --git a/apps/web/src/app/(dashboard)/documents/documents-page-view.tsx b/apps/web/src/app/(dashboard)/documents/documents-page-view.tsx index ead3e8f4f..9059b8e88 100644 --- a/apps/web/src/app/(dashboard)/documents/documents-page-view.tsx +++ b/apps/web/src/app/(dashboard)/documents/documents-page-view.tsx @@ -33,10 +33,7 @@ export type DocumentsPageViewProps = { team?: Team & { teamEmail?: TeamEmail | null }; }; -export default async function DocumentsPageView({ - searchParams = {}, - team, -}: DocumentsPageViewProps) { +export const DocumentsPageView = async ({ searchParams = {}, team }: DocumentsPageViewProps) => { const { user } = await getRequiredServerComponentSession(); const status = isExtendedDocumentStatus(searchParams.status) ? searchParams.status : 'ALL'; @@ -155,4 +152,4 @@ export default async function DocumentsPageView({ ); -} +}; diff --git a/apps/web/src/app/(dashboard)/documents/page.tsx b/apps/web/src/app/(dashboard)/documents/page.tsx index b67ed6f02..67f432a13 100644 --- a/apps/web/src/app/(dashboard)/documents/page.tsx +++ b/apps/web/src/app/(dashboard)/documents/page.tsx @@ -1,7 +1,7 @@ import type { Metadata } from 'next'; import type { DocumentsPageViewProps } from './documents-page-view'; -import DocumentsPageView from './documents-page-view'; +import { DocumentsPageView } from './documents-page-view'; export type DocumentsPageProps = { searchParams?: DocumentsPageViewProps['searchParams']; diff --git a/apps/web/src/app/(dashboard)/templates/[id]/edit-template.tsx b/apps/web/src/app/(dashboard)/templates/[id]/edit-template.tsx index bdc769e79..f8c7f9a43 100644 --- a/apps/web/src/app/(dashboard)/templates/[id]/edit-template.tsx +++ b/apps/web/src/app/(dashboard)/templates/[id]/edit-template.tsx @@ -28,6 +28,7 @@ export type EditTemplateFormProps = { recipients: Recipient[]; fields: Field[]; documentData: DocumentData; + templateRootPath: string; }; type EditTemplateStep = 'signers' | 'fields'; @@ -40,6 +41,7 @@ export const EditTemplateForm = ({ fields, user: _user, documentData, + templateRootPath, }: EditTemplateFormProps) => { const { toast } = useToast(); const router = useRouter(); @@ -98,7 +100,7 @@ export const EditTemplateForm = ({ duration: 5000, }); - router.push('/templates'); + router.push(templateRootPath); } catch (err) { toast({ title: 'Error', diff --git a/apps/web/src/app/(dashboard)/templates/[id]/page.tsx b/apps/web/src/app/(dashboard)/templates/[id]/page.tsx index 6d234eff2..aa55d1943 100644 --- a/apps/web/src/app/(dashboard)/templates/[id]/page.tsx +++ b/apps/web/src/app/(dashboard)/templates/[id]/page.tsx @@ -1,81 +1,10 @@ import React from 'react'; -import Link from 'next/link'; -import { redirect } from 'next/navigation'; +import type { TemplatePageViewProps } from './template-page-view'; +import { TemplatePageView } from './template-page-view'; -import { ChevronLeft } from 'lucide-react'; +type TemplatePageProps = Pick; -import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session'; -import { getFieldsForTemplate } from '@documenso/lib/server-only/field/get-fields-for-template'; -import { getRecipientsForTemplate } from '@documenso/lib/server-only/recipient/get-recipients-for-template'; -import { getTemplateById } from '@documenso/lib/server-only/template/get-template-by-id'; - -import { TemplateType } from '~/components/formatter/template-type'; - -import { EditTemplateForm } from './edit-template'; - -export type TemplatePageProps = { - params: { - id: string; - }; -}; - -export default async function TemplatePage({ params }: TemplatePageProps) { - const { id } = params; - - const templateId = Number(id); - - if (!templateId || Number.isNaN(templateId)) { - redirect('/documents'); - } - - const { user } = await getRequiredServerComponentSession(); - - const template = await getTemplateById({ - id: templateId, - userId: user.id, - }).catch(() => null); - - if (!template || !template.templateDocumentData) { - redirect('/documents'); - } - - const { templateDocumentData } = template; - - const [templateRecipients, templateFields] = await Promise.all([ - getRecipientsForTemplate({ - templateId, - userId: user.id, - }), - getFieldsForTemplate({ - templateId, - userId: user.id, - }), - ]); - - return ( -
- - - Templates - - -

- {template.title} -

- -
- -
- - -
- ); +export default function TemplatePage({ params }: TemplatePageProps) { + return ; } diff --git a/apps/web/src/app/(dashboard)/templates/[id]/template-page-view.tsx b/apps/web/src/app/(dashboard)/templates/[id]/template-page-view.tsx new file mode 100644 index 000000000..899e600f1 --- /dev/null +++ b/apps/web/src/app/(dashboard)/templates/[id]/template-page-view.tsx @@ -0,0 +1,86 @@ +import React from 'react'; + +import Link from 'next/link'; +import { redirect } from 'next/navigation'; + +import { ChevronLeft } from 'lucide-react'; + +import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session'; +import { getFieldsForTemplate } from '@documenso/lib/server-only/field/get-fields-for-template'; +import { getRecipientsForTemplate } from '@documenso/lib/server-only/recipient/get-recipients-for-template'; +import { getTemplateById } from '@documenso/lib/server-only/template/get-template-by-id'; +import { formatTemplatesPath } from '@documenso/lib/utils/teams'; +import type { Team } from '@documenso/prisma/client'; + +import { TemplateType } from '~/components/formatter/template-type'; + +import { EditTemplateForm } from './edit-template'; + +export type TemplatePageViewProps = { + params: { + id: string; + }; + team?: Team; +}; + +export const TemplatePageView = async ({ params, team }: TemplatePageViewProps) => { + const { id } = params; + + const templateId = Number(id); + const templateRootPath = formatTemplatesPath(team?.url); + + if (!templateId || Number.isNaN(templateId)) { + redirect(templateRootPath); + } + + const { user } = await getRequiredServerComponentSession(); + + const template = await getTemplateById({ + id: templateId, + userId: user.id, + }).catch(() => null); + + if (!template || !template.templateDocumentData) { + redirect(templateRootPath); + } + + const { templateDocumentData } = template; + + const [templateRecipients, templateFields] = await Promise.all([ + getRecipientsForTemplate({ + templateId, + userId: user.id, + }), + getFieldsForTemplate({ + templateId, + userId: user.id, + }), + ]); + + return ( +
+ + + Templates + + +

+ {template.title} +

+ +
+ +
+ + +
+ ); +}; diff --git a/apps/web/src/app/(dashboard)/templates/data-table-action-dropdown.tsx b/apps/web/src/app/(dashboard)/templates/data-table-action-dropdown.tsx index 9f26d632c..eee32b920 100644 --- a/apps/web/src/app/(dashboard)/templates/data-table-action-dropdown.tsx +++ b/apps/web/src/app/(dashboard)/templates/data-table-action-dropdown.tsx @@ -21,9 +21,15 @@ import { DuplicateTemplateDialog } from './duplicate-template-dialog'; export type DataTableActionDropdownProps = { row: Template; + templateRootPath: string; + teamId?: number; }; -export const DataTableActionDropdown = ({ row }: DataTableActionDropdownProps) => { +export const DataTableActionDropdown = ({ + row, + templateRootPath, + teamId, +}: DataTableActionDropdownProps) => { const { data: session } = useSession(); const [isDeleteDialogOpen, setDeleteDialogOpen] = useState(false); @@ -34,6 +40,7 @@ export const DataTableActionDropdown = ({ row }: DataTableActionDropdownProps) = } const isOwner = row.userId === session.user.id; + const isTeamTemplate = row.teamId === teamId; return ( @@ -44,20 +51,25 @@ export const DataTableActionDropdown = ({ row }: DataTableActionDropdownProps) = Action - - + + Edit - {/* onDuplicateButtonClick(row.id)}> */} - setDuplicateDialogOpen(true)}> + setDuplicateDialogOpen(true)} + > Duplicate - setDeleteDialogOpen(true)}> + setDeleteDialogOpen(true)} + > Delete @@ -65,6 +77,7 @@ export const DataTableActionDropdown = ({ row }: DataTableActionDropdownProps) = diff --git a/apps/web/src/app/(dashboard)/templates/data-table-templates.tsx b/apps/web/src/app/(dashboard)/templates/data-table-templates.tsx index 0e8f822c2..309695c88 100644 --- a/apps/web/src/app/(dashboard)/templates/data-table-templates.tsx +++ b/apps/web/src/app/(dashboard)/templates/data-table-templates.tsx @@ -28,6 +28,9 @@ type TemplatesDataTableProps = { perPage: number; page: number; totalPages: number; + documentRootPath: string; + templateRootPath: string; + teamId?: number; }; export const TemplatesDataTable = ({ @@ -35,6 +38,9 @@ export const TemplatesDataTable = ({ perPage, page, totalPages, + documentRootPath, + templateRootPath, + teamId, }: TemplatesDataTableProps) => { const [isPending, startTransition] = useTransition(); const updateSearchParams = useUpdateSearchParams(); @@ -70,7 +76,7 @@ export const TemplatesDataTable = ({ duration: 5000, }); - router.push(`/documents/${id}`); + router.push(`${documentRootPath}/${id}`); } catch (err) { toast({ title: 'Error', @@ -131,7 +137,12 @@ export const TemplatesDataTable = ({ {!isRowLoading && } Use Template - + + ); }, diff --git a/apps/web/src/app/(dashboard)/templates/delete-template-dialog.tsx b/apps/web/src/app/(dashboard)/templates/delete-template-dialog.tsx index 9075f4677..b31ad2048 100644 --- a/apps/web/src/app/(dashboard)/templates/delete-template-dialog.tsx +++ b/apps/web/src/app/(dashboard)/templates/delete-template-dialog.tsx @@ -35,20 +35,15 @@ export const DeleteTemplateDialog = ({ id, open, onOpenChange }: DeleteTemplateD onOpenChange(false); }, - }); - - const onDeleteTemplate = async () => { - try { - await deleteTemplate({ id }); - } catch { + onError: () => { toast({ title: 'Something went wrong', description: 'This template could not be deleted at this time. Please try again.', variant: 'destructive', duration: 7500, }); - } - }; + }, + }); return ( !isLoading && onOpenChange(value)}> @@ -63,20 +58,18 @@ export const DeleteTemplateDialog = ({ id, open, onOpenChange }: DeleteTemplateD -
- + - -
+ diff --git a/apps/web/src/app/(dashboard)/templates/duplicate-template-dialog.tsx b/apps/web/src/app/(dashboard)/templates/duplicate-template-dialog.tsx index be743ff48..cdd3000c2 100644 --- a/apps/web/src/app/(dashboard)/templates/duplicate-template-dialog.tsx +++ b/apps/web/src/app/(dashboard)/templates/duplicate-template-dialog.tsx @@ -14,12 +14,14 @@ import { useToast } from '@documenso/ui/primitives/use-toast'; type DuplicateTemplateDialogProps = { id: number; + teamId?: number; open: boolean; onOpenChange: (_open: boolean) => void; }; export const DuplicateTemplateDialog = ({ id, + teamId, open, onOpenChange, }: DuplicateTemplateDialogProps) => { @@ -40,22 +42,15 @@ export const DuplicateTemplateDialog = ({ onOpenChange(false); }, + onError: () => { + toast({ + title: 'Error', + description: 'An error occurred while duplicating template.', + variant: 'destructive', + }); + }, }); - const onDuplicate = async () => { - try { - await duplicateTemplate({ - templateId: id, - }); - } catch (err) { - toast({ - title: 'Error', - description: 'An error occurred while duplicating template.', - variant: 'destructive', - }); - } - }; - return ( !isLoading && onOpenChange(value)}> @@ -66,20 +61,27 @@ export const DuplicateTemplateDialog = ({ -
- + - -
+ diff --git a/apps/web/src/app/(dashboard)/templates/new-template-dialog.tsx b/apps/web/src/app/(dashboard)/templates/new-template-dialog.tsx index a4aa9bce2..37d60f946 100644 --- a/apps/web/src/app/(dashboard)/templates/new-template-dialog.tsx +++ b/apps/web/src/app/(dashboard)/templates/new-template-dialog.tsx @@ -43,8 +43,14 @@ const ZCreateTemplateFormSchema = z.object({ type TCreateTemplateFormSchema = z.infer; -export const NewTemplateDialog = () => { +type NewTemplateDialogProps = { + teamId?: number; + templateRootPath: string; +}; + +export const NewTemplateDialog = ({ teamId, templateRootPath }: NewTemplateDialogProps) => { const router = useRouter(); + const { data: session } = useSession(); const { toast } = useToast(); @@ -99,6 +105,7 @@ export const NewTemplateDialog = () => { }); const { id } = await createTemplate({ + teamId, title: values.name ? values.name : file.name, templateDocumentDataId, }); @@ -112,7 +119,7 @@ export const NewTemplateDialog = () => { setShowNewTemplateDialog(false); - void router.push(`/templates/${id}`); + router.push(`${templateRootPath}/${id}`); } catch { toast({ title: 'Something went wrong', diff --git a/apps/web/src/app/(dashboard)/templates/page.tsx b/apps/web/src/app/(dashboard)/templates/page.tsx index d3dacd501..7c7bd4e4f 100644 --- a/apps/web/src/app/(dashboard)/templates/page.tsx +++ b/apps/web/src/app/(dashboard)/templates/page.tsx @@ -2,57 +2,17 @@ import React from 'react'; import type { Metadata } from 'next'; -import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session'; -import { getTemplates } from '@documenso/lib/server-only/template/get-templates'; - -import { TemplatesDataTable } from './data-table-templates'; -import { EmptyTemplateState } from './empty-state'; -import { NewTemplateDialog } from './new-template-dialog'; +import { TemplatesPageView } from './templates-page-view'; +import type { TemplatesPageViewProps } from './templates-page-view'; type TemplatesPageProps = { - searchParams?: { - page?: number; - perPage?: number; - }; + searchParams?: TemplatesPageViewProps['searchParams']; }; export const metadata: Metadata = { title: 'Templates', }; -export default async function TemplatesPage({ searchParams = {} }: TemplatesPageProps) { - const { user } = await getRequiredServerComponentSession(); - const page = Number(searchParams.page) || 1; - const perPage = Number(searchParams.perPage) || 10; - - const { templates, totalPages } = await getTemplates({ - userId: user.id, - page: page, - perPage: perPage, - }); - - return ( -
-
-

Templates

- -
- -
-
- -
- {templates.length > 0 ? ( - - ) : ( - - )} -
-
- ); +export default function TemplatesPage({ searchParams = {} }: TemplatesPageProps) { + return ; } diff --git a/apps/web/src/app/(dashboard)/templates/templates-page-view.tsx b/apps/web/src/app/(dashboard)/templates/templates-page-view.tsx new file mode 100644 index 000000000..4736f4268 --- /dev/null +++ b/apps/web/src/app/(dashboard)/templates/templates-page-view.tsx @@ -0,0 +1,73 @@ +import React from 'react'; + +import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session'; +import { findTemplates } from '@documenso/lib/server-only/template/find-templates'; +import { formatDocumentsPath, formatTemplatesPath } from '@documenso/lib/utils/teams'; +import type { Team } from '@documenso/prisma/client'; +import { Avatar, AvatarFallback } from '@documenso/ui/primitives/avatar'; + +import { TemplatesDataTable } from './data-table-templates'; +import { EmptyTemplateState } from './empty-state'; +import { NewTemplateDialog } from './new-template-dialog'; + +export type TemplatesPageViewProps = { + searchParams?: { + page?: number; + perPage?: number; + }; + team?: Team; +}; + +export const TemplatesPageView = async ({ searchParams = {}, team }: TemplatesPageViewProps) => { + const { user } = await getRequiredServerComponentSession(); + const page = Number(searchParams.page) || 1; + const perPage = Number(searchParams.perPage) || 10; + + const documentRootPath = formatDocumentsPath(team?.url); + const templateRootPath = formatTemplatesPath(team?.url); + + const { templates, totalPages } = await findTemplates({ + userId: user.id, + teamId: team?.id, + page: page, + perPage: perPage, + }); + + return ( +
+
+
+ {team && ( + + + {team.name.slice(0, 1)} + + + )} + +

Templates

+
+ +
+ +
+
+ +
+ {templates.length > 0 ? ( + + ) : ( + + )} +
+
+ ); +}; diff --git a/apps/web/src/app/(teams)/t/[teamUrl]/documents/[id]/page.tsx b/apps/web/src/app/(teams)/t/[teamUrl]/documents/[id]/page.tsx index b7f610cff..26b1d7c91 100644 --- a/apps/web/src/app/(teams)/t/[teamUrl]/documents/[id]/page.tsx +++ b/apps/web/src/app/(teams)/t/[teamUrl]/documents/[id]/page.tsx @@ -1,7 +1,7 @@ import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session'; import { getTeamByUrl } from '@documenso/lib/server-only/team/get-team'; -import DocumentPageComponent from '~/app/(dashboard)/documents/[id]/document-page-view'; +import { DocumentPageView } from '~/app/(dashboard)/documents/[id]/document-page-view'; export type DocumentPageProps = { params: { @@ -16,5 +16,5 @@ export default async function DocumentPage({ params }: DocumentPageProps) { const { user } = await getRequiredServerComponentSession(); const team = await getTeamByUrl({ userId: user.id, teamUrl }); - return ; + return ; } diff --git a/apps/web/src/app/(teams)/t/[teamUrl]/documents/page.tsx b/apps/web/src/app/(teams)/t/[teamUrl]/documents/page.tsx index 952aeeeea..d3d5b5bee 100644 --- a/apps/web/src/app/(teams)/t/[teamUrl]/documents/page.tsx +++ b/apps/web/src/app/(teams)/t/[teamUrl]/documents/page.tsx @@ -2,7 +2,7 @@ import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get- import { getTeamByUrl } from '@documenso/lib/server-only/team/get-team'; import type { DocumentsPageViewProps } from '~/app/(dashboard)/documents/documents-page-view'; -import DocumentsPageView from '~/app/(dashboard)/documents/documents-page-view'; +import { DocumentsPageView } from '~/app/(dashboard)/documents/documents-page-view'; export type TeamsDocumentPageProps = { params: { diff --git a/apps/web/src/app/(teams)/t/[teamUrl]/templates/[id]/page.tsx b/apps/web/src/app/(teams)/t/[teamUrl]/templates/[id]/page.tsx new file mode 100644 index 000000000..3fe7cbf67 --- /dev/null +++ b/apps/web/src/app/(teams)/t/[teamUrl]/templates/[id]/page.tsx @@ -0,0 +1,22 @@ +import React from 'react'; + +import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session'; +import { getTeamByUrl } from '@documenso/lib/server-only/team/get-team'; + +import type { TemplatePageViewProps } from '~/app/(dashboard)/templates/[id]/template-page-view'; +import { TemplatePageView } from '~/app/(dashboard)/templates/[id]/template-page-view'; + +type TeamTemplatePageProps = { + params: TemplatePageViewProps['params'] & { + teamUrl: string; + }; +}; + +export default async function TeamTemplatePage({ params }: TeamTemplatePageProps) { + const { teamUrl } = params; + + const { user } = await getRequiredServerComponentSession(); + const team = await getTeamByUrl({ userId: user.id, teamUrl }); + + return ; +} diff --git a/apps/web/src/app/(teams)/t/[teamUrl]/templates/page.tsx b/apps/web/src/app/(teams)/t/[teamUrl]/templates/page.tsx new file mode 100644 index 000000000..6954d8e2d --- /dev/null +++ b/apps/web/src/app/(teams)/t/[teamUrl]/templates/page.tsx @@ -0,0 +1,26 @@ +import React from 'react'; + +import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session'; +import { getTeamByUrl } from '@documenso/lib/server-only/team/get-team'; + +import type { TemplatesPageViewProps } from '~/app/(dashboard)/templates/templates-page-view'; +import { TemplatesPageView } from '~/app/(dashboard)/templates/templates-page-view'; + +type TeamTemplatesPageProps = { + searchParams?: TemplatesPageViewProps['searchParams']; + params: { + teamUrl: string; + }; +}; + +export default async function TeamTemplatesPage({ + searchParams = {}, + params, +}: TeamTemplatesPageProps) { + const { teamUrl } = params; + + const { user } = await getRequiredServerComponentSession(); + const team = await getTeamByUrl({ userId: user.id, teamUrl }); + + return ; +} diff --git a/apps/web/src/components/(dashboard)/layout/desktop-nav.tsx b/apps/web/src/components/(dashboard)/layout/desktop-nav.tsx index 2b11c4be2..9eef1f4bd 100644 --- a/apps/web/src/components/(dashboard)/layout/desktop-nav.tsx +++ b/apps/web/src/components/(dashboard)/layout/desktop-nav.tsx @@ -52,24 +52,22 @@ export const DesktopNav = ({ className, ...props }: DesktopNavProps) => { {...props} >
- {navigationLinks - .filter(({ href }) => href !== '/templates' || rootHref === '') // Remove templates for team pages. - .map(({ href, label }) => ( - - {label} - - ))} + {navigationLinks.map(({ href, label }) => ( + + {label} + + ))}
diff --git a/apps/web/src/components/(dashboard)/layout/header.tsx b/apps/web/src/components/(dashboard)/layout/header.tsx index 753f5fb11..65bb63230 100644 --- a/apps/web/src/components/(dashboard)/layout/header.tsx +++ b/apps/web/src/components/(dashboard)/layout/header.tsx @@ -7,6 +7,7 @@ import { useParams } from 'next/navigation'; import { MenuIcon, SearchIcon } from 'lucide-react'; +import { useFeatureFlags } from '@documenso/lib/client-only/providers/feature-flag'; import type { GetTeamsResponse } from '@documenso/lib/server-only/team/get-teams'; import { getRootHref } from '@documenso/lib/utils/params'; import type { User } from '@documenso/prisma/client'; @@ -18,6 +19,7 @@ import { CommandMenu } from '../common/command-menu'; import { DesktopNav } from './desktop-nav'; import { MenuSwitcher } from './menu-switcher'; import { MobileNavigation } from './mobile-navigation'; +import { ProfileDropdown } from './profile-dropdown'; export type HeaderProps = HTMLAttributes & { user: User; @@ -27,6 +29,10 @@ export type HeaderProps = HTMLAttributes & { export const Header = ({ className, user, teams, ...props }: HeaderProps) => { const params = useParams(); + const { getFlag } = useFeatureFlags(); + + const isTeamsEnabled = getFlag('app_teams'); + const [isCommandMenuOpen, setIsCommandMenuOpen] = useState(false); const [isHamburgerMenuOpen, setIsHamburgerMenuOpen] = useState(false); const [scrollY, setScrollY] = useState(0); @@ -41,6 +47,34 @@ export const Header = ({ className, user, teams, ...props }: HeaderProps) => { return () => window.removeEventListener('scroll', onScroll); }, []); + if (!isTeamsEnabled) { + return ( +
5 && 'border-b-border', + className, + )} + {...props} + > +
+ + + + + + +
+ +
+
+
+ ); + } + return (
{
diff --git a/apps/web/src/components/(dashboard)/layout/menu-switcher.tsx b/apps/web/src/components/(dashboard)/layout/menu-switcher.tsx index 35a05baf2..195716d64 100644 --- a/apps/web/src/components/(dashboard)/layout/menu-switcher.tsx +++ b/apps/web/src/components/(dashboard)/layout/menu-switcher.tsx @@ -6,7 +6,7 @@ import { usePathname } from 'next/navigation'; import { CheckCircle2, ChevronsUpDown, Plus, Settings2 } from 'lucide-react'; import { signOut } from 'next-auth/react'; -import { TEAM_MEMBER_ROLE_MAP } from '@documenso/lib/constants/teams'; +import { TEAM_MEMBER_ROLE_MAP, TEAM_URL_REGEX } from '@documenso/lib/constants/teams'; import { isAdmin } from '@documenso/lib/next-auth/guards/is-admin'; import type { GetTeamsResponse } from '@documenso/lib/server-only/team/get-teams'; import { extractInitials } from '@documenso/lib/utils/recipient-formatter'; @@ -71,6 +71,22 @@ export const MenuSwitcher = ({ user, teams: initialTeamsData }: MenuSwitcherProp return TEAM_MEMBER_ROLE_MAP[team.currentTeamMember.role]; }; + /** + * Formats the redirect URL so we can switch between documents and templates page + * seemlessly between teams and personal accounts. + */ + const formatRedirectUrlOnSwitch = (teamUrl?: string) => { + const baseUrl = teamUrl ? `/t/${teamUrl}/` : '/'; + + const currentPathname = (pathname ?? '/').replace(TEAM_URL_REGEX, ''); + + if (currentPathname === '/templates') { + return `${baseUrl}templates`; + } + + return baseUrl; + }; + return ( @@ -100,7 +116,7 @@ export const MenuSwitcher = ({ user, teams: initialTeamsData }: MenuSwitcherProp Personal - + ( - + text !== 'Templates' || href === '/templates'); // Filter out templates for teams. + ]; return ( - + Documenso Logo { + const { getFlag } = useFeatureFlags(); + const { theme, setTheme } = useTheme(); + const isUserAdmin = isAdmin(user); + + const isBillingEnabled = getFlag('app_billing'); + + const avatarFallback = user.name + ? extractInitials(user.name) + : user.email.slice(0, 1).toUpperCase(); + + return ( + + + + + + + Account + + {isUserAdmin && ( + <> + + + + Admin + + + + + + )} + + + + + Profile + + + + + + + Security + + + + {isBillingEnabled && ( + + + + Billing + + + )} + + + + + + Templates + + + + + + + + Themes + + + + + + Light + + + + Dark + + + + System + + + + + + + + + + Star on Github + + + + + + + void signOut({ + callbackUrl: '/', + }) + } + > + + Sign Out + + + + ); +}; diff --git a/apps/web/src/components/(dashboard)/settings/layout/desktop-nav.tsx b/apps/web/src/components/(dashboard)/settings/layout/desktop-nav.tsx index c7ab61d8a..572c91c76 100644 --- a/apps/web/src/components/(dashboard)/settings/layout/desktop-nav.tsx +++ b/apps/web/src/components/(dashboard)/settings/layout/desktop-nav.tsx @@ -19,6 +19,7 @@ export const DesktopNav = ({ className, ...props }: DesktopNavProps) => { const { getFlag } = useFeatureFlags(); const isBillingEnabled = getFlag('app_billing'); + const isTeamsEnabled = getFlag('app_teams'); return (
@@ -35,18 +36,20 @@ export const DesktopNav = ({ className, ...props }: DesktopNavProps) => { - - - + {isTeamsEnabled && ( + + + + )} - - - + {isTeamsEnabled && ( + + + + )}
diff --git a/apps/web/src/components/forms/2fa/authenticator-app.tsx b/apps/web/src/components/forms/2fa/authenticator-app.tsx index 316272e34..3aa0e123e 100644 --- a/apps/web/src/components/forms/2fa/authenticator-app.tsx +++ b/apps/web/src/components/forms/2fa/authenticator-app.tsx @@ -30,13 +30,11 @@ export const AuthenticatorApp = ({ isTwoFactorEnabled }: AuthenticatorAppProps)
!open && setModalState(null)} /> !open && setModalState(null)} /> diff --git a/packages/app-tests/e2e/templates/manage-templates.spec.ts b/packages/app-tests/e2e/templates/manage-templates.spec.ts new file mode 100644 index 000000000..53edc705d --- /dev/null +++ b/packages/app-tests/e2e/templates/manage-templates.spec.ts @@ -0,0 +1,205 @@ +import { expect, test } from '@playwright/test'; + +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 { manualLogin } from '../fixtures/authentication'; + +test.describe.configure({ mode: 'parallel' }); + +test('[TEMPLATES]: view templates', async ({ page }) => { + const team = await seedTeam({ + createTeamMembers: 1, + }); + + const owner = team.owner; + const teamMemberUser = team.members[1].user; + + // Should only be visible to the owner in personal templates. + await seedTemplate({ + title: 'Personal template', + userId: owner.id, + }); + + // Should be visible to team members. + await seedTemplate({ + title: 'Team template 1', + userId: owner.id, + teamId: team.id, + }); + + // Should be visible to team members. + await seedTemplate({ + title: 'Team template 2', + userId: teamMemberUser.id, + teamId: team.id, + }); + + await manualLogin({ + page, + email: owner.email, + redirectPath: '/templates', + }); + + // Owner should see both team templates. + await page.goto(`${WEBAPP_BASE_URL}/t/${team.url}/templates`); + await expect(page.getByRole('main')).toContainText('Showing 2 results'); + + // Only should only see their personal template. + await page.goto(`${WEBAPP_BASE_URL}/templates`); + await expect(page.getByRole('main')).toContainText('Showing 1 result'); + + await unseedTeam(team.url); +}); + +test('[TEMPLATES]: delete template', async ({ page }) => { + const team = await seedTeam({ + createTeamMembers: 1, + }); + + const owner = team.owner; + const teamMemberUser = team.members[1].user; + + // Should only be visible to the owner in personal templates. + await seedTemplate({ + title: 'Personal template', + userId: owner.id, + }); + + // Should be visible to team members. + await seedTemplate({ + title: 'Team template 1', + userId: owner.id, + teamId: team.id, + }); + + // Should be visible to team members. + await seedTemplate({ + title: 'Team template 2', + userId: teamMemberUser.id, + teamId: team.id, + }); + + await manualLogin({ + page, + email: owner.email, + redirectPath: '/templates', + }); + + // Owner should be able to delete their personal template. + await page.getByRole('cell', { name: 'Use Template' }).getByRole('button').nth(1).click(); + await page.getByRole('menuitem', { name: 'Delete' }).click(); + await page.getByRole('button', { name: 'Delete' }).click(); + await expect(page.getByText('Template deleted').first()).toBeVisible(); + + // Team member should be able to delete all templates. + await page.goto(`${WEBAPP_BASE_URL}/t/${team.url}/templates`); + + for (const template of ['Team template 1', 'Team template 2']) { + await page + .getByRole('row', { name: template }) + .getByRole('cell', { name: 'Use Template' }) + .getByRole('button') + .nth(1) + .click(); + + await page.getByRole('menuitem', { name: 'Delete' }).click(); + await page.getByRole('button', { name: 'Delete' }).click(); + await expect(page.getByText('Template deleted').first()).toBeVisible(); + } + + await unseedTeam(team.url); +}); + +test('[TEMPLATES]: duplicate template', async ({ page }) => { + const team = await seedTeam({ + createTeamMembers: 1, + }); + + const owner = team.owner; + const teamMemberUser = team.members[1].user; + + // Should only be visible to the owner in personal templates. + await seedTemplate({ + title: 'Personal template', + userId: owner.id, + }); + + // Should be visible to team members. + await seedTemplate({ + title: 'Team template 1', + userId: teamMemberUser.id, + teamId: team.id, + }); + + await manualLogin({ + page, + email: owner.email, + redirectPath: '/templates', + }); + + // Duplicate personal template. + await page.getByRole('cell', { name: 'Use Template' }).getByRole('button').nth(1).click(); + await page.getByRole('menuitem', { name: 'Duplicate' }).click(); + await page.getByRole('button', { name: 'Duplicate' }).click(); + await expect(page.getByText('Template duplicated').first()).toBeVisible(); + await expect(page.getByRole('main')).toContainText('Showing 2 results'); + + await page.goto(`${WEBAPP_BASE_URL}/t/${team.url}/templates`); + + // Duplicate team template. + await page.getByRole('cell', { name: 'Use Template' }).getByRole('button').nth(1).click(); + await page.getByRole('menuitem', { name: 'Duplicate' }).click(); + await page.getByRole('button', { name: 'Duplicate' }).click(); + await expect(page.getByText('Template duplicated').first()).toBeVisible(); + await expect(page.getByRole('main')).toContainText('Showing 2 results'); + + await unseedTeam(team.url); +}); + +test('[TEMPLATES]: use template', async ({ page }) => { + const team = await seedTeam({ + createTeamMembers: 1, + }); + + const owner = team.owner; + const teamMemberUser = team.members[1].user; + + // Should only be visible to the owner in personal templates. + await seedTemplate({ + title: 'Personal template', + userId: owner.id, + }); + + // Should be visible to team members. + await seedTemplate({ + title: 'Team template 1', + userId: teamMemberUser.id, + teamId: team.id, + }); + + await manualLogin({ + page, + email: owner.email, + redirectPath: '/templates', + }); + + // Use personal template. + await page.getByRole('button', { name: 'Use Template' }).click(); + await page.waitForURL(/documents/); + await page.getByRole('main').getByRole('link', { name: 'Documents' }).click(); + await page.waitForURL('/documents'); + await expect(page.getByRole('main')).toContainText('Showing 1 result'); + + await page.goto(`${WEBAPP_BASE_URL}/t/${team.url}/templates`); + + // Use team template. + await page.getByRole('button', { name: 'Use Template' }).click(); + await page.waitForURL(/\/t\/.+\/documents/); + await page.getByRole('main').getByRole('link', { name: 'Documents' }).click(); + await page.waitForURL(`/t/${team.url}/documents`); + await expect(page.getByRole('main')).toContainText('Showing 1 result'); + + await unseedTeam(team.url); +}); diff --git a/packages/lib/constants/feature-flags.ts b/packages/lib/constants/feature-flags.ts index e972b47c2..947409be1 100644 --- a/packages/lib/constants/feature-flags.ts +++ b/packages/lib/constants/feature-flags.ts @@ -17,6 +17,7 @@ export const FEATURE_FLAG_POLL_INTERVAL = 30000; */ export const LOCAL_FEATURE_FLAGS: Record = { app_billing: process.env.NEXT_PUBLIC_FEATURE_BILLING_ENABLED === 'true', + app_teams: true, marketing_header_single_player_mode: false, } as const; diff --git a/packages/lib/constants/teams.ts b/packages/lib/constants/teams.ts index 47705bb14..67f3ef16f 100644 --- a/packages/lib/constants/teams.ts +++ b/packages/lib/constants/teams.ts @@ -1,6 +1,7 @@ import { TeamMemberRole } from '@documenso/prisma/client'; export const TEAM_URL_ROOT_REGEX = new RegExp('^/t/[^/]+$'); +export const TEAM_URL_REGEX = new RegExp('^/t/[^/]+'); export const TEAM_MEMBER_ROLE_MAP: Record = { ADMIN: 'Admin', diff --git a/packages/lib/server-only/field/get-fields-for-template.ts b/packages/lib/server-only/field/get-fields-for-template.ts index c174d7eff..724ec75fb 100644 --- a/packages/lib/server-only/field/get-fields-for-template.ts +++ b/packages/lib/server-only/field/get-fields-for-template.ts @@ -10,7 +10,20 @@ export const getFieldsForTemplate = async ({ templateId, userId }: GetFieldsForT where: { templateId, Template: { - userId, + OR: [ + { + userId, + }, + { + team: { + members: { + some: { + userId, + }, + }, + }, + }, + ], }, }, orderBy: { diff --git a/packages/lib/server-only/field/set-fields-for-document.ts b/packages/lib/server-only/field/set-fields-for-document.ts index 2ba592f31..ecb45d461 100644 --- a/packages/lib/server-only/field/set-fields-for-document.ts +++ b/packages/lib/server-only/field/set-fields-for-document.ts @@ -56,11 +56,7 @@ export const setFieldsForDocument = async ({ }); const removedFields = existingFields.filter( - (existingField) => - !fields.find( - (field) => - field.id === existingField.id || field.signerEmail === existingField.Recipient?.email, - ), + (existingField) => !fields.find((field) => field.id === existingField.id), ); const linkedFields = fields diff --git a/packages/lib/server-only/field/set-fields-for-template.ts b/packages/lib/server-only/field/set-fields-for-template.ts index 9431666bf..2062e06bc 100644 --- a/packages/lib/server-only/field/set-fields-for-template.ts +++ b/packages/lib/server-only/field/set-fields-for-template.ts @@ -27,7 +27,20 @@ export const setFieldsForTemplate = async ({ const template = await prisma.template.findFirst({ where: { id: templateId, - userId, + OR: [ + { + userId, + }, + { + team: { + members: { + some: { + userId, + }, + }, + }, + }, + ], }, }); diff --git a/packages/lib/server-only/recipient/get-recipients-for-template.ts b/packages/lib/server-only/recipient/get-recipients-for-template.ts index ab6f860eb..4b393353d 100644 --- a/packages/lib/server-only/recipient/get-recipients-for-template.ts +++ b/packages/lib/server-only/recipient/get-recipients-for-template.ts @@ -13,7 +13,20 @@ export const getRecipientsForTemplate = async ({ where: { templateId, Template: { - userId, + OR: [ + { + userId, + }, + { + team: { + members: { + some: { + userId, + }, + }, + }, + }, + ], }, }, orderBy: { diff --git a/packages/lib/server-only/recipient/set-recipients-for-template.ts b/packages/lib/server-only/recipient/set-recipients-for-template.ts index c21c8cbf9..7c96bcf44 100644 --- a/packages/lib/server-only/recipient/set-recipients-for-template.ts +++ b/packages/lib/server-only/recipient/set-recipients-for-template.ts @@ -20,7 +20,20 @@ export const setRecipientsForTemplate = async ({ const template = await prisma.template.findFirst({ where: { id: templateId, - userId, + OR: [ + { + userId, + }, + { + team: { + members: { + some: { + userId, + }, + }, + }, + }, + ], }, }); diff --git a/packages/lib/server-only/template/create-document-from-template.ts b/packages/lib/server-only/template/create-document-from-template.ts index 1c23d8f85..c520d4ce1 100644 --- a/packages/lib/server-only/template/create-document-from-template.ts +++ b/packages/lib/server-only/template/create-document-from-template.ts @@ -11,7 +11,23 @@ export const createDocumentFromTemplate = async ({ userId, }: CreateDocumentFromTemplateOptions) => { const template = await prisma.template.findUnique({ - where: { id: templateId, userId }, + where: { + id: templateId, + OR: [ + { + userId, + }, + { + team: { + members: { + some: { + userId, + }, + }, + }, + }, + ], + }, include: { Recipient: true, Field: true, @@ -34,6 +50,7 @@ export const createDocumentFromTemplate = async ({ const document = await prisma.document.create({ data: { userId, + teamId: template.teamId, title: template.title, documentDataId: documentData.id, Recipient: { diff --git a/packages/lib/server-only/template/create-template.ts b/packages/lib/server-only/template/create-template.ts index d00526a64..e51d69485 100644 --- a/packages/lib/server-only/template/create-template.ts +++ b/packages/lib/server-only/template/create-template.ts @@ -1,20 +1,36 @@ import { prisma } from '@documenso/prisma'; -import { TCreateTemplateMutationSchema } from '@documenso/trpc/server/template-router/schema'; +import type { TCreateTemplateMutationSchema } from '@documenso/trpc/server/template-router/schema'; export type CreateTemplateOptions = TCreateTemplateMutationSchema & { userId: number; + teamId?: number; }; export const createTemplate = async ({ title, userId, + teamId, templateDocumentDataId, }: CreateTemplateOptions) => { + if (teamId) { + await prisma.team.findFirstOrThrow({ + where: { + id: teamId, + members: { + some: { + userId, + }, + }, + }, + }); + } + return await prisma.template.create({ data: { title, userId, templateDocumentDataId, + teamId, }, }); }; diff --git a/packages/lib/server-only/template/delete-template.ts b/packages/lib/server-only/template/delete-template.ts index f693bcec0..c24cc1333 100644 --- a/packages/lib/server-only/template/delete-template.ts +++ b/packages/lib/server-only/template/delete-template.ts @@ -8,5 +8,23 @@ export type DeleteTemplateOptions = { }; export const deleteTemplate = async ({ id, userId }: DeleteTemplateOptions) => { - return await prisma.template.delete({ where: { id, userId } }); + return await prisma.template.delete({ + where: { + id, + OR: [ + { + userId, + }, + { + team: { + members: { + some: { + userId, + }, + }, + }, + }, + ], + }, + }); }; diff --git a/packages/lib/server-only/template/duplicate-template.ts b/packages/lib/server-only/template/duplicate-template.ts index 6078a1945..97b3f0a0b 100644 --- a/packages/lib/server-only/template/duplicate-template.ts +++ b/packages/lib/server-only/template/duplicate-template.ts @@ -1,14 +1,39 @@ import { nanoid } from '@documenso/lib/universal/id'; import { prisma } from '@documenso/prisma'; +import type { Prisma } from '@documenso/prisma/client'; import type { TDuplicateTemplateMutationSchema } from '@documenso/trpc/server/template-router/schema'; export type DuplicateTemplateOptions = TDuplicateTemplateMutationSchema & { userId: number; }; -export const duplicateTemplate = async ({ templateId, userId }: DuplicateTemplateOptions) => { +export const duplicateTemplate = async ({ + templateId, + userId, + teamId, +}: DuplicateTemplateOptions) => { + let templateWhereFilter: Prisma.TemplateWhereUniqueInput = { + id: templateId, + userId, + teamId: null, + }; + + if (teamId !== undefined) { + templateWhereFilter = { + id: templateId, + teamId, + team: { + members: { + some: { + userId, + }, + }, + }, + }; + } + const template = await prisma.template.findUnique({ - where: { id: templateId, userId }, + where: templateWhereFilter, include: { Recipient: true, Field: true, @@ -31,6 +56,7 @@ export const duplicateTemplate = async ({ templateId, userId }: DuplicateTemplat const duplicatedTemplate = await prisma.template.create({ data: { userId, + teamId, title: template.title + ' (copy)', templateDocumentDataId: documentData.id, Recipient: { diff --git a/packages/lib/server-only/template/find-templates.ts b/packages/lib/server-only/template/find-templates.ts new file mode 100644 index 000000000..d453d28a0 --- /dev/null +++ b/packages/lib/server-only/template/find-templates.ts @@ -0,0 +1,56 @@ +import { prisma } from '@documenso/prisma'; +import type { Prisma } from '@documenso/prisma/client'; + +export type FindTemplatesOptions = { + userId: number; + teamId?: number; + page: number; + perPage: number; +}; + +export const findTemplates = async ({ + userId, + teamId, + page = 1, + perPage = 10, +}: FindTemplatesOptions) => { + let whereFilter: Prisma.TemplateWhereInput = { + userId, + teamId: null, + }; + + if (teamId !== undefined) { + whereFilter = { + team: { + id: teamId, + members: { + some: { + userId, + }, + }, + }, + }; + } + + const [templates, count] = await Promise.all([ + prisma.template.findMany({ + where: whereFilter, + include: { + templateDocumentData: true, + Field: true, + }, + skip: Math.max(page - 1, 0) * perPage, + orderBy: { + createdAt: 'desc', + }, + }), + prisma.template.count({ + where: whereFilter, + }), + ]); + + return { + templates, + totalPages: Math.ceil(count / perPage), + }; +}; diff --git a/packages/lib/server-only/template/get-template-by-id.ts b/packages/lib/server-only/template/get-template-by-id.ts index 56f959a9b..c4295c3c3 100644 --- a/packages/lib/server-only/template/get-template-by-id.ts +++ b/packages/lib/server-only/template/get-template-by-id.ts @@ -1,4 +1,5 @@ import { prisma } from '@documenso/prisma'; +import type { Prisma } from '@documenso/prisma/client'; export interface GetTemplateByIdOptions { id: number; @@ -6,11 +7,26 @@ export interface GetTemplateByIdOptions { } export const getTemplateById = async ({ id, userId }: GetTemplateByIdOptions) => { + const whereFilter: Prisma.TemplateWhereInput = { + id, + OR: [ + { + userId, + }, + { + team: { + members: { + some: { + userId, + }, + }, + }, + }, + ], + }; + return await prisma.template.findFirstOrThrow({ - where: { - id, - userId, - }, + where: whereFilter, include: { templateDocumentData: true, }, diff --git a/packages/lib/server-only/template/get-templates.ts b/packages/lib/server-only/template/get-templates.ts deleted file mode 100644 index 5f802d278..000000000 --- a/packages/lib/server-only/template/get-templates.ts +++ /dev/null @@ -1,35 +0,0 @@ -import { prisma } from '@documenso/prisma'; - -export type GetTemplatesOptions = { - userId: number; - page: number; - perPage: number; -}; - -export const getTemplates = async ({ userId, page = 1, perPage = 10 }: GetTemplatesOptions) => { - const [templates, count] = await Promise.all([ - prisma.template.findMany({ - where: { - userId, - }, - include: { - templateDocumentData: true, - Field: true, - }, - skip: Math.max(page - 1, 0) * perPage, - orderBy: { - createdAt: 'desc', - }, - }), - prisma.template.count({ - where: { - userId, - }, - }), - ]); - - return { - templates, - totalPages: Math.ceil(count / perPage), - }; -}; diff --git a/packages/lib/utils/teams.ts b/packages/lib/utils/teams.ts index eb9be2c2b..c6dfd27fd 100644 --- a/packages/lib/utils/teams.ts +++ b/packages/lib/utils/teams.ts @@ -12,6 +12,10 @@ export const formatDocumentsPath = (teamUrl?: string) => { return teamUrl ? `/t/${teamUrl}/documents` : '/documents'; }; +export const formatTemplatesPath = (teamUrl?: string) => { + return teamUrl ? `/t/${teamUrl}/templates` : '/templates'; +}; + /** * Determines whether a team member can execute a given action. * diff --git a/packages/prisma/migrations/20240206051948_add_teams_templates/migration.sql b/packages/prisma/migrations/20240206051948_add_teams_templates/migration.sql new file mode 100644 index 000000000..3a79168bf --- /dev/null +++ b/packages/prisma/migrations/20240206051948_add_teams_templates/migration.sql @@ -0,0 +1,5 @@ +-- AlterTable +ALTER TABLE "Template" ADD COLUMN "teamId" INTEGER; + +-- AddForeignKey +ALTER TABLE "Template" ADD CONSTRAINT "Template_teamId_fkey" FOREIGN KEY ("teamId") REFERENCES "Team"("id") ON DELETE CASCADE ON UPDATE CASCADE; diff --git a/packages/prisma/schema.prisma b/packages/prisma/schema.prisma index e7de03ec7..ff2d12319 100644 --- a/packages/prisma/schema.prisma +++ b/packages/prisma/schema.prisma @@ -335,7 +335,8 @@ model Team { owner User @relation(fields: [ownerUserId], references: [id]) subscription Subscription? - document Document[] + document Document[] + templates Template[] } model TeamPending { @@ -416,10 +417,12 @@ model Template { type TemplateType @default(PRIVATE) title String userId Int + teamId Int? templateDocumentDataId String createdAt DateTime @default(now()) updatedAt DateTime @default(now()) @updatedAt + team Team? @relation(fields: [teamId], references: [id], onDelete: Cascade) templateDocumentData DocumentData @relation(fields: [templateDocumentDataId], references: [id], onDelete: Cascade) User User @relation(fields: [userId], references: [id], onDelete: Cascade) Recipient Recipient[] diff --git a/packages/prisma/seed/templates.ts b/packages/prisma/seed/templates.ts new file mode 100644 index 000000000..7f1b2f8e9 --- /dev/null +++ b/packages/prisma/seed/templates.ts @@ -0,0 +1,36 @@ +import fs from 'node:fs'; +import path from 'node:path'; + +import { prisma } from '..'; +import { DocumentDataType } from '../client'; + +const examplePdf = fs + .readFileSync(path.join(__dirname, '../../../assets/example.pdf')) + .toString('base64'); + +type SeedTemplateOptions = { + title?: string; + userId: number; + teamId?: number; +}; + +export const seedTemplate = async (options: SeedTemplateOptions) => { + const { title = 'Untitled', userId, teamId } = options; + + const documentData = await prisma.documentData.create({ + data: { + type: DocumentDataType.BYTES_64, + data: examplePdf, + initialData: examplePdf, + }, + }); + + return await prisma.template.create({ + data: { + title, + templateDocumentDataId: documentData.id, + userId: userId, + teamId, + }, + }); +}; diff --git a/packages/trpc/server/field-router/router.ts b/packages/trpc/server/field-router/router.ts index 07cdcd347..5ae3cbe4b 100644 --- a/packages/trpc/server/field-router/router.ts +++ b/packages/trpc/server/field-router/router.ts @@ -39,7 +39,7 @@ export const fieldRouter = router({ throw new TRPCError({ code: 'BAD_REQUEST', - message: 'We were unable to sign this field. Please try again later.', + message: 'We were unable to set this field. Please try again later.', }); } }), diff --git a/packages/trpc/server/recipient-router/router.ts b/packages/trpc/server/recipient-router/router.ts index 1ada3d0d3..9553a8aae 100644 --- a/packages/trpc/server/recipient-router/router.ts +++ b/packages/trpc/server/recipient-router/router.ts @@ -33,7 +33,7 @@ export const recipientRouter = router({ throw new TRPCError({ code: 'BAD_REQUEST', - message: 'We were unable to sign this field. Please try again later.', + message: 'We were unable to set this field. Please try again later.', }); } }), @@ -58,7 +58,7 @@ export const recipientRouter = router({ throw new TRPCError({ code: 'BAD_REQUEST', - message: 'We were unable to sign this field. Please try again later.', + message: 'We were unable to set this field. Please try again later.', }); } }), diff --git a/packages/trpc/server/template-router/router.ts b/packages/trpc/server/template-router/router.ts index 28e919e92..7417e7d00 100644 --- a/packages/trpc/server/template-router/router.ts +++ b/packages/trpc/server/template-router/router.ts @@ -19,11 +19,12 @@ export const templateRouter = router({ .input(ZCreateTemplateMutationSchema) .mutation(async ({ input, ctx }) => { try { - const { title, templateDocumentDataId } = input; + const { teamId, title, templateDocumentDataId } = input; return await createTemplate({ - title, userId: ctx.user.id, + teamId, + title, templateDocumentDataId, }); } catch (err) { @@ -64,11 +65,12 @@ export const templateRouter = router({ .input(ZDuplicateTemplateMutationSchema) .mutation(async ({ input, ctx }) => { try { - const { templateId } = input; + const { teamId, templateId } = input; return await duplicateTemplate({ - templateId, userId: ctx.user.id, + teamId, + templateId, }); } catch (err) { console.error(err); @@ -88,7 +90,7 @@ export const templateRouter = router({ const userId = ctx.user.id; - return await deleteTemplate({ id, userId }); + return await deleteTemplate({ userId, id }); } catch (err) { console.error(err); diff --git a/packages/trpc/server/template-router/schema.ts b/packages/trpc/server/template-router/schema.ts index bc7161f74..3d87d4b4f 100644 --- a/packages/trpc/server/template-router/schema.ts +++ b/packages/trpc/server/template-router/schema.ts @@ -1,7 +1,8 @@ import { z } from 'zod'; export const ZCreateTemplateMutationSchema = z.object({ - title: z.string().min(1), + title: z.string().min(1).trim(), + teamId: z.number().optional(), templateDocumentDataId: z.string().min(1), }); @@ -11,6 +12,7 @@ export const ZCreateDocumentFromTemplateMutationSchema = z.object({ export const ZDuplicateTemplateMutationSchema = z.object({ templateId: z.number(), + teamId: z.number().optional(), }); export const ZDeleteTemplateMutationSchema = z.object({ diff --git a/packages/ui/primitives/document-flow/add-title.tsx b/packages/ui/primitives/document-flow/add-title.tsx index 730c4248f..a6390fd3a 100644 --- a/packages/ui/primitives/document-flow/add-title.tsx +++ b/packages/ui/primitives/document-flow/add-title.tsx @@ -1,5 +1,6 @@ 'use client'; +import { zodResolver } from '@hookform/resolvers/zod'; import { useForm } from 'react-hook-form'; import type { Field, Recipient } from '@documenso/prisma/client'; @@ -10,6 +11,7 @@ import { Input } from '../input'; import { Label } from '../label'; import { useStep } from '../stepper'; import type { TAddTitleFormSchema } from './add-title.types'; +import { ZAddTitleFormSchema } from './add-title.types'; import { DocumentFlowFormContainerActions, DocumentFlowFormContainerContent, @@ -40,6 +42,7 @@ export const AddTitleFormPartial = ({ handleSubmit, formState: { errors, isSubmitting }, } = useForm({ + resolver: zodResolver(ZAddTitleFormSchema), defaultValues: { title: document.title, }, @@ -71,7 +74,7 @@ export const AddTitleFormPartial = ({ id="title" className="bg-background my-2" disabled={isSubmitting} - {...register('title', { required: "Title can't be empty" })} + {...register('title')} /> diff --git a/packages/ui/primitives/document-flow/add-title.types.ts b/packages/ui/primitives/document-flow/add-title.types.ts index aaa8c17e4..b910c060a 100644 --- a/packages/ui/primitives/document-flow/add-title.types.ts +++ b/packages/ui/primitives/document-flow/add-title.types.ts @@ -1,7 +1,7 @@ import { z } from 'zod'; export const ZAddTitleFormSchema = z.object({ - title: z.string().min(1), + title: z.string().trim().min(1, { message: "Title can't be empty" }), }); export type TAddTitleFormSchema = z.infer; diff --git a/packages/ui/primitives/sheet.tsx b/packages/ui/primitives/sheet.tsx index e9f1b4401..a6326de0f 100644 --- a/packages/ui/primitives/sheet.tsx +++ b/packages/ui/primitives/sheet.tsx @@ -3,7 +3,8 @@ import * as React from 'react'; import * as SheetPrimitive from '@radix-ui/react-dialog'; -import { VariantProps, cva } from 'class-variance-authority'; +import type { VariantProps } from 'class-variance-authority'; +import { cva } from 'class-variance-authority'; import { X } from 'lucide-react'; import { cn } from '../lib/utils'; @@ -12,7 +13,7 @@ const Sheet = SheetPrimitive.Root; const SheetTrigger = SheetPrimitive.Trigger; -const portalVariants = cva('fixed inset-0 z-50 flex', { +const portalVariants = cva('fixed inset-0 z-[61] flex', { variants: { position: { top: 'items-start', @@ -42,7 +43,7 @@ const SheetOverlay = React.forwardRef< >(({ className, children: _children, ...props }, ref) => (