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.

Sign up for GitHub

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

Jump to bottom

Added link to admin page #2068

Merged
merged 3 commits into from
Aug 24, 2020
Merged

Added link to admin page #2068

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
425cd7c
Added link to admin page
bsekachev Aug 24, 2020
20356af
Updated version
bsekachev Aug 24, 2020
67e38c6
Updated changelog
bsekachev Aug 24, 2020
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
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- [Datumaro] Dataset statistics (<https://github.com/opencv/cvat/pull/1668>)
- Ability to change label color in tasks and predefined labels (<https://github.com/opencv/cvat/pull/2014>)
- [Datumaro] Multi-dataset merge (https://github.com/opencv/cvat/pull/1695)
- Link to django admin page from UI (<https://github.com/opencv/cvat/pull/2068>)

### Changed
- Shape coordinates are rounded to 2 digits in dumped annotations (<https://github.com/opencv/cvat/pull/1970>)
Expand Down
2 changes: 1 addition & 1 deletion cvat-ui/package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion cvat-ui/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "cvat-ui",
"version": "1.8.0",
"version": "1.8.1",
"description": "CVAT single-page application",
"main": "src/index.tsx",
"scripts": {
Expand Down
4 changes: 2 additions & 2 deletions cvat-ui/src/components/cvat-app.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ import ModelsPageContainer from 'containers/models-page/models-page';
import AnnotationPageContainer from 'containers/annotation-page/annotation-page';
import LoginPageContainer from 'containers/login-page/login-page';
import RegisterPageContainer from 'containers/register-page/register-page';
import HeaderContainer from 'containers/header/header';
import Header from 'components/header/header';
import { customWaViewHit } from 'utils/enviroment';

import getCore from 'cvat-core-wrapper';
Expand Down Expand Up @@ -272,7 +272,7 @@ class CVATApplication extends React.PureComponent<CVATAppProps & RouteComponentP
return (
<GlobalErrorBoundary>
<Layout>
<HeaderContainer> </HeaderContainer>
<Header />
<Layout.Content style={{ height: '100%' }}>
<ShorcutsDialog />
<GlobalHotKeys keyMap={subKeyMap} handlers={handlers}>
Expand Down
204 changes: 156 additions & 48 deletions cvat-ui/src/components/header/header.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,9 @@
// SPDX-License-Identifier: MIT

import './styles.scss';
import React, { MouseEvent } from 'react';
import { RouteComponentProps } from 'react-router';
import { withRouter } from 'react-router-dom';
import React from 'react';
import { connect } from 'react-redux';
import { useHistory } from 'react-router';
import { Row, Col } from 'antd/lib/grid';
import Layout from 'antd/lib/layout';
import Icon from 'antd/lib/icon';
Expand All @@ -15,50 +15,129 @@ import Dropdown from 'antd/lib/dropdown';
import Modal from 'antd/lib/modal';
import Text from 'antd/lib/typography/Text';

import { CVATLogo, AccountIcon } from 'icons';
import getCore from 'cvat-core-wrapper';
import consts from 'consts';

import { CVATLogo, AccountIcon } from 'icons';
import ChangePasswordDialog from 'components/change-password-modal/change-password-modal';
import { switchSettingsDialog as switchSettingsDialogAction } from 'actions/settings-actions';
import { logoutAsync, authActions } from 'actions/auth-actions';
import { SupportedPlugins, CombinedState } from 'reducers/interfaces';
import SettingsModal from './settings-modal/settings-modal';

interface HeaderContainerProps {
onLogout: () => void;
switchSettingsDialog: (show: boolean) => void;
switchChangePasswordDialog: (show: boolean) => void;
logoutFetching: boolean;
changePasswordFetching: boolean;
installedAnalytics: boolean;
serverHost: string;
username: string;
toolName: string;
serverVersion: string;
serverDescription: string;
coreVersion: string;
canvasVersion: string;
uiVersion: string;
const core = getCore();

interface Tool {
name: string;
description: string;
server: {
host: string;
version: string;
};
core: {
version: string;
};
canvas: {
version: string;
};
ui: {
version: string;
};
}

interface StateToProps {
user: any;
tool: Tool;
switchSettingsShortcut: string;
settingsDialogShown: boolean;
changePasswordDialogShown: boolean;
changePasswordFetching: boolean;
logoutFetching: boolean;
installedAnalytics: boolean;
renderChangePasswordItem: boolean;
}

type Props = HeaderContainerProps & RouteComponentProps;
interface DispatchToProps {
onLogout: () => void;
switchSettingsDialog: (show: boolean) => void;
switchChangePasswordDialog: (show: boolean) => void;
}

function mapStateToProps(state: CombinedState): StateToProps {
const {
auth: {
user,
fetching: logoutFetching,
fetching: changePasswordFetching,
showChangePasswordDialog: changePasswordDialogShown,
allowChangePassword: renderChangePasswordItem,
},
plugins: {
list,
},
about: {
server,
packageVersion,
},
shortcuts: {
normalizedKeyMap,
},
settings: {
showDialog: settingsDialogShown,
},
} = state;

return {
user,
tool: {
name: server.name as string,
description: server.description as string,
server: {
host: core.config.backendAPI.slice(0, -7),
version: server.version as string,
},
canvas: {
version: packageVersion.canvas,
},
core: {
version: packageVersion.core,
},
ui: {
version: packageVersion.ui,
},
},
switchSettingsShortcut: normalizedKeyMap.SWITCH_SETTINGS,
settingsDialogShown,
changePasswordDialogShown,
changePasswordFetching,
logoutFetching,
installedAnalytics: list[SupportedPlugins.ANALYTICS],
renderChangePasswordItem,
};
}

function mapDispatchToProps(dispatch: any): DispatchToProps {
return {
onLogout: (): void => dispatch(logoutAsync()),
switchSettingsDialog: (show: boolean): void => dispatch(switchSettingsDialogAction(show)),
switchChangePasswordDialog: (show: boolean): void => (
dispatch(authActions.switchChangePasswordDialog(show))
),
};
}

type Props = StateToProps & DispatchToProps;

function HeaderContainer(props: Props): JSX.Element {
const {
user,
tool,
installedAnalytics,
username,
toolName,
serverHost,
serverVersion,
serverDescription,
coreVersion,
canvasVersion,
uiVersion,
onLogout,
logoutFetching,
changePasswordFetching,
settingsDialogShown,
switchSettingsShortcut,
onLogout,
switchSettingsDialog,
switchChangePasswordDialog,
renderChangePasswordItem,
Expand All @@ -72,44 +151,46 @@ function HeaderContainer(props: Props): JSX.Element {
GITHUB_URL,
} = consts;

function aboutModal(): void {
const history = useHistory();

function showAboutModal(): void {
Modal.info({
title: `${toolName}`,
title: `${tool.name}`,
content: (
<div>
<p>
{`${serverDescription}`}
{`${tool.description}`}
</p>
<p>
<Text strong>
Server version:
</Text>
<Text type='secondary'>
{` ${serverVersion}`}
{` ${tool.server.version}`}
</Text>
</p>
<p>
<Text strong>
Core version:
</Text>
<Text type='secondary'>
{` ${coreVersion}`}
{` ${tool.core.version}`}
</Text>
</p>
<p>
<Text strong>
Canvas version:
</Text>
<Text type='secondary'>
{` ${canvasVersion}`}
{` ${tool.canvas.version}`}
</Text>
</p>
<p>
<Text strong>
UI version:
</Text>
<Text type='secondary'>
{` ${uiVersion}`}
{` ${tool.ui.version}`}
</Text>
</p>
<Row type='flex' justify='space-around'>
Expand All @@ -131,16 +212,27 @@ function HeaderContainer(props: Props): JSX.Element {

const menu = (
<Menu className='cvat-header-menu' mode='vertical'>
{user.isStaff && (
<Menu.Item
onClick={(): void => {
// false positive
// eslint-disable-next-line
window.open(`${tool.server.host}/admin`, '_blank');
}}
>
<Icon type='control' />
Admin page
</Menu.Item>
)}

<Menu.Item
title={`Press ${switchSettingsShortcut} to switch`}
onClick={
(): void => switchSettingsDialog(true)
}
onClick={() => switchSettingsDialog(true)}
>
<Icon type='setting' />
Settings
</Menu.Item>
<Menu.Item onClick={() => aboutModal()}>
<Menu.Item onClick={showAboutModal}>
<Icon type='info-circle' />
About
</Menu.Item>
Expand Down Expand Up @@ -178,7 +270,7 @@ function HeaderContainer(props: Props): JSX.Element {
onClick={
(event: React.MouseEvent): void => {
event.preventDefault();
props.history.push('/tasks?page=1');
history.push('/tasks?page=1');
}
}
>
Expand All @@ -192,7 +284,7 @@ function HeaderContainer(props: Props): JSX.Element {
onClick={
(event: React.MouseEvent): void => {
event.preventDefault();
props.history.push('/models');
history.push('/models');
}
}
>
Expand All @@ -203,13 +295,13 @@ function HeaderContainer(props: Props): JSX.Element {
<Button
className='cvat-header-button'
type='link'
href={`${serverHost}/analytics/app/kibana`}
href={`${tool.server.host}/analytics/app/kibana`}
onClick={
(event: React.MouseEvent): void => {
event.preventDefault();
// false positive
// eslint-disable-next-line
window.open(`${serverHost}/analytics/app/kibana`, '_blank');
window.open(`${tool.server.host}/analytics/app/kibana`, '_blank');
}
}
>
Expand Down Expand Up @@ -237,13 +329,13 @@ function HeaderContainer(props: Props): JSX.Element {
<Button
className='cvat-header-button'
type='link'
href={`${serverHost}/documentation/user_guide.html`}
href={`${tool.server.host}/documentation/user_guide.html`}
onClick={
(event: React.MouseEvent): void => {
event.preventDefault();
// false positive
// eslint-disable-next-line
window.open(`${serverHost}/documentation/user_guide.html`, '_blank')
window.open(`${tool.server.host}/documentation/user_guide.html`, '_blank')
}
}
>
Expand All @@ -254,7 +346,7 @@ function HeaderContainer(props: Props): JSX.Element {
<span>
<Icon className='cvat-header-account-icon' component={AccountIcon} />
<Text strong>
{username.length > 14 ? `${username.slice(0, 10)} ...` : username}
{user.username.length > 14 ? `${user.username.slice(0, 10)} ...` : user.username}
</Text>
<Icon className='cvat-header-menu-icon' type='caret-down' />
</span>
Expand All @@ -275,4 +367,20 @@ function HeaderContainer(props: Props): JSX.Element {
);
}

export default withRouter(HeaderContainer);
function propsAreTheSame(prevProps: Props, nextProps: Props): boolean {
let equal = true;
for (const prop in nextProps) {
if (prop in prevProps && (prevProps as any)[prop] !== (nextProps as any)[prop]) {
if (prop !== 'tool') {
equal = false;
}
}
}

return equal;
}

export default connect(
mapStateToProps,
mapDispatchToProps,
)(React.memo(HeaderContainer, propsAreTheSame));
2 changes: 1 addition & 1 deletion cvat-ui/src/components/login-page/cookie-policy-drawer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ function CookieDrawer(): JSX.Element {
This site uses cookies for functionality, analytics, and advertising purposes
as described in our Cookie and Similar Technologies Notice.
To see what cookies we serve and set your preferences, please visit our
<a href='https://www.intel.com/cookies'>Cookie Consent Tool</a>
<a href='https://www.intel.com/cookies'> Cookie Consent Tool</a>
. By continuing to use our website, you agree to our use of cookies.
</Paragraph>
<Button onClick={onClose} size='large' type='primary'>
Expand Down
Loading