تحسين خصائص تحسين محركات البحث عبر صفحات ومكونات متعددة، بما في ذلك إضافة البيانات المنظمة، وعلامات OpenGraph، ومكون SEOHead قابل لإعادة الاستخدام. تحديث عملية إنشاء خريطة الموقع لتشمل مسارات جديدة وتحسين ظهور الموقع بشكل عام.---Enhance SEO features across multiple pages and components, including the addition of structured data, OpenGraph tags, and a reusable SEOHead component. Update sitemap generation to include new routes and improve overall site visibility.

2026-03-09 20:56:43 +02:00
parent ce5c85ec7d
commit 9990415a51
12 changed files with 229 additions and 81 deletions
--- a/frontend/src/pages/AboutPage.tsx
+++ b/frontend/src/pages/AboutPage.tsx
@@ -1,6 +1,7 @@
 import { useTranslation } from 'react-i18next';
-import { Helmet } from 'react-helmet-async';
 import { Link } from 'react-router-dom';
+import SEOHead from '@/components/seo/SEOHead';
+import { generateWebPage } from '@/utils/seo';
 import { Target, Cpu, Shield, Lock, Wrench } from 'lucide-react';
 import { FILE_RETENTION_MINUTES } from '@/config/toolLimits';

@@ -10,11 +11,16 @@ export default function AboutPage() {

  return (
    <>
-      <Helmet>
-        <title>{t('pages.about.title')} — {t('common.appName')}</title>
-        <meta name="description" content={t('pages.about.metaDescription')} />
-        <link rel="canonical" href={`${window.location.origin}/about`} />
-      </Helmet>
+      <SEOHead
+        title={t('pages.about.title')}
+        description={t('pages.about.metaDescription')}
+        path="/about"
+        jsonLd={generateWebPage({
+          name: t('pages.about.title'),
+          description: t('pages.about.metaDescription'),
+          url: `${window.location.origin}/about`,
+        })}
+      />

      <div className="mx-auto max-w-3xl">
        <h1 className="mb-8 text-3xl font-bold text-slate-900 dark:text-white">
--- a/frontend/src/pages/ContactPage.tsx
+++ b/frontend/src/pages/ContactPage.tsx
@@ -2,6 +2,8 @@ import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Helmet } from 'react-helmet-async';
 import { Mail, Send, CheckCircle } from 'lucide-react';
+import SEOHead from '@/components/seo/SEOHead';
+import { generateWebPage } from '@/utils/seo';

 const CONTACT_EMAIL = 'support@saas-pdf.com';

@@ -52,11 +54,16 @@ export default function ContactPage() {

  return (
    <>
-      <Helmet>
-        <title>{t('pages.contact.title')} — {t('common.appName')}</title>
-        <meta name="description" content={t('pages.contact.metaDescription')} />
-        <link rel="canonical" href={`${window.location.origin}/contact`} />
-      </Helmet>
+      <SEOHead
+        title={t('pages.contact.title')}
+        description={t('pages.contact.metaDescription')}
+        path="/contact"
+        jsonLd={generateWebPage({
+          name: t('pages.contact.title'),
+          description: t('pages.contact.metaDescription'),
+          url: `${window.location.origin}/contact`,
+        })}
+      />

      <div className="mx-auto max-w-2xl">
        <div className="mb-8 text-center">
--- a/frontend/src/pages/HomePage.tsx
+++ b/frontend/src/pages/HomePage.tsx
@@ -1,5 +1,6 @@
 import { useTranslation } from 'react-i18next';
-import { Helmet } from 'react-helmet-async';
+import SEOHead from '@/components/seo/SEOHead';
+import { generateOrganization } from '@/utils/seo';
 import {
  FileText,
  FileOutput,
@@ -83,12 +84,12 @@ export default function HomePage() {

  return (
    <>
-      <Helmet>
-        <title>{t('common.appName')} — {t('home.heroSub')}</title>
-        <meta name="description" content={t('home.heroSub')} />
-        <link rel="canonical" href={window.location.origin} />
-        <script type="application/ld+json">
-          {JSON.stringify({
+      <SEOHead
+        title={t('common.appName')}
+        description={t('home.heroSub')}
+        path="/"
+        jsonLd={[
+          {
            '@context': 'https://schema.org',
            '@type': 'WebSite',
            name: t('common.appName'),
@@ -99,9 +100,10 @@ export default function HomePage() {
              target: `${window.location.origin}/tools/{search_term_string}`,
              'query-input': 'required name=search_term_string',
            },
-          })}
-        </script>
-      </Helmet>
+          },
+          generateOrganization(window.location.origin),
+        ]}
+      />

      {/* Hero Section */}
      <section className="py-12 sm:py-20 bg-gradient-to-b from-slate-50 to-white dark:from-slate-900 dark:to-slate-950 px-4 mb-10 rounded-b-[3rem]">
--- a/frontend/src/pages/PrivacyPage.tsx
+++ b/frontend/src/pages/PrivacyPage.tsx
@@ -1,5 +1,6 @@
 import { useTranslation } from 'react-i18next';
-import { Helmet } from 'react-helmet-async';
+import SEOHead from '@/components/seo/SEOHead';
+import { generateWebPage } from '@/utils/seo';
 import { FILE_RETENTION_MINUTES } from '@/config/toolLimits';

 const LAST_UPDATED = '2026-03-06';
@@ -12,11 +13,16 @@ export default function PrivacyPage() {

  return (
    <>
-      <Helmet>
-        <title>{t('pages.privacy.title')} — {t('common.appName')}</title>
-        <meta name="description" content={t('pages.privacy.metaDescription')} />
-        <link rel="canonical" href={`${window.location.origin}/privacy`} />
-      </Helmet>
+      <SEOHead
+        title={t('pages.privacy.title')}
+        description={t('pages.privacy.metaDescription')}
+        path="/privacy"
+        jsonLd={generateWebPage({
+          name: t('pages.privacy.title'),
+          description: t('pages.privacy.metaDescription'),
+          url: `${window.location.origin}/privacy`,
+        })}
+      />

      <div className="prose mx-auto max-w-2xl dark:prose-invert">
        <h1>{t('pages.privacy.title')}</h1>
--- a/frontend/src/pages/TermsPage.tsx
+++ b/frontend/src/pages/TermsPage.tsx
@@ -1,5 +1,6 @@
 import { useTranslation } from 'react-i18next';
-import { Helmet } from 'react-helmet-async';
+import SEOHead from '@/components/seo/SEOHead';
+import { generateWebPage } from '@/utils/seo';
 import { FILE_RETENTION_MINUTES } from '@/config/toolLimits';

 const LAST_UPDATED = '2026-03-06';
@@ -12,11 +13,16 @@ export default function TermsPage() {

  return (
    <>
-      <Helmet>
-        <title>{t('pages.terms.title')} — {t('common.appName')}</title>
-        <meta name="description" content={t('pages.terms.metaDescription')} />
-        <link rel="canonical" href={`${window.location.origin}/terms`} />
-      </Helmet>
+      <SEOHead
+        title={t('pages.terms.title')}
+        description={t('pages.terms.metaDescription')}
+        path="/terms"
+        jsonLd={generateWebPage({
+          name: t('pages.terms.title'),
+          description: t('pages.terms.metaDescription'),
+          url: `${window.location.origin}/terms`,
+        })}
+      />

      <div className="prose mx-auto max-w-2xl dark:prose-invert">
        <h1>{t('pages.terms.title')}</h1>