Feature/pwa support#37
Merged
Merged
Conversation
Co-authored-by: Copilot <copilot@github.com>
Co-authored-by: Copilot <copilot@github.com>
There was a problem hiding this comment.
Pull request overview
Adds Progressive Web App (PWA) support to the KinTree React client and adjusts client/server integration to better support single-origin deployments (including relative API paths and backend static hosting).
Changes:
- Adds a custom service worker + registration flow and an optional PWA install hook.
- Updates PWA metadata (manifest + HTML meta tags) for installability/mobile UX.
- Refactors several frontend API calls to use relative
/api/...paths and updates the backend to serve the built client.
Reviewed changes
Copilot reviewed 16 out of 19 changed files in this pull request and generated 11 comments.
Show a summary per file
| File | Description |
|---|---|
server/server.js |
Serves the React build from Express and adds a catch-all route for React Router. |
docs/sample-data.json |
Removes sample JSON data file. |
docs/PWA_SETUP.md |
Adds documentation for PWA features, caching, and install prompt usage. |
client/src/serviceWorkerRegistration.js |
Adds service worker registration/unregistration logic. |
client/src/services/familyTreeService.js |
Updates some API calls to use relative /api/... paths. |
client/src/index.js |
Registers the service worker for PWA support. |
client/src/hooks/usePWAInstall.js |
Adds a hook to manage the beforeinstallprompt install UX. |
client/src/config/urls.js |
Changes default client/server URL configuration for deployments. |
client/src/components/UserMemory/MemoryCard.js |
Updates memory delete request URL. |
client/src/components/UserMemory/EditMemory.js |
Updates memory update request URL. |
client/src/components/UserMemory/CreateMemory.js |
Updates memory create request URL. |
client/src/components/AddFamilyMember/AddFamilyMember.js |
Updates relationship-create request URL. |
client/public/service-worker.js |
Adds a custom service worker with caching strategies. |
client/public/manifest.json |
Updates manifest metadata and adds screenshots/categories/etc. |
client/public/index.html |
Updates meta tags for theme color and iOS/mobile PWA support. |
client/package.json |
Attempts to add a dev proxy setting for API requests. |
Comments suppressed due to low confidence (1)
client/src/components/AddFamilyMember/AddFamilyMember.js:285
- This fetch was changed to a relative
/api/...URL while the file still importsSERVER_URL(now unused). If you support a configurable backend origin viaREACT_APP_SERVER_URL, prefer${SERVER_URL}/api/...(or a shared API base helper) so dev/prod deployments stay consistent and the import isn’t left unused.
console.log('Relationships to create (Existing):', relsToCreate);
for (const rel of relsToCreate) {
const relRes = await fetch(`/api/relationships/`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
...rel,
relationshipStatus: "active",
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment on lines
+23
to
+44
| @@ -38,6 +38,11 @@ app.use('/api/tree-info', treeInfoRoutes); | |||
| app.use('/api/events', eventRoutes); | |||
| app.use('/api/memories', memoryRoutes); | |||
|
|
|||
| // Let React Router handle all non-API routes. | |||
| app.get('*', (req, res) => { | |||
| res.sendFile(path.join(clientBuildPath, 'index.html')); | |||
| }); | |||
| app.use('/api/memories', memoryRoutes); | ||
|
|
||
| // Let React Router handle all non-API routes. | ||
| app.get('*', (req, res) => { |
| */ | ||
| async deleteFamilyMember(memberId) { | ||
| const response = await fetch(`http://localhost:5000/api/family-members/${memberId}`, { | ||
| const response = await fetch(`/api/family-members/${memberId}`, { |
| export const CLIENT_URL = process.env.REACT_APP_CLIENT_URL || 'http://localhost:3000'; | ||
| export const SERVER_URL = process.env.REACT_APP_SERVER_URL || 'http://localhost:5000'; | ||
| export const CLIENT_URL = process.env.REACT_APP_CLIENT_URL || window.location.origin; | ||
| export const SERVER_URL = process.env.REACT_APP_SERVER_URL || ''; |
Comment on lines
+19
to
+31
| "categories": ["family", "social", "productivity"], | ||
| "screenshots": [ | ||
| { | ||
| "src": "favicon.ico", | ||
| "sizes": "540x720", | ||
| "form_factor": "narrow" | ||
| }, | ||
| { | ||
| "src": "favicon.ico", | ||
| "sizes": "1280x720", | ||
| "form_factor": "wide" | ||
| } | ||
| ] |
Comment on lines
5
to
12
| "icons": [ | ||
| { | ||
| "src": "favicon.ico", | ||
| "sizes": "64x64 32x32 24x24 16x16", | ||
| "type": "image/x-icon" | ||
| "type": "image/x-icon", | ||
| "purpose": "any" | ||
| } | ||
| ], |
Comment on lines
9
to
14
| if (!window.confirm("Are you sure you want to delete this memory?")) return; | ||
|
|
||
| try { | ||
| const response = await fetch(`http://localhost:5000/api/memories/${memory.id}`, { | ||
| const response = await fetch(`/api/memories/${memory.id}`, { | ||
| method: 'DELETE', | ||
| }); |
Comment on lines
14
to
20
|
|
||
| const onSubmit = async (data, close) => { | ||
| try { | ||
| const response = await fetch(`http://localhost:5000/api/memories/${memory.id}`, { | ||
| const response = await fetch(`/api/memories/${memory.id}`, { | ||
| method: 'PUT', | ||
| headers: { 'Content-Type': 'application/json' }, | ||
| body: JSON.stringify(data), |
Comment on lines
41
to
46
| return; | ||
| } | ||
|
|
||
| const response = await fetch('http://localhost:5000/api/memories', { | ||
| const response = await fetch('/api/memories', { | ||
| method: 'POST', | ||
| body: formData, |
…ect_KinTree into feature/pwa-support
Co-authored-by: Copilot <copilot@github.com>
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.
This pull request adds Progressive Web App (PWA) support to the KinTree client, changes the app's manifest and metadata for new mobile and installability experiences, and updates API calls for better deployment compatibility. The most significant changes include the addition of a custom service worker, & refactoring API URLs to work in different environments