Add configurable about this dataset links (#907)

* add about arg

* add simple url validator

* attach about link to config api

* add links to configDefaults

* add conditional link in top left and menu item

* whitespace

* change to lower case

* move --about arg before click.command()

if this fixes it I have no idea why

* change link>URL

* be more descriptive about URL

* Make error more explicit

* refactor attach_data to accept about

* format

* change icon

* add trailing parenthesis

* whitespace
This commit is contained in:
Severiano Badajoz
2019-09-25 19:23:49 -07:00
committed by GitHub
parent e64f4f06fb
commit 44cb276cdf
7 changed files with 62 additions and 17 deletions
@@ -7,15 +7,26 @@ import Logo from "../framework/logo";
@connect(state => ({
responsive: state.responsive,
datasetTitle: state.config?.displayNames?.dataset ?? "",
aboutURL: state.config?.links?.["about-dataset"],
scatterplotXXaccessor: state.controls.scatterplotXXaccessor,
scatterplotYYaccessor: state.controls.scatterplotYYaccessor
}))
class LeftSideBar extends React.Component {
render() {
const { datasetTitle } = this.props;
const { datasetTitle, aboutURL } = this.props;
const paddingToAvoidScrollBar = 15;
const displayTitle =
datasetTitle.length > globals.datasetTitleMaxCharacterCount
? `${datasetTitle.substring(
0,
Math.floor(globals.datasetTitleMaxCharacterCount / 2)
)}…${datasetTitle.slice(
-Math.floor(globals.datasetTitleMaxCharacterCount / 2)
)}`
: datasetTitle;
return (
<div
style={{
@@ -69,14 +80,7 @@ class LeftSideBar extends React.Component {
}}
title={datasetTitle}
>
{datasetTitle.length > globals.datasetTitleMaxCharacterCount
? `${datasetTitle.substring(
0,
Math.floor(globals.datasetTitleMaxCharacterCount / 2)
)}…${datasetTitle.slice(
-Math.floor(globals.datasetTitleMaxCharacterCount / 2)
)}`
: datasetTitle}
{aboutURL ? <a href={aboutURL}>{displayTitle}</a> : displayTitle}
</div>
</div>
);
+8 -3
View File
@@ -38,7 +38,8 @@ import { tooltipHoverOpenDelay } from "../../globals";
celllist2: state.differential.celllist2,
libraryVersions: state.config?.library_versions, // eslint-disable-line camelcase
undoDisabled: state["@@undoable/past"].length === 0,
redoDisabled: state["@@undoable/future"].length === 0
redoDisabled: state["@@undoable/future"].length === 0,
aboutLink: state.config?.links?.["about-dataset"]
}))
class MenuBar extends React.Component {
static isValidDigitKeyEvent(e) {
@@ -267,7 +268,8 @@ class MenuBar extends React.Component {
clipPercentileMin,
clipPercentileMax,
layoutChoice,
graphInteractionMode
graphInteractionMode,
aboutLink
} = this.props;
const { pendingClipPercentiles } = this.state;
@@ -473,7 +475,10 @@ class MenuBar extends React.Component {
undoDisabled={undoDisabled}
redoDisabled={redoDisabled}
/>
<InformationMenu libraryVersions={libraryVersions} />
<InformationMenu
libraryVersions={libraryVersions}
aboutLink={aboutLink}
/>
</div>
);
}
+12 -1
View File
@@ -3,12 +3,23 @@ import React from "react";
import { Button, Popover, Menu, MenuItem, Position } from "@blueprintjs/core";
function InformationMenu(props) {
const { libraryVersions } = props;
const { libraryVersions, aboutLink } = props;
return (
<div style={{ marginLeft: 10 }} className="bp3-button-group">
<Popover
content={
<Menu>
{aboutLink ? (
<MenuItem
href={aboutLink}
target="_blank"
icon="document-open"
text="About this dataset"
/>
) : (
""
)}
<MenuItem
href="https://chanzuckerberg.github.io/cellxgene/faq.html"
target="_blank"