Fix auto login for mock view (#30)

.github/workflows/demo-release.yml

@@ -4,14 +4,9 @@ on:
   push:
     branches:
       - main
-  pull_request:
-    types: [opened, synchronize, reopened, closed]
-    branches:
-      - main
 
 jobs:
   build_and_deploy_job:
-    if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed')
     runs-on: ubuntu-latest
     name: Build and Deploy Job
     steps:
@@ -34,15 +29,3 @@ jobs:
           app_build_command: "npm run build"
           api_build_command: "rm -rf ./node_modules/@next/swc-* && rm -rf ./.next/cache"
           ###### End of Repository/Build Configurations ######
-
-  close_pull_request_job:
-    if: github.event_name == 'pull_request' && github.event.action == 'closed'
-    runs-on: ubuntu-latest
-    name: Close Pull Request Job
-    steps:
-      - name: Close Pull Request
-        id: closepullrequest
-        uses: Azure/static-web-apps-deploy@v1
-        with:
-          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
-          action: "close"

src/app/api/versions/route.ts

@@ -2,11 +2,24 @@ import { getAppVersion } from "@/server/services/install.service"
 import { failure, success } from "@/server/services/request.service"
 import { NextRequest } from "next/server"
 
+const IS_MOCK = process.env.IS_MOCK === "true"
+
 export const GET = async (req: NextRequest) => {
   const scope = req.nextUrl.searchParams.get("scope")
   if (scope === "app") {
     const version = await getAppVersion()
-    return success(version)
+    if (!version) {
+      return success({
+        isInstalled: false,
+        isMock: IS_MOCK,
+      })
+    } else {
+      return success({
+        ...version,
+        isInstalled: true,
+        isMock: IS_MOCK,
+      })
+    }
   }
 
   return failure("Scope not supported")

src/app/auth/login/page.tsx

@@ -7,15 +7,18 @@ import { Input } from "@/components/ui/input"
 import { Label } from "@/components/ui/label"
 import { useInstallHook } from "@/hooks/use-install.hook"
 import { useLoginMutation } from "@/redux/services/auth.api"
+import { useGetGlobalAppVersionQuery } from "@/redux/services/versions.api"
 import { Spinner, Typography } from "@material-tailwind/react"
-import React, { useState } from "react"
+import React, { useEffect, useState } from "react"
 
 export default function Page() {
   const [email, setEmail] = useState("")
   const [password, setPassword] = useState("")
   const [login, { isLoading }] = useLoginMutation()
   const [hasError, setHasError] = useState(false)
 
+  const { data, isLoading: isGlobalLoading } = useGetGlobalAppVersionQuery()
+
   useInstallHook()
 
   const handleSubmit = async (e: React.FormEvent) => {
@@ -40,6 +43,13 @@ export default function Page() {
     window.location.href = "/"
   }
 
+  useEffect(() => {
+    if (!isGlobalLoading && data?.isInstalled && data?.isMock) {
+      setEmail("[email protected]")
+      setPassword("password")
+    }
+  }, [isGlobalLoading, data])
+
   return (
     <section className="w-screen h-screen flex items-center">
       <div className="w-full lg:grid lg:min-h-[600px] lg:grid-cols-2 xl:min-h-[800px]">

src/app/install/page.tsx

@@ -8,34 +8,50 @@ import {
   CardFooter,
   Typography,
 } from "@material-tailwind/react"
-import { useState } from "react"
+import { useSearchParams } from "next/navigation"
+import { useCallback, useEffect, useState } from "react"
 
 export default function Page() {
+  const searchParams = useSearchParams()
+  const isMock = searchParams.get("mock") === "1"
   const [first, setFirst] = useState("")
   const [last, setLast] = useState("")
   const [email, setEmail] = useState("")
   const [password, setPassword] = useState("")
 
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault()
+  const handleSubmit = useCallback(
+    async (e: React.FormEvent) => {
+      e.preventDefault()
 
-    const response = await fetch("/api/versions/install", {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-      },
-      body: JSON.stringify({
-        first: first,
-        last: last,
-        email: email,
-        password: password,
-      }),
-    })
+      const response = await fetch("/api/versions/install", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify({
+          first: first,
+          last: last,
+          email: email,
+          password: password,
+        }),
+      })
 
-    if (response.ok) {
-      window.location.href = "/"
+      if (response.ok) {
+        window.location.href = "/"
+      }
+    },
+    [first, last, email, password]
+  )
+
+  useEffect(() => {
+    if (isMock) {
+      setFirst("Mock")
+      setLast("User")
+      setEmail("[email protected]")
+      setPassword("password")
+      handleSubmit({ preventDefault: () => {} } as React.FormEvent)
     }
-  }
+  }, [isMock, setFirst, setLast, setEmail, setPassword, handleSubmit])
 
   return (
     <section className="w-screen h-screen flex flex-col items-center mt-12">

src/hooks/use-install.hook.ts

@@ -6,8 +6,9 @@ export const useInstallHook = () => {
   const { data, isLoading, isSuccess } = useGetGlobalAppVersionQuery()
 
   useEffect(() => {
-    if (!isLoading && isSuccess && !data) {
-      window.location.href = "/install"
+    if (!isLoading && isSuccess && (!data || !data.isInstalled)) {
+      console.log("here")
+      window.location.href = `/install?mock=${data.isMock ? "1" : "0"}`
     }
   }, [isLoading, isSuccess, data])
 }

src/models/version.model.ts

@@ -1,6 +1,8 @@
 export interface Version {
   version: string
   app: string
+  isInstalled?: boolean
+  isMock?: boolean
 }
 
 export interface InstallAppPayload {