@kinvolk/headlamp-plugin
Version:
The needed infrastructure for building Headlamp plugins.
38 lines (37 loc) • 1.91 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import { isValidElement } from 'react';
import { getThemeName, useNavBarMode } from '../../lib/themes';
import { useTypedSelector } from '../../redux/hooks';
import LogoDark from '../../resources/icon-dark.svg?react';
import LogoLight from '../../resources/icon-light.svg?react';
import LogoWithTextDark from '../../resources/logo-dark.svg?react';
import LogoWithTextLight from '../../resources/logo-light.svg?react';
import { EmptyContent } from '../common';
import ErrorBoundary from '../common/ErrorBoundary';
export default function OriginalAppLogo(props) {
const { logoType, themeName } = props;
const Component = logoType === 'large'
? themeName === 'dark'
? LogoWithTextLight
: LogoWithTextDark
: themeName === 'dark'
? LogoLight
: LogoDark;
return _jsx(Component, { style: { width: 'auto', height: '32px' } });
}
export function AppLogo(props) {
const { logoType = 'large', themeName = getThemeName() } = props;
const arePluginsLoaded = useTypedSelector(state => state.plugins.loaded);
const PluginAppLogoComponent = useTypedSelector(state => state.theme.logo);
const PluginAppLogoComp = PluginAppLogoComponent;
const mode = useNavBarMode();
// Till all plugins are not loaded show empty content for logo as we might have logo coming from a plugin
if (!arePluginsLoaded) {
return _jsx(EmptyContent, {});
}
return PluginAppLogoComponent ? (_jsx(ErrorBoundary, { children: isValidElement(PluginAppLogoComponent) ? (
// If it's an element, just use it.
PluginAppLogoComponent) : (
// It is a component, so we make it here.
_jsx(PluginAppLogoComp, { logoType: logoType, themeName: themeName, sx: { height: '32px', width: 'auto' } })) })) : (_jsx(OriginalAppLogo, { logoType: logoType, themeName: mode }));
}