update and test something

client-electron/src/pages/Home.tsx

@@ -1,11 +1,49 @@
 import React from 'react'
+import googleLogo from '../assets/google-color.svg'
 
 const Home: React.FC = () => {
   console.log(import.meta.env.TAOBIN_RECIPE_MANAGER_SERVER_URL)
 
+  const loginWithGoogle = () => {
+    // if is web mode then use window.open
+    // if is electron mode then use ipcRenderer.send to use deep link method
+    if (import.meta.env.TAOBIN_RECIPE_MANAGER_MODE === 'web') {
+      // open new window and listen to message from window.opener
+      const newWindow = window.open(
+        import.meta.env.TAOBIN_RECIPE_MANAGER_SERVER_URL,
+        '_blank',
+        'width=500,height=600'
+      )
+
+      // listen to message from new window
+      window.addEventListener('message', event => {
+        if (event.data.payload === 'loginSuccess') {
+          // close new window
+          newWindow?.close()
+
+          console.log(event.data)
+        }
+      })
+    } else {
+      window.ipcRenderer.send('deeplink', 'http://127.0.0.1:5500/test.html')
+    }
+  }
+
   return (
     <div>
       <h1>This is Home Page!!!</h1>
+      <button
+        onClick={loginWithGoogle}
+        className="bg-white px-4 py-2 border flex gap-2 border-slate-200 rounded-lg text-slate-700 hover:border-slate-400 hover:text-slate-900 hover:shadow transition duration-150"
+      >
+        <img
+          className="w-6 h-6"
+          src={googleLogo}
+          alt="google logo"
+          loading="lazy"
+        />
+        <span>Login with @forth.co.th Google account</span>
+      </button>
     </div>
   )
 }