Skip to content

Version v3.1.0

Latest
Latest

Choose a tag to compare

View all tags
@anikeshwebkul anikeshwebkul released this 20 Mar 11:54
· 8 commits to main since this release
v3.1.0
44c6bb1

Overview

Version v3.1.0 represents a major refactoring of the Bagisto Next.js Commerce platform, focusing on API consolidation, improved component architecture, and enhanced user experience. This release transitions from multiple REST API endpoints to a unified GraphQL API and introduces comprehensive product review functionality.

Key Highlights

🚀 API Consolidation

  • Unified GraphQL Endpoint: All API operations now route through a single /api/graphql endpoint for better maintainability and performance.
  • Removed REST APIs: Deprecated legacy REST API routes for cart, checkout, and review operations.
  • Better Query Management: Implemented GraphQL fragments (ProductCore, ProductDetailed) for more efficient and reusable queries.

⭐ Product Review System

  • Full-featured product review system with user ratings and review creation.
  • New review components: ReviewButton, NoReview, ReviewSection, ReviewDetail, AddProductReview.
  • Product review hooks for seamless integration: useProductReview, getProductReviews.
  • Enhanced product detail pages with comprehensive review information.

🎨 Enhanced UI/UX

  • Improved Responsiveness: Complete refactoring for better mobile-first design.
  • Loading States: New loading spinners and shimmer components for smooth data transitions.
  • Error Boundaries: Comprehensive error boundary implementation for better error handling.
  • Skeleton Loaders: Added skeleton loaders for navbar, product grid, and carousel sections.

🏗️ Code Architecture Improvements

  • Cleaner Provider Structure: Refactored providers with GlobalProviders and SessionManager for better session handling.
  • Organized GraphQL Queries: Better folder structure and organization of GraphQL queries and mutations.
  • Custom Hooks: New utility hooks for common operations: useCache, useAddress, useBodyScrollLock, etc.
  • Type Safety: Enhanced TypeScript types and definitions across the application.

Technical Changes

New Files & Components

GraphQL

  • /api/graphql/route.ts - Unified GraphQL API endpoint
  • graphql/catalog/ - Reorganized catalog queries and mutations
  • graphql/catalog/fragments/ - Reusable GraphQL fragments

Components

  • components/error/ErrorBoundary.tsx - Error boundary component
  • components/common/LoadingSpinner.tsx - Loading spinner component
  • components/common/Shimmer.tsx - Shimmer loading component
  • components/layout/navbar/CartAndUserActions.tsx - Cart and user actions
  • components/layout/navbar/CategoriesMenu.tsx - Categories menu component
  • components/catalog/review/ - Complete review system components

Utilities & Hooks

  • utils/hooks/useCache.ts - Custom caching hook
  • utils/hooks/useAddress.ts - Address management hook
  • utils/hooks/getProductReviews.ts - Product reviews fetching hook

Removed Files & Components

REST API Routes (Migrated to GraphQL)

  • /api/cart/addToCart/route.ts
  • /api/cart/createGuestToken/route.ts
  • /api/cart/mergeCart/route.ts
  • /api/cart/removeCart/route.ts
  • /api/cart/updateCart/route.ts
  • /api/cart-detail/route.ts
  • /api/checkout/paymentMethods/route.ts
  • /api/checkout/placeOrder/route.ts
  • /api/checkout/saveAddress/route.ts
  • /api/checkout/saveCheckoutAddresses/route.ts
  • /api/checkout/savePayment/route.ts
  • /api/checkout/saveShipping/route.ts
  • /api/checkout/shippingMethods/route.ts
  • /api/review/route.ts

Deprecated Providers

  • providers/AppWrapper.tsx
  • providers/MainProvider.tsx
  • providers/ReactQueryProvider.tsx
  • providers/TanstackProvider.tsx

Old Folder Structure

  • graphql/catelog/ → Migrated to graphql/catalog/ (typo fixed)

Migration Guide for Developers

If You're Using REST API Endpoints

All REST API calls should now use the unified GraphQL endpoint:

Before:

POST /api/cart/addToCart
POST /api/checkout/saveAddress
POST /api/review

After:

POST /api/graphql
// Send GraphQL mutations

If You're Using Custom Providers

Update your provider imports:

Before:

import { AppWrapper, MainProvider } from '@/providers';

After:

import { GlobalProviders } from '@/providers';

Product Review Access

Use the new product review hooks:

import { useProductReview, getProductReviews } from '@/utils/hooks';

Performance Improvements

  • Optimized Loading States: Shimmer and skeleton components reduce perceived load time.
  • Efficient GraphQL Queries: Fragments reduce data transfer and improve query efficiency.
  • Better Caching: New useCache hook provides improved caching mechanisms.
  • Responsive Design: Mobile-first approach ensures fast rendering on all devices.

Bug Fixes

  • ✅ Fixed responsive layout issues across mobile devices
  • ✅ Fixed product URL structure for better SEO
  • ✅ Resolved authorization and storefront security issues
  • ✅ Fixed typos in folder structure (catelog → catalog)
  • ✅ Improved error handling with error boundaries
  • ✅ Enhanced TypeScript type safety

Breaking Changes

⚠️ Important: This release includes breaking changes:

  1. REST API Endpoints Deprecated: All legacy REST API endpoints have been removed. Use GraphQL API instead.
  2. Provider Structure Changed: Update imports if you're using custom providers.
  3. Folder Structure: graphql/catelog/ renamed to graphql/catalog/.
Assets 2
Loading