home page services updated for language

This commit is contained in:
Alaguraj0361 2025-08-18 21:12:26 +05:30
parent 5be6db26bd
commit 815ab6b346
3 changed files with 31 additions and 17 deletions

View File

@ -3,17 +3,22 @@ import { TabContent, TabPane, Nav, NavItem, NavLink, Row } from "reactstrap";
import classnames from "classnames";
import Link from "next/link";
import Image from "next/image";
import { TabServices } from "../../utils/constant.utils"; // JSON array
import Campaign from "../../api/campaign";
import { useTranslation } from "next-i18next";
const ClickHandler = () => {
window.scrollTo(10, 0);
window.scrollTo(0, 0);
};
// Extract unique categories from the JSON dynamically
const categories = [...new Set(Campaign.map((service) => service.category))];
const ServiceSectionS2 = () => {
const { t } = useTranslation("services"); // Assuming your translations are in services.json
// Get campaigns array from the translation JSON
const campaigns = t("campaigns", { returnObjects: true });
// Extract unique categories from the campaigns dynamically
const categories = [...new Set(campaigns.map((service) => service.category))];
// Default active tab is the first category
const [activeTab, setActiveTab] = useState(categories[0]);
const toggle = (tab) => {
@ -43,15 +48,18 @@ const ServiceSectionS2 = () => {
{categories.map((cat, idx) => (
<TabPane tabId={cat} key={idx}>
<Row>
{Campaign.filter((srv) => srv.category === cat).slice(0,3).map(
(service, srvIdx) => (
{/* Filter campaigns based on category */}
{campaigns
.filter((srv) => srv.category === cat)
.slice(0, 3) // Limit to 3 services per category
.map((service, srvIdx) => (
<div className="col-lg-4 col-md-6 col-12" key={srvIdx}>
<div className="wpo-campaign-single">
<div className="wpo-campaign-item">
<div className="wpo-campaign-img">
<Image
src={service.sImgS}
alt={service.sTitle}
src={service.sImgS} // Service Image
alt={service.sTitle} // Service Title for Alt text
width={400}
height={250}
/>
@ -62,19 +70,25 @@ const ServiceSectionS2 = () => {
<Link
onClick={ClickHandler}
href={`/service-single/[slug]`}
as={`/service-single/${service.slug}`}
as={`/service-single/${service.slug}`} // Dynamic slug
>
{service.sTitle}
{service.sTitle} {/* Service Title */}
</Link>
</h2>
<p>{service.description}</p>
<p
dangerouslySetInnerHTML={{
__html:
service.description.length > 100
? service.description.substring(0, 100) + '...'
: service.description,
}}
></p>
</div>
</div>
</div>
</div>
</div>
)
)}
))}
</Row>
</TabPane>
))}

View File

@ -5,7 +5,7 @@ module.exports = {
locales: ['en', 'es'],
localeDetection: false,
},
ns: ['common', 'menu', 'homeHero', 'home4Card', '(home)/homeAbout', '(home)/homeFeature', '(home)/testimonial', '(home)/homeCalltoAction', 'blog', 'footer', 'ourMission', 'racialJustice', 'services', 'ourStory', 'aboutService', 'aboutMission', 'aboutRacial', 'aboutDonor'],
ns: ['common', 'menu', 'homeHero', 'home4Card', '(home)/homeAbout', '(home)/homeFeature', '(home)/testimonial', '(home)/homeCalltoAction', 'blog', 'footer', 'ourMission', 'racialJustice', 'services', 'ourStory', 'aboutService', 'aboutMission', 'aboutRacial', 'aboutDonor', 'contact'],
defaultNS: 'common',
// localePath: './public/locales',
};

View File

@ -40,7 +40,7 @@ export default HomePage;
export async function getStaticProps({ locale }) {
return {
props: {
...(await serverSideTranslations(locale, ['common', 'menu', 'homeHero', 'home4Card', '(home)/homeAbout', '(home)/homeFeature', '(home)/testimonial', '(home)/homeCalltoAction', 'blog', 'footer'])), // Add 'home', 'footer', etc. if needed
...(await serverSideTranslations(locale, ['common', 'menu', 'homeHero', 'home4Card', '(home)/homeAbout', '(home)/homeFeature', '(home)/testimonial', '(home)/homeCalltoAction', 'blog', 'footer', 'services'])), // Add 'home', 'footer', etc. if needed
},
};
}