M1 and M2 code#1
Merged
Merged
Conversation
There was a problem hiding this comment.
Pull request overview
This PR introduces a React + TypeScript + Vite frontend and an Express backend for “Bethany’s Pie Shop”, adding typed domain models, a cart implementation backed by localStorage, a pie API/service layer, shared UI components, and CI/deploy configuration.
Changes:
- Add Vite + TypeScript configuration (including Vitest setup) and GitHub Actions CI/CD (build/test/deploy).
- Implement frontend features: pages, shared components, hooks, and utilities for pies + cart flows with unit tests.
- Add an Express API server (pies endpoints, security headers, optional Swagger) and in-memory data.
Reviewed changes
Copilot reviewed 76 out of 99 changed files in this pull request and generated 7 comments.
Show a summary per file
| File | Description |
|---|---|
| vite.config.ts | Vite config (proxy, build outDir, Vitest setup). |
| tsconfig.node.json | TS config for Node-side files (vite config). |
| tsconfig.json | TS compiler options + project references. |
| src/utils/cartStorage.ts | Typed cart persistence/validation via localStorage. |
| src/utils/cartStorage.test.ts | Unit tests for cart storage behaviors and edge cases. |
| src/types/pie.ts | Shared TypeScript domain and UI types (Pie/Cart/etc.). |
| src/setupTests.ts | Testing-library jest-dom setup for Vitest. |
| src/services/pieService.ts | Typed fetch-based API client for pie endpoints. |
| src/services/pieService.test.ts | Unit tests for pieService success/error cases. |
| src/reportWebVitals.ts | Web vitals reporting helper. |
| src/react-app-env.d.ts | Vite client type reference. |
| src/pages/HomePage.tsx | Home page (monthly pies, hero, category links). |
| src/pages/HomePage.css | Home page styling. |
| src/pages/CheckoutSuccessPage.tsx | Checkout success page + cart clearing flow. |
| src/pages/CheckoutSuccessPage.css | Checkout success styling. |
| src/pages/CheckoutPage.tsx | Checkout form + order creation/navigation. |
| src/pages/CheckoutPage.css | Checkout page styling. |
| src/pages/CategoryPage.tsx | Category route with client-side filtering/search UI. |
| src/pages/CategoryPage.css | Category page styling. |
| src/pages/CartPage.tsx | Cart page with items + order summary. |
| src/pages/CartPage.css | Cart page styling. |
| src/logo.svg | App logo asset. |
| src/index.tsx | React entrypoint mounting <App />. |
| src/index.css | Base CSS for the entrypoint. |
| src/hooks/usePies.ts | Hook wrappers for fetching pies/monthly/search. |
| src/hooks/usePies.test.ts | Unit tests for pie hooks delegation. |
| src/hooks/useFetchPies.ts | Generic fetch hook (loading/error/refetch). |
| src/hooks/useFetchPies.test.ts | Unit tests for generic fetch hook. |
| src/hooks/useCart.ts | Cart state hook backed by cartStorage + storage events. |
| src/hooks/useCart.test.ts | Unit tests for useCart behaviors and sync. |
| src/contexts/CartContext.tsx | Cart context provider + safe consumer hook. |
| src/contexts/CartContext.test.tsx | Unit tests for provider + “must be used within” error. |
| src/components/shared/shared.css | Shared CSS for EmptyState and OrderSummary. |
| src/components/shared/index.ts | Barrel exports for shared components. |
| src/components/shared/OrderSummary.tsx | Shared order summary component. |
| src/components/shared/OrderSummary.test.tsx | OrderSummary unit tests. |
| src/components/shared/LoadingSpinner.tsx | Shared loading component. |
| src/components/shared/LoadingSpinner.test.tsx | LoadingSpinner unit tests. |
| src/components/shared/ErrorMessage.tsx | Shared error display component. |
| src/components/shared/ErrorMessage.test.tsx | ErrorMessage unit tests. |
| src/components/shared/EmptyState.tsx | Shared empty state component. |
| src/components/shared/EmptyState.test.tsx | EmptyState unit tests. |
| src/components/SearchBar/SearchBar.tsx | Search input + clear button component. |
| src/components/SearchBar/SearchBar.test.tsx | SearchBar unit tests. |
| src/components/SearchBar/SearchBar.css | SearchBar styling. |
| src/components/PieCard/PieCard.tsx | Pie card UI + add-to-cart action. |
| src/components/PieCard/PieCard.test.tsx | PieCard unit tests. |
| src/components/PieCard/PieCard.css | PieCard styling. |
| src/components/Hero/Hero.tsx | Hero carousel component. |
| src/components/Hero/Hero.css | Hero styling. |
| src/components/Header/Header.tsx | Header/nav + cart modal toggle. |
| src/components/Header/Header.css | Header styling. |
| src/components/Footer/Footer.tsx | Footer component. |
| src/components/Footer/Footer.css | Footer styling. |
| src/components/Cart/CartItem.tsx | Cart line-item component w/ qty controls. |
| src/components/Cart/CartItem.test.tsx | CartItem unit tests. |
| src/components/Cart/Cart.tsx | Cart overlay/modal component. |
| src/components/Cart/Cart.css | Cart styling. |
| src/App.tsx | App shell: router + providers + routes. |
| src/App.test.tsx | App routing/unit tests. |
| src/App.css | Global app styles. |
| server/utils/piesHelper.js | Backend helper for “pies of the month”. |
| server/server.js | Express server startup + graceful shutdown. |
| server/routes/api.js | API routes for pies, monthly pies, and pie-by-id. |
| server/models/pies.js | In-memory pies dataset. |
| server/middleware/security.js | Helmet middleware configuration. |
| server/config/swagger.js | Optional Swagger UI setup. |
| server/config/constants.js | Backend constants (port, latency, allowed categories). |
| server/app.js | Express app wiring, static serving, SPA fallback. |
| public/robots.txt | Robots config. |
| public/manifest.json | Web app manifest. |
| public/logo512.png | Icon asset. |
| public/logo192.png | Icon asset. |
| public/index.html | Static HTML template in public/ (not Vite root). |
| public/favicon.ico | Favicon asset. |
| package.json | Dependencies + scripts for frontend/backend/dev/test/CI. |
| index.html | Vite root HTML entry. |
| docs/PR_SUMMARY.md | PR summary and review checklist. |
| docs/CI.md | CI/CD documentation for GitHub Actions workflow. |
| docs/ARCHITECTURE.md | Architecture overview and diagrams. |
| README.md | Project documentation and setup instructions. |
| .gitignore | Ignore rules for node/build/dev artifacts. |
| .github/workflows/ci.yml | GitHub Actions CI + GitHub Pages deploy workflow. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment on lines
+30
to
+39
| // Serve static frontend (for production builds) | ||
| const publicDir = path.join(__dirname, '..', 'public'); | ||
| app.use(express.static(publicDir)); | ||
|
|
||
| // Fallback to index.html for SPA routing (production only) | ||
| app.get('*', (req, res) => { | ||
| // Only serve index.html if not an API route | ||
| if (!req.path.startsWith('/api')) { | ||
| res.sendFile(path.join(publicDir, 'index.html')); | ||
| } |
| "@types/node": "^20.14.0", | ||
| "@types/react": "^19.1.13", | ||
| "@types/react-dom": "^19.1.9", | ||
| "@types/react-router-dom": "^5.3.3", |
Comment on lines
+26
to
+30
| title: 'Welcome to Bethany\'s Cafe', | ||
| description: 'Handcrafted pies made with love.', | ||
| buttonText: 'Shop Now', | ||
| buttonLink: '#pies' | ||
| }, |
Owner
Author
There was a problem hiding this comment.
yes you are right, lets get this fixed.
Comment on lines
+35
to
+41
| <nav className="top-nav"> | ||
| <Link to="/">Home</Link> | ||
| <Link to="/fruit">Fruit Pies</Link> | ||
| <Link to="/cheesecake">Cheesecakes</Link> | ||
| <Link to="/seasonal">Seasonal</Link> | ||
| <Link to="/cart">Cart</Link> | ||
| </nav> |
Comment on lines
+59
to
+70
| async searchPies(query: string, category?: string): Promise<Pie[]> { | ||
| try { | ||
| const url = new URL(`${API_BASE}/pies`, window.location.origin); | ||
| if (query) { | ||
| url.searchParams.set('search', query); | ||
| } | ||
| if (category) { | ||
| url.searchParams.set('category', category); | ||
| } | ||
|
|
||
| const response = await fetch(url.toString()); | ||
| return this.handleResponse<Pie[]>(response); |
Comment on lines
+12
to
+14
| const [pies, setPies] = useState<Pie[]>([]); | ||
| const [loading, setLoading] = useState(false); | ||
| const [error, setError] = useState<string | null>(null); |
Comment on lines
+17
to
+21
| <img | ||
| src={pie.image || '/images/placeholder.png'} | ||
| alt={pie.name} | ||
| className="pie-image" | ||
| /> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
M1 and M2 code