Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

change logic get logs error algo #245

Merged
merged 6 commits into from
Jan 10, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
103 changes: 13 additions & 90 deletions src/Routes/Base/Header/HelpBar.react.js
Original file line number Diff line number Diff line change
@@ -1,104 +1,27 @@
import React, { useCallback } from 'react';

import { useHistory, Route } from 'react-router-dom';
import {
ToolOutlined,
GlobalOutlined,
GithubOutlined,
QuestionCircleOutlined,
} from '@ant-design/icons';
import styled from 'styled-components';
import React from 'react';
import { MenuOutlined } from '@ant-design/icons';
import { Popover } from 'antd';
import { selectors } from 'reducers';
import { useSelector } from 'react-redux';
import { USER_GUIDE } from 'const';
import { useActions, useLeftSidebar, useSiteThemeMode } from 'hooks';
import { FlexBox, Icons } from 'components/common';
import { appInfo } from 'config';
import { ReactComponent as IconSwagger } from 'images/swagger.svg';
import {
iconsThemes,
iconsThemesTitle,
} from '../../../styles/themes/HelperThemes';
import InactiveModeTag from './InactiveMode';
import styled from 'styled-components';
import Settings from './Settings/Settings.react';
import InactiveModeTag from './InactiveMode';
import ExperimentPicker from './ExperimentPicker.react';
import ViewType from './ViewType.react';

const DarkText = styled.div`
cursor: pointer;
font-size: 14px;
color: #cccccc;
`;

const Container = styled(FlexBox.Auto)`
position: relative;
`;

const openUrl = url => () => window.open(url);

const HelpBar = () => {
const { toggleTheme, themeName } = useSiteThemeMode();

const history = useHistory();
const { setCollapsed } = useLeftSidebar();

const { triggerUserGuide } = useActions();
const { hkubeSystemVersion } = useSelector(selectors.connection);

const onGuideClick = useCallback(() => {
triggerUserGuide();
history.push('/jobs');
setCollapsed(true);
}, [history, setCollapsed, triggerUserGuide]);

return (
<Container className={USER_GUIDE.HEADER.SOCIALS}>
<InactiveModeTag />

<ExperimentPicker />

<Icons.Hover
type={<IconSwagger title="Swagger" />}
onClick={openUrl(appInfo.swaggerUrl)}
styleIcon={{ height: '25px' }}
/>

<Popover content={<Settings />} placement="bottomRight" trigger="click">
<Icons.Hover type={<ToolOutlined title="Settings" />} />
</Popover>

<Icons.Hover
type={<GlobalOutlined title="hkube Site" />}
onClick={openUrl(appInfo.websiteUrl)}
/>

<Icons.Hover
type={<GithubOutlined title="Github" />}
onClick={openUrl(appInfo.githubUrl)}
/>
const HelpBar = () => (
<Container className={USER_GUIDE.HEADER.SOCIALS}>
<InactiveModeTag />

<Icons.Hover
type={
<span
title={iconsThemesTitle[themeName.toUpperCase()]}
role="img"
aria-label="menu-unfold"
className="anticon anticon-menu-unfold">
{iconsThemes[themeName.toUpperCase()]}
</span>
}
onClick={toggleTheme}
/>
<Route exact path="/jobs" component={ViewType} />
<Icons.Hover
type={<QuestionCircleOutlined title="Help" />}
onClick={onGuideClick}
/>
<ExperimentPicker />

<DarkText as="span">{hkubeSystemVersion}</DarkText>
</Container>
);
};
<Popover content={<Settings />} placement="bottomRight" trigger="click">
<Icons.Hover type={<MenuOutlined title="Settings" />} />
</Popover>
</Container>
);

export default HelpBar;
3 changes: 2 additions & 1 deletion src/Routes/Base/Header/Settings/SetDefaultTime.js
Original file line number Diff line number Diff line change
Expand Up @@ -55,8 +55,9 @@ const SetDefaultTime = () => {

return (
<FlexBox.Auto>
<Typography.Text strong>Filter Default Time</Typography.Text>
<Typography.Text strong>Default Scoop</Typography.Text>
<Select
style={{ width: '100px' }}
defaultValue={dateTimeDefault.hour || 24}
onChange={onChange}
options={OptionDefaultTime}
Expand Down
148 changes: 134 additions & 14 deletions src/Routes/Base/Header/Settings/Settings.react.js
Original file line number Diff line number Diff line change
@@ -1,20 +1,140 @@
import { FlexBox } from 'components/common';
import React from 'react';
import GraphDirection from './GraphDirection.react';
import LogSource from './LogSource.react';
import LogMode from './LogMode.react';
import React, { useCallback } from 'react';
import { FlexBox, Icons } from 'components/common';
import { useHistory } from 'react-router-dom';
import {
GlobalOutlined,
GithubOutlined,
QuestionCircleOutlined,
} from '@ant-design/icons';
import styled from 'styled-components';
import { useSelector } from 'react-redux';
import { useActions, useLeftSidebar, useSiteThemeMode } from 'hooks';
import { appInfo } from 'config';
import { ReactComponent as IconSwagger } from 'images/swagger.svg';
import { selectors } from 'reducers';
import { Divider, Typography } from 'antd';
import { ReactComponent as ApiIcon } from 'images/apiIcon.svg';
import SetDefaultTime from './SetDefaultTime';
// import LogMode from './LogMode.react';
// import LogSource from './LogSource.react';
// import GraphDirection from './GraphDirection.react';
import {
iconsThemes,
iconsThemesTitle,
} from '../../../../styles/themes/HelperThemes';

// import TypesSelect from './TypesSelect.react';

const Settings = () => (
<FlexBox.Auto direction="column" gutter={[10, 10]}>
<GraphDirection />
<LogSource />
<LogMode />
<SetDefaultTime />
{/* <TypesSelect /> */}
</FlexBox.Auto>
);
const { Text } = Typography;
const Settings = () => {
const { toggleTheme, themeName } = useSiteThemeMode();

const history = useHistory();
const { setCollapsed } = useLeftSidebar();

const { triggerUserGuide } = useActions();
const { hkubeSystemVersion } = useSelector(selectors.connection);

const onGuideClick = useCallback(() => {
triggerUserGuide();
history.push('/jobs');
setCollapsed(true);
}, [history, setCollapsed, triggerUserGuide]);

const openUrl = url => () => window.open(url);

const DarkText = styled.div`
cursor: pointer;
font-size: 14px;
color: #cccccc;
`;

const TextLink = styled(Text)`
cursor: pointer;
`;

const DividerStyle = styled(Divider)`
width: 203px;
margin: 0px;
`;

return (
<FlexBox.Auto align="left" direction="column" gutter={[10, 10]}>
<FlexBox.Auto>
<Icons.Hover
type={<IconSwagger title="Swagger" />}
onClick={openUrl(appInfo.swaggerUrl)}
styleIcon={{ height: '25px' }}
/>
<TextLink onClick={openUrl(appInfo.swaggerUrl)}>Swagger</TextLink>
</FlexBox.Auto>

<FlexBox.Auto>
<Icons.Hover
type={<ApiIcon title="Spec" />}
onClick={openUrl(appInfo.specUrl)}
styleIcon={{ height: '25px' }}
/>
<TextLink onClick={openUrl(appInfo.specUrl)}>Spec</TextLink>
</FlexBox.Auto>

<FlexBox.Auto>
<Icons.Hover
type={<GithubOutlined title="Github" />}
onClick={openUrl(appInfo.githubUrl)}
/>
<TextLink onClick={openUrl(appInfo.githubUrl)}>Github</TextLink>
</FlexBox.Auto>

<FlexBox.Auto>
<Icons.Hover
type={<GlobalOutlined title="hkube Site" />}
onClick={openUrl(appInfo.websiteUrl)}
/>
<TextLink onClick={openUrl(appInfo.websiteUrl)}>Hkube Site</TextLink>
</FlexBox.Auto>

<FlexBox.Auto>
<DividerStyle />
</FlexBox.Auto>

<FlexBox.Auto>
<Icons.Hover
type={
<span
title={iconsThemesTitle[themeName.toUpperCase()]}
role="img"
aria-label="menu-unfold"
className="anticon anticon-menu-unfold">
{iconsThemes[themeName.toUpperCase()]}
</span>
}
onClick={toggleTheme}
/>
<TextLink onClick={toggleTheme}>Mode Theme</TextLink>
</FlexBox.Auto>
<SetDefaultTime />

<FlexBox.Auto>
<DividerStyle />
</FlexBox.Auto>

<FlexBox.Auto>
<Icons.Hover
type={<QuestionCircleOutlined title="Help" />}
onClick={onGuideClick}
/>
<TextLink onClick={onGuideClick}>Help</TextLink>
</FlexBox.Auto>

<DarkText as="span">{hkubeSystemVersion}</DarkText>

{/* <GraphDirection />
<LogSource />
<LogMode /> */}

{/* <TypesSelect /> */}
</FlexBox.Auto>
);
};
export default Settings;
3 changes: 3 additions & 0 deletions src/Routes/Base/Header/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,8 @@ import { useLeftSidebar, useCacheFilters } from 'hooks';
import HelpBar from './HelpBar.react';
import TagsFiltersViews from './TagsFiltersViews';

import ViewType from './ViewType.react';

// DO NOT REMOVE! This is important to preload the monaco instance into the global window!!!
// eslint-disable-next-line
import * as monaco from 'monaco-editor';
Expand Down Expand Up @@ -92,6 +94,7 @@ const Header = () => {
onClick={toggle}
/>

<Route exact path="/jobs" component={ViewType} />
<Route exact path="/jobs" component={FilterButton} />
<Route exact path="/pipelines" component={FilterButton} />
<Route exact path="/algorithms" component={FilterButton} />
Expand Down
Loading