Update SEO Data Structure

[pphatdev]

This pull request includes changes to improve code organization, enhance the UI for the contact page, and simplify structured data handling. The most important updates involve fixing import paths for shared constants, improving the contact form's design, and removing unnecessary use client directives from structured data components.

Code Organization:

• Updated import paths for shared constants in multiple files to use relative paths instead of aliases for better consistency and maintainability. (src/app/api/contact/route.ts [1] src/app/contact/metadata.ts [2] src/lib/meta/posts.ts [3] src/lib/utils/og-image.ts [4] src/scripts/test-structured-data.ts [5]

Contact Page Enhancements:

• Improved the contact form's UI by introducing rounded corners, transparent backgrounds, and better error state handling using the cn utility function. (src/app/contact/page.tsx [1] [2] [3] [4]
• Adjusted the appearance of the "Message Sent!" confirmation section, including spacing, font sizes, and shadow effects for a more polished look. (src/app/contact/page.tsx src/app/contact/page.tsxL150-R164)

Structured Data Simplification:

• Removed unnecessary use client directives from structured data components to streamline the codebase. (src/components/about-structured-data.tsx [1] src/components/breadcrumb-structured-data.tsx [2] src/components/home-person-structured-data.tsx [3] src/components/projects-structured-data.tsx [4] src/components/website-structured-data.tsx [5]
• Enhanced JSON serialization for structured data by adding indentation for better readability. (src/components/home-person-structured-data.tsx src/components/home-person-structured-data.tsxL98-R96)

Funding File Update:

• Updated the GitHub username in the .github/FUNDING.yml file to reflect the new owner. (.github/FUNDING.yml .github/FUNDING.ymlL3-R3)

[Copilot]

Pull Request Overview

This PR standardizes import paths, enhances the contact page UI, and cleans up structured data components.

• Switches shared-constant imports from alias to relative paths in key modules.
• Refines contact form styling, spacing, and error-state handling with the cn utility.
• Removes redundant use client directives and pretty-prints structured data JSON.

Reviewed Changes

Copilot reviewed 12 out of 12 changed files in this pull request and generated 4 comments.

Show a summary per file

File	Description
src/scripts/test-structured-data.ts	Updated import-path check in the structured-data test
src/lib/utils/og-image.ts	Changed import from alias to relative path
src/lib/meta/posts.ts	Changed import from alias to relative path
src/components/*.tsx	Removed use client directives in all structured-data components
src/components/home-person-structured-data.tsx	Switched JSON parsing to JSON.stringify(..., null, 2)
src/app/contact/page.tsx	Added cn to form fields, adjusted styling and layout
src/app/contact/metadata.ts	Changed import from alias to relative path
src/app/api/contact/route.ts	Changed import from alias to relative path
.github/FUNDING.yml	Updated GitHub sponsorship username

Comments suppressed due to low confidence (2)

src/app/contact/page.tsx:159

• The size-20 utility isn't a default Tailwind class. If using Tailwind, replace it with standard width/height classes (e.g., w-16 h-16) or confirm that size-20 is defined.

<div className="inline-flex items-center justify-center size-20 bg-primary/10 rounded-full text-primary mb-4">

src/app/contact/page.tsx:160

• The size-8 class isn't recognized by default in Tailwind. Use w-8 h-8 or the appropriate utility classes to ensure consistent SVG sizing.

<svg className="size-8" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">

[Copilot]

The test only checks for '../lib/constants' but many imports now use deeper paths (e.g., '../../lib/constants'). Consider matching both '../lib/constants' and '../../lib/constants' to avoid false negatives.

Suggested change

	if (content.includes('from "../lib/constants"') || content.includes('from \'../lib/constants\'')) {
	if (content.includes('from "../lib/constants"') || content.includes('from \'../lib/constants\'') ||
	content.includes('from "../../lib/constants"') || content.includes('from \'../../lib/constants\'')) {

[Copilot]

The email input's error styling condition uses formErrors.name instead of formErrors.email, so it won't highlight email errors correctly. Update the condition to check formErrors.email.

Suggested change

	className={cn(formErrors.name ? "border-destructive ring-primary" : "", "rounded-xl bg-transparent")}
	className={cn(formErrors.email ? "border-destructive ring-primary" : "", "rounded-xl bg-transparent")}

[Copilot]

The subject field's error styling condition is still checking formErrors.name instead of formErrors.subject. Change it to formErrors.subject to properly indicate errors.

Suggested change

	className={cn(formErrors.name ? "border-destructive ring-primary" : "", "rounded-xl bg-transparent")}
	className={cn(formErrors.subject ? "border-destructive ring-primary" : "", "rounded-xl bg-transparent")}

[Copilot]

The message textarea's error condition references formErrors.name instead of formErrors.message. It should check formErrors.message to display validation errors correctly.

Suggested change

	className={cn(formErrors.name ? "border-destructive ring-primary" : "", "rounded-xl bg-transparent")}
	className={cn(formErrors.message ? "border-destructive ring-primary" : "", "rounded-xl bg-transparent")}