POSDash Client

The legacy React frontend for a learning-focused inventory and warehouse-management application.

POSDash was built as a full-stack course project for browsing inventory, creating accounts, managing products, reducing stock on delivery, and keeping user-specific items. The Firebase-hosted client shell is still reachable, but its hard-coded Heroku API currently returns 404. Data, token, and inventory workflows therefore do not work end to end without replacing or redeploying the backend.

Open the hosted client · View the server repository · Report an issue

Intended workflow

• Browse inventory items and open an item-detail page.
• Register or sign in through Firebase Authentication.
• Request a backend token associated with the signed-in email.
• Add inventory items and user-specific items.
• Update stock or reduce it when an item is delivered.
• Delete inventory records and review a personal item list.
• Use profile, settings, blog, about, password-reset, and marketing pages.

These capabilities depend on both Firebase configuration and the separate API. They describe implemented client routes and request code, not a currently operational hosted system.

Current routes

Route	Purpose	Guard in the client
/	Marketing home and inventory preview	Public
/login	Firebase sign-in	Public
/register	Account creation	Public
/forgot-password	Firebase password reset	Public
/inventory	Inventory-management page	RequireAuth
/inventory/:id	Item details, delivery, and update controls	RequireAuth
/add-item	Add an inventory item	None in router
/my-items	View user-specific items	None in router
/profile, /settings	Account-oriented presentation pages	None in router
/blog, /about	Static content	Public

App.js also declares a second /inventory route for ManageItems, but the earlier matching route is the effective one. Treat route-level guards as user-interface behavior only; the backend must enforce authorization independently.

How it works

flowchart LR
    A[React client] --> B[Firebase Authentication]
    A --> C[Hard-coded Heroku API]
    C --> D[(MongoDB via separate server)]
    B --> E[Email sent to /login]
    E --> F[Token stored in localStorage]
    F --> C

Loading

src/Hooks/Firebase.Init.js initializes Firebase from REACT_APP_* variables. src/Hooks/useToken.js sends the signed-in email to the backend and stores the returned token in localStorage. src/API/axiosPrivate.js adds that token to requests.

All API URLs are compiled into components as https://posdash-server.herokuapp.com; there is no configurable API-base variable.

Local development

Prerequisites

• A maintained Node.js release compatible with Create React App 5
• npm
• A Firebase web application with the desired authentication providers enabled
• A compatible POSDash API, if data workflows are required

The repository does not declare an exact Node.js engine. Because its dependencies date from 2022, use an isolated development environment and review dependency advisories before maintenance work.

1. Clone and install

git clone https://github.com/montasim/warehouse-management-client.git
cd warehouse-management-client
npm ci

2. Configure Firebase

Create .env.local with the variables consumed by the source:

REACT_APP_apiKey=your-firebase-web-api-key
REACT_APP_authDomain=your-project.firebaseapp.com
REACT_APP_projectId=your-project-id
REACT_APP_storageBucket=your-project.appspot.com
REACT_APP_messagingSenderId=your-sender-id
REACT_APP_appId=your-app-id

Create React App embeds REACT_APP_* values in the browser bundle. Firebase web configuration is not a server secret, but access must be protected through Firebase rules, authorized domains, provider settings, and backend authorization. Never place private service-account keys in these variables.

3. Replace the unavailable API

The current Heroku endpoint is no longer deployed. To restore data workflows, deploy a compatible version of warehouse-management-server and replace every posdash-server.herokuapp.com occurrence with its HTTPS base URL. A future maintenance change should centralize this as REACT_APP_API_BASE_URL.

4. Start the client

npm start

Open http://localhost:3000.

Commands

Command	Purpose
npm start	Start the Create React App development server
npm run build	Create the production bundle in build/
npm test	Start the interactive test runner; no project tests are committed
npm run eject	Irreversibly copy CRA configuration into the repository

Warning

npm run eject is destructive and cannot be undone automatically. Commit or back up the repository first.

Deployment

firebase.json publishes build/ and rewrites client routes to index.html:

npm run build
firebase deploy --only hosting

The currently hosted client returns HTTP 200 at posdash-37746.web.app. A successful page load does not prove the inventory workflow works; the separate API currently returns 404.

Project status and limitations

This is a legacy learning project with a partially available deployment.

• The hard-coded Heroku backend is unavailable, breaking data and token requests.
• Multiple routes that appear account-specific are not wrapped in RequireAuth.
• A route declaration is duplicated at /inventory.
• The client stores its bearer token in localStorage, where injected scripts could read it.
• The token request sends only an email; the server must verify identity rather than trust that value.
• API base URLs are duplicated across components instead of centralized configuration.
• Several pages contain static marketing or placeholder content unrelated to inventory operations.
• There are no committed tests, CI workflow, environment template, support policy, security policy, or license file.
• The legacy dependency tree should be audited before deployment.

Do not connect this client to real inventory or user data until backend authorization, client route protections, token handling, dependencies, and tests are reviewed.

Support and security

Use GitHub Issues for non-sensitive frontend bugs. Include the route, browser, sanitized console error, expected behavior, and actual behavior. Backend issues belong in warehouse-management-server.

Do not publish Firebase settings tied to privileged services, tokens, user records, or vulnerability details. The repository has no security policy; report sensitive concerns privately to Montasim.

Contributing

High-value work includes a configurable API base URL, backend identity verification, consistent route guards, safer token handling, tests, and dependency modernization. Run the relevant tests and production build before opening a pull request.

The repository does not include dedicated contribution or code-of-conduct documents.

Funding

Optional support for maintained public projects is available through SupportKori. Security improvements, backend restoration, tests, and documentation are equally valuable.

Author

Built by Montasim.

License

No license file is present. The code is publicly viewable, but permission to copy, modify, or redistribute it is not granted unless explicit license terms are added.