feat: marketing production-ready pass — report-issue, i18n, RTL, a11y

.env.example

@@ -0,0 +1,51 @@
+# Marketing site environment variables.
+# Copy to .env.local and fill in values. Never commit .env.local.
+
+# ─── App URL ───────────────────────────────────────────────────────
+NEXT_PUBLIC_APP_URL=http://localhost:3000
+NEXT_PUBLIC_BASE_URL=http://localhost:3000
+NEXT_PUBLIC_ROOT_DOMAIN=
+
+# ─── Auth.js ───────────────────────────────────────────────────────
+NEXTAUTH_URL=http://localhost:3000
+AUTH_SECRET=
+NEXTAUTH_SECRET=
+
+# ─── OAuth providers ───────────────────────────────────────────────
+GOOGLE_CLIENT_ID=
+GOOGLE_CLIENT_SECRET=
+FACEBOOK_CLIENT_ID=
+FACEBOOK_CLIENT_SECRET=
+
+# ─── Database (Neon serverless Postgres) ───────────────────────────
+DATABASE_URL=
+
+# ─── Email (Resend) ────────────────────────────────────────────────
+RESEND_API_KEY=
+EMAIL_FROM=
+
+# ─── AI chatbot (Groq) ─────────────────────────────────────────────
+GROQ_API_KEY=
+
+# ─── Payments (Stripe) ─────────────────────────────────────────────
+STRIPE_API_KEY=
+STRIPE_WEBHOOK_SECRET=
+NEXT_PUBLIC_STRIPE_PRO_MONTHLY_PLAN_ID=
+NEXT_PUBLIC_STRIPE_PRO_YEARLY_PLAN_ID=
+NEXT_PUBLIC_STRIPE_BUSINESS_MONTHLY_PLAN_ID=
+NEXT_PUBLIC_STRIPE_BUSINESS_YEARLY_PLAN_ID=
+NEXT_PUBLIC_STRIPE_ULTRA_MONTHLY_PLAN_ID=
+NEXT_PUBLIC_STRIPE_ULTRA_YEARLY_PLAN_ID=
+
+# ─── Image CDN (ImageKit) ──────────────────────────────────────────
+IMAGEKIT_PUBLIC_KEY=
+IMAGEKIT_PRIVATE_KEY=
+IMAGEKIT_URL_ENDPOINT=
+NEXT_PUBLIC_IMAGEKIT_URL_ENDPOINT=
+
+# ─── GitHub (report-issue → creates issues in databayt/marketing) ──
+GITHUB_PERSONAL_ACCESS_TOKEN=
+GITHUB_REPO=databayt/marketing
+
+# ─── Optional: misc ────────────────────────────────────────────────
+TELEGRAM_BOT_TOKEN=

.gitignore

@@ -32,6 +32,7 @@ yarn-error.log*
 
 # env files (can opt-in for committing if needed)
 .env*
+!.env.example
 
 # vercel
 .vercel

README.md

@@ -1,37 +1,88 @@
-This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
+# Marketing — databayt.org
 
-## Getting Started
+Public landing site for [databayt](https://databayt.org). Bilingual (English / Arabic with full RTL), bills via Stripe, hosts the AI consult chatbot, and lets visitors report issues directly into GitHub.
 
-First, run the development server:
+Part of the [databayt](https://github.com/databayt) family. See sibling repos: [hogwarts](https://github.com/databayt/hogwarts), [souq](https://github.com/databayt/souq), [mkan](https://github.com/databayt/mkan), [shifa](https://github.com/databayt/shifa), [kun](https://github.com/databayt/kun).
+
+## Stack
+
+- Next.js 16.1 (App Router, Turbopack dev)
+- React 19, TypeScript 5
+- Tailwind CSS 4 + shadcn/ui (Radix primitives)
+- Prisma 7 + Neon serverless Postgres
+- Auth.js v5 (Google + Facebook OAuth, credentials, 2FA)
+- Stripe + Resend + Groq (Llama 3.1 chatbot)
+- ImageKit CDN
+
+## Quickstart
 
 ```bash
-npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-# or
-bun dev
+pnpm install
+cp .env.example .env.local      # fill in values
+pnpm dev                         # http://localhost:3000
 ```
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+The dev server uses Turbopack and supports HMR. Routes are prefixed with the locale (`/en/...`, `/ar/...`); the proxy in `proxy.ts` handles locale detection from the `NEXT_LOCALE` cookie + `Accept-Language` header.
+
+## Scripts
 
-You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
+| Command | What it does |
+| --- | --- |
+| `pnpm dev` | Dev server on :3000 |
+| `pnpm build` | Production build (runs `prisma generate` first) |
+| `pnpm start` | Serve the production build |
+| `pnpm lint` | ESLint |
+
+## Architecture
+
+```
+src/
+  app/[lang]/           # locale-segmented routes
+    (marketing)/        # public pages with SiteHeader/Footer
+    (auth)/             # login, join, reset, new-password, verification
+    chatbot/            # standalone chatbot page
+    wizard/             # multi-step onboarding wizard
+  components/
+    marketing/          # landing-page sections
+    auth/               # auth flows + server actions
+    chatbot/            # AI chat widget
+    template/           # site shell (header, footer, wizard chrome)
+    ui/                 # shadcn primitives
+    internationalization/  # en.json, ar.json, dictionaries.ts
+  lib/
+    actions/            # cross-cutting server actions
+    use-translations.ts # client-side translation hook
+  env.mjs               # zod-validated env schema (t3-oss)
+  routes.ts             # public/auth route lists, default redirect
+proxy.ts                # Next 16 middleware-equivalent (locale detection)
+prisma/schema.prisma    # User, ServicePackage, Project, Payment, Inquiry, …
+```
 
-This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
+## Internationalization
 
-## Learn More
+Dictionaries live at `src/components/internationalization/{en,ar}.json`. Both files mirror the same key shape — adding a key in one means adding it in the other.
 
-To learn more about Next.js, take a look at the following resources:
+Server components: `getDictionary(locale)` (`dictionaries.ts`).
+Client components: `useTranslations()` returns `{ t, locale, isRTL, localeConfig }`.
 
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+The locale-aware `Rubik` font auto-applies on RTL routes; LTR uses `GeistSans`. Use logical Tailwind utilities (`ms-*`, `me-*`, `ps-*`, `pe-*`, `start-*`, `end-*`, `text-start`, `text-end`) instead of physical ones — they flip automatically under `dir=rtl`.
 
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
+## Report-an-issue
 
-## Deploy on Vercel
+A floating Bug-icon button is mounted globally in `[lang]/layout.tsx`. It opens a dialog, posts to the `reportIssue` server action, and creates a GitHub issue in `databayt/marketing` with `report` label, page URL, browser, viewport, and direction metadata.
 
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+Requires `GITHUB_PERSONAL_ACCESS_TOKEN` (repo scope) in env. Without it, the action returns an error and the toast shows the localized failure message — the UI degrades gracefully.
+
+## Deployment
+
+Vercel auto-deploys on push to `main`. Preview deploys on PR. Mirror new `.env.example` keys into Vercel project env (Production + Preview). Never set per-deploy overrides via the dashboard — `.env.local` is the source of truth locally and Vercel env mirrors it.
+
+## Contributing
+
+See `CLAUDE.md` for AI-coding-agent conventions, and follow the GitHub workflow:
+
+```
+issue → branch (feat|fix|chore/<slug>) → atomic commits → PR (Closes #N) → squash merge
+```
 
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
-# Trigger rebuild
+Conventional Commits, present tense, body explains the *why*.

next.config.ts

@@ -2,8 +2,15 @@ import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
   typescript: {
+    // TODO: re-enable once pre-existing pricing/wizard `any` types are
+    // tightened (tracked separately).
     ignoreBuildErrors: true,
   },
+  compiler: {
+    // Strip console.* from production builds, keeping warn/error.
+    removeConsole:
+      process.env.NODE_ENV === 'production' ? { exclude: ['warn', 'error'] } : false,
+  },
   images: {
     remotePatterns: [
       {

src/app/[lang]/(marketing)/layout.tsx

@@ -13,14 +13,7 @@ export default function SiteLayout({
   const chatbotRef = useRef<{ openChat: () => void }>(null);
 
   const handleChatClick = () => {
-    // This will be called from the mobile header button
-    console.log('handleChatClick called', { chatbotRef: chatbotRef.current });
-    if (chatbotRef.current?.openChat) {
-      console.log('Opening chat...');
-      chatbotRef.current.openChat();
-    } else {
-      console.warn('Chat ref or openChat method not available');
-    }
+    chatbotRef.current?.openChat?.();
   };
 
   return (

src/app/[lang]/layout.tsx

@@ -8,9 +8,16 @@ import { ThemeProvider } from "@/components/atom/theme-provider";
 import { ImageKitProvider } from "@/components/ui/imagekit-provider";
 import { Toaster } from "sonner";
 import { getDictionary } from "@/components/internationalization/dictionaries";
-import { type Locale, localeConfig } from "@/components/internationalization/config";
-// import { SessionProvider } from "next-auth/react";
-// import { auth } from "@/auth";
+import { i18n, type Locale, localeConfig } from "@/components/internationalization/config";
+import { SessionProvider } from "next-auth/react";
+import { auth } from "@/auth";
+import { ReportIssue } from "@/components/report-issue";
+
+function resolveLocale(rawLang: string): Locale {
+  return (i18n.locales as readonly string[]).includes(rawLang)
+    ? (rawLang as Locale)
+    : i18n.defaultLocale;
+}
 
 // Configure Rubik font for Arabic
 const rubik = Rubik({
@@ -22,16 +29,15 @@ const rubik = Rubik({
 export const viewport: Viewport = {
   width: 'device-width',
   initialScale: 1,
-  maximumScale: 1,
-  userScalable: false,
 };
 
 export async function generateMetadata({
   params,
 }: {
-  params: Promise<{ lang: Locale }>;
+  params: Promise<{ lang: string }>;
 }): Promise<Metadata> {
-  const { lang } = await params;
+  const { lang: rawLang } = await params;
+  const lang = resolveLocale(rawLang);
   const dict = await getDictionary(lang);
   const baseUrl = process.env.NEXT_PUBLIC_BASE_URL || 'https://databayt.org';
 
@@ -78,13 +84,13 @@ export default async function LocaleLayout({
   params,
 }: Readonly<{
   children: React.ReactNode;
-  params: Promise<{ lang: Locale }>;
+  params: Promise<{ lang: string }>;
 }>) {
-  // const session = await auth();
-  const { lang } = await params;
+  const [{ lang: rawLang }, session] = await Promise.all([params, auth()]);
+  const lang = resolveLocale(rawLang);
   const config = localeConfig[lang];
   const isRTL = config.dir === 'rtl';
-  
+
   return (
     <html lang={lang} dir={config.dir}>
       <body
@@ -95,19 +101,19 @@ export default async function LocaleLayout({
           rubik.variable
         )}
       >
-        {/* <SessionProvider session={session}> */}
-
-            <ThemeProvider>
-              <ImageKitProvider>
-                <div className="layout-container">
-                  <Toaster position={isRTL ? "bottom-left" : "bottom-right"} />
-                  
-                  {children}
+        <SessionProvider session={session}>
+          <ThemeProvider>
+            <ImageKitProvider>
+              <div className="layout-container">
+                <Toaster position={isRTL ? "bottom-left" : "bottom-right"} />
+                {children}
+                <div className="fixed bottom-4 start-4 z-40 print:hidden">
+                  <ReportIssue variant="icon" />
                 </div>
-              </ImageKitProvider>
-            </ThemeProvider>
-
-        {/* </SessionProvider> */}
+              </div>
+            </ImageKitProvider>
+          </ThemeProvider>
+        </SessionProvider>
       </body>
     </html>
   );

src/app/[lang]/not-found.tsx

@@ -1,12 +1,16 @@
 import Link from 'next/link';
+import { cookies } from 'next/headers';
 import { Button } from '@/components/ui/button';
 import { getDictionary } from '@/components/internationalization/dictionaries';
-import type { Locale } from '@/components/internationalization/config';
+import { i18n, type Locale } from '@/components/internationalization/config';
 
 export default async function NotFound() {
-  // For not-found pages, we can't reliably get locale from params
-  // so we'll default to English and handle this gracefully
-  const dict = await getDictionary('en');
+  const cookieStore = await cookies();
+  const cookieLocale = cookieStore.get('NEXT_LOCALE')?.value;
+  const locale: Locale = (i18n.locales as readonly string[]).includes(cookieLocale ?? '')
+    ? (cookieLocale as Locale)
+    : i18n.defaultLocale;
+  const dict = await getDictionary(locale);
 
   return (
     <div className="flex min-h-screen flex-col items-center justify-center">
@@ -16,11 +20,9 @@ export default async function NotFound() {
           <h2 className="text-2xl font-bold">{dict.errors.notFound}</h2>
         </div>
         <Button asChild>
-          <Link href="/en">
-            {dict.common.home}
-          </Link>
+          <Link href={`/${locale}`}>{dict.common.home}</Link>
         </Button>
       </div>
     </div>
   );
-}
+}

src/app/api/auth/[...nextauth]/route.ts

@@ -1,7 +1 @@
-console.log("Auth configuration:", {
-  NEXTAUTH_URL: process.env.NEXTAUTH_URL,
-  GOOGLE_CLIENT_ID: process.env.GOOGLE_CLIENT_ID?.slice(0, 10) + "...",
-  callbackUrl: `${process.env.NEXTAUTH_URL}/api/auth/callback/google`
-});
-
-export { GET, POST } from "@/auth"
+export { GET, POST } from "@/auth"

src/app/robots.ts

@@ -1,13 +1,16 @@
 import { MetadataRoute } from 'next';
 
-const baseUrl = process.env.NEXT_PUBLIC_BASE_URL || 'http://localhost:3001';
+const baseUrl = process.env.NEXT_PUBLIC_BASE_URL || 'http://localhost:3000';
 
 export default function robots(): MetadataRoute.Robots {
   return {
-    rules: {
-      userAgent: '*',
-      allow: '/',
-    },
+    rules: [
+      {
+        userAgent: '*',
+        allow: '/',
+        disallow: ['/api/', '/login', '/join', '/reset', '/new-password', '/new-verification', '/wizard'],
+      },
+    ],
     sitemap: `${baseUrl}/sitemap.xml`,
   };
 }

src/app/sitemap.ts

@@ -1,15 +1,16 @@
 import { MetadataRoute } from 'next';
 import { type Locale, i18n } from '@/components/internationalization/config';
 
-const locales: Locale[] = i18n.locales;
-const baseUrl = process.env.NEXT_PUBLIC_BASE_URL || 'http://localhost:3001';
+const locales: readonly Locale[] = i18n.locales;
+const baseUrl = process.env.NEXT_PUBLIC_BASE_URL || 'http://localhost:3000';
 
-// Define all your pages here
+// Public pages indexed for search. Auth/wizard intentionally omitted.
 const pages = [
-  '',        // home page
+  '',         // home
   '/about',
-  '/pricing', 
+  '/pricing',
   '/service',
+  '/chatbot',
 ];
 
 export default function sitemap(): MetadataRoute.Sitemap {