fork/cellxgene
1
0
Fork 0
mirror of https://github.com/chanzuckerberg/cellxgene.git synced 2026-10-06 22:58:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

move component declarations out of app to leftsidebar

Browse Source
This commit is contained in:
Colin Megill
2018-02-28 09:49:26 -08:00
parent 6ad78a7ffd
commit 56f6aca981
1 changed files with 12 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/app.js
+12 -29
View File
@@ -2,14 +2,12 @@ import React from "react";
import _ from "lodash"; import _ from "lodash";
import Helmet from "react-helmet"; import Helmet from "react-helmet";
import Container from "./framework/container"; import Container from "./framework/container";
import buttonStyles from "./framework/buttons.css";
import { connect } from "react-redux"; import { connect } from "react-redux";
import PulseLoader from "halogen/PulseLoader"; import PulseLoader from "halogen/PulseLoader";
import Categorical from "./categorical/categorical"; import LeftSideBar from "./leftsidebar";
import Continuous from "./continuous/continuous"; import Continuous from "./continuous/continuous";
import DynamicScatterplot from "./scatterplot/scatterplot"; import DynamicScatterplot from "./scatterplot/scatterplot";
import Expression from "./expression/expression";
import Joy from "./joy/joy"; import Joy from "./joy/joy";
import Graph from "./graph/graph"; import Graph from "./graph/graph";
import * as globals from "../globals"; import * as globals from "../globals";
@@ -54,41 +52,26 @@ class App extends React.Component {
<Helmet title="cellxgene" /> <Helmet title="cellxgene" />
{ {
this.props.cells.loading ? this.props.cells.loading ?
<div style={{display: "flex", justifyContent: "center", marginTop: 20}}> <div style={{position: "fixed", left: window.innerWidth / 2, marginTop: 20}}>
<PulseLoader color="rgb(0,0,0)" size="10px" margin="4px"/> <PulseLoader color="rgb(0,0,0)" size="10px" margin="4px"/>
<span style={{marginLeft: 10, fontFamily: globals.accentFont, fontStyle: "italic"}}>loading cells</span> <span style={{fontFamily: globals.accentFont, fontStyle: "italic"}}>loading cells</span>
</div> : </div> :
null null
} }
{this.props.cells.error ? "Error loading cells" : null} {this.props.cells.error ? "Error loading cells" : null}
{false ? <Joy data={this.state.expressions && this.state.expressions.data}/> : ""} {false ? <Joy data={this.state.expressions && this.state.expressions.data}/> : ""}
<div style={{ <div>
display: "flex" <LeftSideBar/>
}}> <div style={{
padding: 15,
<Categorical/> backgroundColor: "#F7F7F7",
<div> width: 1440 - 410 /* but responsive */,
marginLeft: 350 /* but responsive */
}}>
<Graph/> <Graph/>
<button
onClick={() => { this.props.dispatch(actions.regraph()) }}
style={{
fontSize: 14,
fontWeight: 400,
color: "#41633C",
padding: "10px 20px",
backgroundColor: "#B9D1B5",
border: "none",
borderRadius: 3,
cursor: "pointer",
}}
>
Regraph
</button>
<DynamicScatterplot/> <DynamicScatterplot/>
<Continuous/> {/*<Continuous/>*/}
</div> </div>
<Expression/>
</div> </div>
</Container> </Container>
) )