create-techtiten-app 0.0.0-stage → 0.2.0

package/templates/root/_github/workflows/android.yml

@@ -0,0 +1,79 @@
+name: Android Build & Release
+
+# Push to main (or run by hand) -> build a signed AAB on GitHub's runner -> upload to Google Play.
+# No EAS servers: `expo prebuild` generates android/ on the runner, then plain Gradle builds it.
+# Only mobile changes trigger it, so a web/API fix never starts a Play release.
+on:
+  push:
+    branches: [main]
+    paths:
+      - "apps/mobile/**"
+      - "packages/**"
+      - "package-lock.json"
+      - "!**/*.md"
+  workflow_dispatch:
+    inputs:
+      track:
+        description: "Play track (internal / alpha / beta / production)"
+        required: false
+        default: ""
+
+env:
+  # New apps start on the internal track. Switch to production once the app is live and tested.
+  PLAY_TRACK: internal
+
+jobs:
+  android:
+    name: Build & Release Android
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-java@v4
+        with: { distribution: zulu, java-version: "17" }
+      - uses: gradle/actions/setup-gradle@v4
+      - uses: actions/setup-node@v4
+        with: { node-version: "22", cache: npm }
+
+      - name: Install
+        run: npm ci
+
+      - name: Typecheck
+        run: npm run typecheck
+
+      - name: Expo prebuild (generate android/)
+        working-directory: apps/mobile
+        env:
+          BUILD_NUMBER: ${{ github.run_number }}
+          EXPO_NO_TELEMETRY: "1"
+        run: npx expo prebuild --platform android --clean --no-install
+
+      # After prebuild: --clean wipes android/
+      - name: Decode keystore
+        working-directory: apps/mobile
+        env:
+          ANDROID_KEYSTORE_BASE64: ${{ secrets.ANDROID_KEYSTORE_BASE64 }}
+        run: echo "$ANDROID_KEYSTORE_BASE64" | base64 --decode > android/app/release.keystore
+
+      - name: Build release bundle (AAB)
+        working-directory: apps/mobile/android
+        env:
+          ANDROID_KEYSTORE_PATH: release.keystore # read by plugins/withSigning.js (relative to android/app)
+          ANDROID_KEY_ALIAS: ${{ secrets.ANDROID_KEY_ALIAS }}
+          ANDROID_KEYSTORE_PASSWORD: ${{ secrets.ANDROID_KEYSTORE_PASSWORD }}
+          ANDROID_KEY_PASSWORD: ${{ secrets.ANDROID_KEY_PASSWORD }}
+        run: ./gradlew bundleRelease --no-daemon
+
+      - name: Upload to Google Play
+        uses: r0adkll/upload-google-play@v1
+        with:
+          serviceAccountJsonPlainText: ${{ secrets.ANDROID_SERVICE_ACCOUNT_JSON }}
+          packageName: __PACKAGE_ID__
+          releaseFiles: apps/mobile/android/app/build/outputs/bundle/release/app-release.aab
+          track: ${{ github.event.inputs.track || env.PLAY_TRACK }}
+          status: completed
+          whatsNewDirectory: apps/mobile/distribution/whatsnew
+
+      - uses: actions/upload-artifact@v4
+        with:
+          name: app-release-bundle
+          path: apps/mobile/android/app/build/outputs/bundle/release/app-release.aab

package/templates/root/_github/workflows/web-check.yml

@@ -0,0 +1,19 @@
+name: Web check
+
+# Typecheck + build the Next.js app on every PR (Vercel deploys it on merge).
+on:
+  pull_request:
+    paths: ["apps/web/**", "packages/**", "package-lock.json"]
+
+jobs:
+  web:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with: { node-version: "22", cache: npm }
+      - run: npm ci
+      - run: npm run typecheck
+      - run: npm run build:web
+        env:
+          NEXT_TELEMETRY_DISABLED: "1"

package/templates/root/_gitignore

@@ -0,0 +1,33 @@
+# deps / builds
+node_modules/
+.expo/
+dist/
+web-build/
+.next/
+out/
+build/
+*.tsbuildinfo
+next-env.d.ts
+
+# generated native projects (CNG: made by `expo prebuild` at build time)
+apps/mobile/android/
+apps/mobile/ios/
+
+# secrets: never commit these
+.env
+.env.*
+credentials/
+*.keystore
+*.jks
+*.p8
+*.p12
+*.mobileprovision
+google-services.json
+GoogleService-Info.plist
+*service-account*.json
+*-firebase-adminsdk-*.json
+
+# misc
+.DS_Store
+.vercel
+*.log

package/templates/root/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "__APP_SLUG__",
+  "private": true,
+  "workspaces": [
+    "apps/*",
+    "packages/*"
+  ],
+  "scripts": {
+    "mobile": "npm run start -w __SCOPE__/mobile",
+    "android": "npm run android -w __SCOPE__/mobile",
+    "web": "npm run dev -w __SCOPE__/web",
+    "build:web": "npm run build -w __SCOPE__/web",
+    "typecheck": "npm run typecheck --workspaces --if-present",
+    "format": "prettier --write .",
+    "upgrade:mobile": "cd apps/mobile && npx expo install expo@latest && npx expo install --fix",
+    "upgrade:web": "npm install next@latest eslint-config-next@latest -w __SCOPE__/web"
+  },
+  "engines": {
+    "node": ">=20.19"
+  }
+}

package/templates/web/src/app/(site)/page.tsx

@@ -0,0 +1,18 @@
+import Link from 'next/link';
+
+// The public website / web version of the app. Shares colors with the phone app (packages/theme).
+export default function Home() {
+  return (
+    <main className="mx-auto flex w-full max-w-3xl flex-1 flex-col justify-center gap-8 px-6 py-16">
+      <div className="flex flex-col gap-4">
+        <span className="w-fit rounded-full bg-surface-alt px-3 py-1 text-sm text-text-muted">by Techtiten</span>
+        <h1 className="text-5xl font-black tracking-tight">__APP_NAME__</h1>
+        <p className="text-lg text-text-muted">This is the website. Edit <code>src/app/(site)/page.tsx</code>. The admin panel is at <code>/admin</code> and the API at <code>/api</code>.</p>
+      </div>
+      <div className="flex flex-wrap gap-3">
+        <Link href="/admin" className="rounded-xl bg-brand px-5 py-3 font-bold text-on-brand">Open admin</Link>
+        <a href="/api/health" className="rounded-xl border border-border px-5 py-3 font-bold">API health</a>
+      </div>
+    </main>
+  );
+}

package/templates/web/src/app/admin/layout.tsx

@@ -0,0 +1,17 @@
+import Link from 'next/link';
+
+// Everything under /admin is behind HTTP basic auth (src/proxy.ts, ADMIN_USER / ADMIN_PASSWORD).
+export default function AdminLayout({ children }: LayoutProps<'/admin'>) {
+  return (
+    <div className="flex min-h-full flex-1">
+      <aside className="w-56 shrink-0 border-r border-border bg-surface p-5">
+        <div className="mb-6 text-lg font-black">__APP_NAME__ <span className="text-text-muted font-medium">admin</span></div>
+        <nav className="flex flex-col gap-1 text-sm">
+          <Link href="/admin" className="rounded-lg px-3 py-2 hover:bg-surface-alt">Dashboard</Link>
+          <Link href="/" className="rounded-lg px-3 py-2 hover:bg-surface-alt">View site</Link>
+        </nav>
+      </aside>
+      <main className="flex-1 p-8">{children}</main>
+    </div>
+  );
+}

package/templates/web/src/app/admin/page.tsx

@@ -0,0 +1,32 @@
+import { JOBS } from '@/server/jobs';
+
+const cards = [
+  { label: 'Users', value: '—', hint: 'connect your database' },
+  { label: 'Active today', value: '—', hint: 'connect your database' },
+  { label: 'Scheduled jobs', value: String(Object.keys(JOBS).length), hint: 'src/server/jobs.ts' },
+];
+
+export default function AdminHome() {
+  return (
+    <div className="flex flex-col gap-8">
+      <h1 className="text-3xl font-black">Dashboard</h1>
+      <div className="grid gap-4 sm:grid-cols-3">
+        {cards.map((c) => (
+          <div key={c.label} className="rounded-2xl border border-border bg-surface p-5">
+            <div className="text-sm text-text-muted">{c.label}</div>
+            <div className="mt-1 text-3xl font-black">{c.value}</div>
+            <div className="mt-2 text-xs text-text-muted">{c.hint}</div>
+          </div>
+        ))}
+      </div>
+      <div className="rounded-2xl border border-border bg-surface p-5">
+        <h2 className="mb-3 font-bold">Jobs</h2>
+        <ul className="flex flex-col gap-2 text-sm">
+          {Object.entries(JOBS).map(([name, job]) => (
+            <li key={name} className="flex justify-between gap-4"><code>/api/cron/{name}</code><span className="text-text-muted">{job.description}</span></li>
+          ))}
+        </ul>
+      </div>
+    </div>
+  );
+}

package/templates/web/src/app/api/cron/[job]/route.ts

@@ -0,0 +1,17 @@
+import { JOBS } from '@/server/jobs';
+
+// Scheduled jobs. Vercel functions are short-lived, so an outside timer calls this:
+//   cron-job.org or a GitHub Actions schedule ->
+//   POST https://<your-app>/api/cron/<job>   header  x-cron-key: <CRON_API_KEY>
+// Keep each run short; for big work, do it in batches and save where you stopped.
+export async function POST(request: Request, ctx: RouteContext<'/api/cron/[job]'>) {
+  const key = process.env.CRON_API_KEY;
+  if (!key) return Response.json({ error: 'CRON_API_KEY is not set' }, { status: 503 });
+  if (request.headers.get('x-cron-key') !== key) return Response.json({ error: 'Not allowed' }, { status: 401 });
+  const { job } = await ctx.params;
+  const run = JOBS[job];
+  if (!run) return Response.json({ error: `Unknown job: ${job}` }, { status: 404 });
+  const started = Date.now();
+  const result = await run.handler();
+  return Response.json({ ok: true, job, ms: Date.now() - started, result });
+}

package/templates/web/src/app/api/health/route.ts

@@ -0,0 +1,8 @@
+import { connection } from 'next/server';
+import { healthSchema } from '__SCOPE__/shared';
+
+// GET /api/health. The response shape is the shared zod schema, so the phone app parses the same type.
+export async function GET() {
+  await connection(); // run per request (not prerendered at build time)
+  return Response.json(healthSchema.parse({ ok: true, app: '__APP_SLUG__', time: new Date().toISOString() }));
+}

package/templates/web/src/app/globals.css

@@ -0,0 +1,23 @@
+@import "tailwindcss";
+
+/* Colors are CSS variables written by app/layout.tsx from packages/theme.
+   Use them as Tailwind classes: bg-background, text-text, bg-brand, border-border… */
+@theme inline {
+  --color-background: var(--color-background);
+  --color-surface: var(--color-surface);
+  --color-surface-alt: var(--color-surface-alt);
+  --color-border: var(--color-border);
+  --color-text: var(--color-text);
+  --color-text-muted: var(--color-text-muted);
+  --color-brand: var(--color-brand);
+  --color-brand-strong: var(--color-brand-strong);
+  --color-accent: var(--color-accent);
+  --color-on-brand: var(--color-on-brand);
+  --color-danger: var(--color-danger);
+}
+
+body {
+  background: var(--color-background);
+  color: var(--color-text);
+  font-family: var(--font-app, ui-sans-serif), system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+}

package/templates/web/src/app/layout.tsx

@@ -0,0 +1,24 @@
+import type { Metadata } from 'next';
+import { cssVariables } from '__SCOPE__/theme';
+import { appFontClass } from './fonts';
+import './globals.css';
+
+export const metadata: Metadata = {
+  title: '__APP_NAME__',
+  description: '__APP_NAME__ by Techtiten',
+};
+
+// Theme colors come from packages/theme (same as the phone app), as CSS variables.
+const toCss = (vars: Record<string, string>) => Object.entries(vars).map(([k, v]) => `${k}:${v}`).join(';');
+const themeCss = `:root{${toCss(cssVariables('light'))}}@media (prefers-color-scheme: dark){:root{${toCss(cssVariables('dark'))}}}`;
+
+export default function RootLayout({ children }: LayoutProps<'/'>) {
+  return (
+    <html lang="en" className={`h-full antialiased ${appFontClass}`}>
+      <head>
+        <style dangerouslySetInnerHTML={{ __html: themeCss }} />
+      </head>
+      <body className="min-h-full flex flex-col">{children}</body>
+    </html>
+  );
+}

package/templates/web/src/proxy.ts

@@ -0,0 +1,26 @@
+import { NextResponse, type NextRequest } from 'next/server';
+
+// HTTP basic auth for the admin panel and admin APIs. Set ADMIN_USER and ADMIN_PASSWORD
+// in Vercel (and in apps/web/.env.local for development). Swap for real auth later if you need it.
+export function proxy(request: NextRequest) {
+  const user = process.env.ADMIN_USER;
+  const pass = process.env.ADMIN_PASSWORD;
+  if (!user || !pass) return new NextResponse('Admin is locked: set ADMIN_USER and ADMIN_PASSWORD.', { status: 503 });
+
+  const header = request.headers.get('authorization') ?? '';
+  const [scheme, encoded] = header.split(' ');
+  if (scheme === 'Basic' && encoded) {
+    const [u, ...rest] = atob(encoded).split(':');
+    if (same(u, user) && same(rest.join(':'), pass)) return NextResponse.next();
+  }
+  return new NextResponse('Login required', { status: 401, headers: { 'WWW-Authenticate': 'Basic realm="admin"' } });
+}
+
+// Compare without exiting early, so the time taken doesn't reveal how much matched.
+function same(a: string, b: string) {
+  let diff = a.length ^ b.length;
+  for (let i = 0; i < Math.max(a.length, b.length); i++) diff |= (a.charCodeAt(i) || 0) ^ (b.charCodeAt(i) || 0);
+  return diff === 0;
+}
+
+export const config = { matcher: ['/admin/:path*', '/api/admin/:path*'] };

package/templates/web/src/server/jobs.ts

@@ -0,0 +1,9 @@
+// Server-only jobs, called by /api/cron/[job]. Add yours here.
+type Job = { description: string; handler: () => Promise<unknown> };
+
+export const JOBS: Record<string, Job> = {
+  'daily-summary': {
+    description: 'Example job: replace with your own (reminders, cleanup, reports).',
+    handler: async () => ({ processed: 0 }),
+  },
+};