Migrated backoffice, hackathon, dimentorin, gacha, qrcampaign, and
infra from custom react-router file-based routing to TanStack Router
file-based routing following the tanstack-frontend-best-practice
convention.
Key changes per app:
- New routes/ directory with __root.tsx, _public.tsx, _authenticated.tsx
- Auth guards via beforeLoad (replaces old middleware.ts)
- createFileRoute pattern for all page components
- TanStackRouterVite plugin in vite.config for auto route generation
- _components/_hooks folders colocated with routes (ignored by router)
- routeTree.gen.ts auto-generated on dev/build
Convention:
- _public/* routes redirect to dashboard if authenticated
- _authenticated/* routes redirect to /auth/login if not authenticated
- $param for dynamic segments (was [param] in old convention)
- _layout suffix for pathless layout routes
Removed:
- Old src/app/ directories from all apps
- Old src/middleware.ts files
- Custom convertPagesToRoute utility (no longer needed)
- react-router dependency usage (kept in package.json for shared libs)
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
The <link rel="stylesheet" href="/src/..."> tags reference source
paths that only exist in dev mode. In production builds, Vite injects
CSS through the JS bundle. These broken links caused 404 errors and
unstyled pages in production.
Affected: backoffice, dimentorin, gacha, hackathon, infra
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Stripped dark: classes from Input, Textarea, Button, and InputField
components. These were causing black/dark backgrounds in modals and
forms across all apps (backoffice, gacha, dimentorin, etc).
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
All login pages now use react-hook-form with zod resolver for
real-time validation:
- Email validated as proper email format on each keystroke
- Password required validation
- Red border + error message shown inline below invalid fields
- Submit button disabled until all fields are valid
- Input type="text" instead of type="email" to avoid browser tooltip
Also fixed:
- Gacha API trailing slash on /items/ and /credits/ causing 404s
Apps updated: hackathon, dimentorin, backoffice, qrcampaign, gacha
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Updated default HydrateFallback in file-based-routing to show a
centered blue spinner instead of bare "Loading..." text
- Added inline spinner to all index.html root divs so users see a
spinner immediately while JS bundles load (instead of blank white)
- Affects: dimentorin, hackathon, backoffice, gacha, qrcampaign, infra
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Stripped all dark: classes from hackathon, dimentorin, backoffice,
and qrcampaign login pages — light mode only
- Rewrote gacha login modal to match the unified clean design:
clean typography, native inputs with eye toggle, proper spacing,
removed old IMPHNEN logo header and Indonesian text
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Dimentorin: replaced anime-themed login with clean dark-mode design,
removed Google login, uses shared useLogin hook
- Backoffice: replaced custom hook login with unified design, clean
admin-only layout (no signup link)
- QR Campaign: added dark mode support to match hackathon style
All login pages now share consistent:
- Dark/light mode support
- Email + password fields with show/hide toggle
- GitHub OAuth button
- Error handling UI
- Same Tailwind class patterns
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Fix API service paths to use /v1/iam/, /v1/dimentorin/, /v1/gacha/, /v1/hackathon/ prefixes
- Add roles, permissions, events, testimonials, sessions API services and hooks
- Rewrite gacha service with full CRUD + roll/claim endpoints
- Replace all mock data in backoffice pages with real API calls (accounts, roles, permissions, gacha-roll, dashboard, sessions, users-dimentorin, feedback-review, settings)
- Wire dimentorin mentoring list to useMentorList with search + pagination
- Wire dimentorin mentor detail page to useMentorById, pass real data to all sections
- Wire appointment modal to useBookSession with controlled schedule inputs
- Wire gacha app Spin Now to useExecuteGachaRoll, show credits and real items
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Upgrade Nx 22.1.1 → 22.6.3 and all patch/minor dependencies
- Restructure shared libs: move business logic from utils to service
- Consolidate shadcn-ui into ui lib with atomic design pattern
- Fix container centering for landing app (Tailwind v4 compatibility)
- Fix button styling by updating @source directive in globals.css
- Fix SiCss3 → SiCss rename in react-icons 5.6
- Fix duplicate useSession export conflict
- Remove dead code, comments, and unused files
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* feat(backoffice): create a boilerplate page for Hackathon dashboard
- Create an empty page for Hackathon dashboard
- Comment out and hide the existing backoffice sidebar
* feat(backoffice): Create a nested/dropdown sidebar list
- Create a dropdown sidebar list
- Show back the old navigation and group them
- Make the sidebar responsive for mobile view
* test datatable with mock data
* base UI for Hackathon backoffice
TODO:
- Organize table schema for users, teams, and submissions management
- Create API Contract for additional back-end endpoint
* feat(hackathon): draft data table column & API Contract
* update endpoint
* feat(backoffice): update page hackathon user management
- update data table component
- update filtering & pagination
- add modal display to edit and add user
- hide notification icon in backoffice wrapper
* feat(backoffice): add API contract for hackathon users
* feat(backoffice): little adjustment in hackathon users management UI and API contract
* feat(backoffice): update hackathon team management page
- add modal for manage team, add new team, and view project submission
- reorganize the table column and data table
* feat(backoffice): add searchable city filter
- add component for city filter
- apply to user management and team management pages
* feat(backoffice): improve hackathon team modal UI and add API contract
- Add feature to select city in team detail modal using CityFilterSelect component
- Add feature to change team logo and banner
- Add API contract documentation for hackathon teams in backoffice
* feat(backoffice): authentication middleware, error pages, and 404 page
* feat(backoffice): hackathon dashboard integration
* feat(backoffice): users page integration
- Get users data from API
- Set up server-side pagination and match URL params
- Hide filter that doesn't exist in back-end
* feat(backoffice): teams page integration
- Get teams data from API
- Hide filter that doesn't exists in back-end
- Simplify modal according to the back-end
* feat(backoffice): submission page integration
- Fetch submissions data from API
- Move submission modal to hackathon-submissions page
* feat(backoffice): create a boilerplate page for Hackathon dashboard
- Create an empty page for Hackathon dashboard
- Comment out and hide the existing backoffice sidebar
* feat(backoffice): Create a nested/dropdown sidebar list
- Create a dropdown sidebar list
- Show back the old navigation and group them
- Make the sidebar responsive for mobile view
* test datatable with mock data
* base UI for Hackathon backoffice
TODO:
- Organize table schema for users, teams, and submissions management
- Create API Contract for additional back-end endpoint
* feat(hackathon): draft data table column & API Contract
* update endpoint
* feat(backoffice): update page hackathon user management
- update data table component
- update filtering & pagination
- add modal display to edit and add user
- hide notification icon in backoffice wrapper
* feat(backoffice): add API contract for hackathon users
* feat(backoffice): little adjustment in hackathon users management UI and API contract
Triggering deployment for all apps to deploy the following changes:
- Fixed circular dependency between utils and service libraries
- Added missing auth hooks (usePostVerifyEmail, useGoogleCallback, etc.)
- Moved useAuthStore from utils to service
- All apps now build successfully
Apps to deploy:
- hackathon
- gacha
- dimentorin
- backoffice
- landing
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Pisahkan type dan schema untuk gacha roll item
- Perbaiki validasi gacha roll item
- Parsing angka pada component ControlledInputField
- Update type number untuk component Input dan InputField
- Tambah fitur login dan logout pada Backoffice
- Ubah port development server dan atasi CORS
- Update type login response
- Update component Input agar toggle password berfungsi dengan benar
- Tambah custom hook 'use-query-state' dan implementasi stepper pada modal dengan tahapan lebih dari 1
- Hapus component ModalBackoffice karena sudah menggunakan component umum Modal
- Slicing desain modal untuk backoffice di storybook component ModalBackoffice
- Update static directory untuk storybook agar dapat membaca gambar pada folder public
- Minor edit component button & input