Skip to content

feat(ki-inventory): connect frontend to backend API#5142

Open
abhinav-TB wants to merge 1 commit intodevelopmentfrom
feature/ki-inventory-api-connect
Open

feat(ki-inventory): connect frontend to backend API#5142
abhinav-TB wants to merge 1 commit intodevelopmentfrom
feature/ki-inventory-api-connect

Conversation

@abhinav-TB
Copy link
Copy Markdown
Member

Description

This PR connects the Kitchen and Inventory (KI) dashboard to the live backend API. It establishes the Redux state management layer for inventory items, statistics, and preserved stock, and fixes a critical permission bug in the protected route that was preventing access.

Implements # Kitchen Inventory - API Connectivity


Related PRs (if any):

Backend branch: feature/ki-inventory-api-connect


Main changes explained:

  • Create src/actions/KIInventoryActions.js — Implements thunk actions to fetch inventory items, statistics, and preserved stock from the backend.
  • Create src/reducers/KIInventoryReducer.js — Manages state for inventory data, including loading states and error handling.
  • Create src/constants/KIInventoryConstants.js — Defines action types for the inventory Redux flow.
  • Update src/components/KitchenandInventory/KIInventory/KIInventory.jsx — Replaced static mock data with Redux state. Added useEffect hooks to trigger data fetching on mount.
  • Update src/components/common/KitchenandInventory/KIProtectedRoute/KIProtectedRoute.jsx — Commented out an incorrect canAccessBMPortal permission check that was incorrectly blocking KI dashboard access.
  • Update src/reducers/index.js — Integrated the kiInventory reducer into the root reducer.
  • Update src/utils/URL.js — Added API constants for KI_INVENTORY_ITEMS, KI_INVENTORY_STATS, and KI_INVENTORY_PRESERVED.

How to test:

  1. Check out branch feature/ki-inventory-api-connect
  2. Run npm install then npm start
  3. Log in as an admin user
  4. Navigate to the Inventory tab within the Kitchen & Inventory portal (/kitchenandinventory/inventory)
  5. Verify that the metric cards (Total Items, Critical Stock, etc.) display data from the database.
  6. Verify that the inventory items list is populated correctly for each category.
  7. Verify the Preserved Stock banner displays the correct data if available in the DB.
  8. Verify all UI elements display correctly in dark mode.

Screenshots or videos of changes:

image image

Note:

@netlify
Copy link
Copy Markdown

netlify bot commented Apr 13, 2026

Deploy Preview for highestgoodnetwork-dev ready!

Name Link
🔨 Latest commit 826f9fc
🔍 Latest deploy log https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/69dd36535912ab000872dbf4
😎 Deploy Preview https://deploy-preview-5142--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@sonarqubecloud
Copy link
Copy Markdown

Quality Gate Failed Quality Gate failed

Failed conditions
3.7% Duplication on New Code (required ≤ 3%)

See analysis details on SonarQube Cloud

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.

1 participant