How william-cohen/top-hats works
Will-commerce is a Vue storefront with product browsing, account access, a cart, and a staged checkout. The main user flow is browsing products, adding items to a cart, then progressing through cart, delivery, payment, and order confirmation; checkout is route-guarded by session state. The session store implements sign-in, registration, and order submission through the backend API. The tree also includes PHP endpoints and cryptographic code. Some feature wiring and API behavior are unsampled, so uncertain links are omitted.
Main entry points: CheckoutPage.vue Checkout flow · index.ts Route navigation · session.ts Session state · product Product views
Components 22
Storefront shell
- Application shell
src/App.vue - Route navigation
src/router/index.ts
Product catalog
- Home page
src/components/home/HomePage.vue - Product views
src/views/product - Browse products
src/components/products/BrowseProducts.vue - Product details
src/components/products/ProductInfoPage.vue - Product filters
src/components/products/filters/ProductFilters.vue - Product state
src/store/products.ts
Account and sessions
- Login and signup
src/components/session/SessionPage.vue - Session state
src/store/session.ts - Credential crypto
src/crypto/DES.ts
Cart and checkout
- Cart interface
src/components/cart/CartDrawer.vue - Cart state
src/store/cart.ts - Checkout flow
src/components/checkout/CheckoutPage.vue - Cart step
src/components/checkout/steps/CartStep.vue - Delivery step
src/components/checkout/steps/DeliveryStep.vue - Payment step
src/components/checkout/steps/PaymentStep.vue - Order confirmation
src/components/checkout/steps/ProcessedStep.vue
Backend services
- Backend API client
src/api/backend.ts - PHP endpoints
src/backend
Other components
- Shopper
- Commerce backend
Connections 25
- Shopper → Application shell: uses
- Application shell → Route navigation: hosts routes
- Route navigation → Home page: routes to
- Route navigation → Product views: routes to
- Product views → Browse products: renders
- Product views → Product details: renders
- Browse products → Product filters: offers filters
- Browse products → Product state: reads products
- Product views → Product state: fetches products
- Shopper → Cart interface: manages cart
- Cart interface → Cart state: updates
- Route navigation → Checkout flow: routes to
- Checkout flow → Cart step: selects step
- Checkout flow → Delivery step: selects step
- Checkout flow → Payment step: selects step
- Checkout flow → Order confirmation: selects step
- Checkout flow → Cart state: clears cart
- Shopper → Login and signup: enters credentials
- Login and signup → Session state: calls login
- Session state → Credential crypto: encrypts credentials
- Session state → Backend API client: sends requests
- Session state → Cart state: reads cart
- Backend API client → PHP endpoints: posts requests
- PHP endpoints → Commerce backend: accesses services
- Route navigation → Session state: checks access