From e32dbe2ee21f2096b955df29fc1d1d4c58ef66a4 Mon Sep 17 00:00:00 2001
From: nick-delirium <nikita@openreplay.com>
Date: Mon, 14 Apr 2025 09:38:33 +0200
Subject: [PATCH] ui: check if spot ext exists on login comp

---
 frontend/app/components/Login/Login.tsx       | 31 ++++++++++++++++++-
 .../components/Spots/SpotsList/InstallCTA.tsx |  3 +-
 2 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/frontend/app/components/Login/Login.tsx b/frontend/app/components/Login/Login.tsx
index 45bb73ee2..590353f99 100644
--- a/frontend/app/components/Login/Login.tsx
+++ b/frontend/app/components/Login/Login.tsx
@@ -13,6 +13,7 @@ import { useStore } from 'App/mstore';
 import LanguageSwitcher from '../LanguageSwitcher';
 import withCaptcha, { WithCaptchaProps } from 'App/withRecaptcha';
 import SSOLogin from './SSOLogin';
+import { extKey } from 'Components/Spots/SpotsList/InstallCTA';
 
 const FORGOT_PASSWORD = forgotPassword();
 const SIGNUP_ROUTE = signup();
@@ -30,6 +31,7 @@ function Login({
   const { t } = useTranslation();
   const [email, setEmail] = useState('');
   const [password, setPassword] = useState('');
+  const [extExist, setExtExist] = useState<boolean>(false);
   const { loginStore, userStore } = useStore();
   const { errors } = userStore.loginRequest;
   const { loading } = loginStore;
@@ -38,6 +40,33 @@ function Login({
   const history = useHistory();
   const params = new URLSearchParams(location.search);
 
+  useEffect(() => {
+      let int: any;
+      const v = localStorage.getItem(extKey);
+      if (v) {
+        setExtExist(true);
+      } else {
+        int = setInterval(() => {
+          window.postMessage({ type: 'orspot:ping' }, '*');
+        });
+        const onSpotMsg = (e: any) => {
+          if (e.data.type === 'orspot:pong') {
+            setExtExist(true);
+            localStorage.setItem(extKey, '1');
+            clearInterval(int);
+            int = null;
+            window.removeEventListener('message', onSpotMsg);
+          }
+        };
+        window.addEventListener('message', onSpotMsg);
+      }
+      return () => {
+        if (int) {
+          clearInterval(int);
+        }
+      };
+    }, []);
+
   useEffect(() => {
     if (authDetails && !authDetails.tenants) {
       history.push(SIGNUP_ROUTE);
@@ -63,7 +92,7 @@ function Login({
     let int: ReturnType<typeof setInterval>;
 
     const onSpotMsg = (event: any) => {
-      if (event.data.type === 'orspot:logged') {
+      if (event.data.type === 'orspot:logged' && extExist) {
         clearInterval(int);
         window.removeEventListener('message', onSpotMsg);
         const msg = t('You have been logged into Spot successfully')
diff --git a/frontend/app/components/Spots/SpotsList/InstallCTA.tsx b/frontend/app/components/Spots/SpotsList/InstallCTA.tsx
index b534cde63..25a939712 100644
--- a/frontend/app/components/Spots/SpotsList/InstallCTA.tsx
+++ b/frontend/app/components/Spots/SpotsList/InstallCTA.tsx
@@ -4,9 +4,10 @@ import { Alert, Button } from 'antd';
 import { ArrowUpRight } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 
+export const extKey = '__$spot_ext_exist$__';
+
 function InstallCTA() {
   const { t } = useTranslation();
-  const extKey = '__$spot_ext_exist$__';
   const [extExist, setExtExist] = React.useState<boolean>(false);
   const isChromium =
     // @ts-ignore