From 773f9648b27f187d5d9e149635153168eae162d4 Mon Sep 17 00:00:00 2001 From: Alaguraj0361 Date: Mon, 18 Aug 2025 19:11:03 +0530 Subject: [PATCH] home page blog section updated --- api/blogs.js | 4 ++ components/BlogSection/BlogSection.js | 96 ++++++++++++++++----------- next-i18next.config.js | 3 +- pages/blog/[slug].js | 70 +++++++++++++------ pages/index.js | 2 +- public/locales/en/blog.json | 22 ++++++ public/locales/es/blog.json | 22 ++++++ utils/constant.utils.js | 52 +++++++++++++++ 8 files changed, 209 insertions(+), 62 deletions(-) create mode 100644 public/locales/en/blog.json create mode 100644 public/locales/es/blog.json 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/next-i18next.config.js b/next-i18next.config.js index 2eb1d60..84ca021 100644 --- a/next-i18next.config.js +++ b/next-i18next.config.js @@ -1,4 +1,3 @@ -const { default: OurApproach } = require("./pages/our-approach"); module.exports = { i18n: { @@ -19,5 +18,5 @@ module.exports = { // Vidhya - OurApproach -// Alagu Raj - 'common', 'menu', 'homeHero', 'home4Card', '(home)/homeAbout', '(home)/homeFeature', '(home)/testimonial', '(home)/homeCalltoAction' +// Alagu Raj - 'common', 'menu', 'homeHero', 'home4Card', '(home)/homeAbout', '(home)/homeFeature', '(home)/testimonial', '(home)/homeCalltoAction', 'blog' 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/public/locales/en/blog.json b/public/locales/en/blog.json new file mode 100644 index 0000000..392b89f --- /dev/null +++ b/public/locales/en/blog.json @@ -0,0 +1,22 @@ +{ + "sectionSubTitle": "Our Blog", + "sectionTitle": "Latest News & Press", + "knowMore": "Know More", + "posts": { + "new-tps-designations-what-you-need-to-know": { + "title": "New TPS Designations: What You Need to Know", + "summary": "Recent policy changes affect thousands of immigrants. Learn how temporary protected status updates may impact your case and what actions to take.", + "description": "

Recent policy changes affect thousands of immigrants. Learn how temporary protected status updates...

... full content here ..." + }, + "h1b-season-2025-preparation-strategies": { + "title": "H-1B Season 2025: Preparation Strategies", + "summary": "The annual H-1B lottery approaches. Our comprehensive guide helps employers and workers navigate the process.", + "description": "

The H-1B registration period for the fiscal year 2026 closed recently...

... full content here ..." + }, + "family-immigration-backlogs-alternative-options": { + "title": "Family Immigration Backlogs: Alternative Options", + "summary": "While family preference categories face delays, discover alternative pathways to reunite with loved ones.", + "description": "

While family preference categories face delays...

... full content here ..." + } + } +} \ No newline at end of file diff --git a/public/locales/es/blog.json b/public/locales/es/blog.json new file mode 100644 index 0000000..aad4cd9 --- /dev/null +++ b/public/locales/es/blog.json @@ -0,0 +1,22 @@ +{ + "sectionSubTitle": "Nuestro Blog", + "sectionTitle": "Últimas Noticias y Comunicados", + "knowMore": "Saber Más", + "posts": { + "new-tps-designations-what-you-need-to-know": { + "title": "Nuevas Designaciones de TPS: Lo Que Necesitas Saber", + "summary": "Cambios recientes en la política afectan a miles de inmigrantes. Descubre cómo las actualizaciones de TPS pueden impactar tu caso y qué acciones tomar.", + "description": "

Los cambios recientes en la política afectan a miles de inmigrantes. Aprende cómo las actualizaciones del Estatus de Protección Temporal (TPS) pueden impactar tu caso y qué pasos debes seguir...

... contenido completo aquí ..." + }, + "h1b-season-2025-preparation-strategies": { + "title": "Temporada H-1B 2025: Estrategias de Preparación", + "summary": "Se acerca la lotería anual de visas H-1B. Nuestra guía integral ayuda a empleadores y trabajadores a navegar el proceso y mejorar sus posibilidades.", + "description": "

El período de registro para la visa H-1B del año fiscal 2026 se cerró recientemente...

... contenido completo aquí ..." + }, + "family-immigration-backlogs-alternative-options": { + "title": "Retrasos en la Inmigración Familiar: Opciones Alternativas", + "summary": "Mientras las categorías de preferencia familiar enfrentan demoras, descubre vías alternativas para reunirte con tus seres queridos.", + "description": "

Mientras las categorías de inmigración familiar enfrentan retrasos significativos...

... contenido completo aquí ..." + } + } +} \ No newline at end of file diff --git a/utils/constant.utils.js b/utils/constant.utils.js index b4ddb25..3e5d5b7 100644 --- a/utils/constant.utils.js +++ b/utils/constant.utils.js @@ -30,6 +30,18 @@ import iconImg1 from '/public/images/home/icons/strategic-planning.webp' import iconImg2 from '/public/images/home/icons/expert-preparation.webp' import iconImg3 from '/public/images/home/icons/ongoing-support.webp' +import blogImg1 from "/public/images/blog/blog-1.webp"; +import blogImg2 from "/public/images/blog/blog-2.webp"; +import blogImg3 from "/public/images/blog/blog-3.webp"; + +import blogSingleImg1 from "/public/images/blog/blog-detail-1.webp"; +import blogSingleImg2 from "/public/images/blog/blog-detail-2.webp"; +import blogSingleImg3 from "/public/images/blog/blog-detail-3.webp"; + +import bannerImg1 from "/public/images/blog/banner-1.webp"; +import bannerImg2 from "/public/images/blog/banner-2.webp"; +import bannerImg3 from "/public/images/blog/banner-3.webp"; + export const featuresData = [ { img: iconImg1, @@ -205,3 +217,43 @@ export const MissionVision = [ }, ] +const blog = [ + { + id: '1', + slug: 'new-tps-designations-what-you-need-to-know', + bannerImg: bannerImg1, + screens: blogImg1, + blogSingleImg: blogSingleImg1, + author: 'Anne William', + authorTitle: 'Admin', + create_at: '25 Sep 2022', + comment: '35', + blClass: 'format-standard-image' + }, + { + id: '2', + slug: 'h1b-season-2025-preparation-strategies', + bannerImg: bannerImg2, + screens: blogImg2, + blogSingleImg: blogSingleImg2, + author: 'Robert Fox', + authorTitle: 'Admin', + create_at: '12 Jun 2023', + comment: '80', + blClass: 'format-standard-image' + }, + { + id: '3', + slug: 'family-immigration-backlogs-alternative-options', + bannerImg: bannerImg3, + screens: blogImg3, + blogSingleImg: blogSingleImg3, + author: 'Devon Lane', + authorTitle: 'Admin', + create_at: '03 Dec 2024', + comment: '95', + blClass: 'format-video' + } +]; + +export default blog;