From 71447d32c3a13df24fba4a841e3f0c1bb56e5018 Mon Sep 17 00:00:00 2001
From: andupetcu <47487320+andupetcu@users.noreply.github.com>
Date: Sat, 20 Sep 2025 18:06:27 +0300
Subject: [PATCH] Localize prayers page via next-intl messages (titles,
 categories, stats, buttons, dialog, samples); use Intl relative time;
 scalable for more locales.

---
 app/[locale]/prayers/page.tsx | 200 ++++++++++++----------------------
 messages/en.json              |  51 ++++++++-
 messages/ro.json              |  51 ++++++++-
 3 files changed, 165 insertions(+), 137 deletions(-)

diff --git a/app/[locale]/prayers/page.tsx b/app/[locale]/prayers/page.tsx
index c5a85fc..5db473d 100644
--- a/app/[locale]/prayers/page.tsx
+++ b/app/[locale]/prayers/page.tsx
@@ -37,7 +37,7 @@ import {
   MoreVert,
 } from '@mui/icons-material'
 import { useState, useEffect } from 'react'
-import { useLocale } from 'next-intl'
+import { useTranslations, useLocale, useFormatter } from 'next-intl'
 
 interface PrayerRequest {
   id: string
@@ -53,6 +53,9 @@ interface PrayerRequest {
 export default function PrayersPage() {
   const theme = useTheme()
   const locale = useLocale()
+  const t = useTranslations('pages.prayers')
+  const tc = useTranslations('common')
+  const f = useFormatter()
   const [prayers, setPrayers] = useState<PrayerRequest[]>([])
   const [openDialog, setOpenDialog] = useState(false)
   const [newPrayer, setNewPrayer] = useState({
@@ -62,101 +65,51 @@ export default function PrayersPage() {
   })
   const [loading, setLoading] = useState(true)
 
-  const categories = locale === 'en'
-    ? [
-        { value: 'personal', label: 'Personal', color: 'primary' },
-        { value: 'family', label: 'Family', color: 'secondary' },
-        { value: 'health', label: 'Health', color: 'error' },
-        { value: 'work', label: 'Work', color: 'warning' },
-        { value: 'ministry', label: 'Ministry', color: 'success' },
-        { value: 'world', label: 'World', color: 'info' },
-      ]
-    : [
-        { value: 'personal', label: 'Personal', color: 'primary' },
-        { value: 'family', label: 'Familie', color: 'secondary' },
-        { value: 'health', label: 'Sănătate', color: 'error' },
-        { value: 'work', label: 'Muncă', color: 'warning' },
-        { value: 'ministry', label: 'Serviciu', color: 'success' },
-        { value: 'world', label: 'Lume', color: 'info' },
-      ]
+  const categories = [
+    { value: 'personal', label: t('categories.personal'), color: 'primary' },
+    { value: 'family', label: t('categories.family'), color: 'secondary' },
+    { value: 'health', label: t('categories.health'), color: 'error' },
+    { value: 'work', label: t('categories.work'), color: 'warning' },
+    { value: 'ministry', label: t('categories.ministry'), color: 'success' },
+    { value: 'world', label: t('categories.world'), color: 'info' },
+  ]
 
   // Sample data - in real app this would come from API
   useEffect(() => {
     // Simulate loading prayers
     setTimeout(() => {
-      setPrayers(
-        locale === 'en'
-          ? [
-              {
-                id: '1',
-                title: 'Prayer for healing',
-                description:
-                  'Please pray for my father who is in the hospital. He needs God\'s healing.',
-                category: 'health',
-                author: 'Maria P.',
-                timestamp: new Date(Date.now() - 2 * 60 * 60 * 1000),
-                prayerCount: 23,
-                isPrayedFor: false,
-              },
-              {
-                id: '2',
-                title: 'God\'s guidance in career',
-                description:
-                  'Seeking God\'s direction for the next step in my career. Please pray for clarity and peace.',
-                category: 'work',
-                author: 'Alex M.',
-                timestamp: new Date(Date.now() - 5 * 60 * 60 * 1000),
-                prayerCount: 15,
-                isPrayedFor: true,
-              },
-              {
-                id: '3',
-                title: 'Unity in our family',
-                description:
-                  'Please pray for restoration of relationships in our family and for mutual forgiveness.',
-                category: 'family',
-                author: 'Anonymous',
-                timestamp: new Date(Date.now() - 1 * 24 * 60 * 60 * 1000),
-                prayerCount: 41,
-                isPrayedFor: false,
-              },
-            ]
-          : [
-              {
-                id: '1',
-                title: 'Rugăciune pentru vindecare',
-                description:
-                  'Te rog să te rogi pentru tatăl meu care se află în spital. Are nevoie de vindecarea lui Dumnezeu.',
-                category: 'health',
-                author: 'Maria P.',
-                timestamp: new Date(Date.now() - 2 * 60 * 60 * 1000),
-                prayerCount: 23,
-                isPrayedFor: false,
-              },
-              {
-                id: '2',
-                title: 'Îndrumarea lui Dumnezeu în carieră',
-                description:
-                  'Caut direcția lui Dumnezeu pentru următorul pas în cariera mea. Te rog să te rogi pentru claritate și pace.',
-                category: 'work',
-                author: 'Alexandru M.',
-                timestamp: new Date(Date.now() - 5 * 60 * 60 * 1000),
-                prayerCount: 15,
-                isPrayedFor: true,
-              },
-              {
-                id: '3',
-                title: 'Unitatea în familia noastră',
-                description:
-                  'Rugați-vă pentru restaurarea relațiilor în familia noastră și pentru iertarea reciprocă.',
-                category: 'family',
-                author: 'Anonim',
-                timestamp: new Date(Date.now() - 1 * 24 * 60 * 60 * 1000),
-                prayerCount: 41,
-                isPrayedFor: false,
-              },
-            ]
-      )
+      setPrayers([
+        {
+          id: '1',
+          title: t('samples.item1.title'),
+          description: t('samples.item1.description'),
+          category: 'health',
+          author: t('samples.item1.author'),
+          timestamp: new Date(Date.now() - 2 * 60 * 60 * 1000),
+          prayerCount: 23,
+          isPrayedFor: false,
+        },
+        {
+          id: '2',
+          title: t('samples.item2.title'),
+          description: t('samples.item2.description'),
+          category: 'work',
+          author: t('samples.item2.author'),
+          timestamp: new Date(Date.now() - 5 * 60 * 60 * 1000),
+          prayerCount: 15,
+          isPrayedFor: true,
+        },
+        {
+          id: '3',
+          title: t('samples.item3.title'),
+          description: t('samples.item3.description'),
+          category: 'family',
+          author: t('samples.item3.author'),
+          timestamp: new Date(Date.now() - 1 * 24 * 60 * 60 * 1000),
+          prayerCount: 41,
+          isPrayedFor: false,
+        },
+      ])
       setLoading(false)
     }, 1000)
   }, [locale])
@@ -213,17 +166,14 @@ export default function PrayersPage() {
   const formatTimestamp = (timestamp: Date) => {
     const now = new Date()
     const diff = now.getTime() - timestamp.getTime()
-    const hours = Math.floor(diff / (1000 * 60 * 60))
+    const minutes = Math.floor(diff / (1000 * 60))
+    const hours = Math.floor(minutes / 60)
     const days = Math.floor(hours / 24)
 
-    if (locale === 'en') {
-      if (days > 0) return `${days} day${days === 1 ? '' : 's'} ago`
-      if (hours > 0) return `${hours} hour${hours === 1 ? '' : 's'} ago`
-      return 'A few minutes ago'
-    }
-    if (days > 0) return `${days} zile în urmă`
-    if (hours > 0) return `${hours} ore în urmă`
-    return 'Acum câteva minute'
+    if (days > 0) return f.relativeTime(-days, 'day')
+    if (hours > 0) return f.relativeTime(-hours, 'hour')
+    if (minutes > 0) return f.relativeTime(-minutes, 'minute')
+    return f.relativeTime(0, 'second')
   }
 
   return (
@@ -234,12 +184,10 @@ export default function PrayersPage() {
         <Box sx={{ mb: 4, textAlign: 'center' }}>
           <Typography variant="h3" component="h1" gutterBottom>
             <Favorite sx={{ fontSize: 40, mr: 2, verticalAlign: 'middle', color: 'error.main' }} />
-            {locale === 'en' ? 'Prayer Wall' : 'Peretele de rugăciuni'}
+            {t('title')}
           </Typography>
           <Typography variant="body1" color="text.secondary">
-            {locale === 'en'
-              ? 'Share prayers and pray together with the community'
-              : 'Partajează rugăciuni și roagă-te împreună cu comunitatea'}
+            {t('subtitle')}
           </Typography>
         </Box>
 
@@ -249,7 +197,7 @@ export default function PrayersPage() {
             <Card>
               <CardContent>
                 <Typography variant="h6" gutterBottom>
-                  {locale === 'en' ? 'Categories' : 'Categorii'}
+                  {t('categories.title')}
                 </Typography>
                 <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }}>
                   {categories.map((category) => (
@@ -265,22 +213,12 @@ export default function PrayersPage() {
                 </Box>
 
                 <Typography variant="h6" sx={{ mt: 3, mb: 1 }}>
-                  {locale === 'en' ? 'Statistics' : 'Statistici'}
+                  {t('stats.title')}
                 </Typography>
                 <Typography variant="body2" color="text.secondary">
-                  {locale === 'en' ? (
-                    <>
-                      • {prayers.length} active requests<br />
-                      • {prayers.reduce((sum, p) => sum + p.prayerCount, 0)} total prayers<br />
-                      • {prayers.filter(p => p.isPrayedFor).length} requests you prayed for
-                    </>
-                  ) : (
-                    <>
-                      • {prayers.length} cereri active<br />
-                      • {prayers.reduce((sum, p) => sum + p.prayerCount, 0)} rugăciuni totale<br />
-                      • {prayers.filter(p => p.isPrayedFor).length} cereri la care te-ai rugat
-                    </>
-                  )}
+                  • {t('stats.activeRequests', { count: prayers.length })}<br />
+                  • {t('stats.totalPrayers', { count: prayers.reduce((sum, p) => sum + p.prayerCount, 0) })}<br />
+                  • {t('stats.youPrayed', { count: prayers.filter(p => p.isPrayedFor).length })}
                 </Typography>
               </CardContent>
             </Card>
@@ -377,23 +315,19 @@ export default function PrayersPage() {
                               onClick={() => handlePrayFor(prayer.id)}
                               disabled={prayer.isPrayedFor}
                             >
-                              {prayer.isPrayedFor
-                                ? locale === 'en' ? 'Prayed' : 'M-am rugat'
-                                : locale === 'en' ? 'Pray' : 'Mă rog'}
+                              {prayer.isPrayedFor ? t('buttons.prayed') : t('buttons.pray')}
                             </Button>
                             <Button
                               variant="outlined"
                               size="small"
                               startIcon={<Share />}
                             >
-                              {locale === 'en' ? 'Share' : 'Partajează'}
+                              {t('buttons.share')}
                             </Button>
                           </Box>
 
                           <Typography variant="body2" color="text.secondary">
-                            {locale === 'en'
-                              ? `${prayer.prayerCount} ${prayer.prayerCount === 1 ? 'prayer' : 'prayers'}`
-                              : `${prayer.prayerCount} ${prayer.prayerCount === 1 ? 'rugăciune' : 'rugăciuni'}`}
+                            {t('stats.totalPrayers', { count: prayer.prayerCount })}
                           </Typography>
                         </Box>
                       </CardContent>
@@ -424,7 +358,7 @@ export default function PrayersPage() {
         >
           <DialogTitle>
             <Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
-              {locale === 'en' ? 'Add a prayer request' : 'Adaugă o cerere de rugăciune'}
+              {t('dialog.title')}
               <IconButton onClick={() => setOpenDialog(false)} size="small">
                 <Close />
               </IconButton>
@@ -433,7 +367,7 @@ export default function PrayersPage() {
           <DialogContent>
             <TextField
               fullWidth
-              label={locale === 'en' ? 'Title' : 'Titlu'}
+              label={t('dialog.titleLabel')}
               value={newPrayer.title}
               onChange={(e) => setNewPrayer({ ...newPrayer, title: e.target.value })}
               sx={{ mb: 2, mt: 1 }}
@@ -441,7 +375,7 @@ export default function PrayersPage() {
 
             <TextField
               fullWidth
-              label={locale === 'en' ? 'Category' : 'Categoria'}
+              label={t('dialog.categoryLabel')}
               select
               value={newPrayer.category}
               onChange={(e) => setNewPrayer({ ...newPrayer, category: e.target.value })}
@@ -456,24 +390,24 @@ export default function PrayersPage() {
 
             <TextField
               fullWidth
-              label={locale === 'en' ? 'Description' : 'Descriere'}
+              label={t('dialog.descriptionLabel')}
               multiline
               rows={4}
               value={newPrayer.description}
               onChange={(e) => setNewPrayer({ ...newPrayer, description: e.target.value })}
-              placeholder={locale === 'en' ? 'Describe your prayer request...' : 'Descrie cererea ta de rugăciune...'}
+              placeholder={t('dialog.placeholder')}
             />
           </DialogContent>
           <DialogActions>
             <Button onClick={() => setOpenDialog(false)}>
-              {locale === 'en' ? 'Cancel' : 'Anulează'}
+              {t('dialog.cancel')}
             </Button>
             <Button
               onClick={handleSubmitPrayer}
               variant="contained"
               disabled={!newPrayer.title.trim() || !newPrayer.description.trim()}
             >
-              {locale === 'en' ? 'Add prayer' : 'Adaugă rugăciunea'}
+              {t('dialog.submit')}
             </Button>
           </DialogActions>
         </Dialog>
diff --git a/messages/en.json b/messages/en.json
index b128f70..d761356 100644
--- a/messages/en.json
+++ b/messages/en.json
@@ -91,9 +91,56 @@
     },
     "prayers": {
       "title": "Prayers",
+      "subtitle": "Share prayers and pray together with the community",
       "addRequest": "Add prayer request",
       "anonymous": "Anonymous",
-      "prayFor": "Pray for this"
+      "prayFor": "Pray for this",
+      "categories": {
+        "title": "Categories",
+        "personal": "Personal",
+        "family": "Family",
+        "health": "Health",
+        "work": "Work",
+        "ministry": "Ministry",
+        "world": "World"
+      },
+      "stats": {
+        "title": "Statistics",
+        "activeRequests": "{count} active requests",
+        "totalPrayers": "{count} total prayers",
+        "youPrayed": "{count} requests you prayed for"
+      },
+      "buttons": {
+        "pray": "Pray",
+        "prayed": "Prayed",
+        "share": "Share"
+      },
+      "dialog": {
+        "title": "Add a prayer request",
+        "titleLabel": "Title",
+        "categoryLabel": "Category",
+        "descriptionLabel": "Description",
+        "placeholder": "Describe your prayer request...",
+        "cancel": "Cancel",
+        "submit": "Add prayer"
+      },
+      "samples": {
+        "item1": {
+          "title": "Prayer for healing",
+          "description": "Please pray for my father who is in the hospital. He needs God's healing.",
+          "author": "Maria P."
+        },
+        "item2": {
+          "title": "God's guidance in career",
+          "description": "Seeking God's direction for the next step in my career. Please pray for clarity and peace.",
+          "author": "Alex M."
+        },
+        "item3": {
+          "title": "Unity in our family",
+          "description": "Please pray for restoration of relationships in our family and for mutual forgiveness.",
+          "author": "Anonymous"
+        }
+      }
     },
     "search": {
       "title": "Search",
@@ -114,4 +161,4 @@
     "next": "Next",
     "previous": "Previous"
   }
-}
\ No newline at end of file
+}
diff --git a/messages/ro.json b/messages/ro.json
index fa33317..ccc3061 100644
--- a/messages/ro.json
+++ b/messages/ro.json
@@ -91,9 +91,56 @@
     },
     "prayers": {
       "title": "Rugăciuni",
+      "subtitle": "Partajează rugăciuni și roagă-te împreună cu comunitatea",
       "addRequest": "Adaugă cerere de rugăciune",
       "anonymous": "Anonim",
-      "prayFor": "Mă rog pentru aceasta"
+      "prayFor": "Mă rog pentru aceasta",
+      "categories": {
+        "title": "Categorii",
+        "personal": "Personal",
+        "family": "Familie",
+        "health": "Sănătate",
+        "work": "Muncă",
+        "ministry": "Serviciu",
+        "world": "Lume"
+      },
+      "stats": {
+        "title": "Statistici",
+        "activeRequests": "{count} cereri active",
+        "totalPrayers": "{count} rugăciuni totale",
+        "youPrayed": "{count} cereri la care te-ai rugat"
+      },
+      "buttons": {
+        "pray": "Mă rog",
+        "prayed": "M-am rugat",
+        "share": "Partajează"
+      },
+      "dialog": {
+        "title": "Adaugă o cerere de rugăciune",
+        "titleLabel": "Titlu",
+        "categoryLabel": "Categoria",
+        "descriptionLabel": "Descriere",
+        "placeholder": "Descrie cererea ta de rugăciune...",
+        "cancel": "Anulează",
+        "submit": "Adaugă rugăciunea"
+      },
+      "samples": {
+        "item1": {
+          "title": "Rugăciune pentru vindecare",
+          "description": "Te rog să te rogi pentru tatăl meu care se află în spital. Are nevoie de vindecarea lui Dumnezeu.",
+          "author": "Maria P."
+        },
+        "item2": {
+          "title": "Îndrumarea lui Dumnezeu în carieră",
+          "description": "Caut direcția lui Dumnezeu pentru următorul pas în cariera mea. Te rog să te rogi pentru claritate și pace.",
+          "author": "Alexandru M."
+        },
+        "item3": {
+          "title": "Unitatea în familia noastră",
+          "description": "Rugați-vă pentru restaurarea relațiilor în familia noastră și pentru iertarea reciprocă.",
+          "author": "Anonim"
+        }
+      }
     },
     "search": {
       "title": "Căutare",
@@ -114,4 +161,4 @@
     "next": "Următorul",
     "previous": "Anterior"
   }
-}
\ No newline at end of file
+}