feat: admin API integration, LogoMark, settings page, i18n, RTL font, docs

- Wire admin API into homepage + templates page (ISR 60s, null fallback)
- Add src/lib/admin-api.ts with safeFetch helper
- Add adminProjectToTemplateItem + adminProjectToCatalogTemplate mappers
- Add LogoMark SVG component, replace Sparkles icon in Navbar/Footer/Sidebar
- Add public/favicon.svg (SVG brand mark)
- Rewrite opengraph-image.tsx with FlatRender branding
- Add RTL/Persian font cascade: unlayered [dir=rtl] block forces Vazirmatn
- Dashboard Settings page: Profile, Security, Billing, Notifications sections
- Add src/lib/supabase/client.ts browser client
- Admin API: GET /me, PATCH /profile, POST /change-password endpoints
- Admin API DTOs: AdminUserDto, UpdateProfileRequest, ChangePasswordRequest
- Admin UI Settings page with TanStack Query + mutations
- Add CLAUDE.md + README.md to both repos for new-machine onboarding
- Update PROJECT_MEMORY.md with session log
- Add appsettings.Development.json.example template
This commit is contained in:
Soroush.Asadi
2026-05-27 09:06:51 +03:30
parent 4875e468fe
commit 36e264f3e3
27 changed files with 1275 additions and 88 deletions
+45 -21
View File
@@ -1,36 +1,60 @@
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).
# FlatRender
## Getting Started
AI-powered video and image creation platform. Create professional videos and images with templates, a drag-and-drop studio, and one-click export.
First, run the development server:
## Products
- **Video Maker** — timeline editor, Konva canvas, scene browser, transitions, audio, nexrender export
- **Image Editor** — Konva canvas, filters, crop, background removal, layer system
- **Video Trimmer** — ffmpeg.wasm in-browser trim + crop + export
- **Templates** — browsable marketplace with category sidebar
## Quick Start
```bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
npm install
cp .env.example .env.local # fill in your credentials
npm run dev # http://localhost:3000
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
## Related Repos
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
| Repo | Path | Purpose |
|---|---|---|
| flatrender | `D:\Projects\flatrender` | This repo — Next.js app |
| flatrender-admin | `D:\Projects\flatrender-admin\admin-api` | .NET 10 Admin API |
| flatrender-admin | `D:\Projects\flatrender-admin\admin-ui` | React Admin SPA |
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.
## Stack
## Learn More
- **Next.js 15** App Router · TypeScript · Tailwind CSS · shadcn/ui
- **Supabase** — auth, database, storage
- **Stripe** — subscription payments
- **React-Konva** — canvas editor (video + image)
- **next-intl** — Persian (default) + English i18n
- **ffmpeg.wasm** — browser-side video trimming
- **nexrender** — server-side After Effects rendering
To learn more about Next.js, take a look at the following resources:
## Environment Variables
- [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.
See `.env.example` for the full list. Minimum required to run:
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
```env
NEXT_PUBLIC_SUPABASE_URL=
NEXT_PUBLIC_SUPABASE_ANON_KEY=
```
## Deploy on Vercel
Without Supabase the app runs in mock mode (studio uses localStorage).
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.
## Database Migrations
Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
Run in order in Supabase SQL Editor:
1. `supabase/migrations/001_profiles.sql`
2. `supabase/migrations/002_render_jobs.sql`
3. `supabase/migrations/003_projects.sql`
## Admin Panel
The admin panel at `D:\Projects\flatrender-admin` manages templates, categories, and media. When `ADMIN_API_URL=http://localhost:5000` is set, the Next.js app fetches live data from it. Without it, hardcoded fallback data is used.
See `CLAUDE.md` for full development guide.