1. Home page file drop now shows quick-action tool selector
2. Auth disabled by default in dev (Docker still defaults to true)
3. Tool settings wrapped in forms - Enter key triggers processing
After upload: dropzone replaced by image viewer with zoom controls.
After processing: review panel shows result preview, file info, download,
undo button, and suggested next tools for chaining.
Add useMobile hook for viewport detection (<768px). Update AppLayout
with hamburger menu, slide-over sidebar overlay, and fixed bottom
navigation bar (Tools, Automate, Files, Settings) for mobile. Update
Sidebar with expanded mode for mobile overlay. Update ToolPage to
stack settings above dropzone on mobile with collapsible panel. Add
new routes for /automate and /fullscreen. Integrate Settings dialog
and keyboard shortcuts at the App root level.
Create /fullscreen page showing all 37 tools grouped by 9 categories
in a card grid layout. Each category card has a colored header with
icon and tool count badge. Includes search bar, Show/Hide Details
toggle for tool descriptions, and button to switch back to sidebar view.
Create Automate page at /automate with pipeline builder component.
Includes 5 preset templates (Social Media Ready, Privacy Clean, Web
Optimization, Profile Picture, Watermark Batch), saved automation
management, step reordering, and pipeline execution with download.
- Add replace-color tool with pixel-level color replacement and tolerance
- Register all 19 new Phase 3 tools in routes/tools/index.ts
- Map all new tool IDs to settings components in tool-page.tsx
- Add PDF, ZIP, ICO, JSON content types to download route
- Install qrcode, jsqr, potrace, pdfkit dependencies
Draggable split-view slider with clip-path reveals original vs processed
image. Shows file size badges with savings percentage. Supports pointer
events for both mouse and touch. Integrated into tool-page to replace
dropzone after processing completes. Updated file-store with
originalBlobUrl for comparison. Enhanced dropzone with multi-file count
badge and file list display.
Adds Zustand file store, useToolProcessor hook for upload/process/download
flow, and 7 settings components: resize (with social media presets), crop
(with aspect ratio presets), rotate/flip, convert, compress (quality +
target size modes), strip-metadata, and color adjustments (brightness,
contrast, saturation, channels, effects). Updates tool-page to render the
appropriate settings panel based on toolId.
Siddharth Kumar Sah