diff --git a/desktop/app/src/sandy-chrome/LeftRail.tsx b/desktop/app/src/sandy-chrome/LeftRail.tsx index 0454ad045..6569a7878 100644 --- a/desktop/app/src/sandy-chrome/LeftRail.tsx +++ b/desktop/app/src/sandy-chrome/LeftRail.tsx @@ -47,7 +47,6 @@ import {logout, USER_NOT_SIGNEDIN, USER_UNAUTHORIZED} from '../reducers/user'; import config from '../fb-stubs/config'; import styled from '@emotion/styled'; import {showEmulatorLauncher} from './appinspect/LaunchEmulator'; -import {useStore as useReduxStore} from 'react-redux'; import SupportRequestFormV2 from '../fb-stubs/SupportRequestFormV2'; import {setStaticView} from '../reducers/connections'; import {getInstance} from '../fb-stubs/Logger'; @@ -252,7 +251,7 @@ function DebugLogsButton({ } function LaunchEmulatorButton() { - const store = useReduxStore(); + const store = useStore(); return ( client.id === selectedApp); - return ( + return entries.length ? ( - {entries.flat()} - + {entries} }> @@ -114,6 +114,8 @@ export function AppSelector() { + ) : ( + ); } @@ -216,5 +218,36 @@ function computeEntries( )), ]); } - return entries; + return entries.flat(); +} + +function NoDevices() { + const store = useStore(); + + const onLaunchEmulator = useTrackedCallback( + 'select-emulator', + () => { + showEmulatorLauncher(store); + }, + [], + ); + + return ( + + No devices found + + Start a fresh emulator {' '} + or check the{' '} + + troubleshooting guide + + . + + + } + /> + ); } diff --git a/desktop/app/src/utils/useStore.tsx b/desktop/app/src/utils/useStore.tsx index 133ceb716..be4f7cdc6 100644 --- a/desktop/app/src/utils/useStore.tsx +++ b/desktop/app/src/utils/useStore.tsx @@ -8,12 +8,13 @@ */ import { + useStore as useReduxStore, useSelector, shallowEqual, useDispatch as useDispatchBase, } from 'react-redux'; import {Dispatch as ReduxDispatch} from 'redux'; -import {State, Actions} from '../reducers/index'; +import {State, Actions, Store} from '../reducers/index'; /** * Strongly typed wrapper or Redux's useSelector. @@ -22,9 +23,14 @@ import {State, Actions} from '../reducers/index'; */ export function useStore( selector: (state: State) => Selected, - equalityFn: (left: Selected, right: Selected) => boolean = shallowEqual, -): Selected { - return useSelector(selector, equalityFn); + equalityFn?: (left: Selected, right: Selected) => boolean, +): Selected; +export function useStore(): Store; +export function useStore(selector?: any, equalityFn?: any) { + // eslint-disable-next-line react-hooks/rules-of-hooks + if (arguments.length === 0) return useReduxStore(); + // eslint-disable-next-line react-hooks/rules-of-hooks + return useSelector(selector, equalityFn ?? shallowEqual); } export type Dispatch = ReduxDispatch;