Skip to content

Conversation

@cybervoid0
Copy link
Owner

Refactor: Migrate from API routes to Server Functions

What

  • Complete migration from Next.js API routes (/api/v2/*) to Server Functions pattern
  • Restructured data layer with dedicated lib/ modules for each domain (barometers, brands, categories, etc.)
  • Enhanced admin functionality with new brand management and improved form handling
  • Integrated Zod validation for type-safe form schemas
  • Modernized component architecture with better separation of concerns

Why

  • Performance improvement: Server Functions eliminate unnecessary network roundtrips
  • Better type safety: Direct TypeScript integration without API serialization overhead
  • Simplified architecture: Removed ~20 API route files and consolidated logic
  • Enhanced DX: Better error handling and debugging capabilities
  • Future-proof: Aligns with Next.js App Router best practices

Key Changes

Removed API Routes (20+ files)

  • /api/v2/barometers/*lib/barometers/queries.ts
  • /api/v2/manufacturers/*lib/brands/queries.ts
  • /api/v2/categories/*lib/categories/queries.ts
  • All other domain APIs migrated to respective lib/ modules

Enhanced Admin Features

  • New brand management: Complete CRUD operations with image handling
  • Improved barometer forms: Zod validation + better UX
  • Document management: Streamlined upload and processing

Component Improvements

  • Refactored edit fields with consistent patterns
  • Added reusable multi-select, image-upload, icon-upload components
  • Better error states and loading indicators

Technical Improvements

  • Type safety: Full TypeScript coverage without any types
  • Form validation: Zod schemas for all admin forms
  • Image handling: Enhanced upload and processing logic
  • Code organization: Clear separation between queries, actions, and components

Migration Impact

  • Breaking changes: None for end users
  • Performance: Faster page loads and form submissions
  • Maintainability: Cleaner codebase with better organization
  • Bundle size: Reduced client-side JavaScript

- Added a comment in the barometer page to investigate the use of Prisma.BarometerCreateInput type for schema foundation.
- Renamed the form submission handler in the document page from `handleFormSubmit` to `submitForm` for clarity.
- Updated the form submission method to use the new handler, improving code readability and maintainability.
- Introduced a new export for `revalidateCategory` in the utils index, enhancing server-side functionality.
…er form with zod

- Replaced Yup with Zod for form validation in the barometer component, enhancing type safety and validation capabilities.
- Updated the form submission logic to utilize Zod's transformation and validation features.
- Added Zod as a new dependency in package.json and bun.lock for consistent validation handling.
- Cleaned up unused imports and improved code readability in the barometer form component.
- Updated the BrandEdit component to include a multi-select for countries and successors, improving user experience.
- Integrated a new ManufacturerImageEdit component for better image management, allowing drag-and-drop functionality and image uploads.
- Refactored form handling to utilize Zod for validation, ensuring type safety and cleaner code.
- Added a RequiredFieldMark component for indicating mandatory fields in forms.
- Implemented deleteImages function for handling image deletions from storage.
- Cleaned up imports and improved overall code organization across several files.
…and query files for server-side rendering support
…bmission state management

- Added state management for form submission success to prevent unnecessary cleanup of temporary images.
- Refactored image deletion logic to ensure only removed images are deleted from storage.
- Cleaned up the component by consolidating the cleanup logic on dialog close.
…oved data fetching and form handling

- Replaced existing form handling logic with dedicated BarometerForm and DocumentForm components for better separation of concerns.
- Enhanced data fetching by utilizing async functions to retrieve conditions, categories, movements, brands, and materials in AddBarometer and conditions and all barometers in AddDocument.
- Updated type definitions for materials and movements to ensure consistency across the application.
- Cleaned up imports and improved overall code organization in related files.
- Updated the package.json dump command to include dotenv and script execution for database backup.
- Added a new link in the Admin component for adding brands, enhancing navigation and user experience.
- Removed the AddManufacturer component to streamline the barometer form, consolidating manufacturer management within the brand editing process.
- Refactored the barometer form to include required field indicators for better user guidance.
- Improved image handling in the BrandEdit component by integrating icon upload functionality.
- Cleaned up imports and improved overall code organization across several files.
- Moved barometer and category query functions to dedicated files in the lib directory for better organization and maintainability.
- Updated import paths across the application to reflect the new structure, ensuring consistency.
- Removed obsolete API service file to streamline the codebase.
- Cleaned up unused imports and improved overall code organization in related components and services.
- Wrapped the BrandEdit component in an IsAdmin check to restrict editing functionality to admin users.
- Corrected the order of parameters in the searchBarometers function call to align with the updated function signature, improving search functionality.
- Cleaned up imports and improved overall code organization in the affected files.
…e multi-select functionality into forms

- Deleted the MaterialsMultiSelect component to streamline the codebase and reduce redundancy.
- Replaced the MaterialsMultiSelect usage in BarometerForm and DocumentForm with a new MultiSelect component for improved consistency and functionality.
- Updated related imports and adjusted props to align with the new MultiSelect implementation.
- Enhanced overall code organization and maintainability across affected files.
@cybervoid0 cybervoid0 merged commit aa41cf2 into master Sep 11, 2025
1 check failed
@cybervoid0 cybervoid0 deleted the api-to-server-functions branch September 14, 2025 05:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants