diff --git a/client/.babelrc b/client/.babelrc index 2b7bafa5f..e60d3036a 100644 --- a/client/.babelrc +++ b/client/.babelrc @@ -1,3 +1,4 @@ { - "presets": ["@babel/preset-env", "@babel/preset-react"] + "presets": ["@babel/preset-env", "@babel/preset-react"], + "plugins": ["@babel/plugin-proposal-class-properties"] } diff --git a/client/package-lock.json b/client/package-lock.json index 5b6deaa38..8f803109b 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -1330,6 +1330,20 @@ "@babel/plugin-syntax-async-generators": "^7.0.0" } }, + "@babel/plugin-proposal-class-properties": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.0.0.tgz", + "integrity": "sha512-mVgsbdySh6kuzv4omXvw0Kuh+3hrUrQ883qTCf75MqfC6zctx2LXrP3Wt+bbJmB5fE5nfhf/Et2pQyrRy4j0Pg==", + "dev": true, + "requires": { + "@babel/helper-function-name": "^7.0.0", + "@babel/helper-member-expression-to-functions": "^7.0.0", + "@babel/helper-optimise-call-expression": "^7.0.0", + "@babel/helper-plugin-utils": "^7.0.0", + "@babel/helper-replace-supers": "^7.0.0", + "@babel/plugin-syntax-class-properties": "^7.0.0" + } + }, "@babel/plugin-proposal-json-strings": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-json-strings/-/plugin-proposal-json-strings-7.0.0.tgz", @@ -1380,6 +1394,15 @@ "@babel/helper-plugin-utils": "^7.0.0" } }, + "@babel/plugin-syntax-class-properties": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-class-properties/-/plugin-syntax-class-properties-7.0.0.tgz", + "integrity": "sha512-cR12g0Qzn4sgkjrbrzWy2GE7m9vMl/sFkqZ3gIpAQdrvPDnLM8180i+ANDFIXfjHo9aqp0ccJlQ0QNZcFUbf9w==", + "dev": true, + "requires": { + "@babel/helper-plugin-utils": "^7.0.0" + } + }, "@babel/plugin-syntax-json-strings": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-json-strings/-/plugin-syntax-json-strings-7.0.0.tgz", diff --git a/client/package.json b/client/package.json index c5e9afa00..27b67cb88 100644 --- a/client/package.json +++ b/client/package.json @@ -19,6 +19,7 @@ "license": "AGPL-3.0", "devDependencies": { "@babel/core": "^7.0.1", + "@babel/plugin-proposal-class-properties": "^7.0.0", "@babel/preset-env": "^7.0.0", "@babel/preset-react": "^7.0.0", "autoprefixer": "^8.6.5", @@ -78,6 +79,7 @@ "apollo-utilities": "^1.0.20", "auth0-lock": "^11.9.0", "babel-polyfill": "^6.26.0", + "classnames": "^2.2.6", "cross-fetch": "^2.2.2", "dotenv-webpack": "^1.5.7", "graphql": "^0.13.2", diff --git a/client/src/App.js b/client/src/App.js index 016affd44..5dcdda261 100644 --- a/client/src/App.js +++ b/client/src/App.js @@ -12,7 +12,18 @@ import { getMainDefinition } from 'apollo-utilities' import React, { Component } from 'react' import { Route, BrowserRouter, Switch } from 'react-router-dom' -import { NavBar, Footer, Callback, Home } from './views' +import MuiThemeProvider from '@material-ui/core/styles/MuiThemeProvider' +import CssBaseline from '@material-ui/core/CssBaseline' +import { withStyles } from '@material-ui/core/styles' +import { + NavBar, + Footer, + Callback, + Home, + Dashboard, + theme, + globalStyles +} from './views' import Auth from './auth' @@ -101,16 +112,16 @@ const authRetryLink = onError( } ) -const authLink = setContext((_, { headers }) => { +const authLink = setContext(async (_, { headers }) => { // get the authentication token from local storage if it exists - const token = window.localStorage.getItem('access_token') - // return the headers to the context so httpLink can read them - return { - headers: { - ...headers, - Authorization: token ? `Bearer ${token}` : `` + await getItem('access_token').then(token => { + return { + headers: { + ...headers, + Authorization: token ? `Bearer ${token}` : `` + } } - } + }) }) const cache = new InMemoryCache().restore(window.__APOLLO_STATE__) @@ -131,24 +142,28 @@ class App extends Component { return ( -
- - - - { - auth.handleAuthentication(props) - return - }} - /> - -
-
+ + +
+ + + + + { + auth.handleAuthentication(props) + return + }} + /> + +
+ ) } } -export default App +export default withStyles(globalStyles)(App) diff --git a/client/src/assets/AlgonetWebPlatform.jpg b/client/src/assets/AlgonetWebPlatform.jpg new file mode 100644 index 000000000..7f5176e33 Binary files /dev/null and b/client/src/assets/AlgonetWebPlatform.jpg differ diff --git a/client/src/assets/logos/advanced-algos/aa-logo-vert.svg b/client/src/assets/logos/advanced-algos/aa-logo-vert.svg new file mode 100644 index 000000000..442e9a7fd --- /dev/null +++ b/client/src/assets/logos/advanced-algos/aa-logo-vert.svg @@ -0,0 +1 @@ +aa-logo-vert \ No newline at end of file diff --git a/client/src/assets/logos/advanced-algos/aa-logo.png b/client/src/assets/logos/advanced-algos/aa-logo.png new file mode 100644 index 000000000..9701ee1c0 Binary files /dev/null and b/client/src/assets/logos/advanced-algos/aa-logo.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/android-chrome-192x192.png b/client/src/assets/logos/advanced-algos/favicon/android-chrome-192x192.png new file mode 100644 index 000000000..150043a06 Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/android-chrome-192x192.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/android-chrome-512x512.png b/client/src/assets/logos/advanced-algos/favicon/android-chrome-512x512.png new file mode 100644 index 000000000..d98b9ce8d Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/android-chrome-512x512.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/apple-touch-icon.png b/client/src/assets/logos/advanced-algos/favicon/apple-touch-icon.png new file mode 100644 index 000000000..95ec62746 Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/apple-touch-icon.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/browserconfig.xml b/client/src/assets/logos/advanced-algos/favicon/browserconfig.xml new file mode 100644 index 000000000..b3930d0f0 --- /dev/null +++ b/client/src/assets/logos/advanced-algos/favicon/browserconfig.xml @@ -0,0 +1,9 @@ + + + + + + #da532c + + + diff --git a/client/src/assets/logos/advanced-algos/favicon/favicon-16x16.png b/client/src/assets/logos/advanced-algos/favicon/favicon-16x16.png new file mode 100644 index 000000000..99bda00af Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/favicon-16x16.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/favicon-32x32.png b/client/src/assets/logos/advanced-algos/favicon/favicon-32x32.png new file mode 100644 index 000000000..08c2369b0 Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/favicon-32x32.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/favicon.ico b/client/src/assets/logos/advanced-algos/favicon/favicon.ico new file mode 100644 index 000000000..cd2c5d6af Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/favicon.ico differ diff --git a/client/src/assets/logos/advanced-algos/favicon/html_code.html b/client/src/assets/logos/advanced-algos/favicon/html_code.html new file mode 100644 index 000000000..a66b72bb6 --- /dev/null +++ b/client/src/assets/logos/advanced-algos/favicon/html_code.html @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/client/src/assets/logos/advanced-algos/favicon/mstile-150x150.png b/client/src/assets/logos/advanced-algos/favicon/mstile-150x150.png new file mode 100644 index 000000000..78a06c05a Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/mstile-150x150.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/safari-pinned-tab.svg b/client/src/assets/logos/advanced-algos/favicon/safari-pinned-tab.svg new file mode 100644 index 000000000..db3ba7cde --- /dev/null +++ b/client/src/assets/logos/advanced-algos/favicon/safari-pinned-tab.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/client/src/assets/logos/advanced-algos/favicon/site.webmanifest b/client/src/assets/logos/advanced-algos/favicon/site.webmanifest new file mode 100644 index 000000000..002445914 --- /dev/null +++ b/client/src/assets/logos/advanced-algos/favicon/site.webmanifest @@ -0,0 +1,19 @@ +{ + "name": "Advanced Algos", + "short_name": "Advanced Algos", + "icons": [ + { + "src": "/android-chrome-192x192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "/android-chrome-512x512.png", + "sizes": "512x512", + "type": "image/png" + } + ], + "theme_color": "#ffffff", + "background_color": "#ffffff", + "display": "standalone" +} diff --git a/client/src/auth/index.js b/client/src/auth/index.js index cf8411ac3..0b01b3e47 100644 --- a/client/src/auth/index.js +++ b/client/src/auth/index.js @@ -104,7 +104,7 @@ class Auth { console.log(authResult.idTokenPayload) setItem('user', JSON.stringify(authResult.idTokenPayload)) if (window.location.href.includes(`callback`)) { - window.location.href = '/' + window.location.href = '/dashboard' } return true } @@ -128,7 +128,7 @@ class Auth { console.log('signinOrCreateAccount auth: ', await data) setItem('user', JSON.stringify(data.data.authenticate)) if (window.location.href.includes(`callback`)) { - window.location.href = '/' + window.location.href = '/dashboard' } else { window.location.reload() } diff --git a/client/src/graphql/teams/AddTeamMutation.js b/client/src/graphql/teams/CreateTeamMutation.js similarity index 64% rename from client/src/graphql/teams/AddTeamMutation.js rename to client/src/graphql/teams/CreateTeamMutation.js index 903ea5b59..752546daa 100644 --- a/client/src/graphql/teams/AddTeamMutation.js +++ b/client/src/graphql/teams/CreateTeamMutation.js @@ -1,15 +1,19 @@ /* eslint-disable no-unused-vars */ import gql from 'graphql-tag' -export const AddTeamMutation = gql` +export const CreateTeamMutation = gql` mutation CreateTeamMutation($name: String!, $slug: String!, $owner: String!) { createTeam(name: $name, slug: $slug, owner: $owner) { id name slug - owner { - auth0id - id + owner + members{ + role + member { + authId + alias + } } } } diff --git a/client/src/graphql/teams/UniqueTeamnameQuery.js b/client/src/graphql/teams/UniqueTeamnameQuery.js index e7366ef27..c3be3ec8e 100644 --- a/client/src/graphql/teams/UniqueTeamnameQuery.js +++ b/client/src/graphql/teams/UniqueTeamnameQuery.js @@ -3,7 +3,7 @@ import gql from 'graphql-tag' export const UniqueTeamnameQuery = gql` query uniqueTeamname($name: String!) { - teamByName(name: $name){ + teamByName(name: $name) { name } } diff --git a/client/src/views/callback/index.js b/client/src/views/callback/index.js index 2f94f8eb4..c4b615186 100644 --- a/client/src/views/callback/index.js +++ b/client/src/views/callback/index.js @@ -1,5 +1,5 @@ import React from 'react' -const Callback = () => (
Authenticating...
) +const Callback = () =>
Authenticating...
export default Callback diff --git a/client/src/views/dashboard/components/CreateTeam.js b/client/src/views/dashboard/components/CreateTeam.js new file mode 100644 index 000000000..2d0bda554 --- /dev/null +++ b/client/src/views/dashboard/components/CreateTeam.js @@ -0,0 +1,135 @@ +import React, { Component } from 'react' +import PropTypes from 'prop-types' +import { withRouter } from 'react-router-dom' +import Button from '@material-ui/core/Button' +import AddIcon from '@material-ui/icons/Add' +import TextField from '@material-ui/core/TextField' +import Dialog from '@material-ui/core/Dialog' +import DialogActions from '@material-ui/core/DialogActions' +import DialogContent from '@material-ui/core/DialogContent' +import DialogContentText from '@material-ui/core/DialogContentText' +import DialogTitle from '@material-ui/core/DialogTitle' +import Typography from '@material-ui/core/Typography' + +import { getItem } from '../../../utils/local-storage' + +export class CreateTeamDialog extends Component { + constructor (props) { + super(props) + + this.handleClickOpen = this.handleClickOpen.bind(this) + this.handleClose = this.handleClose.bind(this) + this.handlePost = this.handlePost.bind(this) + this.slugify = this.slugify.bind(this) + this.handleChange = this.handleChange.bind(this) + + this.state = { + open: false, + name: '' + } + } + + handleClickOpen () { + this.setState({ open: true }) + } + + handleClose () { + this.setState({ open: false }) + } + + handleChange (e) { + this.setState({ name: e.target.value }) + } + + render () { + console.log(this.props) + return ( +
+ + + Subscribe + + + Team Creation + + + Name your team! + + + + + + + + +
+ ) + } + + slugify (string) { + const a = 'àáäâãåèéëêìíïîòóöôùúüûñçßÿœæŕśńṕẃǵǹḿǘẍźḧ·/_,:;' + const b = 'aaaaaaeeeeiiiioooouuuuncsyoarsnpwgnmuxzh------' + const p = new RegExp(a.split('').join('|'), 'g') + + return string.toString().toLowerCase() + .replace(/\s+/g, '-') // Replace spaces with - + .replace(p, c => b.charAt(a.indexOf(c))) // Replace special characters + .replace(/&/g, '-and-') // Replace & with 'and' + .replace(/[^\w-]+/g, '') // Remove all non-word characters + .replace(/--+/g, '-') // Replace multiple - with single - + .replace(/^-+/, '') // Trim - from start of text + .replace(/-+$/, '') // Trim - from end of text + } + + async handlePost (e) { + e.preventDefault() + const { name } = this.state + const slug = this.slugify(name) + const currentUser = await getItem('user') + let authId = JSON.parse(currentUser) + authId = authId.sub + console.log('createPage cu:', JSON.parse(currentUser)) + await this.props.createTeamMutation({ + variables: { + name, + slug, + owner: authId + } + }) + this.setState({ open: false }) + } +} + +CreateTeamDialog.propTypes = { + classes: PropTypes.object.isRequired, + createTeamMutation: PropTypes.function +} + +export default withRouter(CreateTeamDialog) diff --git a/client/src/views/dashboard/components/DrawerLinks.js b/client/src/views/dashboard/components/DrawerLinks.js new file mode 100644 index 000000000..b2a178697 --- /dev/null +++ b/client/src/views/dashboard/components/DrawerLinks.js @@ -0,0 +1,72 @@ +import React from 'react' +import { Link } from 'react-router-dom' + +import ListItem from '@material-ui/core/ListItem' +import ListItemIcon from '@material-ui/core/ListItemIcon' +import ListItemText from '@material-ui/core/ListItemText' +import GroupIcon from '@material-ui/icons/Group' +import DashboardIcon from '@material-ui/icons/Dashboard' +import SettingsIcon from '@material-ui/icons/Settings' +import SupervisedUserCircleIcon from '@material-ui/icons/SupervisedUserCircle' +import LibraryBooksIcon from '@material-ui/icons/LibraryBooks' +import SentimentSatisfiedAltIcon from '@material-ui/icons/SentimentSatisfiedAlt' +import AndroidIcon from '@material-ui/icons/Android' + +const DashboardLink = props => +const TeamsLink = props => +const MembersLink = props => +const SettingsLink = props => + +export const MainDrawerItems = ( +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+) + +export const SecondaryDrawerItems = ( +
+ + + + + + + + + + + + +
+) + +export default MainDrawerItems diff --git a/client/src/views/dashboard/components/TeamTable.js b/client/src/views/dashboard/components/TeamTable.js new file mode 100644 index 000000000..1dec0c165 --- /dev/null +++ b/client/src/views/dashboard/components/TeamTable.js @@ -0,0 +1,54 @@ +import React from 'react' +import Table from '@material-ui/core/Table' +import TableBody from '@material-ui/core/TableBody' +import TableCell from '@material-ui/core/TableCell' +import TableHead from '@material-ui/core/TableHead' +import TableRow from '@material-ui/core/TableRow' +import Paper from '@material-ui/core/Paper' + +let id = 0 +const createData = (name, calories, fat, carbs, protein) => { + id += 1 + return { id, name, calories, fat, carbs, protein } +} + +const data = [ + createData('Frozen yoghurt', 159, 6.0, 24, 4.0), + createData('Ice cream sandwich', 237, 9.0, 37, 4.3), + createData('Eclair', 262, 16.0, 24, 6.0), + createData('Cupcake', 305, 3.7, 67, 4.3), + createData('Gingerbread', 356, 16.0, 49, 3.9) +] + +export const TeamTable = () => ( + + + + + Dessert (100g serving) + Calories + Fat (g) + Carbs (g) + Protein (g) + + + + {data.map(n => { + return ( + + + {n.name} + + {n.calories} + {n.fat} + {n.carbs} + {n.protein} + + ) + })} + +
+ +) + +export default TeamTable diff --git a/client/src/views/dashboard/index.js b/client/src/views/dashboard/index.js new file mode 100644 index 000000000..6392347ed --- /dev/null +++ b/client/src/views/dashboard/index.js @@ -0,0 +1,216 @@ +import React from 'react' +import PropTypes from 'prop-types' +import { graphql } from 'react-apollo' + +import Typography from '@material-ui/core/Typography' +import { withStyles } from '@material-ui/core/styles' +import Drawer from '@material-ui/core/Drawer' +import List from '@material-ui/core/List' +import Divider from '@material-ui/core/Divider' +import Grid from '@material-ui/core/Grid' +import Card from '@material-ui/core/Card' +import CardContent from '@material-ui/core/CardContent' +import CardMedia from '@material-ui/core/CardMedia' +import CardActions from '@material-ui/core/CardActions' +import Button from '@material-ui/core/Button' + +import { MainDrawerItems, SecondaryDrawerItems } from './components/DrawerLinks' +import { CreateTeamDialog } from './components/CreateTeam' + +import { CreateTeamMutation } from '../../graphql/teams/CreateTeamMutation' + +import aaweb from '../../assets/AlgonetWebPlatform.jpg' + +const drawerWidth = 240 + +const styles = theme => ({ + root: { + display: 'flex' + }, + '@global': { + body: { + backgroundColor: theme.palette.common.white + } + }, + appBar: { + zIndex: theme.zIndex.drawer + 1 + }, + drawerPaper: { + position: 'relative', + width: drawerWidth, + whiteSpace: 'nowrap', + zIndex: 1000 + }, + content: { + flexGrow: 1, + backgroundColor: theme.palette.background.default, + padding: theme.spacing.unit * 3, + height: '100vh', + overflow: 'auto', + width: `calc(90% - ${drawerWidth}px)` + }, + appBarSpacer: theme.mixins.toolbar, + tableContainer: { + height: 320 + }, + card: { + display: 'flex', + width: '100%' + }, + cardDetails: { + display: 'flex', + flex: 1 + }, + cardContent: { + flex: 1 + }, + cardMedia: { + flex: 1, + width: 160, + height: 160, + justifyContent: 'flex-start' + }, + aawebMedia: { + width: '100%', + height: 320 + }, + buttonRight: { + justifyContent: 'flex-end' + }, + extendedIcon: { + marginRight: theme.spacing.unit + } +}) + +const Dashboard = ({ classes, createTeamMutation, ...props }) => ( +
+ +
+ {MainDrawerItems} + + {SecondaryDrawerItems} + +
+
+ + + + Teams + + + + +
+ + + +
+ + + + +
+ + + Goodester + + 09.15.2018 + + + Members:6 + + + Now recruiting! + + + + + +
+ + + + +
+ + + Goodester + + 09.15.2018 + + + Members:6 + + + Now recruiting! + + + + + +
+ + + + + + + Develop + + + + + + + + + + + + + + + +
+
+) + +Dashboard.propTypes = { + classes: PropTypes.object.isRequired, + createTeamMutation: PropTypes.function +} + +const CreateTeamDialogWithMutation = graphql(CreateTeamMutation, { + name: 'createTeamMutation' // name of the injected prop: this.props.createTeamMutation... +})(Dashboard) + +export default withStyles(styles)(CreateTeamDialogWithMutation) diff --git a/client/src/views/dashboard/members.js b/client/src/views/dashboard/members.js new file mode 100644 index 000000000..da5524ed0 --- /dev/null +++ b/client/src/views/dashboard/members.js @@ -0,0 +1,111 @@ +import React from 'react' +import PropTypes from 'prop-types' +import { graphql } from 'react-apollo' + +import Typography from '@material-ui/core/Typography' +import { withStyles } from '@material-ui/core/styles' +import Drawer from '@material-ui/core/Drawer' +import List from '@material-ui/core/List' +import Divider from '@material-ui/core/Divider' + +import { MainDrawerItems, SecondaryDrawerItems } from './components/DrawerLinks' +import { TeamTable } from './components/TeamTable' + +import { CreateTeamMutation } from '../../graphql/teams/CreateTeamMutation' + +const drawerWidth = 240 + +const styles = theme => ({ + root: { + display: 'flex' + }, + '@global': { + body: { + backgroundColor: theme.palette.common.white + } + }, + appBar: { + zIndex: theme.zIndex.drawer + 1 + }, + drawerPaper: { + position: 'relative', + width: drawerWidth, + whiteSpace: 'nowrap', + zIndex: 1000 + }, + content: { + flexGrow: 1, + backgroundColor: theme.palette.background.default, + padding: theme.spacing.unit * 3, + height: '100vh', + overflow: 'auto', + width: `calc(90% - ${drawerWidth}px)` + }, + appBarSpacer: theme.mixins.toolbar, + tableContainer: { + height: 320 + }, + card: { + display: 'flex', + width: '100%' + }, + cardDetails: { + display: 'flex', + flex: 1 + }, + cardContent: { + flex: 1 + }, + cardMedia: { + flex: 1, + width: 160, + height: 160, + justifyContent: 'flex-start' + }, + aawebMedia: { + width: '100%', + height: 320 + }, + buttonRight: { + justifyContent: 'flex-end' + }, + extendedIcon: { + marginRight: theme.spacing.unit + } +}) + +const Dashboard = ({ classes, createTeamMutation, ...props }) => ( +
+ +
+ {MainDrawerItems} + + {SecondaryDrawerItems} + +
+
+ + Members + +
+ +
+
+
+) + +Dashboard.propTypes = { + classes: PropTypes.object.isRequired, + createTeamMutation: PropTypes.function +} + +const CreateTeamDialogWithMutation = graphql(CreateTeamMutation, { + name: 'createTeamMutation' // name of the injected prop: this.props.createTeamMutation... +})(Dashboard) + +export default withStyles(styles)(CreateTeamDialogWithMutation) diff --git a/client/src/views/dashboard/settings.js b/client/src/views/dashboard/settings.js new file mode 100644 index 000000000..0fac8c47e --- /dev/null +++ b/client/src/views/dashboard/settings.js @@ -0,0 +1,210 @@ +import React from 'react' +import PropTypes from 'prop-types' +import { graphql } from 'react-apollo' + +import Typography from '@material-ui/core/Typography' +import { withStyles } from '@material-ui/core/styles' +import Drawer from '@material-ui/core/Drawer' +import List from '@material-ui/core/List' +import Divider from '@material-ui/core/Divider' +import Grid from '@material-ui/core/Grid' +import Card from '@material-ui/core/Card' +import CardContent from '@material-ui/core/CardContent' +import CardMedia from '@material-ui/core/CardMedia' +import CardActions from '@material-ui/core/CardActions' +import Button from '@material-ui/core/Button' + +import { MainDrawerItems, SecondaryDrawerItems } from './components/DrawerLinks' +import { TeamTable } from './components/TeamTable' +import { CreateTeamDialog } from './components/CreateTeam' + +import { CreateTeamMutation } from '../../graphql/teams/CreateTeamMutation' + +const drawerWidth = 240 + +const styles = theme => ({ + root: { + display: 'flex' + }, + '@global': { + body: { + backgroundColor: theme.palette.common.white + } + }, + appBar: { + zIndex: theme.zIndex.drawer + 1 + }, + drawerPaper: { + position: 'relative', + width: drawerWidth, + whiteSpace: 'nowrap', + zIndex: 1000 + }, + content: { + flexGrow: 1, + backgroundColor: theme.palette.background.default, + padding: theme.spacing.unit * 3, + height: '100vh', + overflow: 'auto', + width: `calc(90% - ${drawerWidth}px)` + }, + appBarSpacer: theme.mixins.toolbar, + tableContainer: { + height: 320 + }, + card: { + display: 'flex', + width: '100%' + }, + cardDetails: { + display: 'flex', + flex: 1 + }, + cardContent: { + flex: 1 + }, + cardMedia: { + flex: 1, + width: 160, + height: 160, + justifyContent: 'flex-start' + }, + aawebMedia: { + width: '100%', + height: 320 + }, + buttonRight: { + justifyContent: 'flex-end' + }, + extendedIcon: { + marginRight: theme.spacing.unit + } +}) + +const Dashboard = ({ classes, createTeamMutation, ...props }) => ( +
+ +
+ {MainDrawerItems} + + {SecondaryDrawerItems} + +
+
+ + + + Settings + + + + +
+ + + +
+ + + + +
+ + + Goodester + + 09.15.2018 + + + Members:6 + + + Now recruiting! + + + + + +
+ + + + +
+ + + Goodester + + 09.15.2018 + + + Members:6 + + + Now recruiting! + + + + + +
+ + + + + + + Notifications + + + + + + + + + + + + + + +
+
+) + +Dashboard.propTypes = { + classes: PropTypes.object.isRequired, + createTeamMutation: PropTypes.function +} + +const CreateTeamDialogWithMutation = graphql(CreateTeamMutation, { + name: 'createTeamMutation' // name of the injected prop: this.props.createTeamMutation... +})(Dashboard) + +export default withStyles(styles)(CreateTeamDialogWithMutation) diff --git a/client/src/views/dashboard/teams.js b/client/src/views/dashboard/teams.js new file mode 100644 index 000000000..9d223e372 --- /dev/null +++ b/client/src/views/dashboard/teams.js @@ -0,0 +1,111 @@ +import React from 'react' +import PropTypes from 'prop-types' +import { graphql } from 'react-apollo' + +import Typography from '@material-ui/core/Typography' +import { withStyles } from '@material-ui/core/styles' +import Drawer from '@material-ui/core/Drawer' +import List from '@material-ui/core/List' +import Divider from '@material-ui/core/Divider' + +import { MainDrawerItems, SecondaryDrawerItems } from './components/DrawerLinks' +import { TeamTable } from './components/TeamTable' + +import { CreateTeamMutation } from '../../graphql/teams/CreateTeamMutation' + +const drawerWidth = 240 + +const styles = theme => ({ + root: { + display: 'flex' + }, + '@global': { + body: { + backgroundColor: theme.palette.common.white + } + }, + appBar: { + zIndex: theme.zIndex.drawer + 1 + }, + drawerPaper: { + position: 'relative', + width: drawerWidth, + whiteSpace: 'nowrap', + zIndex: 1000 + }, + content: { + flexGrow: 1, + backgroundColor: theme.palette.background.default, + padding: theme.spacing.unit * 3, + height: '100vh', + overflow: 'auto', + width: `calc(90% - ${drawerWidth}px)` + }, + appBarSpacer: theme.mixins.toolbar, + tableContainer: { + height: 320 + }, + card: { + display: 'flex', + width: '100%' + }, + cardDetails: { + display: 'flex', + flex: 1 + }, + cardContent: { + flex: 1 + }, + cardMedia: { + flex: 1, + width: 160, + height: 160, + justifyContent: 'flex-start' + }, + aawebMedia: { + width: '100%', + height: 320 + }, + buttonRight: { + justifyContent: 'flex-end' + }, + extendedIcon: { + marginRight: theme.spacing.unit + } +}) + +const Dashboard = ({ classes, createTeamMutation, ...props }) => ( +
+ +
+ {MainDrawerItems} + + {SecondaryDrawerItems} + +
+
+ + Teams + +
+ +
+
+
+) + +Dashboard.propTypes = { + classes: PropTypes.object.isRequired, + createTeamMutation: PropTypes.function +} + +const CreateTeamDialogWithMutation = graphql(CreateTeamMutation, { + name: 'createTeamMutation' // name of the injected prop: this.props.createTeamMutation... +})(Dashboard) + +export default withStyles(styles)(CreateTeamDialogWithMutation) diff --git a/client/src/views/footer/index.js b/client/src/views/footer/index.js index 8d9a68502..a7abff6b7 100644 --- a/client/src/views/footer/index.js +++ b/client/src/views/footer/index.js @@ -1,88 +1,118 @@ import React from 'react' +import PropTypes from 'prop-types' import { NavLink } from 'react-router-dom' +import { withStyles } from '@material-ui/core/styles' +import classNames from 'classnames' +import Typography from '@material-ui/core/Typography' +import Grid from '@material-ui/core/Grid' -const Footer = () => { +import aalogo from '../../assets/logos/advanced-algos/aa-logo-vert.svg' + +const styles = theme => ({ + '@global': { + body: { + backgroundColor: theme.palette.common.white + } + }, + layout: { + width: 'auto', + marginLeft: theme.spacing.unit * 3, + marginRight: theme.spacing.unit * 3, + [theme.breakpoints.up(1200 + theme.spacing.unit * 3 * 2)]: { + width: 1200, + marginLeft: 'auto', + marginRight: 'auto' + } + }, + footer: { + borderTop: `1px solid ${theme.palette.divider}`, + padding: `${theme.spacing.unit * 6}px 0` + }, + footerContainer: { + marginRight: theme.spacing.unit * 8, + marginLeft: theme.spacing.unit * 8 + }, + footerLink: { + textDecoration: 'none' + } +}) + +const Footer = ({ classes }) => { return ( -