diff --git a/api/blogs.js b/api/blogs.js index f11ff44..068e8f5 100644 --- a/api/blogs.js +++ b/api/blogs.js @@ -180,3 +180,7 @@ This article provides general information only. Consult qualified immigration co ]; export default blogs; + + + + diff --git a/components/BlogSection/BlogSection.js b/components/BlogSection/BlogSection.js index 1286f68..9542dce 100644 --- a/components/BlogSection/BlogSection.js +++ b/components/BlogSection/BlogSection.js @@ -1,48 +1,64 @@ import React from "react"; -import blogs from '../../api/blogs' +import blogs from '../../api/blogs'; import Link from "next/link"; import SectionTitle from "../SectionTitle/SectionTitle"; import Image from "next/image"; +import { useTranslation } from 'next-i18next'; +import blog from "../../utils/constant.utils"; - -const ClickHandler = () => { - window.scrollTo(10, 0); -} +const ClickHandler = () => window.scrollTo(10, 0); const BlogSection = () => { - return ( -
-
- -
-
- {blogs.map((blog, bl) => ( -
-
-
- -
-
- {/* */} -

{blog.title}

-
-

- {blog.para} -

- Know More -
-
-
-
- ))} -
-
-
-
- ); -} + const { t } = useTranslation('blog'); -export default BlogSection; \ No newline at end of file + return ( +
+
+ +
+
+ {blog.map((blog) => { + const blogTexts = t(`posts.${blog.slug}`, { returnObjects: true }); + return ( +
+
+
+ {blogTexts.title} +
+
+

+ + {blogTexts.title} + +

+
+

{blogTexts.para}

+ + {t('knowMore')} + +
+
+
+
+ ); + })} +
+
+
+
+ ); +}; + +export default BlogSection; diff --git a/components/services/ServicesSection.js b/components/services/ServicesSection.js index 1b9a696..15ec345 100644 --- a/components/services/ServicesSection.js +++ b/components/services/ServicesSection.js @@ -1,72 +1,79 @@ import React from "react"; -import Link from 'next/link'; +import Link from "next/link"; import SectionTitle from "../SectionTitle/SectionTitle"; -import Campaign from '../../api/campaign'; import Image from "next/image"; +import { useTranslation } from "next-i18next"; const ClickHandler = () => { + if (typeof window !== "undefined") { window.scrollTo(10, 0); -} + } +}; const ServicesSection = (props) => { - return ( -
-
- -
-
- {Campaign.map((campaign, cam) => ( -
-
-
-
- -
-
-
- {/*

{campaign.date}

*/} - {/*

*/} -

- - {campaign.sTitle} - + const { t } = useTranslation("services"); + // campaigns from translations + const campaigns = t("campaigns", { returnObjects: true }); + return ( +
+
+ {/* Section Title */} + -

-

- {campaign.description} -

-
- - View Services - -
- -
-
-
-
-
- ))} +
+
+ {campaigns.map((campaign, cam) => ( +
+
+
+
+ {campaign.sTitle}
+ +
+
+

+ + {campaign.sTitle} + +

+ +

{campaign.description}

+ +
+ + {t("page.viewButton")} + +
+
+
+
-
+
+ ))} +
- ); -} +
+
+ ); +}; export default ServicesSection; diff --git a/next-i18next.config.js b/next-i18next.config.js index 64c0762..413ac15 100644 --- a/next-i18next.config.js +++ b/next-i18next.config.js @@ -6,7 +6,7 @@ module.exports = { locales: ['en', 'es'], localeDetection: false, }, - ns: ['common', 'menu', 'homeHero', 'home4Card', '(home)/homeAbout', '(home)/homeFeature', '(home)/testimonial', '(home)/homeCalltoAction', 'ourMission', 'racialJustice', 'contact', 'ourApproach', 'ourStory', 'aboutService', 'aboutMission', 'aboutRacial', 'aboutDonor' ], + ns: ['common', 'menu', 'homeHero', 'home4Card'], defaultNS: 'common', // localePath: './public/locales', }; diff --git a/pages/blog/[slug].js b/pages/blog/[slug].js index e41e3b1..4a139bc 100644 --- a/pages/blog/[slug].js +++ b/pages/blog/[slug].js @@ -1,6 +1,9 @@ +// pages/blog/[slug].js import React, { Fragment } from 'react'; import { useRouter } from 'next/router'; -import blogs from '../../api/blogs'; +import { useTranslation } from 'next-i18next'; +import { serverSideTranslations } from 'next-i18next/serverSideTranslations'; +import blogs from '../../api/blogs'; // Static metadata like images, author, etc. import Link from 'next/link'; import PageTitle from '../../components/pagetitle/PageTitle'; import Navbar2 from '../../components/Navbar2/Navbar2'; @@ -8,17 +11,25 @@ import Footer from '../../components/footer/Footer'; import Scrollbar from '../../components/scrollbar/scrollbar'; import Image from 'next/image'; -const BlogSingle = (props) => { +const BlogSingle = () => { const router = useRouter(); const { slug } = router.query; - const BlogDetails = blogs.find(blog => blog.slug === slug); + const { t } = useTranslation('blog'); - if (!BlogDetails) { + if (!slug) return null; // Avoid hydration mismatch on first load + + // Localized content from blog.json + const blogContent = t(`posts.${slug}`, { returnObjects: true }); + + // Static metadata (images, date, author) + const blogMeta = blogs.find(blog => blog.slug === slug); + + if (!blogMeta || !blogContent?.title) { return (

Blog not found!

- Back to Blog + ← Back to Blog
); } @@ -26,37 +37,34 @@ const BlogSingle = (props) => { return ( - +
-
+
-
+
-
+
{BlogDetails.title}
    -
  • {BlogDetails.create_at}
    • -
  • - By{' '} - {BlogDetails.authorTitle} -
    • +
  • {blogMeta.create_at}
    • +
  • By {blogMeta.authorTitle}
-

{BlogDetails.title}

-
+

{blogContent.title}

+
@@ -70,4 +78,28 @@ const BlogSingle = (props) => { ); }; +export async function getStaticPaths() { + const locales = ['en', 'es']; + + const paths = locales.flatMap(locale => + blogs.map(blog => ({ + params: { slug: blog.slug }, + locale, + })) + ); + + return { + paths, + fallback: false, + }; +} + +export async function getStaticProps({ locale }) { + return { + props: { + ...(await serverSideTranslations(locale, ['common', 'menu', 'blog'])), + }, + }; +} + export default BlogSingle; diff --git a/pages/index.js b/pages/index.js index de920eb..3431bb4 100644 --- a/pages/index.js +++ b/pages/index.js @@ -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'])), // Add 'home', 'footer', etc. if needed + ...(await serverSideTranslations(locale, ['common', 'menu', 'homeHero', 'home4Card', '(home)/homeAbout', '(home)/homeFeature', '(home)/testimonial', '(home)/homeCalltoAction', 'blog'])), // Add 'home', 'footer', etc. if needed }, }; } diff --git a/pages/services/[slug].js b/pages/services/[slug].js index 8554e24..5b78cd4 100644 --- a/pages/services/[slug].js +++ b/pages/services/[slug].js @@ -1,101 +1,126 @@ -import React, { Fragment } from 'react'; -import Navbar2 from '../../components/Navbar2/Navbar2'; -import PageTitle from '../../components/pagetitle/PageTitle'; -import Scrollbar from '../../components/scrollbar/scrollbar'; -import { useRouter } from 'next/router'; -import Campaign from '../../api/campaign'; -import Footer from '../../components/footer/Footer'; -import Image from 'next/image'; -import Link from 'next/link'; -import services from '/public/images/service/service-details-banner.webp'; +import React, { Fragment } from "react"; +import Navbar2 from "../../components/Navbar2/Navbar2"; +import PageTitle from "../../components/pagetitle/PageTitle"; +import Scrollbar from "../../components/scrollbar/scrollbar"; +import Footer from "../../components/footer/Footer"; +import Image from "next/image"; +import Link from "next/link"; +import servicesBanner from "/public/images/service/service-details-banner.webp"; +import { useTranslation } from "next-i18next"; +import { serverSideTranslations } from "next-i18next/serverSideTranslations"; -const ServiceDetailsPage = () => { - const router = useRouter(); - const { slug } = router.query; - - const service = Campaign.find(item => item.slug === slug); - - if (!service) { - return ( - - -
-

Service not found!

- Back to Home -
-