From f01477ea70e6c343461cce6c1bcee3d738c076de Mon Sep 17 00:00:00 2001 From: Vojtech Simetka Date: Mon, 25 Jul 2022 10:28:17 +0200 Subject: [PATCH] feat: check whether the app runs within bee-desktop is now an environment variable (#490) * feat: check whether the app runs within bee-desktop is now an environment variable * chore: remove console.log --- src/components/SideBar.tsx | 3 +-- src/config.ts | 2 ++ src/hooks/apiHooks.test.ts | 36 +++++++--------------------- src/hooks/apiHooks.tsx | 39 +++++++++++++++++-------------- src/layout/Dashboard.tsx | 4 ++-- src/pages/info/index.tsx | 4 +++- src/pages/top-up/GiftCardFund.tsx | 4 ++-- src/pages/top-up/Swap.tsx | 4 ++-- src/pages/top-up/index.tsx | 4 ++-- 9 files changed, 45 insertions(+), 55 deletions(-) diff --git a/src/components/SideBar.tsx b/src/components/SideBar.tsx index 43eb296..411c398 100644 --- a/src/components/SideBar.tsx +++ b/src/components/SideBar.tsx @@ -12,7 +12,6 @@ import { Context as BeeContext } from '../providers/Bee' import DashboardLogo from '../assets/dashboard-logo.svg' import DesktopLogo from '../assets/desktop-logo.svg' import { config } from '../config' -import { useIsBeeDesktop } from '../hooks/apiHooks' import { ROUTES } from '../routes' import Feedback from './Feedback' import SideBarItem from './SideBarItem' @@ -67,7 +66,7 @@ const useStyles = makeStyles((theme: Theme) => export default function SideBar(): ReactElement { const classes = useStyles() - const { isBeeDesktop } = useIsBeeDesktop() + const isBeeDesktop = config.BEE_DESKTOP_ENABLED const { nodeInfo } = useContext(BeeContext) const navBarItems = [ diff --git a/src/config.ts b/src/config.ts index a9c5601..9c7603d 100644 --- a/src/config.ts +++ b/src/config.ts @@ -5,6 +5,7 @@ class Config { public readonly BEE_DOCS_HOST: string public readonly BEE_DISCORD_HOST: string public readonly GITHUB_REPO_URL: string + public readonly BEE_DESKTOP_ENABLED: boolean public readonly BEE_DESKTOP_URL: string public readonly SENTRY_KEY: string | undefined public readonly SENTRY_ENVIRONMENT: string | undefined @@ -21,6 +22,7 @@ class Config { this.BEE_DOCS_HOST = process.env.REACT_APP_BEE_DOCS_HOST ?? 'https://docs.ethswarm.org/docs/' this.BEE_DISCORD_HOST = process.env.REACT_APP_BEE_DISCORD_HOST ?? 'https://discord.gg/eKr9XPv7' this.GITHUB_REPO_URL = process.env.REACT_APP_BEE_GITHUB_REPO_URL ?? 'https://api.github.com/repos/ethersphere/bee' + this.BEE_DESKTOP_ENABLED = process.env.REACT_APP_BEE_DESKTOP_ENABLED === 'true' this.BEE_DESKTOP_URL = process.env.REACT_APP_BEE_DESKTOP_URL ?? window.location.origin this.DEFAULT_RPC_URL = process.env.REACT_APP_DEFAULT_RPC_URL ?? 'https://xdai.fairdatasociety.org' } diff --git a/src/hooks/apiHooks.test.ts b/src/hooks/apiHooks.test.ts index 4995804..a5ec0a9 100644 --- a/src/hooks/apiHooks.test.ts +++ b/src/hooks/apiHooks.test.ts @@ -10,7 +10,7 @@ interface AddressInfo { port: number } -export function mockServer(data: Record): Promise { +export function mockServer(data: Record): Promise { const app = express() app.use(cors()) @@ -26,48 +26,30 @@ export function mockServer(data: Record): Prom } let serverCorrect: Server -let serverWrong: Server let serverCorrectURL: string -let serverWrongURL: string beforeAll(async () => { - serverCorrect = await mockServer({ name: 'bee-desktop' }) + serverCorrect = await mockServer({ autoUpdateEnabled: true, version: '0.1.0' }) const portServerCorrect = (serverCorrect.address() as AddressInfo).port serverCorrectURL = `http://localhost:${portServerCorrect}` - - serverWrong = await mockServer({ foo: 'bar' }) - const portServerWrong = (serverWrong.address() as AddressInfo).port - serverWrongURL = `http://localhost:${portServerWrong}` }) afterAll(async () => { await new Promise(resolve => serverCorrect.close(resolve)) - await new Promise(resolve => serverWrong.close(resolve)) }) describe('useIsBeeDesktop', () => { - it('should fail when connected to wrong server', async () => { - const { result, waitFor } = renderHook(() => useIsBeeDesktop({ BEE_DESKTOP_URL: serverWrongURL })) - - expect(result.current.isLoading).toBe(true) - expect(result.current.isBeeDesktop).toBe(false) + it('should not have error when connected to bee-desktop', async () => { + const { result, waitFor } = renderHook(() => + useIsBeeDesktop({ BEE_DESKTOP_URL: serverCorrectURL, BEE_DESKTOP_ENABLED: true }), + ) await waitFor(() => { expect(result.current.isLoading).toBe(false) }) - expect(result.current.isBeeDesktop).toBe(false) - }) - - it('should return isBeeDesktop true when connected to bee-desktop', async () => { - const { result, waitFor } = renderHook(() => useIsBeeDesktop({ BEE_DESKTOP_URL: serverCorrectURL })) - - expect(result.current.isLoading).toBe(true) - expect(result.current.isBeeDesktop).toBe(false) - - await waitFor(() => { - expect(result.current.isLoading).toBe(false) - }) - expect(result.current.isBeeDesktop).toBe(true) + expect(result.current.desktopAutoUpdateEnabled).toBe(true) + expect(result.current.beeDesktopVersion).toBe('0.1.0') + expect(result.current.error).toBe(null) }) }) diff --git a/src/hooks/apiHooks.tsx b/src/hooks/apiHooks.tsx index 5936f6d..99bc13b 100644 --- a/src/hooks/apiHooks.tsx +++ b/src/hooks/apiHooks.tsx @@ -11,7 +11,7 @@ export interface LatestBeeReleaseHook { } export interface IsBeeDesktopHook { - isBeeDesktop: boolean + error: Error | null isLoading: boolean beeDesktopVersion: string desktopAutoUpdateEnabled: boolean @@ -23,6 +23,7 @@ export interface NewDesktopVersionHook { interface Config { BEE_DESKTOP_URL: string + BEE_DESKTOP_ENABLED: boolean } /** @@ -31,30 +32,34 @@ interface Config { * @returns isBeeDesktop true if this is run within bee-desktop */ export const useIsBeeDesktop = (conf: Config = config): IsBeeDesktopHook => { - const [isBeeDesktop, setIsBeeDesktop] = useState(false) const [desktopAutoUpdateEnabled, setDesktopAutoUpdateEnabled] = useState(true) const [beeDesktopVersion, setBeeDesktopVersion] = useState('') const [isLoading, setLoading] = useState(true) + const [error, setError] = useState(null) + const isBeeDesktop = conf.BEE_DESKTOP_ENABLED useEffect(() => { - axios - .get(`${conf.BEE_DESKTOP_URL}/info`) - .then(res => { - if (res.data?.name === 'bee-desktop') { - setIsBeeDesktop(true) + if (!isBeeDesktop) { + setLoading(false) + setError(null) + } else { + axios + .get(`${conf.BEE_DESKTOP_URL}/info`) + .then(res => { setBeeDesktopVersion(res.data?.version) setDesktopAutoUpdateEnabled(res.data?.autoUpdateEnabled) - } else setIsBeeDesktop(false) - }) - .catch(() => { - setIsBeeDesktop(false) - }) - .finally(() => { - setLoading(false) - }) - }, [conf]) + setError(null) + }) + .catch(e => { + setError(e) + }) + .finally(() => { + setLoading(false) + }) + } + }, [conf, isBeeDesktop]) - return { isBeeDesktop, isLoading, beeDesktopVersion, desktopAutoUpdateEnabled } + return { error, isLoading, beeDesktopVersion, desktopAutoUpdateEnabled } } async function checkNewVersion(conf: Config): Promise { diff --git a/src/layout/Dashboard.tsx b/src/layout/Dashboard.tsx index 7947f48..ac17c87 100644 --- a/src/layout/Dashboard.tsx +++ b/src/layout/Dashboard.tsx @@ -9,7 +9,7 @@ import { Context } from '../providers/Bee' import config from '../config' import * as Sentry from '@sentry/react' import ItsBroken from './ItsBroken' -import { useIsBeeDesktop, useNewBeeDesktopVersion } from '../hooks/apiHooks' +import { useNewBeeDesktopVersion } from '../hooks/apiHooks' import { BEE_DESKTOP_LATEST_RELEASE_PAGE } from '../utils/desktop' const useStyles = makeStyles((theme: Theme) => @@ -29,7 +29,7 @@ const Dashboard = (props: Props): ReactElement => { const classes = useStyles() const { isLoading } = useContext(Context) - const { isBeeDesktop } = useIsBeeDesktop() + const isBeeDesktop = config.BEE_DESKTOP_ENABLED const { newBeeDesktopVersion } = useNewBeeDesktopVersion(isBeeDesktop) const { enqueueSnackbar, closeSnackbar } = useSnackbar() diff --git a/src/pages/info/index.tsx b/src/pages/info/index.tsx index 37b605b..21906f1 100644 --- a/src/pages/info/index.tsx +++ b/src/pages/info/index.tsx @@ -12,6 +12,7 @@ import { useNavigate } from 'react-router' import { ROUTES } from '../../routes' import { useIsBeeDesktop, useNewBeeDesktopVersion } from '../../hooks/apiHooks' import { BEE_DESKTOP_LATEST_RELEASE_PAGE } from '../../utils/desktop' +import config from '../../config' import NodeInfoCard from './NodeInfoCard' export default function Status(): ReactElement { @@ -25,7 +26,8 @@ export default function Status(): ReactElement { balance, chequebookBalance, } = useContext(BeeContext) - const { isBeeDesktop, beeDesktopVersion } = useIsBeeDesktop() + const isBeeDesktop = config.BEE_DESKTOP_ENABLED + const { beeDesktopVersion } = useIsBeeDesktop() const { newBeeDesktopVersion } = useNewBeeDesktopVersion(isBeeDesktop) const navigate = useNavigate() diff --git a/src/pages/top-up/GiftCardFund.tsx b/src/pages/top-up/GiftCardFund.tsx index c14d7e4..e239746 100644 --- a/src/pages/top-up/GiftCardFund.tsx +++ b/src/pages/top-up/GiftCardFund.tsx @@ -17,11 +17,11 @@ import { ROUTES } from '../../routes' import { sleepMs } from '../../utils' import { restartBeeNode, upgradeToLightNode } from '../../utils/desktop' import { ResolvedWallet } from '../../utils/wallet' -import { useIsBeeDesktop } from '../../hooks/apiHooks' +import config from '../../config' import { BeeModes } from '@ethersphere/bee-js' export function GiftCardFund(): ReactElement { - const { isBeeDesktop } = useIsBeeDesktop() + const isBeeDesktop = config.BEE_DESKTOP_ENABLED const { nodeAddresses, balance, nodeInfo } = useContext(BeeContext) const { provider, providerUrl } = useContext(TopUpContext) diff --git a/src/pages/top-up/Swap.tsx b/src/pages/top-up/Swap.tsx index 62a9d92..778f228 100644 --- a/src/pages/top-up/Swap.tsx +++ b/src/pages/top-up/Swap.tsx @@ -14,7 +14,6 @@ import { Loading } from '../../components/Loading' import { SwarmButton } from '../../components/SwarmButton' import { SwarmDivider } from '../../components/SwarmDivider' import { SwarmTextInput } from '../../components/SwarmTextInput' -import { useIsBeeDesktop } from '../../hooks/apiHooks' import { BzzToken } from '../../models/BzzToken' import { DaiToken } from '../../models/DaiToken' import { Context as BeeContext } from '../../providers/Bee' @@ -23,6 +22,7 @@ import { ROUTES } from '../../routes' import { sleepMs } from '../../utils' import { getBzzPriceAsDai, performSwap, restartBeeNode, upgradeToLightNode } from '../../utils/desktop' import { TopUpProgressIndicator } from './TopUpProgressIndicator' +import config from '../../config' const MINIMUM_XDAI = '0.1' const MINIMUM_XBZZ = '0.1' @@ -39,7 +39,7 @@ export function Swap({ header }: Props): ReactElement { const { providerUrl } = useContext(TopUpContext) const { balance, nodeAddresses, nodeInfo } = useContext(BeeContext) - const { isBeeDesktop } = useIsBeeDesktop() + const isBeeDesktop = config.BEE_DESKTOP_ENABLED const navigate = useNavigate() const { enqueueSnackbar } = useSnackbar() diff --git a/src/pages/top-up/index.tsx b/src/pages/top-up/index.tsx index a90bcdf..18da23d 100644 --- a/src/pages/top-up/index.tsx +++ b/src/pages/top-up/index.tsx @@ -12,7 +12,7 @@ import { SwarmButton } from '../../components/SwarmButton' import { ROUTES } from '../../routes' import { Context as BeeContext } from '../../providers/Bee' import { Context as TopUpContext } from '../../providers/TopUp' -import { useIsBeeDesktop } from '../../hooks/apiHooks' +import config from '../../config' import { BeeModes } from '@ethersphere/bee-js' import { restartBeeNode, upgradeToLightNode } from '../../utils/desktop' import { Loading } from '../../components/Loading' @@ -38,7 +38,7 @@ const MINIMUM_XBZZ = '0.1' export default function TopUp(): ReactElement { const navigate = useNavigate() const styles = useStyles() - const { isBeeDesktop } = useIsBeeDesktop() + const isBeeDesktop = config.BEE_DESKTOP_ENABLED const { balance, nodeInfo } = useContext(BeeContext) const { providerUrl } = useContext(TopUpContext) const [loading, setLoading] = useState(false)