chore: add title and description to individual pages (#847)

Add Title and Description to Individual Pages.
eg:- Security | Documenso, Profile | Documenso etc.

apps/web/src/app/(dashboard)/documents/page.tsx

@@ -1,3 +1,4 @@
+import type { Metadata } from 'next';
 import Link from 'next/link';
 
 import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
@@ -25,6 +26,9 @@ export type DocumentsPageProps = {
   };
 };
 
+export const metadata: Metadata = {
+  title: 'Documents',
+};
 export default async function DocumentsPage({ searchParams = {} }: DocumentsPageProps) {
   const { user } = await getRequiredServerComponentSession();
 

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

@@ -1,3 +1,4 @@
+import type { Metadata } from 'next';
 import { redirect } from 'next/navigation';
 
 import { match } from 'ts-pattern';
@@ -17,6 +18,10 @@ import { LocaleDate } from '~/components/formatter/locale-date';
 import { BillingPlans } from './billing-plans';
 import { BillingPortalButton } from './billing-portal-button';
 
+export const metadata: Metadata = {
+  title: 'Billing',
+};
+
 export default async function BillingSettingsPage() {
   let { user } = await getRequiredServerComponentSession();
 

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

@@ -1,7 +1,13 @@
+import type { Metadata } from 'next';
+
 import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
 
 import { ProfileForm } from '~/components/forms/profile';
 
+export const metadata: Metadata = {
+  title: 'Profile',
+};
+
 export default async function ProfileSettingsPage() {
   const { user } = await getRequiredServerComponentSession();
 

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

@@ -1,3 +1,5 @@
+import type { Metadata } from 'next';
+
 import { IDENTITY_PROVIDER_NAME } from '@documenso/lib/constants/auth';
 import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
 
@@ -5,6 +7,10 @@ import { AuthenticatorApp } from '~/components/forms/2fa/authenticator-app';
 import { RecoveryCodes } from '~/components/forms/2fa/recovery-codes';
 import { PasswordForm } from '~/components/forms/password';
 
+export const metadata: Metadata = {
+  title: 'Security',
+};
+
 export default async function SecuritySettingsPage() {
   const { user } = await getRequiredServerComponentSession();
 

apps/web/src/app/(dashboard)/templates/page.tsx

@@ -1,5 +1,7 @@
 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';
 
@@ -14,6 +16,10 @@ type TemplatesPageProps = {
   };
 };
 
+export const metadata: Metadata = {
+  title: 'Templates',
+};
+
 export default async function TemplatesPage({ searchParams = {} }: TemplatesPageProps) {
   const { user } = await getRequiredServerComponentSession();
   const page = Number(searchParams.page) || 1;

apps/web/src/app/(unauthenticated)/check-email/page.tsx

@@ -1,7 +1,12 @@
+import type { Metadata } from 'next';
 import Link from 'next/link';
 
 import { Button } from '@documenso/ui/primitives/button';
 
+export const metadata: Metadata = {
+  title: 'Forgot password',
+};
+
 export default function ForgotPasswordPage() {
   return (
     <div>

apps/web/src/app/(unauthenticated)/forgot-password/page.tsx

@@ -1,7 +1,12 @@
+import type { Metadata } from 'next';
 import Link from 'next/link';
 
 import { ForgotPasswordForm } from '~/components/forms/forgot-password';
 
+export const metadata: Metadata = {
+  title: 'Forgot Password',
+};
+
 export default function ForgotPasswordPage() {
   return (
     <div>

apps/web/src/app/(unauthenticated)/reset-password/page.tsx

@@ -1,7 +1,12 @@
+import type { Metadata } from 'next';
 import Link from 'next/link';
 
 import { Button } from '@documenso/ui/primitives/button';
 
+export const metadata: Metadata = {
+  title: 'Reset Password',
+};
+
 export default function ResetPasswordPage() {
   return (
     <div>

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

@@ -1,9 +1,14 @@
+import type { Metadata } from 'next';
 import Link from 'next/link';
 
 import { IS_GOOGLE_SSO_ENABLED } from '@documenso/lib/constants/auth';
 
 import { SignInForm } from '~/components/forms/signin';
 
+export const metadata: Metadata = {
+  title: 'Sign In',
+};
+
 export default function SignInPage() {
   return (
     <div>

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

@@ -1,3 +1,4 @@
+import type { Metadata } from 'next';
 import Link from 'next/link';
 import { redirect } from 'next/navigation';
 
@@ -5,6 +6,10 @@ import { IS_GOOGLE_SSO_ENABLED } from '@documenso/lib/constants/auth';
 
 import { SignUpForm } from '~/components/forms/signup';
 
+export const metadata: Metadata = {
+  title: 'Sign Up',
+};
+
 export default function SignUpPage() {
   if (process.env.NEXT_PUBLIC_DISABLE_SIGNUP === 'true') {
     redirect('/signin');

apps/web/src/app/(unauthenticated)/verify-email/page.tsx

@@ -1,9 +1,14 @@
+import type { Metadata } from 'next';
 import Link from 'next/link';
 
 import { XCircle } from 'lucide-react';
 
 import { Button } from '@documenso/ui/primitives/button';
 
+export const metadata: Metadata = {
+  title: 'Verify Email',
+};
+
 export default function EmailVerificationWithoutTokenPage() {
   return (
     <div className="flex w-full items-start">

apps/web/src/app/layout.tsx

@@ -20,7 +20,10 @@ const fontInter = Inter({ subsets: ['latin'], variable: '--font-sans' });
 const fontCaveat = Caveat({ subsets: ['latin'], variable: '--font-signature' });
 
 export const metadata = {
-  title: 'Documenso - The Open Source DocuSign Alternative',
+  title: {
+    template: '%s - Documenso',
+    default: 'Documenso',
+  },
   description:
     'Join Documenso, the open signing infrastructure, and get a 10x better signing experience. Pricing starts at $30/mo. forever! Sign in now and enjoy a faster, smarter, and more beautiful document signing process. Integrates with your favorite tools, customizable, and expandable. Support our mission and become a part of our open-source community.',
   keywords: