mirror of
https://github.com/chanzuckerberg/cellxgene.git
synced 2026-10-05 17:38:11 +08:00
refactor: 2235 remove cookie banner (#2459)
This commit is contained in:
@@ -100,12 +100,6 @@ export async function getElementCoordinates(testId) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
async function clickTermsOfService() {
|
|
||||||
if (!(await isElementPresent(getTestId("tos-cookies-accept")))) return;
|
|
||||||
|
|
||||||
await clickOn("tos-cookies-accept");
|
|
||||||
}
|
|
||||||
|
|
||||||
async function nameNewAnnotation() {
|
async function nameNewAnnotation() {
|
||||||
if (await isElementPresent(getTestId("annotation-dialog"))) {
|
if (await isElementPresent(getTestId("annotation-dialog"))) {
|
||||||
await typeInto("new-annotation-name", "ignoreE2E");
|
await typeInto("new-annotation-name", "ignoreE2E");
|
||||||
@@ -122,7 +116,6 @@ export async function goToPage(url) {
|
|||||||
});
|
});
|
||||||
|
|
||||||
await nameNewAnnotation();
|
await nameNewAnnotation();
|
||||||
await clickTermsOfService();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function isElementPresent(selector, options) {
|
export async function isElementPresent(selector, options) {
|
||||||
|
|||||||
@@ -11,7 +11,6 @@ import Graph from "./graph/graph";
|
|||||||
import MenuBar from "./menubar";
|
import MenuBar from "./menubar";
|
||||||
import Autosave from "./autosave";
|
import Autosave from "./autosave";
|
||||||
import Embedding from "./embedding";
|
import Embedding from "./embedding";
|
||||||
import TermsOfServicePrompt from "./termsPrompt";
|
|
||||||
|
|
||||||
import actions from "../actions";
|
import actions from "../actions";
|
||||||
|
|
||||||
@@ -75,7 +74,6 @@ class App extends React.Component {
|
|||||||
<MenuBar />
|
<MenuBar />
|
||||||
<Embedding />
|
<Embedding />
|
||||||
<Autosave />
|
<Autosave />
|
||||||
<TermsOfServicePrompt />
|
|
||||||
<Legend viewportRef={viewportRef} />
|
<Legend viewportRef={viewportRef} />
|
||||||
<Graph key={graphRenderCounter} viewportRef={viewportRef} />
|
<Graph key={graphRenderCounter} viewportRef={viewportRef} />
|
||||||
</>
|
</>
|
||||||
|
|||||||
@@ -1,147 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import { connect } from "react-redux";
|
|
||||||
import {
|
|
||||||
Drawer,
|
|
||||||
Button,
|
|
||||||
Classes,
|
|
||||||
Position,
|
|
||||||
Colors,
|
|
||||||
Icon,
|
|
||||||
} from "@blueprintjs/core";
|
|
||||||
import { storageGet, storageSet, KEYS } from "../util/localStorage";
|
|
||||||
|
|
||||||
@connect((state) => ({
|
|
||||||
tosURL: state.config?.parameters?.about_legal_tos,
|
|
||||||
privacyURL: state.config?.parameters?.about_legal_privacy,
|
|
||||||
}))
|
|
||||||
class TermsPrompt extends React.PureComponent {
|
|
||||||
constructor(props) {
|
|
||||||
super(props);
|
|
||||||
const { tosURL, privacyURL } = this.props;
|
|
||||||
const cookieDecision = storageGet(KEYS.COOKIE_DECISION, null);
|
|
||||||
const hasDecided = cookieDecision !== null;
|
|
||||||
this.state = {
|
|
||||||
hasDecided,
|
|
||||||
isEnabled: !!tosURL || !!privacyURL,
|
|
||||||
isOpen: !hasDecided,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
componentDidMount() {
|
|
||||||
const { hasDecided, isEnabled } = this.state;
|
|
||||||
if (isEnabled && !hasDecided) {
|
|
||||||
this.setState({ isOpen: true });
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
handleOK = () => {
|
|
||||||
this.setState({ isOpen: false });
|
|
||||||
storageSet(KEYS.COOKIE_DECISION, "yes");
|
|
||||||
if (window.cookieDecisionCallback instanceof Function) {
|
|
||||||
try {
|
|
||||||
window.cookieDecisionCallback();
|
|
||||||
} catch (e) {
|
|
||||||
// continue
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
handleNo = () => {
|
|
||||||
this.setState({ isOpen: false });
|
|
||||||
storageSet(KEYS.COOKIE_DECISION, "no");
|
|
||||||
};
|
|
||||||
|
|
||||||
renderTos() {
|
|
||||||
const { tosURL } = this.props;
|
|
||||||
if (!tosURL) return null;
|
|
||||||
return (
|
|
||||||
<span>
|
|
||||||
<Icon icon="info-sign" intent="primary" /> By using this site, you are
|
|
||||||
agreeing to our{" "}
|
|
||||||
<a
|
|
||||||
style={{
|
|
||||||
fontWeight: 700,
|
|
||||||
textDecoration: "underline",
|
|
||||||
}}
|
|
||||||
href={tosURL}
|
|
||||||
target="_blank"
|
|
||||||
rel="noopener"
|
|
||||||
>
|
|
||||||
terms of service
|
|
||||||
</a>
|
|
||||||
.{" "}
|
|
||||||
</span>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
renderPrivacy() {
|
|
||||||
const { privacyURL } = this.props;
|
|
||||||
if (!privacyURL) return null;
|
|
||||||
return (
|
|
||||||
<span>
|
|
||||||
To learn more, read our{" "}
|
|
||||||
<a
|
|
||||||
style={{
|
|
||||||
fontWeight: 700,
|
|
||||||
textDecoration: "underline",
|
|
||||||
}}
|
|
||||||
href={privacyURL}
|
|
||||||
target="_blank"
|
|
||||||
rel="noopener"
|
|
||||||
>
|
|
||||||
privacy policy
|
|
||||||
</a>
|
|
||||||
.
|
|
||||||
</span>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const { isOpen, isEnabled } = this.state;
|
|
||||||
if (!isEnabled || !isOpen) return null;
|
|
||||||
return (
|
|
||||||
<Drawer
|
|
||||||
onclose={this.drawerClose}
|
|
||||||
isOpen={isOpen}
|
|
||||||
size="120px"
|
|
||||||
position={Position.BOTTOM}
|
|
||||||
canOutsideClickClose={false}
|
|
||||||
hasBackdrop /* if the user can't use the app or click outside to dismiss, that should be visually represented with a backdrop */
|
|
||||||
enforceFocus={false}
|
|
||||||
autoFocus={false}
|
|
||||||
portal={false}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
className={Classes.DRAWER_BODY}
|
|
||||||
style={{ backgroundColor: Colors.LIGHT_GRAY1 }}
|
|
||||||
>
|
|
||||||
<div className={Classes.DIALOG_BODY}>
|
|
||||||
<div>
|
|
||||||
{this.renderTos()}
|
|
||||||
<span>
|
|
||||||
We use cookies to help us improve the site and to inform our
|
|
||||||
future efforts, and we also use necessary cookies to make our
|
|
||||||
site work.
|
|
||||||
</span>
|
|
||||||
{this.renderPrivacy()}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={Classes.DIALOG_FOOTER} style={{ textAlign: "left" }}>
|
|
||||||
<Button
|
|
||||||
intent="primary"
|
|
||||||
onClick={this.handleOK}
|
|
||||||
data-testid="tos-cookies-accept"
|
|
||||||
>
|
|
||||||
I'm OK with cookies!
|
|
||||||
</Button>{" "}
|
|
||||||
<Button onClick={this.handleNo} data-testid="tos-cookies-reject">
|
|
||||||
No thanks
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</Drawer>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export default TermsPrompt;
|
|
||||||
@@ -1,21 +0,0 @@
|
|||||||
export const KEYS = {
|
|
||||||
COOKIE_DECISION: "cxg.cookieDecision",
|
|
||||||
};
|
|
||||||
|
|
||||||
export function storageGet(key, defaultValue = null) {
|
|
||||||
try {
|
|
||||||
const val = window.localStorage.getItem(key);
|
|
||||||
if (val === null) return defaultValue;
|
|
||||||
return val;
|
|
||||||
} catch (e) {
|
|
||||||
return defaultValue;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export function storageSet(key, value) {
|
|
||||||
try {
|
|
||||||
window.localStorage.setItem(key, value);
|
|
||||||
} catch {
|
|
||||||
// continue
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user