feat: Implement S3 presigned URL resolution for CMS images across pages and apply minor styling adjustments to the header and hero sections.

This commit is contained in:
pradeepkumar
2026-03-05 05:51:57 +05:30
parent 9152bb818b
commit 724ce6a735
6 changed files with 74 additions and 18 deletions

View File

@@ -5,7 +5,7 @@ import { HeroSection } from '@/components/home/HeroSection';
import { FeaturesSection } from '@/components/home/FeaturesSection';
import { TopProfessionals } from '@/components/home/TopProfessionals';
import { TestimonialsSection } from '@/components/home/TestimonialsSection';
import { cmsService } from '@/services/cms.service';
import { cmsService, resolveImageUrl } from '@/services/cms.service';
import type { HeroContent, FeaturesContent, TopProfessionalsContent, TestimonialsContent, CmsContentRecord } from '@/types/cms';
export default function UserDashboard() {
@@ -15,9 +15,21 @@ export default function UserDashboard() {
const fetchCms = async () => {
const sections = await cmsService.getPageContent('landing');
const data: Record<string, unknown> = {};
sections.forEach((s: CmsContentRecord) => {
data[s.sectionKey] = s.content;
});
for (const s of sections) {
const content = s.content as Record<string, unknown>;
// Resolve S3 keys in image fields
if (s.sectionKey === 'features' && Array.isArray(content.features)) {
for (const feat of content.features as { iconPath?: string }[]) {
if (feat.iconPath) feat.iconPath = await resolveImageUrl(feat.iconPath);
}
}
if (s.sectionKey === 'testimonials' && Array.isArray(content.stats)) {
for (const stat of content.stats as { iconPath?: string }[]) {
if (stat.iconPath) stat.iconPath = await resolveImageUrl(stat.iconPath);
}
}
data[s.sectionKey] = content;
}
setCmsData(data);
};
fetchCms();

View File

@@ -6,7 +6,7 @@ import Link from 'next/link';
import { useSession } from 'next-auth/react';
import { CommonHeader } from '@/components/layout/CommonHeader';
import { Footer } from '@/components/layout/Footer';
import { cmsService } from '@/services/cms.service';
import { cmsService, resolveImageUrl } from '@/services/cms.service';
import type {
AboutHeroContent,
AboutStatsContent,
@@ -93,28 +93,43 @@ export default function AboutPage() {
const [cta, setCta] = useState<AboutCtaContent>(defaultCta);
useEffect(() => {
cmsService.getPageContent('about').then((sections) => {
sections.forEach((s: CmsContentRecord) => {
cmsService.getPageContent('about').then(async (sections) => {
for (const s of sections) {
const c = s.content as Record<string, unknown>;
// Only apply CMS content if it has meaningful data; otherwise keep defaults
switch (s.sectionKey) {
case 'hero':
if (c.headline || c.description) setHero(c as unknown as AboutHeroContent);
if (c.headline || c.description) {
const heroData = c as unknown as AboutHeroContent;
heroData.bannerImageUrl = await resolveImageUrl(heroData.bannerImageUrl);
setHero(heroData);
}
break;
case 'stats':
if (Array.isArray(c.stats) && c.stats.length > 0) setStats(c as unknown as AboutStatsContent);
break;
case 'features':
if (c.badge || (Array.isArray(c.features) && c.features.length > 0)) setFeatures(c as unknown as AboutFeaturesContent);
if (c.badge || (Array.isArray(c.features) && c.features.length > 0)) {
const featData = c as unknown as AboutFeaturesContent;
for (const feat of featData.features) {
feat.iconPath = await resolveImageUrl(feat.iconPath);
}
setFeatures(featData);
}
break;
case 'team':
if (Array.isArray(c.members) && c.members.length > 0) setTeam(c as unknown as AboutTeamContent);
if (Array.isArray(c.members) && c.members.length > 0) {
const teamData = c as unknown as AboutTeamContent;
for (const member of teamData.members) {
member.imageUrl = await resolveImageUrl(member.imageUrl);
}
setTeam(teamData);
}
break;
case 'cta':
if (c.title || c.description) setCta(c as unknown as AboutCtaContent);
break;
}
});
}
});
}, []);

View File

@@ -4,7 +4,7 @@ import Image from 'next/image';
import { useState, useEffect } from 'react';
import { CommonHeader } from '@/components/layout/CommonHeader';
import { Footer } from '@/components/layout/Footer';
import { cmsService } from '@/services/cms.service';
import { cmsService, resolveImageUrl } from '@/services/cms.service';
import { FaqContent, FaqCategoryItem, FaqItem, CmsContentRecord } from '@/types/cms';
const defaultCategories: FaqCategoryItem[] = [
@@ -91,6 +91,12 @@ export default function FAQPage() {
setCategories(cmsCategories);
}
if (content.faqs && content.faqs.length > 0) {
// Resolve S3 keys for FAQ icons
for (const faq of content.faqs) {
if (faq.icon) {
faq.icon = await resolveImageUrl(faq.icon);
}
}
setFaqs(content.faqs);
setExpandedFaq(content.faqs[0]?.id ?? null);
}

View File

@@ -98,7 +98,7 @@ export function HeroSection({ content }: { content?: HeroContent }) {
};
return (
<section className="relative min-h-[600px] overflow-hidden">
<section className="relative min-h-[480px] overflow-hidden">
{/* Background Image */}
<div className="absolute inset-0">
<Image
@@ -110,7 +110,7 @@ export function HeroSection({ content }: { content?: HeroContent }) {
/>
</div>
<div className="relative max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 pt-28 pb-8 min-h-[600px] flex flex-col">
<div className="relative max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 pt-16 pb-8 min-h-[480px] flex flex-col">
{/* Headline */}
<div className="text-center mb-5">
<h1 className="font-fractul font-bold text-[24px] md:text-[28px] lg:text-[30px] leading-[50px] text-[#00293d] max-w-4xl mx-auto">
@@ -245,8 +245,8 @@ export function HeroSection({ content }: { content?: HeroContent }) {
</div>
{/* Bottom Section - pushed to bottom */}
<div className="mt-auto">
{/* Bottom Section */}
<div className="mt-8">
{/* See All Agents Button */}
<div className="flex justify-center">
<button

View File

@@ -150,7 +150,7 @@ export function CommonHeader() {
<Link
key={link.href}
href={link.href}
className="font-fractul font-bold text-[20px] leading-[24px] text-[#00293D] hover:text-[#e58625] transition-colors"
className="font-fractul font-bold text-[14px] leading-[18px] text-[#00293D] hover:text-[#e58625] transition-colors"
>
{link.label}
</Link>

View File

@@ -1,6 +1,29 @@
import api, { ApiResponse } from './api';
import { uploadService } from './upload.service';
import { CmsContentRecord } from '@/types/cms';
/**
* Check if a string looks like an S3 key (not a URL or local path).
*/
function isS3Key(value: string): boolean {
if (!value) return false;
return !value.startsWith('http') && !value.startsWith('/') && !value.startsWith('data:');
}
/**
* Resolve an image value: if it's an S3 key, fetch a presigned download URL.
* Otherwise return as-is (already a full URL or local path).
*/
export async function resolveImageUrl(value: string | undefined | null): Promise<string> {
if (!value) return '';
if (!isS3Key(value)) return value;
try {
return await uploadService.getPresignedDownloadUrl(value);
} catch {
return value;
}
}
class CmsService {
async getPageContent(pageSlug: string): Promise<CmsContentRecord[]> {
try {