From 840b59fcba2a9fbadc37fb3ecf0c8aee67dd992c Mon Sep 17 00:00:00 2001
From: Harrison Deng <yunyangdeng@gmail.com>
Date: Wed, 14 Jul 2021 01:15:04 -0500
Subject: [PATCH] Fixed a silent login callback error and reworked project
 structure.

---
 Props/client/.eslintrc.js                     | 62 +++++++++----------
 .../public/authentication/callback-handler.js | 13 ----
 ...silent-login-callback.html => silent.html} |  6 +-
 Props/client/src/{ => index}/App.vue          |  0
 .../src/{ => index}/components/InfoCard.vue   |  0
 .../{ => index}/components/ProfileDisplay.vue |  4 +-
 .../{ => index}/components/ProfileLogIn.vue   |  0
 .../{ => index}/components/ProfileLogOut.vue  |  0
 .../{ => index}/components/ProfileSignUp.vue  |  0
 .../src/{ => index}/components/SearchBar.vue  |  0
 .../src/{ => index}/components/WaitCircle.vue |  0
 Props/client/src/{ => index}/main.js          |  4 +-
 .../src/{ => index}/registerServiceWorker.js  |  0
 Props/client/src/{ => index}/router/guards.js |  0
 Props/client/src/{ => index}/router/index.js  |  0
 Props/client/src/{ => index}/router/routes.js |  0
 .../client/src/{ => index}/store/identity.js  |  8 +--
 Props/client/src/{ => index}/store/index.js   |  0
 Props/client/src/{ => index}/views/About.vue  |  0
 .../src/{ => index}/views/Authentication.vue  |  6 +-
 Props/client/src/{ => index}/views/Home.vue   |  2 +-
 Props/client/src/silent/main.js               | 12 ++++
 Props/client/vue.config.js                    |  6 +-
 Props/server/Startup.cs                       | 12 ++--
 24 files changed, 72 insertions(+), 63 deletions(-)
 delete mode 100644 Props/client/public/authentication/callback-handler.js
 rename Props/client/public/{authentication/silent-login-callback.html => silent.html} (68%)
 rename Props/client/src/{ => index}/App.vue (100%)
 rename Props/client/src/{ => index}/components/InfoCard.vue (100%)
 rename Props/client/src/{ => index}/components/ProfileDisplay.vue (92%)
 rename Props/client/src/{ => index}/components/ProfileLogIn.vue (100%)
 rename Props/client/src/{ => index}/components/ProfileLogOut.vue (100%)
 rename Props/client/src/{ => index}/components/ProfileSignUp.vue (100%)
 rename Props/client/src/{ => index}/components/SearchBar.vue (100%)
 rename Props/client/src/{ => index}/components/WaitCircle.vue (100%)
 rename Props/client/src/{ => index}/main.js (65%)
 rename Props/client/src/{ => index}/registerServiceWorker.js (100%)
 rename Props/client/src/{ => index}/router/guards.js (100%)
 rename Props/client/src/{ => index}/router/index.js (100%)
 rename Props/client/src/{ => index}/router/routes.js (100%)
 rename Props/client/src/{ => index}/store/identity.js (96%)
 rename Props/client/src/{ => index}/store/index.js (100%)
 rename Props/client/src/{ => index}/views/About.vue (100%)
 rename Props/client/src/{ => index}/views/Authentication.vue (94%)
 rename Props/client/src/{ => index}/views/Home.vue (99%)
 create mode 100644 Props/client/src/silent/main.js

diff --git a/Props/client/.eslintrc.js b/Props/client/.eslintrc.js
index df848b6..71857fb 100644
--- a/Props/client/.eslintrc.js
+++ b/Props/client/.eslintrc.js
@@ -1,33 +1,33 @@
 module.exports = {
-  root: true,
-  env: {
-    node: true
-  },
-  extends: [
-    'plugin:vue/vue3-essential',
-    '@vue/standard'
-  ],
-  parserOptions: {
-    parser: 'babel-eslint'
-  },
-  rules: {
-    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
-    'quotes': ['error', 'double', 'avoid-escape'],
-    'semi': ['error', 'always'],
-    'indent': ['error', 4],
-    'comma-dangle': ['error', 'only-multiline'],
-    'space-before-function-paren': ['error', 'never']
-  },
-  overrides: [
-    {
-      files: [
-        '**/__tests__/*.{j,t}s?(x)',
-        '**/tests/unit/**/*.spec.{j,t}s?(x)'
-      ],
-      env: {
-        mocha: true
-      }
-    }
-  ]
+    root: true,
+    env: {
+        node: true
+    },
+    extends: [
+        'plugin:vue/vue3-essential',
+        '@vue/standard'
+    ],
+    parserOptions: {
+        parser: 'babel-eslint'
+    },
+    rules: {
+        'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
+        'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
+        'quotes': ['error', 'double', 'avoid-escape'],
+        'semi': ['error', 'always'],
+        'indent': ['error', 4, { "SwitchCase": 1 }],
+        'comma-dangle': ['error', 'only-multiline'],
+        'space-before-function-paren': ['error', 'never']
+    },
+    overrides: [
+        {
+            files: [
+                '**/__tests__/*.{j,t}s?(x)',
+                '**/tests/unit/**/*.spec.{j,t}s?(x)'
+            ],
+            env: {
+                mocha: true
+            }
+        }
+    ]
 }
diff --git a/Props/client/public/authentication/callback-handler.js b/Props/client/public/authentication/callback-handler.js
deleted file mode 100644
index e47465c..0000000
--- a/Props/client/public/authentication/callback-handler.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import { UserManager, WebStorageStateStore } from "oidc-client";
-
-const userManager = new UserManager({
-    authority: window.location.origin,
-    client_id: "Props",
-    redirect_uri: window.location.origin + "/authentication/login-callback",
-    post_logout_redirect_uri: window.location.origin + "/authentication/logout-callback",
-    response_type: "code",
-    scope: "openid profile",
-    userStore: new WebStorageStateStore({ store: window.localStorage }),
-});
-
-userManager.signinSilentCallback();
diff --git a/Props/client/public/authentication/silent-login-callback.html b/Props/client/public/silent.html
similarity index 68%
rename from Props/client/public/authentication/silent-login-callback.html
rename to Props/client/public/silent.html
index ab400a1..458f773 100644
--- a/Props/client/public/authentication/silent-login-callback.html
+++ b/Props/client/public/silent.html
@@ -1,16 +1,18 @@
 <!-- Completely separate static html should improve silent login performance as we don't need to load entire SPA.  -->
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>authentication</title>
-    <script type="module" src="callback-handler.js"></script>
 </head>
+
 <body>
     <div>
-        Silently authenticating user. If you are seeing this page, you probably want to <a href="/">go back to the app</a>.
+        Processing... If you're seeing this, you may want to <a href="/">go back to the app</a>.
     </div>
 </body>
+
 </html>
\ No newline at end of file
diff --git a/Props/client/src/App.vue b/Props/client/src/index/App.vue
similarity index 100%
rename from Props/client/src/App.vue
rename to Props/client/src/index/App.vue
diff --git a/Props/client/src/components/InfoCard.vue b/Props/client/src/index/components/InfoCard.vue
similarity index 100%
rename from Props/client/src/components/InfoCard.vue
rename to Props/client/src/index/components/InfoCard.vue
diff --git a/Props/client/src/components/ProfileDisplay.vue b/Props/client/src/index/components/ProfileDisplay.vue
similarity index 92%
rename from Props/client/src/components/ProfileDisplay.vue
rename to Props/client/src/index/components/ProfileDisplay.vue
index ef8f544..fde641f 100644
--- a/Props/client/src/components/ProfileDisplay.vue
+++ b/Props/client/src/index/components/ProfileDisplay.vue
@@ -13,7 +13,7 @@
 </template>
 
 <script>
-import { identityPaths } from "../services/authentication";
+import { identityPaths } from "@/services/authentication";
 import WaitCircle from "./WaitCircle.vue";
 export default {
     components: {
@@ -29,7 +29,7 @@ export default {
     },
     data() {
         return {
-            manageUrl: identityPaths.Manage,
+            manageUrl: identityPaths.Manage
         };
     },
     computed: {
diff --git a/Props/client/src/components/ProfileLogIn.vue b/Props/client/src/index/components/ProfileLogIn.vue
similarity index 100%
rename from Props/client/src/components/ProfileLogIn.vue
rename to Props/client/src/index/components/ProfileLogIn.vue
diff --git a/Props/client/src/components/ProfileLogOut.vue b/Props/client/src/index/components/ProfileLogOut.vue
similarity index 100%
rename from Props/client/src/components/ProfileLogOut.vue
rename to Props/client/src/index/components/ProfileLogOut.vue
diff --git a/Props/client/src/components/ProfileSignUp.vue b/Props/client/src/index/components/ProfileSignUp.vue
similarity index 100%
rename from Props/client/src/components/ProfileSignUp.vue
rename to Props/client/src/index/components/ProfileSignUp.vue
diff --git a/Props/client/src/components/SearchBar.vue b/Props/client/src/index/components/SearchBar.vue
similarity index 100%
rename from Props/client/src/components/SearchBar.vue
rename to Props/client/src/index/components/SearchBar.vue
diff --git a/Props/client/src/components/WaitCircle.vue b/Props/client/src/index/components/WaitCircle.vue
similarity index 100%
rename from Props/client/src/components/WaitCircle.vue
rename to Props/client/src/index/components/WaitCircle.vue
diff --git a/Props/client/src/main.js b/Props/client/src/index/main.js
similarity index 65%
rename from Props/client/src/main.js
rename to Props/client/src/index/main.js
index 4badd84..817862d 100644
--- a/Props/client/src/main.js
+++ b/Props/client/src/index/main.js
@@ -4,8 +4,8 @@ import "./registerServiceWorker";
 import router from "./router";
 import store from "./store";
 
-import "../node_modules/bootstrap-icons/font/bootstrap-icons.css";
-import "./assets/scss/main.scss"; // Main global scss file.
+import "@/../node_modules/bootstrap-icons/font/bootstrap-icons.css";
+import "@/assets/scss/main.scss"; // Main global scss file.
 
 const app = createApp(App);
 
diff --git a/Props/client/src/registerServiceWorker.js b/Props/client/src/index/registerServiceWorker.js
similarity index 100%
rename from Props/client/src/registerServiceWorker.js
rename to Props/client/src/index/registerServiceWorker.js
diff --git a/Props/client/src/router/guards.js b/Props/client/src/index/router/guards.js
similarity index 100%
rename from Props/client/src/router/guards.js
rename to Props/client/src/index/router/guards.js
diff --git a/Props/client/src/router/index.js b/Props/client/src/index/router/index.js
similarity index 100%
rename from Props/client/src/router/index.js
rename to Props/client/src/index/router/index.js
diff --git a/Props/client/src/router/routes.js b/Props/client/src/index/router/routes.js
similarity index 100%
rename from Props/client/src/router/routes.js
rename to Props/client/src/index/router/routes.js
diff --git a/Props/client/src/store/identity.js b/Props/client/src/index/store/identity.js
similarity index 96%
rename from Props/client/src/store/identity.js
rename to Props/client/src/index/store/identity.js
index d07e59e..e12f664 100644
--- a/Props/client/src/store/identity.js
+++ b/Props/client/src/index/store/identity.js
@@ -1,7 +1,7 @@
 import router from "../router";
-import { identityPaths, identityQueryParameters, userManager } from "../services/authentication";
-import { addBearerTokenInterceptor, apiHttp, removeBearerTokenInterceptor } from "../services/http";
-import { get, put } from "../services/persistence";
+import { identityPaths, identityQueryParameters, userManager } from "@/services/authentication";
+import { addBearerTokenInterceptor, apiHttp, removeBearerTokenInterceptor } from "@/services/http";
+import { get, put } from "@/services/persistence";
 
 const identity = {
     state: () => ({
@@ -67,7 +67,7 @@ const identity = {
             if (!context.getters.isAuthenticated) {
                 try {
                     const user = await userManager.signinSilent({
-                        redirect_uri: window.location.origin + "/authentication/silent-login-callback.html"
+                        redirect_uri: window.location.origin + "/silent/login-callback"
                     });
 
                     context.commit("login", { user });
diff --git a/Props/client/src/store/index.js b/Props/client/src/index/store/index.js
similarity index 100%
rename from Props/client/src/store/index.js
rename to Props/client/src/index/store/index.js
diff --git a/Props/client/src/views/About.vue b/Props/client/src/index/views/About.vue
similarity index 100%
rename from Props/client/src/views/About.vue
rename to Props/client/src/index/views/About.vue
diff --git a/Props/client/src/views/Authentication.vue b/Props/client/src/index/views/Authentication.vue
similarity index 94%
rename from Props/client/src/views/Authentication.vue
rename to Props/client/src/index/views/Authentication.vue
index 0f00177..93908e3 100644
--- a/Props/client/src/views/Authentication.vue
+++ b/Props/client/src/index/views/Authentication.vue
@@ -15,7 +15,7 @@
 
 <script>
 import WaitCircle from "../components/WaitCircle.vue";
-import { userManager } from "../services/authentication";
+import { userManager } from "@/services/authentication";
 
 export default {
     name: "Authentication",
@@ -44,7 +44,9 @@ export default {
                 await userManager.signoutRedirectCallback();
                 this.$store.dispatch("completeDeauthentication");
             } else if (this.action === "silent-login") {
-                this.$store.dispatch("attemptSilentAuthentication", { redirect: true });
+                this.$store.dispatch("attemptSilentAuthentication", {
+                    redirect: true
+                });
             } else {
                 console.warn("Unknown callback: " + this.action);
             }
diff --git a/Props/client/src/views/Home.vue b/Props/client/src/index/views/Home.vue
similarity index 99%
rename from Props/client/src/views/Home.vue
rename to Props/client/src/index/views/Home.vue
index 5aaae64..9b201c0 100644
--- a/Props/client/src/views/Home.vue
+++ b/Props/client/src/index/views/Home.vue
@@ -4,7 +4,7 @@
             <img
                 id="large-logo"
                 alt="SHAID logo"
-                src="../assets/images/logo.svg"
+                src="@/assets/images/logo.svg"
                 class="img-fluid"
             />
         </div>
diff --git a/Props/client/src/silent/main.js b/Props/client/src/silent/main.js
new file mode 100644
index 0000000..4591c89
--- /dev/null
+++ b/Props/client/src/silent/main.js
@@ -0,0 +1,12 @@
+const { userManager } = require("../services/authentication");
+
+const action = window.location.pathname.split("/").pop();
+switch (action) {
+    case "login-callback":
+        userManager.signinSilentCallback();
+        break;
+
+    default:
+        console.warn("Unknown silent action: " + action);
+        break;
+}
diff --git a/Props/client/vue.config.js b/Props/client/vue.config.js
index 6041e7c..1d5e5dc 100644
--- a/Props/client/vue.config.js
+++ b/Props/client/vue.config.js
@@ -1,9 +1,13 @@
 module.exports = {
     pages: {
         index: {
-            entry: "src/main.js",
+            entry: "src/index/main.js",
             template: "public/index.html",
             title: "Props"
+        },
+        silent: {
+            entry: "src/silent/main.js",
+            template: "public/silent.html",
         }
     },
     css: {
diff --git a/Props/server/Startup.cs b/Props/server/Startup.cs
index 94b3ebc..d5b4ded 100644
--- a/Props/server/Startup.cs
+++ b/Props/server/Startup.cs
@@ -2,11 +2,11 @@ using Microsoft.AspNetCore.Authentication;
 using Microsoft.AspNetCore.Builder;
 using Microsoft.AspNetCore.Hosting;
 using Microsoft.EntityFrameworkCore;
-using Props.Data;
-using Props.Models;
 using Microsoft.Extensions.Configuration;
 using Microsoft.Extensions.DependencyInjection;
 using Microsoft.Extensions.Hosting;
+using Props.Data;
+using Props.Models;
 
 namespace Props
 {
@@ -35,9 +35,11 @@ namespace Props
 
             services.AddIdentityServer()
                 .AddApiAuthorization<ApplicationUser, ApplicationDbContext>(
-                    options => {
-                        options.Clients.AddIdentityServerSPA("Props", spa => {
-                            spa.WithRedirectUri("/authentication/silent-login-callback.html");
+                    options =>
+                    {
+                        options.Clients.AddIdentityServerSPA("Props", spa =>
+                        {
+                            spa.WithRedirectUri("/silent/login-callback");
                             spa.WithRedirectUri("/authentication/login-callback");
                             spa.WithLogoutRedirectUri("/authentication/logout-callback");
                         });