translation

components/pages/home/blog.tsx

@@ -1,35 +1,37 @@
 import Image from "next/image";
 import { ChevronRight } from "lucide-react";
 import DotAnimatsiya from "@/components/dot/DotAnimatsiya";
-
-const blogPosts = [
-  {
-    id: 1,
-    image: "/images/img14.webp",
-    category: "Tips & Trick",
-    title: "BEHIND THE HELMET: LIFE AS A FIREFIGHTER",
-    author: "John Doe",
-    date: "July 24, 2025",
-  },
-  {
-    id: 2,
-    image: "/images/img15.webp",
-    category: "Insight",
-    title: "FIREFIGHTING EQUIPMENT: TOOLS OF THE TRADE",
-    author: "John Doe",
-    date: "July 24, 2025",
-  },
-  {
-    id: 3,
-    image: "/images/img16.webp",
-    category: "News",
-    title: "FIREFIGHTER TRAINING TAKES TO BECOME A HERO",
-    author: "John Doe",
-    date: "July 24, 2025",
-  },
-];
+import { useTranslations } from "next-intl";
 
 export function Blog() {
+  const t = useTranslations();
+  const blogPosts = [
+    {
+      id: 1,
+      image: "/images/img14.webp",
+      category: "Tips & Trick",
+      title: t("home.blog.articles.article1"),
+      author: "John Doe",
+      date: "July 24, 2025",
+    },
+    {
+      id: 2,
+      image: "/images/img15.webp",
+      category: "Insight",
+      title: t("home.blog.articles.article2"),
+      author: "John Doe",
+      date: "July 24, 2025",
+    },
+    {
+      id: 3,
+      image: "/images/img16.webp",
+      category: "News",
+      title: t("home.blog.articles.article3"),
+      author: "John Doe",
+      date: "July 24, 2025",
+    },
+  ];
+
   return (
     <section className="bg-[#1f1f1f] py-45">
       <div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
@@ -38,14 +40,14 @@ export function Blog() {
           <div className="mb-4 flex items-center justify-center gap-2">
             <DotAnimatsiya />
             <span className="text-sm font-semibold tracking-wider text-white uppercase">
-              Blog & Articles
+              {t("home.blog.title")}
             </span>
           </div>
           <h2
             className="bg-linear-to-br from-white via-white to-black
   text-transparent bg-clip-text text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl"
           >
-            LATEST BLOG & NEWS
+            {t("home.blog.subtitle")}
           </h2>
         </div>
 
@@ -84,7 +86,7 @@ export function Blog() {
                   href="#"
                   className="inline-flex items-center gap-1 text-sm font-semibold tracking-wider text-red-600 uppercase transition-colors hover:text-red-500"
                 >
-                  Read More
+                  {t("home.blog.readMore")}
                   <ChevronRight className="h-4 w-4" />
                 </a>
               </div>