Introduce a `valueFormatter` prop to the `ChartCard` component to allow
customized data presentation in tooltips. This enables more readable
units for specific metrics, such as converting bytes to MiB or
seconds to milliseconds.
Rewrite the telemetry page logic to bypass the custom proxy API in
favor of direct Prometheus queries.
- Implement `queryRange` and `queryInstant` helpers for Prometheus API
- Replace `TelemetryAPI` client with direct fetch calls to Prometheus
- Update data fetching logic to use standard Prometheus query parameters
- Simplify state management and data transformation for charts
Add a comprehensive telemetry dashboard page featuring real-time
system statistics and metric visualization using recharts.
- Integrate recharts for area and bar chart rendering
- Implement TelemetryAPI client for stats, discovery, and chart data
- Add dashboard UI with stat cards and responsive charts
- Remove legacy nginx sub_filter proxy configuration in favor of
direct API communication to telemetry.imrnes.team
Transition telemetry dashboard integration from an external URL approach to a local reverse proxy via Nginx. This simplifies client-side connectivity by routing all telemetry requests through the existing web server's domain.
- Configure Nginx to proxy `/telemetry/` sub-paths to the internal telemetry service
- Implement `sub_filter` in Nginx to rewrite root-relative paths for the SPA
- Remove `VITE_TELEMETRY_URL` build arguments and environment variable dependencies
- Simplify `TelemetryPage` to use a relative `/telemetry` base path
- Clean up deployment workflows and Dockerfile by removing unused telemetry build args
Replace the hardcoded Nginx proxy configuration with a dynamic environment variable approach. This allows the telemetry dashboard to be loaded via a public URL instead of relying on a local Tailscale proxy.
- Add `VITE_TELEMETRY_URL` build argument to Dockerfile
- Pass `VITE_TELEMETRY_URL` through GitHub Actions deployment workflow
- Remove `/telemetry/` location block from nginx.conf
- Update `TelemetryPage` to use the new environment variable and improve iframe loading state management
- mobile-nav: add 'review' path to NAV_ITEMS array to ensure the menu is accessible on mobile screens.
- scan-page: update background color and border radius of the guidelines card in the right sidebar.
- app & navbar: comment out login, register, and logout features.
- scan-page: align info cards vertically and reduce upload area padding.
- mobile-nav: implement React Portal to fix overlapping menu issue.
- Remove userRole prop, read user directly from auth store
- Add user info section (avatar, name, email) when logged in
- Add Masuk/Daftar buttons at bottom when unauthenticated
- Add Keluar button with loading state when authenticated
- Add tagline under logo in sidebar header
- Add backdrop blur effect for better visual depth
- Use flex-col layout for consistent spacing at any height
- Add conditional button behavior based on file selection state
- Before file selected: button opens file picker
- After file selected: button triggers file upload to API
- Show "Mengunggah..." text and disable button during upload
- Display error messages below button when upload fails
This fixes the issue where users could select files but had no way
to submit them for analysis.
- Add flex-wrap and min-w-0 to prevent RiskBadge from overflowing
the card boundary when commonName is long (e.g., Northern/Southern Leaf Blight)
- Fix both catalog-page.tsx and disease-card.tsx for consistency
- Add MainLayout wrapper to /catalog, /catalog/:slug, and /expert/reviews
routes in app.tsx so they share the same navbar and footer as dashboard
- Remove duplicate header/layout/spacing from CatalogPage,
DiseaseDetailPage, and ExpertReviewsPage
- Update ExpertReviewsPage to use consistent space-y layout pattern
matching other pages
- Update CatalogPage to remove outer main wrapper since MainLayout
provides the container
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Make dashboard disease quick-access cards clickable → link to /catalog/:slug
- Update catalog page to match dashboard styling (4-column grid, consistent
card design with colored dot, risk badge, line-clamp summary)
- Add URL param support to catalog (?risk=high) so dashboard's
"Risiko Tinggi" stat card link works
- Remove confusing "Total Penyakit" stat card (was counting catalog rows,
always 4). Replace with "Total Diagnosa" linking to /diagnoses,
"Gagal" stat, and rename "Risiko Tinggi" to "Kategori Risiko Tinggi"
linking to /catalog?risk=high
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Fix auth system: remove redirect bugs in login/register pages, register
routes, wrap protected routes with AuthGuard, add AuthInitializer
- Add missing navbar links (Diagnosa, Pustaka, expert Review)
- Fix DiagnosesPage status filter to match DB DiagnosisStatus enum,
support URL params (?status=, ?risk=) from dashboard links
- Replace hardcoded disease data on Dashboard with API-driven data,
fix layout bugs (invalid gap-57 class, empty Button)
- Rewrite LibraryPage to use API instead of mock-diseases.ts
- Indonesian-ize Expert Reviews page labels and text
- Wrap DiagnosisDetailPage with MainLayout for consistent layout
- Improve ScanPage UX: image preview before upload, lucide icons,
proper disease names in result modal, file size validation
- Delete dead code: mock-diseases.ts, unused form components,
tailwind.config.ts (Tailwind v4 does not read v3 config)
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Refactor landing page content and links for better user experience.
- Introduce a new library page to display disease information with filtering and modal details.
- Add a scan page for users to upload images for diagnosis with a preview modal.
- Enhance login and registration pages with automatic navigation to the dashboard.
- Integrate vite-tsconfig-paths for improved path resolution in Vite configuration.
- Add proper id/htmlFor associations for verified/corrected radio inputs
- Clear correctedDiseaseSlug when switching verdict to verified to prevent stale state
- Add required={verdict === 'corrected'} to disease select
- Add loading state distinguishing between loading reviews/diseases and empty queue
- Add type="button" to diagnosis list selection buttons
- Improve selected diagnosis image alt text to include disease name
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Prevent object URL leaks in image-classification-form by revoking previous preview URL before replacing it, revoking after successful submit, and revoking on component unmount
- Improve preview image alt text from generic "Preview" to descriptive Indonesian text "Pratinjau gambar daun jagung untuk diagnosis"
- Use auth store setter consistently in dashboard-page logout instead of direct setState call
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Clear error state before submitting credentials in login page
- Clear error state before submitting registration in register page
- Add optional onFieldChange callback to AuthForm to clear parent errors when fields change
- Add role="alert" to error paragraph for accessibility
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Extend shared types for image classification, including PredictionProbability, UploaderMetadata, and ImageClassificationRecord.
- Create image_classifications table in the database with necessary fields and foreign key constraints.
- Implement disease mappers to convert database rows to shared disease records.
- Develop uploader client to handle image uploads to external service.
- Create image model service to load and classify images using TensorFlow.js.
- Add API routes for image classification, including GET for history and POST for new classifications.
- Implement frontend components for image classification form and display results.
- Update dashboard to integrate image classification functionality and display results.
- Document implementation plan for backend image classification.
- Add disease detail page component with data fetching and error handling
- Create shared types for diseases and classifications
- Implement API routes for diseases, classifications, and dashboard summary
- Develop reusable components for risk badge and disease card
- Build catalog page with search and filter functionality
- Update dashboard page with data-backed summary and manual classification form
- Register new routes in the web application
- Ensure type safety and consistency across shared modules
MythEclipse