Re-Quest/frontend
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix: Conditionally apply CMS content to about page sections and refine rendering of "Why Choose Us" section elements based on data availability.

Browse Source
This commit is contained in:
pradeepkumar
2026-02-24 03:37:02 +05:30
parent 20857a9d59
commit cc22d47d1e
1 changed files with 51 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

84
src/app/about/page.tsx
View File

@@ -91,12 +91,24 @@ export default function AboutPage() {
useEffect(() => {
cmsService.getPageContent('about').then((sections) => {
sections.forEach((s: CmsContentRecord) => {
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': setHero(s.content as AboutHeroContent); break;
case 'stats': setStats(s.content as AboutStatsContent); break;
case 'features': setFeatures(s.content as AboutFeaturesContent); break;
case 'team': setTeam(s.content as AboutTeamContent); break;
case 'cta': setCta(s.content as AboutCtaContent); break;
case 'hero':
if (c.headline || c.description) setHero(c as unknown as AboutHeroContent);
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);
break;
case 'team':
if (Array.isArray(c.members) && c.members.length > 0) setTeam(c as unknown as AboutTeamContent);
break;
case 'cta':
if (c.title || c.description) setCta(c as unknown as AboutCtaContent);
break;
}
});
});
@@ -184,39 +196,45 @@ export default function AboutPage() {
)}
{/* Why Choose Us Section */}
{features.features.length > 0 && (
{(features.badge || features.features.length > 0) && (
<section className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16 lg:py-20">
{/* Section Header */}
<div className="text-center mb-12">
<span className="bg-[#e58625]/10 text-[#e58625] font-fractul font-semibold text-[14px] px-4 py-2 rounded-full">
{features.badge}
</span>
</div>
{features.badge && (
<div className="text-center mb-12">
<span className="bg-[#e58625]/10 text-[#e58625] font-fractul font-semibold text-[14px] px-4 py-2 rounded-full">
{features.badge}
</span>
</div>
)}
{/* Feature Cards */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
{features.features.map((feature, index) => (
<div
key={index}
className="border border-[#00293d]/10 rounded-[15px] p-6 text-center hover:shadow-lg transition-shadow"
>
<div className="w-[60px] h-[60px] bg-[#e58625]/10 rounded-full flex items-center justify-center mx-auto mb-4">
<Image
src={feature.iconPath || '/assets/icons/verified-badge-orange.svg'}
alt=""
width={28}
height={28}
/>
{features.features.length > 0 && (
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
{features.features.map((feature, index) => (
<div
key={index}
className="border border-[#00293d]/10 rounded-[15px] p-6 text-center hover:shadow-lg transition-shadow"
>
{feature.iconPath && (
<div className="w-[60px] h-[60px] bg-[#e58625]/10 rounded-full flex items-center justify-center mx-auto mb-4">
<Image
src={feature.iconPath}
alt=""
width={28}
height={28}
/>
</div>
)}
<h3 className="font-fractul font-bold text-[18px] text-[#00293d] mb-3">
{feature.title}
</h3>
<p className="font-serif text-[14px] text-[#00293d] leading-relaxed">
{feature.description}
</p>
</div>
<h3 className="font-fractul font-bold text-[18px] text-[#00293d] mb-3">
{feature.title}
</h3>
<p className="font-serif text-[14px] text-[#00293d] leading-relaxed">
{feature.description}
</p>
</div>
))}
</div>
))}
</div>
)}
</section>
)}