chore: update docs
This commit is contained in:
@@ -8,8 +8,11 @@
|
||||
| `package.json` | Dependencies and npm scripts | Adding dependencies, understanding build |
|
||||
| `tsconfig.json` | TypeScript configuration | Compiler settings, path aliases |
|
||||
| `vite.config.ts` | Vite build configuration | Build optimization, plugins |
|
||||
| `eslint.config.js` | ESLint configuration | Linting rules, code style |
|
||||
| `jest.config.ts` | Jest test configuration | Test setup |
|
||||
| `tailwind.config.js` | Tailwind CSS configuration | Styling, theme customization |
|
||||
| `index.html` | HTML entry point | SPA shell, meta tags |
|
||||
| `nginx.conf` | Nginx server configuration | Production serving, SPA routing |
|
||||
| `Dockerfile` | Container build definition | Docker builds, deployment |
|
||||
|
||||
## Subdirectories
|
||||
|
||||
@@ -17,4 +17,6 @@
|
||||
| `core/` | Shared infrastructure (auth, api, store) | Cross-cutting concerns |
|
||||
| `components/` | Root-level shared components | App-wide UI components |
|
||||
| `pages/` | Page-level components | Page structure, routing targets |
|
||||
| `shared/` | Shared feature components (CameraCapture) | Cross-feature reusable components |
|
||||
| `shared-minimal/` | Minimal shared UI (skeletons, theme) | Reusable UI primitives |
|
||||
| `utils/` | General utilities (logger) | Logging, helper functions |
|
||||
|
||||
@@ -1,7 +1,5 @@
|
||||
# frontend/src/features/
|
||||
|
||||
Feature module directory. Each feature contains pages/, components/, hooks/, api/, types/.
|
||||
|
||||
## Subdirectories
|
||||
|
||||
| Directory | What | When to read |
|
||||
@@ -14,6 +12,8 @@ Feature module directory. Each feature contains pages/, components/, hooks/, api
|
||||
| `maintenance/` | Maintenance record UI | Service tracking, reminders |
|
||||
| `notifications/` | Notification display | Alert UI, notification center |
|
||||
| `onboarding/` | Onboarding wizard | First-time user experience |
|
||||
| `ownership-costs/` | Ownership cost tracking UI | Cost displays, expense forms |
|
||||
| `settings/` | User settings pages | Preferences, account settings |
|
||||
| `stations/` | Gas station finder UI | Station search, favorites, map |
|
||||
| `subscription/` | Subscription and billing UI | Stripe integration, plan management |
|
||||
| `vehicles/` | Vehicle management UI | Vehicle list, details, forms |
|
||||
|
||||
@@ -1,12 +1,11 @@
|
||||
# frontend/src/features/subscription/
|
||||
|
||||
Subscription and billing management feature with Stripe integration.
|
||||
# subscription/
|
||||
|
||||
## Files
|
||||
|
||||
| File | What | When to read |
|
||||
| ---- | ---- | ------------ |
|
||||
| `README.md` | Feature overview and API integration | Understanding subscription flow |
|
||||
| `index.ts` | Feature barrel export | Importing subscription components |
|
||||
|
||||
## Subdirectories
|
||||
|
||||
@@ -19,15 +18,3 @@ Subscription and billing management feature with Stripe integration.
|
||||
| `pages/` | Desktop subscription page | Desktop implementation |
|
||||
| `mobile/` | Mobile subscription screen | Mobile implementation |
|
||||
| `constants/` | Subscription plan configurations | Plan pricing and features |
|
||||
|
||||
## Key Patterns
|
||||
|
||||
- Desktop: MUI components with sx props
|
||||
- Mobile: Tailwind classes with GlassCard
|
||||
- Stripe Elements for payment methods
|
||||
- React Query for data fetching
|
||||
- Toast notifications for user feedback
|
||||
|
||||
## Environment Variables
|
||||
|
||||
- `VITE_STRIPE_PUBLISHABLE_KEY` - Required for Stripe Elements initialization
|
||||
|
||||
@@ -1,32 +1,7 @@
|
||||
# frontend/src/shared/
|
||||
|
||||
Shared components that are reusable across multiple features.
|
||||
|
||||
## Subdirectories
|
||||
|
||||
| Directory | What | When to read |
|
||||
| --------- | ---- | ------------ |
|
||||
| `components/CameraCapture/` | Camera capture with crop tool | Building OCR features, image upload |
|
||||
|
||||
## Components
|
||||
|
||||
### CameraCapture
|
||||
|
||||
Full-featured camera capture component with:
|
||||
- `getUserMedia` API for camera access
|
||||
- Translucent guidance overlays (VIN, receipt, document)
|
||||
- Post-capture crop tool
|
||||
- File input fallback for desktop/unsupported browsers
|
||||
- HEIC, JPEG, PNG support
|
||||
|
||||
Usage:
|
||||
```tsx
|
||||
import { CameraCapture } from '@/shared/components/CameraCapture';
|
||||
|
||||
<CameraCapture
|
||||
onCapture={(file, croppedFile) => handleCapture(file, croppedFile)}
|
||||
onCancel={() => setShowCamera(false)}
|
||||
guidanceType="vin"
|
||||
allowCrop={true}
|
||||
/>
|
||||
```
|
||||
| `components/` | Shared components (CameraCapture) | Cross-feature reusable components |
|
||||
|
||||
Reference in New Issue
Block a user