Skip to content

Add Urdu (اردو) language support across the platform #61

Description

@aliirz

Summary

Add complete Urdu translation support to Numainda, making Pakistan's constitutional knowledge accessible in both English and Urdu.

Scope

Phase 1: Static UI Translation (next-intl)

Use next-intl (v3.x) with prefix-based routing (/about = English, /ur/about = Urdu).

Infrastructure:

  • Install next-intl, configure next.config.mjs
  • Create i18n/ config (routing, request, navigation)
  • Create middleware.ts for locale detection
  • Move all pages into app/[locale]/ (API routes stay outside)
  • Create translation files messages/en.json + messages/ur.json

Typography & RTL:

  • Add Noto Nastaliq Urdu font (lib/fonts.ts)
  • Update root layout with dynamic lang, dir, and font
  • Convert directional Tailwind classes to logical properties (mlms, plps, etc.)
  • Urdu line-height fix (Nastaliq script needs line-height: ~2.2)

String replacement (~500 strings across all pages/components):

  • Homepage (hero, cards, stats)
  • About page
  • Chat page + floating chat bubble
  • Bills listing + detail pages
  • Proceedings listing + detail pages
  • Constitution page (table of contents, section descriptions)
  • Representatives listing + detail pages
  • Site header, footer, navigation
  • Auth flow (Pehchan login, callback)
  • Form labels, placeholders, error messages, toasts
  • Accessibility text (aria-labels, sr-only)

UI:

  • Add language switcher (اردو / English) to site header
  • Chat input dir="auto" for mixed-language typing
  • Pass locale to chat API so AI responds in the correct language

Phase 2: Database Content Translation

For dynamic content from the database (bill summaries, proceedings, constitution text), two approaches are on the table — decide which to pursue:

Option A: AI-powered on-the-fly translation (with caching)

  • Use existing OpenAI integration to translate content on demand
  • Add a translations table to cache results (translate once, serve forever)
  • Pros: No manual translation effort, uses existing API key, good Urdu quality from GPT
  • Cons: Initial load delay for uncached content, API cost for first translation

Option B: Store real Urdu translations in the database

  • Add Urdu columns/rows to existing tables (documents, bills, proceedings)
  • Manually translate or bulk-translate content
  • Pros: Instant load, verified accuracy for legal text
  • Cons: Significant translation effort, ongoing maintenance for new content

Option C: Hybrid

  • Use Option A as the default, allow admins to override with verified translations (Option B)
  • Best of both worlds but more complex

Pages NOT translated (internal/admin):

  • /admin/dashboard
  • /admin/upload
  • API error responses

Technical Details

  • Package: next-intl@3.x (compatible with Next.js 13)
  • Routing: Prefix-based, localePrefix: 'as-needed' (no prefix for English default)
  • Font: Noto Nastaliq Urdu (Google Fonts)
  • RTL: dir="rtl" on <html>, Tailwind logical properties

Why This Matters

Pakistan has two official languages. Most citizens are more comfortable in Urdu. Making constitutional and legal knowledge accessible in Urdu directly serves Numainda's mission.

🤖 Generated with Claude Code

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions