تخطَّ إلى المحتوى الرئيسي

Developer Page Specifications

Listing Page

/:lang/founders — search, filters, sort, founder card grid.

مكتمل

المسار: /:lang/founders. شبكة من كل كروت المؤسّسين المنشورة مع بحث، فلاتر (دولة، قطاع، دور، علم verified، علم claimed/founder-led)، ومنسدلة فرز. أكثر-اتّصالاً entity-type على المنصّة — كل كرت يُبرز thumbnail من شركات المؤسّس + عدد شارات تاريخ التحدّث.

أقسام الصفحة (من الأعلى للأسفل)

  1. A · Hero (eyebrow + H1 + lede + 2 CTAs)
  2. B · شريط إحصاءات (إجمالي المؤسّسين، عدد verified، عدد founder-led)
  3. C · شريط بحث + فلاتر (country، sector، role، verified، founder-led)
  4. D · منسدلة فرز (most-relevant، newest، alphabetical، most-mentioned)
  5. E · شبكة كروت المؤسّسين (<app-founder-card> القياسية)
  6. F · banner CTA "ادّع ملفك" (لغير-المُسَجَّلين)
  7. G · شريط cross-module (Founder Files / متحدّثو Calendar / spotlight ملف تحريري)
  8. H · footer عام

C · عقد الفلتر

q (بحث)
Debounced 300ms · يُطابق عبر: FounderLang.DisplayName، FounderLang.Bio، FounderLang.Headline، Country.Name، Startup.Name (joined). الحد الأدنى 2 حرف.
country (تعدّد-اختيار)
المصدر: Founder.CountryCode. قيمة الفلتر: ISO 3166-1 alpha-2. query param: country=eg,sa.
sector (تعدّد-اختيار)
المصدر: مُجَمَّع من Founder.relatedStartupIds → Startup.industries[]. مؤسّس بشركات عبر عدة قطاعات يَظهر تحت أيّ قطاع مُختار.
role (تعدّد-اختيار)
المصدر: Founder.PrimaryRole. القيم: ceo، cto، cofounder، founder، operator. مدفوعة بجدول lookup لـ Founder.PrimaryRole.
verified (bool)
المصدر: Founder.IsVerified. صندوق فحص واحد. حين true، فقط صفوف Founder.IsVerified=true.
flavor (اختيار-واحد)
القيم: all | editorial | founder-led. المصدر: Founder.Flavor. Editorial = مكتوبة-طاقم، أبداً غير-مُدَّعاة-ذاتياً؛ founder-led = مُدَّعاة-ذاتياً عبر حساب.
sort (اختيار-واحد)
القيم: most-relevant (افتراضي مع q) | newest (Founder.PublishedAt DESC) | alphabetical (DisplayName ASC، مع collation محلّية) | most-mentioned (عدد مراجع إشارات cross-module DESC).

E · حقول كرت المؤسّس

avatarUrl
المصدر: Founder.AvatarUrl. مربع 96×96 (2x = 192×192). الاحتياطي: SVG مُتولَّد initial-on-tinted-bg. مطلوب: نعم (بصرياً).
displayName
المصدر: FounderLang.DisplayName. Bilingual. مطلوب: نعم.
headline
المصدر: FounderLang.Headline. سطر واحد 80 حرف كحد أقصى. "CEO at Paymob" / "Co-founder, Climatech Africa". مطلوب: نعم.
chip الدور
المصدر: Founder.PrimaryRole (lookup → تسمية). العرض: chip أحرف-كبيرة صغير.
chip الدولة
علم emoji + Country.NameLang. المصدر: Founder.CountryCode + Country.NameLang.
شارة verified
المصدر: Founder.IsVerified. إيقونة ✓ خضراء صغيرة. tooltip: "Editorially verified".
شارة flavor
المصدر: Founder.Flavor. pill "Editorial" (بنفسجي) أو "Founder-led" (أزرق). مخفي حين flavor=editorial و IsVerified=true (الحالة الافتراضية، لا حاجة لشارة).
thumbnails الشركات (حتى 3)
المصدر: Founder.relatedStartupIds → Startup.LogoUrl[0..2]. متراصّة أفقياً مع تَداخل margin سالب. "+N" overflow حين ≥4 شركات.
chip عدد الإشارات
المصدر: COUNT(EcosystemEntityLinks WHERE RelatedEntityType='founder' AND RelatedEntityId=Founder.Id). العرض: "Mentioned in {N}" حين N ≥ 1. أخفِ خلاف ذلك.
CTA — View Profile
routerLink: /:lang/founders/{Founder.Slug}. يُطلق founder_card_click.

حالات UI

  • Loading: 12 كرت skeleton (يطابق الحجم الافتراضي للصفحة).
  • Empty: حالة فارغة موثَّقة مع CTA "Clear filters" + رابط لـ /:lang/founders.
  • Error: toast + CTA retry، يَحفظ الكروت المُحَمَّلة.
  • Pagination: scroll لانهائي عبر IntersectionObserver. 24 كرت/دفعة.