fix url serwiceworker template and swregistration for pwa

backend/app.js

@@ -23,7 +23,7 @@ app.use(express.static('avatars')); //folder for static files
 
 const io = require("socket.io")(server, {
     cors: {
-        origin: "http://192.168.0.107:3000" //client endpoint and port
+        origin: "http://localhost:3000" //client endpoint and port
     }
 });
 const PORT = process.env.PORT || 5000;

frontend/src/components/chatPage/ChatPage.jsx

@@ -225,7 +225,6 @@ export const ChatPage = () => {
                             // }}
                         
                         /> 
-
                         <Button 
                             variant="contained" 
                             type='submit'

frontend/src/components/chatPage/messageForm/MessegaForm.jsx

@@ -17,7 +17,7 @@ export const MessageForm = () => {
     const dispatch = useDispatch();
     const socket = useSelector(state => state.getUserSocketReducer.socket)
 
-    const SERVER_URL = process.env.REACT_APP_SERVER_URL|| 'http://192.168.0.107:5000/';
+    const SERVER_URL = process.env.REACT_APP_SERVER_URL|| 'http://localhost:5000/';
 
     const startMessages = useSelector(state => state.getUserSocketReducer.startMessages)
     const user = useSelector(state => state.getUserSocketReducer.socketUserData)

frontend/src/components/chatPage/userInfo/UserInfo.jsx

@@ -34,7 +34,7 @@ export const UserInfo = () => {
             setDisplayType('none')
         }, 4000)
     }
-    const SERVER_URL = process.env.REACT_APP_SERVER_URL|| 'http://192.168.0.107:5000/';
+    const SERVER_URL = process.env.REACT_APP_SERVER_URL|| 'http://localhost:5000/';
 
     const allUsers = useSelector(state => state.getUserSocketReducer.allUsers)
     const user = useSelector(state => state.getUserSocketReducer.socketUserData)

frontend/src/reducers/messageReducer.js

@@ -11,7 +11,7 @@ const initialState = {
     ref: null
 }
 
-const POST_FILES_URL = 'http://192.168.0.107:5000/files';
+const POST_FILES_URL = 'http://localhost:5000/files';
 
 
 export const sendMessageToSocket = (state, data) => {

frontend/src/reducers/socketReducer.js

@@ -17,7 +17,7 @@ const initialState = {
 }
 
 
-const SOCKET_URL = 'http://192.168.0.107:5000'; 
+const SOCKET_URL = 'http://localhost:5000'; 
 
 const connectToSocket = (event) => {
  

frontend/src/reducers/userDataReducer.js

@@ -16,8 +16,8 @@ const initialState = {
     avatar: ''
 }
 
-const POST_URL =  process.env.REACT_APP_POST_URL || 'http://192.168.0.107:5000/login';
-const GET_AVATAR_URL =  process.env.REACT_APP_GET_AVATAR_URL || 'http://192.168.0.107:5000/avatar';
+const POST_URL =  process.env.REACT_APP_POST_URL || 'http://localhost:5000/login';
+const GET_AVATAR_URL =  process.env.REACT_APP_GET_AVATAR_URL || 'http://localhost:5000/avatar';
 
 
 export const getUserData = createAsyncThunk(

frontend/src/service-worker.js

@@ -1,72 +1,72 @@
-// /* eslint-disable no-restricted-globals */
+/* eslint-disable no-restricted-globals */
 
-// // This service worker can be customized!
-// // See https://developers.google.com/web/tools/workbox/modules
-// // for the list of available Workbox modules, or add any other
-// // code you'd like.
-// // You can also remove this file if you'd prefer not to use a
-// // service worker, and the Workbox build step will be skipped.
+// This service worker can be customized!
+// See https://developers.google.com/web/tools/workbox/modules
+// for the list of available Workbox modules, or add any other
+// code you'd like.
+// You can also remove this file if you'd prefer not to use a
+// service worker, and the Workbox build step will be skipped.
 
-// import { clientsClaim } from 'workbox-core';
-// import { ExpirationPlugin } from 'workbox-expiration';
-// import { precacheAndRoute, createHandlerBoundToURL } from 'workbox-precaching';
-// import { registerRoute } from 'workbox-routing';
-// import { StaleWhileRevalidate } from 'workbox-strategies';
+import { clientsClaim } from 'workbox-core';
+import { ExpirationPlugin } from 'workbox-expiration';
+import { precacheAndRoute, createHandlerBoundToURL } from 'workbox-precaching';
+import { registerRoute } from 'workbox-routing';
+import { StaleWhileRevalidate } from 'workbox-strategies';
 
-// clientsClaim();
+clientsClaim();
 
-// // Precache all of the assets generated by your build process.
-// // Their URLs are injected into the manifest variable below.
-// // This variable must be present somewhere in your service worker file,
-// // even if you decide not to use precaching. See https://cra.link/PWA
-// precacheAndRoute(self.__WB_MANIFEST);
+// Precache all of the assets generated by your build process.
+// Their URLs are injected into the manifest variable below.
+// This variable must be present somewhere in your service worker file,
+// even if you decide not to use precaching. See https://cra.link/PWA
+precacheAndRoute(self.__WB_MANIFEST);
 
-// // Set up App Shell-style routing, so that all navigation requests
-// // are fulfilled with your index.html shell. Learn more at
-// // https://developers.google.com/web/fundamentals/architecture/app-shell
-// const fileExtensionRegexp = new RegExp('/[^/?]+\\.[^/]+$');
-// registerRoute(
-//   // Return false to exempt requests from being fulfilled by index.html.
-//   ({ request, url }) => {
-//     // If this isn't a navigation, skip.
-//     if (request.mode !== 'navigate') {
-//       return false;
-//     } // If this is a URL that starts with /_, skip.
+// Set up App Shell-style routing, so that all navigation requests
+// are fulfilled with your index.html shell. Learn more at
+// https://developers.google.com/web/fundamentals/architecture/app-shell
+const fileExtensionRegexp = new RegExp('/[^/?]+\\.[^/]+$');
+registerRoute(
+  // Return false to exempt requests from being fulfilled by index.html.
+  ({ request, url }) => {
+    // If this isn't a navigation, skip.
+    if (request.mode !== 'navigate') {
+      return false;
+    } // If this is a URL that starts with /_, skip.
 
-//     if (url.pathname.startsWith('/_')) {
-//       return false;
-//     } // If this looks like a URL for a resource, because it contains // a file extension, skip.
+    if (url.pathname.startsWith('/_')) {
+      return false;
+    } // If this looks like a URL for a resource, because it contains // a file extension, skip.
 
-//     if (url.pathname.match(fileExtensionRegexp)) {
-//       return false;
-//     } // Return true to signal that we want to use the handler.
+    if (url.pathname.match(fileExtensionRegexp)) {
+      return false;
+    } // Return true to signal that we want to use the handler.
 
-//     return true;
-//   },
-//   createHandlerBoundToURL(process.env.PUBLIC_URL + '/index.html')
-// );
+    return true;
+  },
+  createHandlerBoundToURL(process.env.PUBLIC_URL + '/index.html')
+);
 
-// // An example runtime caching route for requests that aren't handled by the
-// // precache, in this case same-origin .png requests like those from in public/
-// registerRoute(
-//   // Add in any other file extensions or routing criteria as needed.
-//   ({ url }) => url.origin === self.location.origin && url.pathname.endsWith('.png'), // Customize this strategy as needed, e.g., by changing to CacheFirst.
-//   new StaleWhileRevalidate({
-//     cacheName: 'images',
-//     plugins: [
-//       // Ensure that once this runtime cache reaches a maximum size the
-//       // least-recently used images are removed.
-//       new ExpirationPlugin({ maxEntries: 50 }),
-//     ],
-//   })
-// );
+// An example runtime caching route for requests that aren't handled by the
+// precache, in this case same-origin .png requests like those from in public/
+registerRoute(
+  // Add in any other file extensions or routing criteria as needed.
+  ({ url }) => url.origin === self.location.origin && url.pathname.endsWith('.png'), // Customize this strategy as needed, e.g., by changing to CacheFirst.
+  new StaleWhileRevalidate({
+    cacheName: 'images',
+    plugins: [
+      // Ensure that once this runtime cache reaches a maximum size the
+      // least-recently used images are removed.
+      new ExpirationPlugin({ maxEntries: 50 }),
+    ],
+  })
+);
 
-// // This allows the web app to trigger skipWaiting via
-// // registration.waiting.postMessage({type: 'SKIP_WAITING'})
-// self.addEventListener('message', (event) => {
-//   if (event.data && event.data.type === 'SKIP_WAITING') {
-//     self.skipWaiting();
-//   }
-// });
+// This allows the web app to trigger skipWaiting via
+// registration.waiting.postMessage({type: 'SKIP_WAITING'})
+self.addEventListener('message', (event) => {
+  if (event.data && event.data.type === 'SKIP_WAITING') {
+    self.skipWaiting();
+  }
+});
 
-// // Any other custom service worker logic can go here.
+// Any other custom service worker logic can go here.

frontend/src/serviceWorkerRegistration.js

@@ -17,11 +17,12 @@ const isLocalhost = Boolean(
       // 127.0.0.0/8 are considered localhost for IPv4.
       window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/)
   );
-  
 
   export function register(config) {
     console.log('registering..', navigator)
     if ('serviceWorker' in navigator) {
+      console.log('registering..', navigator)
+
       // The URL constructor is available in all browsers that support SW.
       const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
       if (publicUrl.origin !== window.location.origin) {