From 2d8ff056c44bac5950ed77e7f67ca3b613b8a7e9 Mon Sep 17 00:00:00 2001 From: nick-delirium Date: Fri, 6 Sep 2024 15:42:29 +0200 Subject: [PATCH] ui: spot related api fixes --- frontend/app/Router.tsx | 37 +++------------------ frontend/app/api_client.ts | 4 ++- frontend/app/api_middleware.js | 6 +++- frontend/app/duck/user.js | 2 +- frontend/app/utils/index.ts | 36 ++++++++++++++++++++ spot/entrypoints/background.ts | 15 ++++++--- spot/entrypoints/content/SavingControls.tsx | 2 +- 7 files changed, 62 insertions(+), 40 deletions(-) diff --git a/frontend/app/Router.tsx b/frontend/app/Router.tsx index 57a019118..28707c65a 100644 --- a/frontend/app/Router.tsx +++ b/frontend/app/Router.tsx @@ -9,11 +9,12 @@ import PublicRoutes from 'App/PublicRoutes'; import { GLOBAL_DESTINATION_PATH, IFRAME, - JWT_PARAM, SPOT_ONBOARDING + JWT_PARAM, + SPOT_ONBOARDING } from "App/constants/storageKeys"; import Layout from 'App/layout/Layout'; import { withStore } from "App/mstore"; -import { checkParam } from 'App/utils'; +import { checkParam, handleSpotJWT } from "App/utils"; import { ModalProvider } from 'Components/Modal'; import { ModalProvider as NewModalProvider } from 'Components/ModalContext'; import { fetchListActive as fetchMetadata } from 'Duck/customField'; @@ -25,7 +26,6 @@ import { fetchTenants } from 'Duck/user'; import { Loader } from 'UI'; import { spotsList } from "./routes"; import * as routes from './routes'; -import { toast } from 'react-toastify' interface RouterProps extends RouteComponentProps, @@ -72,6 +72,7 @@ const Router: React.FC = (props) => { const spotReqSent = React.useRef(false) const [isIframe, setIsIframe] = React.useState(false); const [isJwt, setIsJwt] = React.useState(false); + const handleJwtFromUrl = () => { const params = new URLSearchParams(location.search) const urlJWT = params.get('jwt'); @@ -90,35 +91,7 @@ const Router: React.FC = (props) => { } else { spotReqSent.current = true; } - let tries = 0; - if (!jwt) { - return; - } - let int: ReturnType; - - const onSpotMsg = (event: any) => { - if (event.data.type === 'orspot:logged') { - clearInterval(int); - window.removeEventListener('message', onSpotMsg); - } - }; - window.addEventListener('message', onSpotMsg); - - int = setInterval(() => { - if (tries > 20) { - clearInterval(int); - window.removeEventListener('message', onSpotMsg); - return; - } - window.postMessage( - { - type: 'orspot:token', - token: jwt, - }, - '*' - ); - tries += 1; - }, 250); + handleSpotJWT(jwt); }; const handleDestinationPath = () => { diff --git a/frontend/app/api_client.ts b/frontend/app/api_client.ts index ffc0843cb..10c1c2219 100644 --- a/frontend/app/api_client.ts +++ b/frontend/app/api_client.ts @@ -151,7 +151,7 @@ export default class APIClient { let fetch = window.fetch; let edp = window.env.API_EDP || window.location.origin + '/api'; const spotService = path.includes('/spot') && !path.includes('/login') - if (spotService) { + if (spotService && !edp.includes('api.openreplay.com')) { edp = edp.replace('/api', '') } if ( @@ -181,6 +181,8 @@ export default class APIClient { _path = _path.replace('PROJECT_ID', this.siteId + ''); } + console.log(edp, _path, init) + return fetch(edp + _path, init).then((response) => { if (response.ok) { return response; diff --git a/frontend/app/api_middleware.js b/frontend/app/api_middleware.js index a6ef69108..e856617b5 100644 --- a/frontend/app/api_middleware.js +++ b/frontend/app/api_middleware.js @@ -1,6 +1,7 @@ import logger from 'App/logger'; import APIClient from './api_client'; import { FETCH_ACCOUNT, UPDATE_JWT } from './duck/user'; +import { handleSpotJWT } from "App/utils"; export default () => (next) => (action) => { const { types, call, ...rest } = action; @@ -23,7 +24,7 @@ export default () => (next) => (action) => { return response.json(); }) .then((json) => json || {}) // TEMP TODO on server: no empty responses - .then(({ jwt, errors, data }) => { + .then(({ jwt, spotJwt, errors, data }) => { if (errors) { next({ type: FAILURE, errors, data }); } else { @@ -32,6 +33,9 @@ export default () => (next) => (action) => { if (jwt) { next({ type: UPDATE_JWT, data: { jwt } }); } + if (spotJwt) { + handleSpotJWT(spotJwt); + } }) .catch(async (e) => { if (e.response?.status === 403) { diff --git a/frontend/app/duck/user.js b/frontend/app/duck/user.js index 8a7f1ed48..49bebf6fa 100644 --- a/frontend/app/duck/user.js +++ b/frontend/app/duck/user.js @@ -168,7 +168,7 @@ export const downgradeScope = () => ({ export const login = (params) => ({ types: LOGIN.toArray(), - call: (client) => client.post('/login', params), + call: (client) => client.post('/login?spot=true', params), }); export const loadingLogin = () => ({ diff --git a/frontend/app/utils/index.ts b/frontend/app/utils/index.ts index 4ec9e5520..8087094df 100644 --- a/frontend/app/utils/index.ts +++ b/frontend/app/utils/index.ts @@ -501,3 +501,39 @@ export function truncateStringToFit(string: string, screenWidth: number, charWid return string.slice(0, frontLen) + ellipsis + string.slice(-backLen); } + +let sendingRequest = false; +export const handleSpotJWT = (jwt: string) => { + console.log(jwt, sendingRequest) + let tries = 0; + if (!jwt || sendingRequest) { + return; + } + sendingRequest = true; + let int: ReturnType; + const onSpotMsg = (event: any) => { + if (event.data.type === 'orspot:logged') { + clearInterval(int); + sendingRequest = false; + window.removeEventListener('message', onSpotMsg); + } + }; + window.addEventListener('message', onSpotMsg); + + int = setInterval(() => { + if (tries > 20) { + sendingRequest = false; + clearInterval(int); + window.removeEventListener('message', onSpotMsg); + return; + } + window.postMessage( + { + type: 'orspot:token', + token: jwt, + }, + '*' + ); + tries += 1; + }, 250) +} \ No newline at end of file diff --git a/spot/entrypoints/background.ts b/spot/entrypoints/background.ts index f932f4865..7805ab721 100644 --- a/spot/entrypoints/background.ts +++ b/spot/entrypoints/background.ts @@ -130,7 +130,7 @@ export default defineBackground(() => { openInNewTab: true, consoleLogs: true, networkLogs: true, - ingestPoint: "https://foss.openreplay.com", + ingestPoint: "https://app.openreplay.com", }; let recordingState = { activeTabId: null, @@ -161,7 +161,7 @@ export default defineBackground(() => { str = str.slice(0, -1); } if (str.includes("app.openreplay.com")) { - str = "https://api.openreplay.com"; + str = str.replace("app.openreplay.com", "api.openreplay.com"); } return str; } @@ -747,7 +747,7 @@ export default defineBackground(() => { }; const videoData = finalVideoBase64; - getPlatformData().then(({ platform }) => { + getPlatformData().then(async ({ platform }) => { const cropped = finalSpotObj.crop && finalSpotObj.crop[0] + finalSpotObj.crop[1] > 0; @@ -795,7 +795,14 @@ export default defineBackground(() => { }, ); - const ingestUrl = safeApiUrl(settings.ingestPoint); + const data = await browser.storage.local.get("settings"); + if (!data.settings) { + return void sendToActiveTab({ + type: messages.content.to.notification, + message: "Error saving Spot: can't retrieve spot ingest", + }); + } + const ingestUrl = safeApiUrl(data.settings.ingestPoint); const dataUrl = `${ingestUrl}/spot/v1/spots`; refreshToken() diff --git a/spot/entrypoints/content/SavingControls.tsx b/spot/entrypoints/content/SavingControls.tsx index 267b525a5..062911b15 100644 --- a/spot/entrypoints/content/SavingControls.tsx +++ b/spot/entrypoints/content/SavingControls.tsx @@ -506,7 +506,7 @@ function SavingControls({

Spots are saved to your{" "}