fix: dashboard auth redirection and magic link login issues (#76)

Co-authored-by: Anwarul Islam <anwaarulislaam@gmail.com>

packages/hoppscotch-sh-admin/src/helpers/auth.ts

@@ -61,17 +61,21 @@ async function logout() {
 }
 
 async function signInUserWithGithubFB() {
-  window.location.href = `${import.meta.env.VITE_BACKEND_API_URL}/auth/github`;
+  window.location.href = `${
+    import.meta.env.VITE_BACKEND_API_URL
+  }/auth/github?redirect_uri=${import.meta.env.VITE_ADMIN_URL}`;
 }
 
 async function signInUserWithGoogleFB() {
-  window.location.href = `${import.meta.env.VITE_BACKEND_API_URL}/auth/google`;
+  window.location.href = `${
+    import.meta.env.VITE_BACKEND_API_URL
+  }/auth/google?redirect_uri=${import.meta.env.VITE_ADMIN_URL}`;
 }
 
 async function signInUserWithMicrosoftFB() {
   window.location.href = `${
     import.meta.env.VITE_BACKEND_API_URL
-  }/auth/microsoft`;
+  }/auth/microsoft?redirect_uri=${import.meta.env.VITE_ADMIN_URL}`;
 }
 
 async function getInitialUserDetails() {
@@ -215,7 +219,7 @@ async function elevateUser() {
 
 async function sendMagicLink(email: string) {
   const res = await axios.post(
-    `${import.meta.env.VITE_BACKEND_API_URL}/auth/signin`,
+    `${import.meta.env.VITE_BACKEND_API_URL}/auth/signin?origin=admin`,
     {
       email,
     },

packages/hoppscotch-sh-admin/src/modules/admin.ts

@@ -6,11 +6,28 @@ const isAdmin = () => {
   return user ? user.isAdmin : false;
 };
 
+const GUEST_ROUTES = ['index', 'magic-link'];
+
+const isGuestRoute = (to: unknown) => GUEST_ROUTES.includes(to as string);
+
+/**
+ * @module routers
+ */
+
+/**
+ * @function
+ * @name onBeforeRouteChange
+ * @param {object} to
+ * @param {object} from
+ * @param {function} next
+ * @returns {void}
+ */
+
 export default <HoppModule>{
   onBeforeRouteChange(to, from, next) {
-    if (to.name !== 'index' && !isAdmin()) {
+    if (!isGuestRoute(to.name) && !isAdmin()) {
       next({ name: 'index' });
-    } else if (to.name === 'index' && isAdmin()) {
+    } else if (isGuestRoute(to.name) && isAdmin()) {
       next({ name: 'dashboard' });
     } else {
       next();

packages/hoppscotch-sh-admin/src/pages/magic-link.vue

@@ -0,0 +1,35 @@
+<template>
+  <div class="flex flex-col items-center justify-center min-h-screen">
+    <HoppSmartSpinner v-if="signingInWithEmail" />
+    <AppLogo v-else class="w-16 h-16 rounded" />
+    <pre v-if="error" class="mt-4 text-secondaryLight">{{ error }}</pre>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { onBeforeMount, onMounted, ref } from 'vue';
+import { auth } from '~/helpers/auth';
+
+const signingInWithEmail = ref(false);
+const error = ref(null);
+
+onBeforeMount(() => {
+  auth.performAuthInit();
+});
+
+onMounted(async () => {
+  signingInWithEmail.value = true;
+  try {
+    await auth.processMagicLink();
+  } catch (e: any) {
+    error.value = e.message;
+  } finally {
+    signingInWithEmail.value = false;
+  }
+});
+</script>
+
+<route lang="yaml">
+meta:
+  layout: empty
+</route>