From 6c5c4ea07315a455f849e9c293d9aa7ee29f5160 Mon Sep 17 00:00:00 2001 From: Dmitry Kalinin Date: Thu, 7 May 2020 18:12:44 +0300 Subject: [PATCH 1/7] Added cookie policy drawer --- .../login-page/cookie-policy-drawer.tsx | 49 +++++++++++++++++++ .../src/components/login-page/login-page.tsx | 42 +++++++++------- 2 files changed, 72 insertions(+), 19 deletions(-) create mode 100644 cvat-ui/src/components/login-page/cookie-policy-drawer.tsx diff --git a/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx b/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx new file mode 100644 index 000000000000..9ff12dcedd23 --- /dev/null +++ b/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx @@ -0,0 +1,49 @@ + +// Copyright (C) 2020 Intel Corporation +// +// SPDX-License-Identifier: MIT + +import React, {useState, useEffect} from 'react'; +import Drawer from 'antd/lib/drawer'; +import Paragraph from 'antd/lib/typography/Paragraph'; +import Button from 'antd/lib/button/button'; + + +function CookieDrawer(): JSX.Element { + const [drawerVisiable, setDrawerVisiable] = useState(false); + + useEffect(() => { + const policyWasShown = localStorage.getItem('cookiePolicyShown'); + if (policyWasShown === null) { + setDrawerVisiable(true); + } + }, []) + + const onClose = () => { + localStorage.setItem('cookiePolicyShown', 'true'); + setDrawerVisiable(false); + } + + return ( + + + 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 Cookie Consent Tool. + By continuing to use our website, you agree to our use of cookies. + + + + ); +} + +export default CookieDrawer; diff --git a/cvat-ui/src/components/login-page/login-page.tsx b/cvat-ui/src/components/login-page/login-page.tsx index 950cd4e846cf..87cebb51446e 100644 --- a/cvat-ui/src/components/login-page/login-page.tsx +++ b/cvat-ui/src/components/login-page/login-page.tsx @@ -10,6 +10,7 @@ import Text from 'antd/lib/typography/Text'; import { Row, Col } from 'antd/lib/grid'; import LoginForm, { LoginData } from './login-form'; +import CookieDrawer from './cookie-policy-drawer'; interface LoginPageComponentProps { fetching: boolean; @@ -31,25 +32,28 @@ function LoginPageComponent(props: LoginPageComponentProps & RouteComponentProps } = props; return ( - - - Login - { - onLogin(loginData.username, loginData.password); - }} - /> - - - - New to CVAT? Create - an account - - - - - + <> + + + Login + { + onLogin(loginData.username, loginData.password); + }} + /> + + + + New to CVAT? Create + an account + + + + + + + ); } From 15e4fe609914e5c79144155ce44169f92973bbad Mon Sep 17 00:00:00 2001 From: Dmitry Kalinin Date: Thu, 7 May 2020 18:18:05 +0300 Subject: [PATCH 2/7] added CHANGELOG.md --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 87a6a475b661..4e4cc46656e2 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,7 +6,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ## [1.0.0] - Unreleased ### Added -- +- cvat-ui: added cookie policy drawer for login page () ### Changed - cvat-core: session.annotations.put() now returns identificators of added objects () From ad521fa08849c895623376ed1acaeaea9c981746 Mon Sep 17 00:00:00 2001 From: Dmitry Kalinin Date: Tue, 12 May 2020 10:11:06 +0300 Subject: [PATCH 3/7] added configurable parameter --- .../login-page/cookie-policy-drawer.tsx | 11 ++-- .../register-page/register-page.tsx | 56 ++++++++++--------- cvat-ui/src/cvat-store.ts | 2 +- cvat-ui/src/utils/enviroment.ts | 6 +- 4 files changed, 42 insertions(+), 33 deletions(-) diff --git a/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx b/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx index 9ff12dcedd23..5dc33e6bd6dc 100644 --- a/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx +++ b/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx @@ -8,19 +8,21 @@ import Drawer from 'antd/lib/drawer'; import Paragraph from 'antd/lib/typography/Paragraph'; import Button from 'antd/lib/button/button'; +import {isPublic} from 'utils/enviroment'; + function CookieDrawer(): JSX.Element { const [drawerVisiable, setDrawerVisiable] = useState(false); useEffect(() => { - const policyWasShown = localStorage.getItem('cookiePolicyShown'); - if (policyWasShown === null) { + const cookiePolicyAccepted = localStorage.getItem('cookiePolicyAccepted'); + if (cookiePolicyAccepted === null && isPublic()) { setDrawerVisiable(true); } - }, []) + }, [isPublic]) const onClose = () => { - localStorage.setItem('cookiePolicyShown', 'true'); + localStorage.setItem('cookiePolicyAccepted', 'true'); setDrawerVisiable(false); } @@ -29,7 +31,6 @@ function CookieDrawer(): JSX.Element { title='About Cookies on this site:' placement='bottom' closable={false} - onClose={onClose} visible={drawerVisiable} height={200} destroyOnClose diff --git a/cvat-ui/src/components/register-page/register-page.tsx b/cvat-ui/src/components/register-page/register-page.tsx index 23b3b2050451..2ab78de9bbf3 100644 --- a/cvat-ui/src/components/register-page/register-page.tsx +++ b/cvat-ui/src/components/register-page/register-page.tsx @@ -10,6 +10,7 @@ import Text from 'antd/lib/typography/Text'; import { Row, Col } from 'antd/lib/grid'; import RegisterForm, { RegisterData } from './register-form'; +import CookieDrawer from 'components/login-page/cookie-policy-drawer'; interface RegisterPageComponentProps { fetching: boolean; @@ -35,32 +36,35 @@ function RegisterPageComponent( } = props; return ( - - - Create an account - { - onRegister( - registerData.username, - registerData.firstName, - registerData.lastName, - registerData.email, - registerData.password1, - registerData.password2, - ); - }} - /> - - - - Already have an account? - Login - - - - - + <> + + + Create an account + { + onRegister( + registerData.username, + registerData.firstName, + registerData.lastName, + registerData.email, + registerData.password1, + registerData.password2, + ); + }} + /> + + + + Already have an account? + Login + + + + + + + ); } diff --git a/cvat-ui/src/cvat-store.ts b/cvat-ui/src/cvat-store.ts index ce3cbf660b2c..1c528c4ec928 100644 --- a/cvat-ui/src/cvat-store.ts +++ b/cvat-ui/src/cvat-store.ts @@ -10,7 +10,7 @@ import { Reducer, } from 'redux'; import { createLogger } from 'redux-logger'; -import isDev from 'utils/enviroment'; +import {isDev} from 'utils/enviroment'; const logger = createLogger({ diff --git a/cvat-ui/src/utils/enviroment.ts b/cvat-ui/src/utils/enviroment.ts index 137e9dd1a905..677dbc6f370e 100644 --- a/cvat-ui/src/utils/enviroment.ts +++ b/cvat-ui/src/utils/enviroment.ts @@ -2,6 +2,10 @@ // // SPDX-License-Identifier: MIT -export default function isDev(): boolean { +export function isDev(): boolean { return process.env.NODE_ENV === 'development'; } + +export function isPublic(): boolean { + return process.env.PUBLIC_INSTANCE === 'true'; +} From f9f7a952342c7669e98b9fee4bc40a36fbddfac2 Mon Sep 17 00:00:00 2001 From: Dmitry Kalinin Date: Tue, 12 May 2020 10:13:07 +0300 Subject: [PATCH 4/7] fixed typos --- .../src/components/login-page/cookie-policy-drawer.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx b/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx index 5dc33e6bd6dc..9672f5262c4c 100644 --- a/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx +++ b/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx @@ -12,18 +12,18 @@ import {isPublic} from 'utils/enviroment'; function CookieDrawer(): JSX.Element { - const [drawerVisiable, setDrawerVisiable] = useState(false); + const [drawerVisible, setDrawerVisible] = useState(false); useEffect(() => { const cookiePolicyAccepted = localStorage.getItem('cookiePolicyAccepted'); if (cookiePolicyAccepted === null && isPublic()) { - setDrawerVisiable(true); + setDrawerVisible(true); } }, [isPublic]) const onClose = () => { localStorage.setItem('cookiePolicyAccepted', 'true'); - setDrawerVisiable(false); + setDrawerVisible(false); } return ( @@ -31,7 +31,7 @@ function CookieDrawer(): JSX.Element { title='About Cookies on this site:' placement='bottom' closable={false} - visible={drawerVisiable} + visible={drawerVisible} height={200} destroyOnClose > From 543ccfef4757bc6cb43f48b128bd435234eefeb3 Mon Sep 17 00:00:00 2001 From: Dmitry Kalinin Date: Tue, 12 May 2020 11:22:21 +0300 Subject: [PATCH 5/7] Increased cvat-ui package version --- cvat-ui/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/cvat-ui/package.json b/cvat-ui/package.json index 6608aa56dca1..b15668d2a5ee 100644 --- a/cvat-ui/package.json +++ b/cvat-ui/package.json @@ -1,6 +1,6 @@ { "name": "cvat-ui", - "version": "1.0.0", + "version": "1.1.0", "description": "CVAT single-page application", "main": "src/index.tsx", "scripts": { From 281b928e05364d2ceb661179bb57114790290f51 Mon Sep 17 00:00:00 2001 From: Dmitry Kalinin Date: Tue, 12 May 2020 13:20:36 +0300 Subject: [PATCH 6/7] Added package-lock.json --- cvat-ui/package-lock.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/cvat-ui/package-lock.json b/cvat-ui/package-lock.json index 634b919ea469..926e6355748b 100644 --- a/cvat-ui/package-lock.json +++ b/cvat-ui/package-lock.json @@ -1,6 +1,6 @@ { "name": "cvat-ui", - "version": "1.0.0", + "version": "1.1.0", "lockfileVersion": 1, "requires": true, "dependencies": { From 748b34b262feaba1b862cae6e8b672fcd2b3f374 Mon Sep 17 00:00:00 2001 From: Dmitry Kalinin Date: Wed, 13 May 2020 22:51:39 +0300 Subject: [PATCH 7/7] fixed hook --- cvat-ui/src/components/login-page/cookie-policy-drawer.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx b/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx index 9672f5262c4c..80a05122c574 100644 --- a/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx +++ b/cvat-ui/src/components/login-page/cookie-policy-drawer.tsx @@ -19,7 +19,7 @@ function CookieDrawer(): JSX.Element { if (cookiePolicyAccepted === null && isPublic()) { setDrawerVisible(true); } - }, [isPublic]) + }, []) const onClose = () => { localStorage.setItem('cookiePolicyAccepted', 'true');