Enhance metadata handling across contact, newsletter, and work pages

- Introduced a consistent metadata structure using the META constant and createMetadata utility for improved SEO and clarity.
- Updated page titles and descriptions for the contact, newsletter, and work pages to better reflect their content and enhance user engagement.
- Added Open Graph and Twitter metadata for better social media integration and sharing capabilities.

Author: sarimrmalik

src/app/(rest)/contact/page.tsx

@@ -1,5 +1,23 @@
+import { META } from '~/lib/constants/metadata'
+import { createMetadata } from '~/lib/utils/create-metadata'
 import { ContactForm } from './contact-form'
 
+const title = `Contact | ${META.title}`
+const description = `Get in touch to discuss AI product strategy, implementation, and collaboration. ${META.description}`
+
+export const metadata = createMetadata({
+	description,
+	openGraph: {
+		description,
+		title
+	},
+	title,
+	twitter: {
+		description,
+		title
+	}
+})
+
 export default function Page() {
 	return (
 		<div className="flex min-h-screen max-w-full flex-col items-center justify-center gap-16 p-4 py-32">

src/app/(rest)/newsletter/page.tsx

@@ -1,7 +1,25 @@
 import { NewsletterForm } from '~/app/(rest)/newsletter/newsletter-form'
+import { META } from '~/lib/constants/metadata'
+import { createMetadata } from '~/lib/utils/create-metadata'
 import { getNewsletterMetadata } from '~/lib/utils/newsletters'
 import { NewsletterList } from './newsletter-list'
 
+const title = `The Grid | ${META.title}`
+const description = `The Grid is a newsletter by Rubric Labs with three actionable insights on building, shipping, and scaling intelligent products. ${META.description}`
+
+export const metadata = createMetadata({
+	description,
+	openGraph: {
+		description,
+		title
+	},
+	title,
+	twitter: {
+		description,
+		title
+	}
+})
+
 export default async function Page() {
 	const newsletters = await getNewsletterMetadata()
 

src/app/(rest)/work/page.tsx

@@ -1,6 +1,24 @@
+import { META } from '~/lib/constants/metadata'
+import { createMetadata } from '~/lib/utils/create-metadata'
 import { CTA } from '~/ui/cta'
 import { WorkTable } from '~/ui/work-table'
 
+const title = `Work | ${META.title}`
+const description = `Client projects, case studies, and technical writing from the Rubric Labs team. ${META.description}`
+
+export const metadata = createMetadata({
+	description,
+	openGraph: {
+		description,
+		title
+	},
+	title,
+	twitter: {
+		description,
+		title
+	}
+})
+
 export default function Page() {
 	return (
 		<div className="flex flex-col items-center p-4 py-32">

src/lib/constants/metadata.ts

@@ -16,13 +16,15 @@ const META: AppMetadata = {
 	description: 'Rubric is an applied AI lab helping companies build intelligent applications.',
 	openGraph: {
 		description: 'Rubric is an applied AI lab helping companies build intelligent applications.',
+		images: [{ alt: 'Rubric Labs', url: '/opengraph-image' }],
 		title: 'Rubric Labs'
 	},
 	title: 'Rubric Labs',
 	twitter: {
 		card: 'summary_large_image',
 		creator: '@rubriclabs',
 		description: 'Rubric is an applied AI lab helping companies build intelligent applications.',
+		images: [{ alt: 'Rubric Labs', url: '/twitter-image' }],
 		title: 'Rubric Labs'
 	}
 }