sysgears · beingtmk · Dec 14, 2019 · Dec 14, 2019 · Dec 14, 2019 · Dec 14, 2019
diff --git a/modules/core/server-ts/middleware/website.tsx b/modules/core/server-ts/middleware/website.tsx
@@ -62,6 +62,7 @@ const Html = ({ content, state, css, headElements, helmet }: HtmlProps) => (
     </head>
     <body {...helmet.bodyAttributes.toComponent()}>
       <div id="root" dangerouslySetInnerHTML={{ __html: content || '' }} />
+      <script src="initServiceWorker.js" />
       <script
         dangerouslySetInnerHTML={{
           __html: `window.__APOLLO_STATE__=${serialize(state, {

diff --git a/modules/favicon/common/assets/manifest.xjson b/modules/favicon/common/assets/manifest.xjson
@@ -1,5 +1,6 @@
 {
-    "name": "",
+    "short_name": "AUSK",
+    "name": "apollo-universal-starter-kit",
     "icons": [
         {
             "src": "android-chrome-192x192.png",
@@ -12,7 +13,9 @@
             "type": "image/png"
         }
     ],
+    "start_url": ".",
     "theme_color": "#ffffff",
     "background_color": "#ffffff",
-    "display": "standalone"
+    "display": "standalone",
+    "orientation": "portrait"
 }
diff --git a/modules/favicon/common/index.js b/modules/favicon/common/index.js
@@ -2,6 +2,10 @@ if (!__TEST__) {
   // Favicon.ico should not be hashed, since some browsers expect it to be exactly on /favicon.ico URL
   require('!file-loader?name=[name].[ext]!./assets/favicon.ico'); // eslint-disable-line
 
+  // android-chrome paths are required to be exact as they are required in manifest file
+  require('!file-loader?name=[name].[ext]!./assets/android-chrome-192x192.png'); // eslint-disable-line
+  require('!file-loader?name=[name].[ext]!./assets/android-chrome-256x256.png'); // eslint-disable-line
+
   // Require all files from assets dir recursively addding them into assets.json
   let req = require.context('!file-loader?name=[hash].[ext]!./assets', true, /.*/);
   req.keys().map(req);

diff --git a/modules/payments/client-react/stripe/subscription/containers/AddSubscription.tsx b/modules/payments/client-react/stripe/subscription/containers/AddSubscription.tsx
@@ -77,8 +77,8 @@ const AddSubscription = ({ t, history, navigation }: AddSubscriptionProps) => {
                   <AddSubscriptionView submitting={submitting} onSubmit={onSubmit(addSubscription)} t={t} />
                 </StripeProvider>
               ) : (
-                  <AddSubscriptionView submitting={submitting} onSubmit={onSubmit(addSubscription)} t={t} />
-                )}
+                <AddSubscriptionView submitting={submitting} onSubmit={onSubmit(addSubscription)} t={t} />
+              )}
             </Fragment>
           );
         }}

diff --git a/modules/pwa/client-react/__tests__/Pwa.test.ts b/modules/pwa/client-react/__tests__/Pwa.test.ts
@@ -0,0 +1 @@
+// Tests Here
diff --git a/modules/pwa/client-react/index.js b/modules/pwa/client-react/index.js
@@ -0,0 +1,4 @@
+// Loading the initialization for service workers
+require('!file-loader?name=./initServiceWorker.js!./initServiceWorker.js'); // eslint-disable-line import/no-webpack-loader-syntax, import/no-unresolved
+// Logading the service workers
+require('!file-loader?name=./basicServiceWorker.js!./sw/basicServiceWorker.js'); // eslint-disable-line import/no-webpack-loader-syntax, import/no-unresolved
diff --git a/modules/pwa/client-react/index.native.js b/modules/pwa/client-react/index.native.js
@@ -0,0 +1 @@
+// Placeholder for mobile platforms
diff --git a/modules/pwa/client-react/initServiceWorker.js b/modules/pwa/client-react/initServiceWorker.js
@@ -0,0 +1,20 @@
+/*global navigator*/
+if ('serviceWorker' in navigator) {
+  window.addEventListener('load', () => {
+    navigator.serviceWorker
+      .register('basicServiceWorker.js')
+      .then(
+        registration => {
+          console.log('Service Worker registration successful', registration.scope);
+        },
+        err => {
+          console.log('Service Worker registration failed', err);
+        }
+      )
+      .catch(err => {
+        console.log(`Service Worker error: ${err}`);
+      });
+  });
+} else {
+  console.log('Service Worker is not supported by browser.');
+}
diff --git a/modules/pwa/client-react/package.json b/modules/pwa/client-react/package.json
@@ -0,0 +1,5 @@
+{
+  "name": "@gqlapp/pwa-client-react",
+  "version": "1.0.0",
+  "private": true
+}
diff --git a/modules/pwa/client-react/sw/basicServiceWorker.js b/modules/pwa/client-react/sw/basicServiceWorker.js
@@ -0,0 +1,50 @@
+/*global self*/
+const CACHE_NAME = 'ausk-v1';
+// let assetsToCache = [
+//   '/',
+// ];
+
+// Install a service worker
+// self.addEventListener('install', event => {
+//   // Perform install steps
+//   event.waitUntil(
+//     window.caches.open(CACHE_NAME)
+//       .then(cache => {
+//         console.log('Opened cache');
+//         cache.addAll(assetsToCache);
+//       })
+//       .then(() => self.skipWaiting())
+//   );
+// });
+
+// Cache and return requests
+self.addEventListener('fetch', event => {
+  event.respondWith(
+    // caching urls while fetching
+    fetch(event.request)
+      .then(res => {
+        const resClone = res.clone();
+        window.caches.open(CACHE_NAME).then(cache => {
+          cache.put(event.request, resClone);
+        });
+        return res;
+      })
+      .catch(() => window.caches.match(event.request).then(res => res))
+  );
+});
+
+// Update a service worker
+self.addEventListener('activate', event => {
+  let cacheWhitelist = [CACHE_NAME];
+  event.waitUntil(
+    window.caches.keys().then(cacheNames => {
+      return Promise.all(
+        cacheNames.map(cacheName => {
+          if (cacheWhitelist.indexOf(cacheName) === -1) {
+            return window.caches.delete(cacheName);
+          }
+        })
+      );
+    })
+  );
+});
diff --git a/packages/client/package.json b/packages/client/package.json
@@ -51,6 +51,7 @@
     "@gqlapp/i18n-common-react": "^0.1.0",
     "@gqlapp/module-client-react": "^0.1.0",
     "@gqlapp/payments-client-react": "^0.1.0",
+    "@gqlapp/pwa-client-react": "^1.0.0",
     "@gqlapp/reports-client-react": "^0.1.0",
     "@gqlapp/validation-common-react": "^0.1.0",
     "@loadable/component": "^5.10.1",

diff --git a/packages/client/src/modules.ts b/packages/client/src/modules.ts
@@ -1,3 +1,4 @@
+import pwa from '@gqlapp/pwa-client-react';
 import core from '@gqlapp/core-client-react';
 import look from '@gqlapp/look-client-react';
 import i18n from '@gqlapp/i18n-client-react';
@@ -19,6 +20,7 @@ const pagination = require('@gqlapp/pagination-client-react').default;
 const user = require('@gqlapp/user-client-react').default;
 
 const modules = new ClientModule(
+  pwa,
   look,
   validation,
   defaultRouter,