import { Box, createStyles, Group, Header as Head, useMantineColorScheme } from '@mantine/core'; import { AddItemShelfButton } from '../AppShelf/AddAppShelfItem'; import DockerMenuButton from '../../modules/docker/DockerModule'; import SearchBar from '../../modules/search/SearchModule'; import { SettingsMenuButton } from '../Settings/SettingsMenu'; import { Logo } from './Logo'; import { useConfig } from '../../tools/state'; const HEADER_HEIGHT = 60; const useStyles = createStyles((theme) => ({ hide: { [theme.fn.smallerThan('xs')]: { display: 'none', }, }, burger: { [theme.fn.largerThan('sm')]: { display: 'none', }, }, })); export function Header(props: any) { const { classes, cx } = useStyles(); const { config } = useConfig(); const { colorScheme } = useMantineColorScheme(); return (