- Add descriptive placeholders to name, email, and password input fields.
- Display a helper text in register mode to guide users on password length requirements.
- Adjust password `minLength` validation in the frontend.
- Add `onDragOver`, `onDragLeave`, and `onDrop` event handlers to capture dragged files.
- Introduce `isDragging` state to provide visual UI feedback when a file is hovered over the drop zone.
- Wire the dropped file data to the existing `handleFile` processing logic.
Three interrelated fixes for the Android Google sign-in flow:
1. API base URL mismatch (404 error):
- auth-form.tsx used 'window.location.origin || VITE_API_BASE_URL',
which fell back to 'http://tauri.localhost' in Android WebView
instead of the actual API server.
- Fix: import shared 'apiBaseUrl' from api-client.ts (already had
the correct fallback: 'https://zeavisedu.asepharyana.my.id').
- Added .env with VITE_API_BASE_URL for dev mode resilience.
2. Deep-link caused IPC callback errors:
- 'processDeepLinkUrl()' used window.location.href = target,
triggering a full page reload that orphaned pending Tauri IPC
promises, causing 'Cannot read properties of undefined (reading
'runCallback')' errors.
- Cold-start: keep get_current but use window.location.href (safe
at boot — no SPA state to lose).
- Warm-start: use sessionStorage + custom DOM event + React Router
navigate() via new <DeepLinkRouterHandler /> layout route,
avoiding any page reload.
3. SPA navigation did not trigger OAuth token handler:
- LoginPage's useEffect for ?token=xxx depended only on
[setUser, queryClient, navigate] — location.search changes
from a SPA navigate() call were ignored.
- Fix: added location.search and location to deps.
- Added visibilitychange + focus listeners so returning from the
Google auth browser always re-checks URL params.
Co-Authored-By: Claude <noreply@anthropic.com>
Root cause: dynamic import('@tauri-apps/plugin-opener') silently fails on
Android Tauri WebView because the module resolution path for @tauri-apps/api
(plugin dependency) differs from npm expectations in the bundled context.
Rewrote tauri.ts to use window.__TAURI_INTERNALS__.invoke() directly:
- openUrl() → invoke('plugin:opener|open_url', {url})
- setupDeepLinkHandler() → invoke('plugin:deep-link|get_current')
- Warm-start listener still uses import('@tauri-apps/api/event') for
deep-link://new-url events (bundled as separate chunk by Vite)
- Added @tauri-apps/api as direct dependency
Also kept withGlobalTauri: true (needed for __TAURI_INTERNALS__ injection)
but reverted APK frontendDist back to bundled React app (../web/dist)
since redirect-to-live-web approach was unreliable.
Co-Authored-By: Claude <noreply@anthropic.com>
APK architecture change: replaces bundled React SPA with minimal redirect
page that always loads live web content. No more APK rebuilds for web changes.
Root cause of OAuth failure on Android:
1. Cold-start deep links lost — APK's old bundled JS called onOpenUrl()
(warm-start listener only) but NOT getCurrent() which is required for
cold-start deep links. Fix: redirect page + setupDeepLinkHandler both
call getCurrent() before redirecting/navigating.
2. Session cookie was dropped — renderTauriDeepLinkPage returned a raw
new Response() which overwrote the Set-Cookie header set by the
callback handler. Fix: inject Set-Cookie into the Response.
3. tauri.conf.json frontendDist → "./web/dist-tauri" (redirect page)
4. Added @tauri-apps/plugin-deep-link and @tauri-apps/plugin-opener as
web app deps so live-web imports work in Tauri WebView.
Co-Authored-By: Claude <noreply@anthropic.com>
The intent:// URL in renderTauriDeepLinkPage was intent:/path (single slash),
producing zeavisedu:/login?token=xxx — a non-hierarchical URL that new URL()
cannot parse. Fixed to intent://login/path which produces a proper
hierarchical URI (zeavisedu://login/login?token=xxx).
Also hardened setupDeepLinkHandler to handle both double-slash (://) and
single-slash (:/) custom-scheme URLs as fallback.
Co-Authored-By: Claude <noreply@anthropic.com>
- Delete the `assets/images` directory to reduce repository size and footprint.
- Update `dashboard-page.tsx` to fetch background images from external URLs instead of local file imports.
- Delete the `assets/images` directory to reduce repository size and footprint.
- Update `dashboard-page.tsx` to fetch background images from external URLs instead of local file imports.
- Remove local image imports for the background in login and register pages.
- Update background-image styles to use external URL links for easier asset management.
Login-page won't auto-process token on deep link return because
the WebView stays on the page it was on. Added setupDeepLinkHandler()
which listens for zeavisedu:// scheme URLs and navigates the WebView
to the correct path+query.
Co-Authored-By: Claude <noreply@anthropic.com>
On Tauri Android, window.location.origin = http://tauri.localhost
which is the embedded dev server URL, not the API server.
Use VITE_API_BASE_URL env var which points to the production API.
Co-Authored-By: Claude <noreply@anthropic.com>
Background: Google blocks OAuth in embedded WebView (403 disallowed_useragent).
Solution: open Google login in the Android system browser, then deep-link
back to the Tauri app via custom scheme after callback.
Changes:
- Tauri: add tauri-plugin-opener + tauri-plugin-deep-link to Cargo.toml
- Tauri: register plugins in lib.rs, add capabilities
- Web: auth-form.tsx Google button uses openUrl() via @tauri-apps/plugin-opener
on Tauri (opens in system browser), falls back to window.location.href
- Web: add lib/tauri.ts for isTauri() detection + lazy opens
- API: /auth/google accepts ?platform=tauri → encodes into OAuth state param
- API: /auth/google/callback decodes state → if tauri, renders HTML page
that deep-links back via zeavisedu:// scheme; if web, 302 redirect
- Android: patch script adds deep link intent filter for zeavisedu:// scheme
Co-Authored-By: Claude <noreply@anthropic.com>
Inline SVG with official Google brand colors (blue, green, yellow, red)
placed before the label text with gap-2.5 spacing.
Co-Authored-By: Claude <noreply@anthropic.com>
- useSearchParams can lose params during re-renders, causing blank page
- Use native window.location.search + URLSearchParams instead (always accessible)
- Add oauthProcessing spinner state so user sees 'Menyelesaikan login...'
instead of blank page while /auth/me is being called
Co-Authored-By: Claude <noreply@anthropic.com>
API (apps/api/src/routes/auth.ts):
- Exchange authorization code for tokens via Google's token endpoint
- Decode id_token payload (JWT) to extract sub, email, name
- Find user by googleId → fall back to email match (link accounts)
- Auto-create user if neither found (role: 'user', no password)
- Create session + set cookie, redirect to /login?token=<token>
Web (apps/web/src/pages/login-page.tsx):
- Consume ?token= query param from OAuth redirect
- Store token in localStorage for future API calls
- Fetch /auth/me to hydrate Zustand store, then navigate to dashboard
- Show OAuth errors from ?error= query param
Co-Authored-By: Claude <noreply@anthropic.com>
- Add local fallback using `diseaseCatalogSeed` to populate medicine recommendations in the diagnosis preview modal when API data is missing.
- Remove unused `diagnosesQuery` assignment to resolve SonarLint warning while preserving the background prefetching logic.
- Add CameraCapture component with live viewfinder via getUserMedia
- Support rear/environment camera (default) with switch to front/user
- Capture to JPEG 92% quality via canvas, reuse existing upload flow
- Toggle between 'Unggah' (file upload) and 'Kamera' (live capture) modes
- Error handling for denied/not found/not readable in Bahasa Indonesia
- Add patch script for AndroidManifest CAMERA permission (gen/ is gitignored)
Co-Authored-By: Claude <noreply@anthropic.com>
- Fix `getRiskLevelKey` to properly recognize English risk level values ("low", "high"), preventing "Healthy Leaf" from incorrectly defaulting to medium risk.
- Update confidence bar text and colors to dynamically show warning alerts when AI confidence falls below the 75% threshold.
Android WebView blocks third-party cookies by default. This patch:
- Returns session token in login/register response body
- Stores token in localStorage, sends via Authorization: Bearer header
- Backend getCurrentUser supports Authorization header fallback
Co-Authored-By: Claude <noreply@anthropic.com>
- Cookie SameSite now dynamic: None;Secure when behind HTTPS proxy, Lax otherwise
- AuthGuard useEffect no longer overwrites Zustand store with null from background refetch
- AuthInitializer: add staleTime 30s
Co-Authored-By: Claude <noreply@anthropic.com>
- Set VITE_API_BASE_URL default to production API URL in api-client.ts
so fetch() uses absolute URLs instead of relative paths that fail on Tauri
- Add tauri://localhost and https://tauri.localhost to API CORS allowed origins
- Also fix .env WEB_APP_URL from stale .tech to .my.id
Co-Authored-By: Claude <noreply@anthropic.com>
- Add "Kembali ke Riwayat" button to `diagnosis-detail-page.tsx` for better navigation flow.
- Update camera icon in `diagnose-result-view.tsx` to align with the new UI design.
- Resolve merge conflicts with main to sync latest workflow changes.
- Fix reference error in `DiagnosisResultView` by correctly mapping `riskLevel` prop.
- Integrate dynamic `RiskBadge` with automated severity-to-color mapping for both diagnosis and catalog views.
- Update icons in the medicine recommendation section of `catalog-page` and `DiagnosisResultView` for better visual consistency and intuition.
- Replace previous icons in the medicine recommendation section with more intuitive visual elements.
- Enhance the user interface consistency within the catalog page.
- Implement `useEffect` to ensure smooth scroll-to-top on navigation.
- Add fallback logic to populate medicine recommendations from local seed data if backend payload is incomplete.
- Integrate dynamic `RiskBadge` component with automated severity-to-color mapping for better visual clarity.
- Import diseaseCatalogSeed into diagnosis detail and scan pages.
- Implement fallback logic to populate medicine recommendations when backend payload lacks treatment data.
- Ensure consistent educational content display across catalog and diagnosis views.
- Remove `onClick` toggle handler from `Sidebar` links to prevent unwanted state changes during navigation.
- Remove aggressive `onClick` auto-collapse from `MainLayout` content wrapper so the sidebar remains stable.
- Ensure sidebar state is exclusively managed by the dedicated toggle button, aligning with standard desktop UX.
- Restore setFileName(null) and setPreviewUrl(null) in the mutation onSuccess callback.
- Ensure the file upload area resets to its default state immediately after a successful scan, preparing the UI for the next input.
- Update and clarify inline code comments in the diagnosis result view component.
- Improve code readability and maintainability without altering any underlying logic or UI behavior.
- Remove nested overflow and fixed height classes (`max-h-[75vh]`, `overflow-y-auto`) from the inner modal container to fix the double scrollbar UI glitch.
- Adjust the Modal `size` property to a supported type to resolve TypeScript compilation errors.
- Ensure a cleaner, more seamless scrolling experience for the diagnosis result pop-up.
- Move the `onClick` event handler from the accordion header to the outermost card container in `catalog-page.tsx`.
- Allow users to click anywhere on the expanded card (including the description and treatment sections) to collapse it.
- Improve overall user experience by providing a significantly larger tap target, especially beneficial for mobile or touch-screen users.
- Import `diseaseCatalogSeed` to use as a fallback data source in `catalog-page.tsx`.
- Implement logic to merge backend API responses with local seed data, ensuring `imageUrl` and `medicineRecommendations` are populated.
- Fix an issue where disease images and specific treatments were not rendering due to missing fields in the database payload.
- Enhance UI resilience by displaying accurate visual and medical data without requiring immediate backend updates.
- Convert static PNG image assets to WebP format and remove old PNG files to significantly reduce image payload size and improve page load performance.
- Enhance overall UI resilience and frontend speed.
- Import `useUiStore` into `main-layout.tsx` to access the global sidebar state.
- Add an `onClick` event listener to the main content wrapper.
- Automatically close the sidebar if it is expanded and the user clicks outside of it.
- Enhance overall UX by providing a more intuitive, frictionless way to dismiss the navigation menu.
- Update the `onClick` handler for navigation links in `sidebar.tsx` to use `!isSidebarOpen` instead of a hardcoded boolean.
- Enable navigation items to act as smart toggles: expanding the sidebar when clicked in collapsed mode, and collapsing it when clicked in expanded mode.
- Improve overall user experience by reducing the need to manually click the main toggle button.
- Move `isSidebarOpen` state from local component (`useState`) to global Zustand store (`ui-store.ts`).
- Fix an issue where the sidebar would incorrectly reset to its default closed state when navigating between routes (e.g., to the Telemetry page) due to component remounting.
- Ensure consistent sidebar toggle behavior across the entire dashboard application.
- Update `isSidebarOpen` initial state from true to false in `sidebar.tsx`.
- Ensure the sidebar starts in a mini/collapsed mode when the dashboard is first loaded to provide more space for the main content.
- Import `Date` object to dynamically fetch the current year for the copyright notice.
- Ensure the footer always displays the correct year without manual updates.
- Sync `MobileNav` items and icons with desktop `Sidebar` for consistency.
- Standardize menu icons using `lucide-react` across all navigation components.
- Add a spacer div in `main-layout.tsx` to ensure proper bottom spacing between content and the fixed footer.
- Remove redundant 'aria-hidden' attribute in `MobileNav` to fix accessibility warnings.
- Fix 'Logout' button layout in mobile menu for better responsiveness.
- Introduce `showPassword` state in the `AuthForm` component to allow users to show or hide their password.
- Implement `Eye` and `EyeOff` icons from `lucide-react` for the toggle button UI.
- Change password input type dynamically between 'password' and 'text'.
- Clean up unused `eye` icon import from `login-page.tsx`.
- Create a new `Sidebar` component for desktop with collapse/mini-sidebar feature.
- Rename `navbar.tsx` to `mobile-header.tsx` to better reflect its mobile-specific purpose.
- Synchronize icons (from lucide-react) and menu labels between desktop `Sidebar` and touch-based `MobileNav`.
- Fix 'Logout' button sizing in the mobile menu by removing forced margins for better responsiveness on narrow screens.
- Remove conflicting 'aria-hidden' attribute in MobileNav to resolve browser accessibility (a11y) warnings.
- Add a spacer in `main-layout.tsx` to prevent the bottom content from being overlapped by the fixed Footer.
asepharyana