Project

General

Profile

Edit Copy Actions

Feature #10950

open

Support #10821: Gaps in Order Flow from E-commerce & Admin panel side

Add different variants & different attributes per category of each product in create / update product pages

Added by Yalavarthi Thriveni about 1 month ago. Updated about 1 month ago.

Status:
Resolved
Priority:
Normal
Assignee:
Target version:
-
Start date:
09/22/2026
Due date:
09/23/2026 (40 days late)
% Done:

100%

Estimated time:
16:00 h
Spent time:

Add

Subtasks


Add

Related issues

Actions #1

Updated by Ajit A about 1 month ago

  • Status changed from New to In Progress
  • Start date changed from 09/21/2026 to 09/22/2026
  • Estimated time set to 5:00 h

Updated by Ajit A about 1 month ago

  • Tracker changed from Support to Feature
  • Due date set to 09/23/2026
  • % Done changed from 0 to 70
  • Estimated time changed from 5:00 h to 16:00 h

Task: Implementation, Bug Fixes, and Storefront Integration of Multi-SKU Product Variants & Pack Matrix
Status: In Progress / Completed Testing
Repositories Affected:

evergreen_pos_fe (Admin FE)
evergreen_pos_be (Backend Node/MongoDB API)
evergreenpos_E-commerce_new (Storefront FE)
🚀 Summary of Work Completed
1. Admin Panel - Multi-SKU Matrix Generator & Editing (evergreen_pos_fe)
Auto-Matrix Generation on Attribute Selection:
Removed manual "⚡ Generate Combination Matrix" button.
Matrix rows now auto-generate and update immediately upon selecting/deselecting attribute dimension pills (e.g., Pot Size, Light Needs, Water Needs).
Automatically clears matrix rows when all attribute dimensions are deselected.
Enable/Disable Row Toggle Switch:
Removed destructive "Remove" links from matrix table rows.
Replaced action column with an Ant Design <Switch /> component under Status, allowing admins to toggle variant rows active/disabled without deleting them.
Edit Product Hydration & State Sync:
Fixed getProductByID in CreateProduct.tsx to load existing hasVariants, variantDimensions, and variantsMatrix from backend product API responses.
Preserved edited prices, offer prices, stock quantities, SKUs, default variant selection, and active switch states during product updates.
2. Backend Services & MongoDB Persistence (evergreen_pos_be)
Mongoose Schema Persistence:
Updated variantSchema in src/models/nursery/nursery.product.js to include isActive: { type: Boolean, default: true }.
Ensures variant enable/disable switch states pass validation and persist in MongoDB.
Cart & Inventory Variant Resolution:
Updated cart.service.js and product.service.js to support variant SKU lookup, composite cart items (productId_variantSku), variant-specific pricing, and stock mapping.
Allowed hasVariants, variantDimensions, and variants fields in productPayloadFilter.js.
3. Storefront & Cart Integration (evergreenpos_E-commerce_new)
Variant Selection Dropdown on Product Cards:
Integrated a clean variant selection dropdown (<select>) in a separate row on product cards (ProductUnifiedCard.tsx and UnifiedCard.tsx).
Formatted options to show clean variant combination names (e.g., 4-inch / Low Light).
Dynamic Price & Offer Recalculation:
Selecting a variant in the dropdown instantly updates the card's displayed regular price, offer price, and discount percentage badge.
Guest & Logged-in Cart Variant Sync:
Fixed first variant (e.g., 4-inch variant) SKU mapping in guest cart local storage (useCart.tsx).
Generated composite cart keys (productId_variantSku) to ensure variant-specific cart management for both guest and authenticated users.
Cart & Recently Viewed Rail Integration:
Updated useCart.tsx to automatically trigger trackRecentlyViewed when any item is added to the cart.
Updated RecentlyViewedSection.tsx to merge active cart items into the Recently Viewed rail with quantity modifier controls ([- 1 +] and GO TO CART →).
🛠️ Files Modified
Repository Component / File Path Changes Description
Admin FE
CreateProduct.tsx
Auto-matrix generation, enable/disable switch, edit hydration fix
Backend BE
nursery.product.js
Added isActive field to variantSchema
Backend BE
cart.service.js
Added variant cart item resolution & stock checks
Backend BE
productPayloadFilter.js
Whitelisted variant fields in update payload filter
E-Comm FE
ProductUnifiedCard.tsx
Added variant dropdown row, dynamic pricing, variant cart sync
E-Comm FE
UnifiedCard.tsx
Added variant dropdown row, dynamic pricing
E-Comm FE
useCart.tsx
Fixed guest cart SKU mapping, auto-track recently viewed
E-Comm FE
RecentlyViewedSection.tsx
Merged active cart items into Recently Viewed section

Updated by Ajit A about 1 month ago

1. PLP DYNAMIC FILTER REACT RUNTIME CRASH FIX
--------------------------------------------------------------------------------
• User Prompt / Issue:
React runtime crash and console warnings on FilteredProducts page:
- "Objects are not valid as a React child (found: object with keys {value, label, isActive})"
- "Encountered two children with the same key, [object Object]"
• Root Cause:
Backend category attribute options were returned as object structures ({ value, label, isActive })
rather than plain strings. The frontend filter component passed the entire object into React JSX
children and key props.
• Solution & Changes:
- Normalized dynamic attribute options across both desktop sidebar and mobile filter drawer.
- Handled both string options and object options { value, label, isActive }.
- Filtered out inactive/disabled options (isActive === false) and empty values.
- Set unique key and value bindings (key={opt.value}) and rendered opt.label safely in JSX.
• Modified Files:
- evergreenpos_E-commerce_new: src/features/products/pages/FilteredProducts.tsx
2. STOREFRONT HOMEPAGE VARIANT SELECTOR RESTORATION
--------------------------------------------------------------------------------
• User Prompt / Issue:
"In feature product cards the variants is not displaying"
• Root Cause:
The backend storefront projection constant (STOREFRONT_CARD_SELECT) in product.service.js
omitted variant fields (hasVariants, variants, variantAttributes), causing public product
cards to receive null/empty variant arrays.
• Solution & Changes:
- Added 'hasVariants variants variantAttributes' to STOREFRONT_CARD_SELECT query projection.
- Explicitly passed hasVariants and variants props in FeaturedProducts to ProductUnifiedCard.
• Modified Files:
- evergreen_pos_be: src/services/nursery/product.service.js
- evergreenpos_E-commerce_new: src/features/dashboard/componets/FeaturedProducts.tsx
3. PRODUCT CARD LAYOUT & VERTICAL GAP OPTIMIZATION
--------------------------------------------------------------------------------
• User Prompt / Issue:
"In recently viewed card if the product card has no variant I can see the empty spaces how to fix this"
• Root Cause:
Flexbox grid container stretching (items-stretch) paired with 'justify-between' created
awkward vertical white space between the title and action button for non-variant products.
• Solution & Changes:
- Grouped title and variant selector together inside a unified flex column container.
- Anchored price and 'Add to Cart' button to the bottom using 'mt-auto'.
- Added 'items-start' to the horizontal scroll track in RecentlyViewedSection to prevent
unnecessary card stretching.
• Modified Files:
- evergreenpos_E-commerce_new: src/features/products/components/ProductUnifiedCard.tsx
- evergreenpos_E-commerce_new: src/features/dashboard/componets/RecentlyViewedSection.tsx
4. ADMIN MULTI-SKU & BATCH VALIDATION (PRICE & STOCK LIMITS)
--------------------------------------------------------------------------------
• User Prompt / Issue:
"Add validation for these fields also: for price section allow up to 1 lakh and 4 digits for stock quantity"
• Requirement:
- Price limit: Max ₹1,00,000 (1 Lakh).
- Stock quantity limit: Max 4 digits (0 - 9,999).
• Solution & Changes:
- In CreateProduct.tsx: * Matrix generation: Capped combination regular/offer prices to ₹100,000 and initial stock to 9,999. * Table inputs: Enforced min={0}, max={100000} on Regular & Offer Price inputs. * Stock inputs: Enforced min={0}, max={9999}, maxLength={4} with numeric regex sanitization. * Form submit validation: Added safety validation blocking submission if any variant price > ₹1,00,000
or stock quantity > 9,999 with user-friendly error alerts.
- In VariantBatchModal.tsx: * Added max 1 Lakh validation on batch purchase/selling price. * Added max 4-digit (0 - 9,999) limit on batch opening stock and quantities.
• Modified Files:
- evergreen_pos_fe: src/pages/InvortryManagement/CreateProduct.tsx
- evergreen_pos_fe: src/pages/InvortryManagement/VariantBatchModal.tsx

Updated by Ajit A about 1 month ago

  • Status changed from In Progress to Resolved
  • % Done changed from 70 to 100

completed

Updated by Ajit A about 1 month ago

1. Company-Level Dynamic Category Taxonomy
Backend Model & API (company-model.js, company-controller.js):
Implemented categoryTypesConfig schema supporting custom company-level taxonomy configurations (typeName, categoryTypes, isActive).
POS Frontend (ProfileCustomization.tsx, categoryTaxonomyDefaults.ts, CategoryModal.tsx):
Built company settings UI to dynamically add, edit, and configure custom Category Types and sub-types.
Linked CategoryModal dropdowns to company taxonomy dynamically with fallback defaults.
Updated category form layout to ensure full-width responsiveness for attribute definitions and filter selections.
2. Variant Batch Management & FEFO Expiry Tracking (VariantBatchModal.tsx)
Batch Editing Capability:
Added full batch editing functionality allowing updates to existing batches (Batch Number, Dates, Initial Qty, Remaining Qty, Purchase Price).
Validation & Input Constraints:
Restricted Batch Quantities (Initial and Remaining) to a maximum of 4 digits (0–9,999).
Restricted Batch Purchase Price to a maximum of 1,00,000 (1 Lakh).
3. Product Creation & Multi-SKU Variant Matrix (CreateProduct.tsx)
Return & Expiry Day Limits (2-Digit Enforcement):
Product Return Policy Window: Clamped to 2 digits (1–99 days).
Expiry Warning Threshold: Clamped to 2 digits (1–99 days before expiry).
Variant-Level Return Override Window: Clamped to 2 digits (1–99 days).
Variant Pricing & Stock Constraints:
Implemented strict limits on Variant Regular Price & Offer Price up to 1,00,000 (1 Lakh) with client & pre-submission validations.
Restricted Variant Stock Quantity input to 4 digits (0–9,999).
4. E-Commerce Storefront Dynamic Attribute Filters (FilteredProducts.tsx)
Integrated dynamic storefront filter rendering based on category-defined attribute definitions (e.g., Flavour, Pack Size, Dietary Type).
Added multi-select facet filter handling and accordion navigation for dynamic product attributes.
Files Modified
POS Frontend:

CreateProduct.tsx

VariantBatchModal.tsx

CategoryModal.tsx

categoryTaxonomyDefaults.ts
POS Backend:

company-model.js
E-Commerce Frontend:

FilteredProducts.tsx

Edit Copy Actions

Also available in: Atom PDF