mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Kiosk: Reuse kiosk module (#44625)
* Reuse kiosk module, centralize kiosk query handling * update kiosk tests to set correct kiosk value * fix DashboardPage kiosk test * remove unused UrlQueryValue, revert import change
This commit is contained in:
parent
96ae44ee2c
commit
3eac34f5f3
@ -39,10 +39,18 @@ describe('Render', () => {
|
||||
expect(sidemenu).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('should not render when in kiosk mode', async () => {
|
||||
it('should not render when in kiosk mode is tv', async () => {
|
||||
setup();
|
||||
|
||||
locationService.partial({ kiosk: 'full' });
|
||||
locationService.partial({ kiosk: 'tv' });
|
||||
const sidemenu = screen.queryByTestId('sidemenu');
|
||||
expect(sidemenu).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('should not render when in kiosk mode is full', async () => {
|
||||
setup();
|
||||
|
||||
locationService.partial({ kiosk: '1' });
|
||||
const sidemenu = screen.queryByTestId('sidemenu');
|
||||
expect(sidemenu).not.toBeInTheDocument();
|
||||
});
|
||||
|
@ -8,7 +8,8 @@ import { Icon, IconName, useTheme2 } from '@grafana/ui';
|
||||
import { locationService } from '@grafana/runtime';
|
||||
import { Branding } from 'app/core/components/Branding/Branding';
|
||||
import config from 'app/core/config';
|
||||
import { StoreState, KioskMode } from 'app/types';
|
||||
import { getKioskMode } from 'app/core/navigation/kiosk';
|
||||
import { KioskMode, StoreState } from 'app/types';
|
||||
import { enrichConfigItems, getActiveItem, isMatchOrChildMatch, isSearchActive, SEARCH_ITEM_ID } from './utils';
|
||||
import { OrgSwitcher } from '../OrgSwitcher';
|
||||
import NavBarItem from './NavBarItem';
|
||||
@ -43,8 +44,7 @@ export const NavBarUnconnected = React.memo(({ navBarTree }: Props) => {
|
||||
const theme = useTheme2();
|
||||
const styles = getStyles(theme);
|
||||
const location = useLocation();
|
||||
const query = new URLSearchParams(location.search);
|
||||
const kiosk = query.get('kiosk') as KioskMode;
|
||||
const kiosk = getKioskMode();
|
||||
const [showSwitcherModal, setShowSwitcherModal] = useState(false);
|
||||
const toggleSwitcherModal = () => {
|
||||
setShowSwitcherModal(!showSwitcherModal);
|
||||
@ -60,7 +60,7 @@ export const NavBarUnconnected = React.memo(({ navBarTree }: Props) => {
|
||||
|
||||
const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
|
||||
|
||||
if (kiosk !== null) {
|
||||
if (kiosk !== KioskMode.Off) {
|
||||
return null;
|
||||
}
|
||||
|
||||
|
@ -39,10 +39,18 @@ describe('Render', () => {
|
||||
expect(sidemenu).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('should not render when in kiosk mode', async () => {
|
||||
it('should not render when in kiosk mode is tv', async () => {
|
||||
setup();
|
||||
|
||||
locationService.partial({ kiosk: 'full' });
|
||||
locationService.partial({ kiosk: 'tv' });
|
||||
const sidemenu = screen.queryByTestId('sidemenu');
|
||||
expect(sidemenu).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('should not render when in kiosk mode is full', async () => {
|
||||
setup();
|
||||
|
||||
locationService.partial({ kiosk: '1' });
|
||||
const sidemenu = screen.queryByTestId('sidemenu');
|
||||
expect(sidemenu).not.toBeInTheDocument();
|
||||
});
|
||||
|
@ -5,6 +5,7 @@ import { cloneDeep } from 'lodash';
|
||||
import { GrafanaTheme2, NavModelItem, NavSection } from '@grafana/data';
|
||||
import { Icon, IconName, useTheme2 } from '@grafana/ui';
|
||||
import { locationService } from '@grafana/runtime';
|
||||
import { getKioskMode } from 'app/core/navigation/kiosk';
|
||||
import { KioskMode, StoreState } from 'app/types';
|
||||
import { enrichConfigItems, getActiveItem, isMatchOrChildMatch, isSearchActive, SEARCH_ITEM_ID } from './utils';
|
||||
import { OrgSwitcher } from '../OrgSwitcher';
|
||||
@ -40,8 +41,7 @@ export const NavBarNextUnconnected = React.memo(({ navBarTree }: Props) => {
|
||||
const theme = useTheme2();
|
||||
const styles = getStyles(theme);
|
||||
const location = useLocation();
|
||||
const query = new URLSearchParams(location.search);
|
||||
const kiosk = query.get('kiosk') as KioskMode;
|
||||
const kiosk = getKioskMode();
|
||||
const [showSwitcherModal, setShowSwitcherModal] = useState(false);
|
||||
const toggleSwitcherModal = () => {
|
||||
setShowSwitcherModal(!showSwitcherModal);
|
||||
@ -57,7 +57,7 @@ export const NavBarNextUnconnected = React.memo(({ navBarTree }: Props) => {
|
||||
const activeItem = isSearchActive(location) ? searchItem : getActiveItem(navTree, location.pathname);
|
||||
const [menuOpen, setMenuOpen] = useState(false);
|
||||
|
||||
if (kiosk !== null) {
|
||||
if (kiosk !== KioskMode.Off) {
|
||||
return null;
|
||||
}
|
||||
|
||||
|
@ -1,4 +1,4 @@
|
||||
import { AppEvents, UrlQueryValue } from '@grafana/data';
|
||||
import { AppEvents } from '@grafana/data';
|
||||
import { locationService } from '@grafana/runtime';
|
||||
import appEvents from '../app_events';
|
||||
import { KioskMode } from '../../types';
|
||||
@ -22,8 +22,10 @@ export function toggleKioskMode() {
|
||||
locationService.partial({ kiosk });
|
||||
}
|
||||
|
||||
export function getKioskMode(queryParam?: UrlQueryValue): KioskMode {
|
||||
switch (queryParam) {
|
||||
export function getKioskMode(): KioskMode {
|
||||
const kiosk = locationService.getSearchObject().kiosk;
|
||||
|
||||
switch (kiosk) {
|
||||
case 'tv':
|
||||
return KioskMode.TV;
|
||||
// legacy support
|
||||
|
@ -288,8 +288,9 @@ describe('DashboardPage', () => {
|
||||
|
||||
dashboardPageScenario('When in full kiosk mode', (ctx) => {
|
||||
ctx.setup(() => {
|
||||
locationService.partial({ kiosk: true });
|
||||
ctx.mount({
|
||||
queryParams: { kiosk: true },
|
||||
queryParams: {},
|
||||
dashboard: getTestDashboard(),
|
||||
});
|
||||
ctx.rerender({ dashboard: ctx.dashboard });
|
||||
|
@ -24,7 +24,7 @@ import { dashboardWatcher } from 'app/features/live/dashboard/dashboardWatcher';
|
||||
import { GrafanaRouteComponentProps } from 'app/core/navigation/types';
|
||||
import { getTimeSrv } from '../services/TimeSrv';
|
||||
import { getKioskMode } from 'app/core/navigation/kiosk';
|
||||
import { GrafanaTheme2, TimeRange, UrlQueryValue } from '@grafana/data';
|
||||
import { GrafanaTheme2, TimeRange } from '@grafana/data';
|
||||
import { DashboardLoading } from '../components/DashboardLoading/DashboardLoading';
|
||||
import { DashboardFailed } from '../components/DashboardLoading/DashboardFailed';
|
||||
import { DashboardPrompt } from '../components/DashboardPrompt/DashboardPrompt';
|
||||
@ -45,7 +45,6 @@ type DashboardPageRouteSearchParams = {
|
||||
viewPanel?: string;
|
||||
editview?: string;
|
||||
inspect?: string;
|
||||
kiosk?: UrlQueryValue;
|
||||
from?: string;
|
||||
to?: string;
|
||||
refresh?: string;
|
||||
@ -314,7 +313,7 @@ export class UnthemedDashboardPage extends PureComponent<Props, State> {
|
||||
render() {
|
||||
const { dashboard, isInitSlow, initError, queryParams, theme } = this.props;
|
||||
const { editPanel, viewPanel, updateScrollTop } = this.state;
|
||||
const kioskMode = getKioskMode(queryParams.kiosk);
|
||||
const kioskMode = getKioskMode();
|
||||
const styles = getStyles(theme, kioskMode);
|
||||
|
||||
if (!dashboard) {
|
||||
@ -380,7 +379,7 @@ export class UnthemedDashboardPage extends PureComponent<Props, State> {
|
||||
/*
|
||||
* Styles
|
||||
*/
|
||||
export const getStyles = stylesFactory((theme: GrafanaTheme2, kioskMode) => {
|
||||
export const getStyles = stylesFactory((theme: GrafanaTheme2, kioskMode: KioskMode) => {
|
||||
const contentPadding = kioskMode !== KioskMode.Full ? theme.spacing(0, 2, 2) : theme.spacing(2);
|
||||
return {
|
||||
dashboardContainer: css`
|
||||
|
Loading…
Reference in New Issue
Block a user