john/deighton-ar
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Put system stuff on home page

Browse Source
This commit is contained in:
John Lyon-Smith
2018-06-04 19:05:14 -07:00
parent e09a8b87de
commit 12574fb354
6 changed files with 206 additions and 260 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
website/src/App.js
View File

@@ -13,7 +13,6 @@ import { Home } from "./Home"
import { Profile } from "./Profile"
import { Users } from "./Users"
import { Teams } from "./Teams"
import { System } from "./System"
import { Header, Column, Footer } from "ui"
import { BrowserRouter, Route, Switch } from "react-router-dom"
import { sizeInfo } from "ui/style"
@@ -84,12 +83,6 @@ export class App extends Component {
/>
<ProtectedRoute exact admin path="/admin/home" component={Home} />
<ProtectedRoute exact admin path="/admin/teams" component={Teams} />
<ProtectedRoute
exact
admin
path="/admin/system"
component={System}
/>
<ProtectedRoute exact admin path="/admin/users" component={Users} />
<DefaultRoute user="/user/profile" admin="/admin/home" />
</Switch>

222
website/src/Home/Home.js
View File

@@ -1,47 +1,217 @@
import React, { Component, Fragment } from "react"
import PropTypes from "prop-types"
import { Row, Column, PanelButton } from "ui"
import { sizeInfo } from "ui/style"
import { Box, Image, Column, Row, Button, Link } from "ui"
import { MessageModal, WaitModal, YesNoMessageModal } from "../Modal"
import { sizeInfo, colorInfo } from "ui/style"
import headerLogo from "images/logo.png"
import autobind from "autobind-decorator"
import { api } from "../API"
export class Home extends Component {
static propTypes = {
history: PropTypes.object,
changeTitle: PropTypes.func.isRequired,
}
constructor(props) {
super(props)
this.state = {
messageModal: null,
waitModal: null,
yesNoModal: null,
}
}
@autobind
handleDeleteActivities() {
this.setState({
yesNoModal: {
question:
"Are you sure you want to delete all activities in the system?",
onDismiss: this.handleDeleteActivitiesDismiss,
},
})
}
@autobind
handleDeleteActivitiesDismiss(yes) {
if (yes) {
this.setState({ waitModal: { message: "Deleting All Activities..." } })
api
.deleteAllActivities()
.then(() => {
this.setState({
waitModal: null,
messageModal: {
icon: "thumb",
message: "All logged activities have been deleted",
},
})
})
.catch((error) => {
this.setState({
waitModal: null,
messageModal: {
icon: "hand",
message: "Unable to request delete activities.",
detail: error.message,
},
})
})
}
this.setState({
yesNoModal: null,
})
}
@autobind
handleDeleteWorkItems() {
this.setState({
yesNoModal: {
question:
"Are you sure you want to delete all work items & activities in the system?",
onDismiss: this.handleDeleteWorkItemsDismiss,
},
})
}
@autobind
handleDeleteWorkItemsDismiss(yes) {
if (yes) {
this.setState({
waitModal: { message: "Deleting All Work Items & Activities..." },
})
api
.deleteAllWorkItems()
.then(() => {
this.setState({
waitModal: null,
messageModal: {
icon: "thumb",
message: "All work items and logged activities have been deleted",
},
})
})
.catch((error) => {
this.setState({
waitModal: null,
messageModal: {
icon: "hand",
message: "Unable to delete work items and activities.",
detail: error.message,
},
})
})
}
this.setState({
yesNoModal: null,
})
}
@autobind
handleMessageModalDismiss() {
this.setState({ messageModal: null })
}
render() {
const { messageModal, yesNoModal, waitModal } = this.state
return (
<Fragment>
<Column.Item grow />
<Column.Item>
<Row>
<Row.Item grow />
<Row.Item>
<PanelButton
icon="users"
text="Users"
onClick={() => this.props.history.push("/admin/users")}
/>
</Row.Item>
<Row.Item width={sizeInfo.panelButtonSpacing} />
<Row.Item>
<PanelButton
icon="teams"
text="Teams"
onClick={() => this.props.history.push("/admin/teams")}
/>
</Row.Item>
<Row.Item width={sizeInfo.panelButtonSpacing} />
<Row.Item>
<PanelButton
icon="system"
text="System"
onClick={() => this.props.history.push("/admin/system")}
/>
<Row.Item width={sizeInfo.formRowSpacing} />
<Row.Item width={sizeInfo.modalWidth}>
<Box
border={{
width: sizeInfo.headerBorderWidth,
color: colorInfo.headerBorder,
}}
radius={sizeInfo.formBoxRadius}>
<Column>
<Column.Item minHeight={sizeInfo.formColumnSpacing} />
<Column.Item>
<Row>
<Row.Item grow />
<Row.Item>
<Image
source={headerLogo}
width={sizeInfo.loginLogoWidth}
/>
</Row.Item>
<Row.Item grow />
</Row>
</Column.Item>
<Column.Item minHeight={sizeInfo.formColumnSpacing} />
<Column.Item>
<Row>
<Row.Item grow />
<Row.Item>
<Button
text="Delete All Activities"
width={sizeInfo.buttonWideWidth}
onClick={this.handleDeleteActivities}
/>
</Row.Item>
<Row.Item grow />
</Row>
</Column.Item>
<Column.Item minHeight={sizeInfo.formColumnSpacing} />
<Column.Item>
<Row>
<Row.Item grow />
<Row.Item>
<Button
text="Delete All Work Items"
width={sizeInfo.buttonWideWidth}
onClick={this.handleDeleteWorkItems}
/>
</Row.Item>
<Row.Item grow />
</Row>
</Column.Item>
<Column.Item minHeight={sizeInfo.formColumnSpacing} />
<Column.Item>
<Row>
<Row.Item grow />
<Row.Item>
<Link to={api.makeTeamStatusUrl()}>
Download Team Data
</Link>
</Row.Item>
<Row.Item grow />
</Row>
</Column.Item>
<Column.Item height={sizeInfo.formColumnSpacing} />
</Column>
</Box>
</Row.Item>
<Row.Item grow />
</Row>
</Column.Item>
<Column.Item grow />
<Column.Item grow>
<YesNoMessageModal
open={!!yesNoModal}
question={yesNoModal ? yesNoModal.question : ""}
onDismiss={yesNoModal && yesNoModal.onDismiss}
/>
<MessageModal
open={!!messageModal}
icon={messageModal ? messageModal.icon : ""}
message={messageModal ? messageModal.message : ""}
detail={messageModal ? messageModal.title : ""}
onDismiss={this.handleMessageModalDismiss}
/>
<WaitModal
open={!!waitModal}
message={waitModal ? waitModal.message : ""}
/>
</Column.Item>
</Fragment>
)
}

218
website/src/System/System.js
View File

@@ -1,218 +0,0 @@
import React, { Component, Fragment } from "react"
import PropTypes from "prop-types"
import { Box, Image, Column, Row, Button, Link } from "ui"
import { MessageModal, WaitModal, YesNoMessageModal } from "../Modal"
import { sizeInfo, colorInfo } from "ui/style"
import headerLogo from "images/logo.png"
import autobind from "autobind-decorator"
import { api } from "../API"
export class System extends Component {
static propTypes = {
changeTitle: PropTypes.func.isRequired,
}
constructor(props) {
super(props)
this.state = {
messageModal: null,
waitModal: null,
yesNoModal: null,
}
}
@autobind
handleDeleteActivities() {
this.setState({
yesNoModal: {
question:
"Are you sure you want to delete all activities in the system?",
onDismiss: this.handleDeleteActivitiesDismiss,
},
})
}
@autobind
handleDeleteActivitiesDismiss(yes) {
if (yes) {
this.setState({ waitModal: { message: "Deleting All Activities..." } })
api
.deleteAllActivities()
.then(() => {
this.setState({
waitModal: null,
messageModal: {
icon: "thumb",
message: "All logged activities have been deleted",
},
})
})
.catch((error) => {
this.setState({
waitModal: null,
messageModal: {
icon: "hand",
message: "Unable to request delete activities.",
detail: error.message,
},
})
})
}
this.setState({
yesNoModal: null,
})
}
@autobind
handleDeleteWorkItems() {
this.setState({
yesNoModal: {
question:
"Are you sure you want to delete all work items & activities in the system?",
onDismiss: this.handleDeleteWorkItemsDismiss,
},
})
}
@autobind
handleDeleteWorkItemsDismiss(yes) {
if (yes) {
this.setState({
waitModal: { message: "Deleting All Work Items & Activities..." },
})
api
.deleteAllWorkItems()
.then(() => {
this.setState({
waitModal: null,
messageModal: {
icon: "thumb",
message: "All work items and logged activities have been deleted",
},
})
})
.catch((error) => {
this.setState({
waitModal: null,
messageModal: {
icon: "hand",
message: "Unable to delete work items and activities.",
detail: error.message,
},
})
})
}
this.setState({
yesNoModal: null,
})
}
@autobind
handleMessageModalDismiss() {
this.setState({ messageModal: null })
}
render() {
const { messageModal, yesNoModal, waitModal } = this.state
return (
<Fragment>
<Column.Item grow />
<Column.Item>
<Row>
<Row.Item grow />
<Row.Item width={sizeInfo.formRowSpacing} />
<Row.Item width={sizeInfo.modalWidth}>
<Box
border={{
width: sizeInfo.headerBorderWidth,
color: colorInfo.headerBorder,
}}
radius={sizeInfo.formBoxRadius}>
<Column>
<Column.Item minHeight={sizeInfo.formColumnSpacing} />
<Column.Item>
<Row>
<Row.Item grow />
<Row.Item>
<Image
source={headerLogo}
width={sizeInfo.loginLogoWidth}
/>
</Row.Item>
<Row.Item grow />
</Row>
</Column.Item>
<Column.Item minHeight={sizeInfo.formColumnSpacing} />
<Column.Item>
<Row>
<Row.Item grow />
<Row.Item>
<Button
text="Delete All Activities"
width={sizeInfo.buttonWideWidth}
onClick={this.handleDeleteActivities}
/>
</Row.Item>
<Row.Item grow />
</Row>
</Column.Item>
<Column.Item minHeight={sizeInfo.formColumnSpacing} />
<Column.Item>
<Row>
<Row.Item grow />
<Row.Item>
<Button
text="Delete All Work Items"
width={sizeInfo.buttonWideWidth}
onClick={this.handleDeleteWorkItems}
/>
</Row.Item>
<Row.Item grow />
</Row>
</Column.Item>
<Column.Item minHeight={sizeInfo.formColumnSpacing} />
<Column.Item>
<Row>
<Row.Item grow />
<Row.Item>
<Link to={api.makeTeamStatusUrl()}>
Download Team Data
</Link>
</Row.Item>
<Row.Item grow />
</Row>
</Column.Item>
<Column.Item height={sizeInfo.formColumnSpacing} />
</Column>
</Box>
</Row.Item>
<Row.Item grow />
</Row>
</Column.Item>
<Column.Item grow>
<YesNoMessageModal
open={!!yesNoModal}
question={yesNoModal ? yesNoModal.question : ""}
onDismiss={yesNoModal && yesNoModal.onDismiss}
/>
<MessageModal
open={!!messageModal}
icon={messageModal ? messageModal.icon : ""}
message={messageModal ? messageModal.message : ""}
detail={messageModal ? messageModal.title : ""}
onDismiss={this.handleMessageModalDismiss}
/>
<WaitModal
open={!!waitModal}
message={waitModal ? waitModal.message : ""}
/>
</Column.Item>
</Fragment>
)
}
}

1
website/src/System/index.js
View File

@@ -1 +0,0 @@
export { System } from './System'

2
website/src/ui/Header.js
View File

@@ -127,6 +127,8 @@ Header.TextButton = Radium(
static style = {
display: "inline-block",
position: "relative",
top: 3,
fontSize: fontInfo.size.header,
fontFamily: fontInfo.family,
color: fontInfo.color.normal,