mirror of
https://github.com/luxfi/explore.git
synced 2026-09-24 00:28:18 +00:00
tom goriunovandGitHub
f6725649da
* first version of the pack * single entry point * add custom components to the package * move form components to toolkit * add more utils and hooks to the package * minor fixes * add CI workflow * update readme and package.json * fix ts * fix build of env-validator * fix docker build * fix icons size * test fixes * more test fixes
46 lines
1.1 KiB
TypeScript
46 lines
1.1 KiB
TypeScript
import { Flex, Box } from '@chakra-ui/react';
|
|
import React from 'react';
|
|
|
|
import { stripLeadingSlash } from 'toolkit/utils/url';
|
|
import useThemeColors from 'ui/shared/monaco/utils/useThemeColors';
|
|
|
|
interface Props {
|
|
path: string;
|
|
}
|
|
|
|
const CodeEditorBreadcrumbs = ({ path }: Props) => {
|
|
const chunks = stripLeadingSlash(path).split('/');
|
|
const themeColors = useThemeColors();
|
|
|
|
return (
|
|
<Flex
|
|
color={ themeColors['breadcrumbs.foreground'] }
|
|
bgColor={ themeColors['editor.background'] }
|
|
pl="16px"
|
|
pr="8px"
|
|
flexWrap="wrap"
|
|
fontSize="13px"
|
|
lineHeight="22px"
|
|
alignItems="center"
|
|
>
|
|
{ chunks.map((chunk, index) => {
|
|
return (
|
|
<React.Fragment key={ index }>
|
|
{ index !== 0 && (
|
|
<Box
|
|
className="codicon codicon-breadcrumb-separator"
|
|
boxSize="16px"
|
|
_before={{
|
|
content: '"\\eab6"',
|
|
}}/>
|
|
) }
|
|
<Box>{ chunk }</Box>
|
|
</React.Fragment>
|
|
);
|
|
}) }
|
|
</Flex>
|
|
);
|
|
};
|
|
|
|
export default React.memo(CodeEditorBreadcrumbs);
|