english version update

ospabhost/frontend/src/pages/blog.tsx

@@ -2,6 +2,8 @@ import React, { useEffect, useState } from 'react';
 import { Link } from 'react-router-dom';
 import axios from 'axios';
 import { API_URL } from '../config/api';
+import { useTranslation } from '../i18n';
+import { useLocalePath } from '../middleware';
 
 interface Post {
   id: number;
@@ -25,6 +27,8 @@ const Blog: React.FC = () => {
   const [posts, setPosts] = useState<Post[]>([]);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
+  const { t, locale } = useTranslation();
+  const localePath = useLocalePath();
 
   useEffect(() => {
     loadPosts();
@@ -37,8 +41,8 @@ const Blog: React.FC = () => {
       setPosts(response.data.data);
       setError(null);
     } catch (err) {
-      console.error('Ошибка загрузки постов:', err);
-      setError('Не удалось загрузить статьи');
+      console.error('Error loading posts:', err);
+      setError(locale === 'en' ? 'Failed to load articles' : 'Не удалось загрузить статьи');
     } finally {
       setLoading(false);
     }
@@ -46,7 +50,7 @@ const Blog: React.FC = () => {
 
   const formatDate = (dateString: string) => {
     const date = new Date(dateString);
-    return date.toLocaleDateString('ru-RU', {
+    return date.toLocaleDateString(locale === 'en' ? 'en-US' : 'ru-RU', {
       year: 'numeric',
       month: 'long',
       day: 'numeric'
@@ -56,7 +60,7 @@ const Blog: React.FC = () => {
   if (loading) {
     return (
       <div className="min-h-screen bg-gray-50 flex items-center justify-center">
-        <div className="text-xl text-gray-600">Загрузка...</div>
+        <div className="text-xl text-gray-600">{t('common.loading')}</div>
       </div>
     );
   }
@@ -66,9 +70,9 @@ const Blog: React.FC = () => {
       <div className="container mx-auto px-4 max-w-6xl">
         {/* Header */}
         <div className="text-center mb-12">
-          <h1 className="text-5xl font-bold text-gray-900 mb-4">Блог</h1>
+          <h1 className="text-5xl font-bold text-gray-900 mb-4">{t('blog.title')}</h1>
           <p className="text-xl text-gray-600">
-            Новости, статьи и полезные материалы о хостинге
+            {t('blog.subtitle')}
           </p>
         </div>
 
@@ -82,14 +86,14 @@ const Blog: React.FC = () => {
         {/* Posts Grid */}
         {posts.length === 0 ? (
           <div className="text-center py-12">
-            <p className="text-2xl text-gray-400">📭 Статей пока нет</p>
+            <p className="text-2xl text-gray-400">📭 {t('blog.noPosts')}</p>
           </div>
         ) : (
           <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
             {posts.map((post) => (
               <Link
                 key={post.id}
-                to={`/blog/${post.url}`}
+                to={localePath(`/blog/${post.url}`)}
                 className="bg-white rounded-lg shadow-md hover:shadow-xl transition-shadow overflow-hidden group"
               >
                 {/* Cover Image */}
@@ -103,7 +107,7 @@ const Blog: React.FC = () => {
                   </div>
                 ) : (
                   <div className="h-48 bg-gradient-to-br from-blue-500 to-purple-600 flex items-center justify-center">
-                    <span className="text-4xl text-white font-bold">Статья</span>
+                    <span className="text-4xl text-white font-bold">{locale === 'en' ? 'Article' : 'Статья'}</span>
                   </div>
                 )}
 
@@ -122,9 +126,8 @@ const Blog: React.FC = () => {
                   {/* Meta */}
                   <div className="flex items-center justify-between text-sm text-gray-500">
                     <div className="flex items-center gap-4">
-                      <span>Автор: {post.author.username}</span>
-                      <span>Просмотров: {post.views}</span>
-                      <span>Комментариев: {post._count.comments}</span>
+                      <span className="truncate max-w-[150px]" title={post.author.username}>{t('blog.author')}: {post.author.username}</span>
+                      <span>{locale === 'en' ? 'Views' : 'Просмотров'}: {post.views}</span>
                     </div>
                   </div>