fix: reconcile approved live VPS source and operations

web/src/app/(frontend)/page.tsx

@@ -6,14 +6,14 @@ import { getPayload } from 'payload'
 import configPromise from '@payload-config'
 import { TOPICS, topicsFor, INTEREST_MAP } from '@/lib/topics'
 import { formatNumber, guidesLabel, minutesLabel, MEMBERSHIP_PRICE } from '@/lib/format'
-import { freeEarlyAccess } from '@/lib/launch'
+import { freeEarlyAccess, accessLabel, LAUNCH_POLICY } from '@/lib/launch'
 
 export const dynamic = 'force-dynamic'
 
-/* Editorial picks for «ابدأ من هنا». */
-const START_HERE = ['first-arabic-agent', 'choosing-your-model', 'prototype-to-production', 'simple-arabic-rag', 'safe-agent-guardrails', 'agent-loop-stop-condition']
+/* Demo seed articles remain in the library, but never in the popular section. */
+const DEMO_POST_SLUGS = ['first-arabic-agent', 'agent-loop-stop-condition', 'choosing-your-model', 'systematic-model-eval', 'simple-arabic-rag', 'vector-databases-in-practice', 'safe-agent-guardrails', 'agent-output-review-gates', 'indispensable-ai-tools', 'tool-pipelines-and-permissions', 'ai-in-your-business', 'prototype-to-production', 'article-agent-guide']
 
-type Doc = { id: number; title: string; slug: string; dek?: string | null; access: 'free' | 'vip'; category: string; level?: string | null; readingMinutes: number; cover?: { url?: string | null } | number | null }
+type Doc = { id: number; title: string; slug: string; dek?: string | null; access: 'free' | 'vip'; category: string; level?: string | null; readingMinutes: number; views?: number | null; cover?: { url?: string | null } | number | null }
 
 export default async function HomePage() {
   const viewer = await getViewer()
@@ -43,7 +43,17 @@ export default async function HomePage() {
     .slice(0, 4)
     .map(({ d }) => d)
   const counts = Object.fromEntries(TOPICS.map(t => [t.key, docs.filter(d => topicsFor(d).includes(t.key)).length]))
-  const startHere = START_HERE.map(slug => docs.find(d => d.slug === slug)).filter((d): d is Doc => Boolean(d))
+  // Query the complete published collection, not just the 200 newest posts.
+  // Read-count ties prefer the newest publication, then a stable slug order.
+  const { docs: popular } = await payload.find({
+    collection: 'posts',
+    where: { and: [{ status: { equals: 'published' } }, { slug: { not_in: DEMO_POST_SLUGS } }] },
+    depth: 1,
+    limit: 6,
+    sort: ['-views', '-publishedAt', 'slug'],
+    select: { title: true, slug: true, dek: true, access: true, category: true, readingMinutes: true, cover: true, views: true },
+  })
+  const startHere = popular as unknown as Doc[]
 
   return (
     <div id="site" className="site-page v2 v2-home">
@@ -54,7 +64,7 @@ export default async function HomePage() {
           __html: JSON.stringify({
             '@context': 'https://schema.org',
             '@type': 'Organization',
-            name: 'أنور بآي',
+            name: 'أنور پآي',
             url: process.env.NEXT_PUBLIC_SITE_URL ?? 'https://anwarpi.ai',
             logo: `${process.env.NEXT_PUBLIC_SITE_URL ?? 'https://anwarpi.ai'}/brand/icon-256.png`,
           }),
@@ -67,15 +77,15 @@ export default async function HomePage() {
             <div className="home-hero-copy">
               <p className="kicker">مكتبة عربية للذكاء الاصطناعي العملي</p>
               <h1>افهم الذكاء الاصطناعي، ثم ابنِ به.</h1>
-              <p className="lede">أدلة عربية عملية عن الوكلاء والنماذج والأتمتة، يكتبها مهندسو بنية تحتية لمن يريد أن يشغّل شيئاً حقيقياً.</p>
+              <p className="lede">محتوى عربي عملي عن الوكلاء والنماذج والأتمتة، يكتبه مهندسو بنية تحتية لمن يريد أن يشغّل شيئاً حقيقياً.</p>
               <div className="actions">
-                <a className="btn btn-primary" href="/articles?access=free">ابدأ بدليل مجاني</a>
+                <a className="btn btn-primary" href="/articles">ابدأ القراءة المجانية</a>
                 <Link className="btn btn-quiet" href="/articles">تصفح المكتبة</Link>
               </div>
             </div>
             {hero.length > 0 && (
               <aside className="hero-panel" aria-labelledby="new-title">
-                <h2 id="new-title">أحدث الأدلة</h2>
+                <h2 id="new-title">أحدث المحتوى</h2>
                 <ul role="list">
                   {hero.map(d => {
                     const coverUrl = typeof d.cover === 'object' ? d.cover?.url ?? null : null
@@ -84,13 +94,13 @@ export default async function HomePage() {
                         <Link href={`/posts/${d.slug}`}>
                           {coverUrl && <img className="hero-panel-thumb" src={coverUrl} alt="" width={72} height={48} loading="lazy" />}
                           <span className="hero-panel-title">{d.title}</span>
-                          <span className="meta-row"><span>{d.category}</span><span>{minutesLabel(d.readingMinutes)}</span><span className={d.access === 'vip' ? 'is-vip' : undefined}>{d.access === 'free' ? 'مجاني' : 'للأعضاء'}</span></span>
+                          <span className="meta-row"><span>{d.category}</span><span>{minutesLabel(d.readingMinutes)}</span><span className={d.access === 'vip' ? 'is-vip' : undefined}>{accessLabel(d.access)}</span></span>
                         </Link>
                       </li>
                     )
                   })}
                 </ul>
-                <Link className="text-link" href="/articles">كل الأدلة</Link>
+                <Link className="text-link" href="/articles">كل المحتوى</Link>
               </aside>
             )}
           </div>
@@ -100,7 +110,7 @@ export default async function HomePage() {
           <div className="wrap">
             <header className="section-head">
               <h2 id="paths-title">اختر مساراً حسب ما تريد بناءه</h2>
-              <p>كل دليل ينتمي إلى مسار، وأدلة المبتدئين تظهر أيضاً في الأساسيات.</p>
+              <p>ينتمي كل عنصر محتوى إلى مسار، ويظهر محتوى المبتدئين أيضاً في الأساسيات.</p>
             </header>
             <ol className="paths" role="list">
               {TOPICS.map(topic => (
@@ -120,8 +130,8 @@ export default async function HomePage() {
           <section className="home-start" aria-labelledby="start-title">
             <div className="wrap">
               <header className="section-head">
-                <h2 id="start-title">ابدأ من هنا</h2>
-                <Link className="text-link" href="/articles">كل الأدلة ({formatNumber(docs.length)})</Link>
+                <h2 id="start-title">الأكثر قراءة</h2>
+                <Link className="text-link" href="/articles">كل المحتوى ({formatNumber(docs.length)})</Link>
               </header>
               <ul className="card-grid" role="list">
                 {startHere.map(post => {
@@ -130,10 +140,10 @@ export default async function HomePage() {
                     <li key={post.id}>
                       <article className="guide">
                         {coverUrl && <img className="guide-card-art" src={coverUrl} alt="" width={640} height={320} loading="lazy" />}
-                        <p className="meta-row"><span className="cat">{post.category}</span><span>{minutesLabel(post.readingMinutes)}</span><span className={post.access === 'vip' ? 'is-vip' : undefined}>{post.access === 'free' ? 'مجاني' : 'للأعضاء'}</span></p>
+                        <p className="meta-row"><span className="cat">{post.category}</span><span>{minutesLabel(post.readingMinutes)}</span><span>{formatNumber(post.views ?? 0)} قراءة</span><span className={post.access === 'vip' ? 'is-vip' : undefined}>{accessLabel(post.access)}</span></p>
                         <h3><Link href={`/posts/${post.slug}`}>{post.title}</Link></h3>
                         <p className="guide-dek">{post.dek}</p>
-                        <span className="guide-link" aria-hidden="true">اقرأ الدليل</span>
+                        <span className="guide-link" aria-hidden="true">اقرأ المحتوى</span>
                       </article>
                     </li>
                   )
@@ -146,8 +156,8 @@ export default async function HomePage() {
         <section className="home-membership" id="membership" aria-labelledby="membership-title">
           <div className="wrap membership-panel">
             <div>
-              <h2 id="membership-title">العضوية تفتح الأدلة المتقدمة وملفات العمل.</h2>
-              <p>الأدلة المجانية كاملة دائماً. العضوية تضيف الأدلة المعمّقة، القوالب الجاهزة للتنزيل، والنقاش مع الفريق.</p>
+              <h2 id="membership-title">اقرأ مجاناً الآن؛ العضوية خطة مستقبلية.</h2>
+              <p>{LAUNCH_POLICY.summary}</p>
             </div>
             <div className="membership-offer">
               {freeEarlyAccess() ? (
@@ -159,11 +169,11 @@ export default async function HomePage() {
                 <p className="price"><bdi dir="ltr">{MEMBERSHIP_PRICE}</bdi> <span>شهرياً، وتلغي متى شئت</span></p>
               )}
               <ul role="list">
-                <li>{guidesLabel(docs.length - freeCount)} للأعضاء، وتُضاف أدلة جديدة باستمرار</li>
+                <li>{guidesLabel(docs.length - freeCount)} مصنفة للعضوية مستقبلاً ومفتوحة الآن</li>
                 <li>قوالب وقوائم فحص قابلة للتنزيل</li>
-                <li>التعليق والنقاش على كل دليل</li>
+                <li>القراءة دون حساب؛ التسجيل العام متوقف</li>
               </ul>
-              <Link className="btn btn-primary" href="/subscription">اطّلع على العضوية</Link>
+              <Link className="btn btn-primary" href="/subscription">تفاصيل الوصول المبكر</Link>
             </div>
           </div>
         </section>