+
@@ -44,9 +44,9 @@ export const DashTeamItem = ({ classes }) => (
title='Image title'
/>
- Goodester
+ {team.name}
- 09.15.2018
+ {team.createdAt}
Members:6
@@ -66,7 +66,8 @@ export const DashTeamItem = ({ classes }) => (
)
DashTeamItem.propTypes = {
- classes: PropTypes.object.isRequired
+ classes: PropTypes.object.isRequired,
+ team: PropTypes.object.isRequired
}
export default withStyles(styles)(DashTeamItem)
diff --git a/client/src/views/teams/components/TeamsItem.js b/client/src/views/teams/components/TeamsItem.js
new file mode 100644
index 000000000..16d833c32
--- /dev/null
+++ b/client/src/views/teams/components/TeamsItem.js
@@ -0,0 +1,111 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+
+import Typography from '@material-ui/core/Typography'
+import { withStyles } from '@material-ui/core/styles'
+
+import Grid from '@material-ui/core/Grid'
+import Paper from '@material-ui/core/Paper'
+import Button from '@material-ui/core/Button'
+import ButtonBase from '@material-ui/core/ButtonBase'
+
+const styles = theme => ({
+ layout: {
+ width: 'auto',
+ marginLeft: theme.spacing.unit * 2,
+ marginRight: theme.spacing.unit * 2,
+ [theme.breakpoints.up(600 + theme.spacing.unit * 2 * 2)]: {
+ width: 600,
+ marginLeft: 'auto',
+ marginRight: 'auto'
+ }
+ },
+ paper: {
+ marginTop: theme.spacing.unit * 0.1,
+ marginBottom: theme.spacing.unit * 0.1,
+ padding: theme.spacing.unit * 2,
+ [theme.breakpoints.up(600 + theme.spacing.unit * 3 * 2)]: {
+ marginTop: theme.spacing.unit * 1,
+ marginBottom: theme.spacing.unit * 1,
+ padding: theme.spacing.unit * 3
+ }
+ },
+ card: {
+ display: 'block',
+ width: '100%'
+ },
+ cardDetails: {
+ display: 'flex',
+ flex: 1
+ },
+ cardContent: {
+ flex: 1
+ },
+ buttonRight: {
+ justifyContent: 'flex-end'
+ },
+ image: {
+ width: 140,
+ height: 140
+ },
+ img: {
+ margin: 'auto',
+ display: 'block',
+ maxWidth: '100%',
+ maxHeight: '100%'
+ }
+})
+
+export const TeamsItem = ({ classes, team }) => (
+
+
+
+
+
+
+
+
+
+
+
+
+ {team.name}
+
+ {team.createdAt}
+
+
+ Members: 1
+
+
+
+
+ Now recruiting!
+
+
+
+
+
+
+
+
+
+
+
+)
+
+TeamsItem.propTypes = {
+ classes: PropTypes.object.isRequired,
+ team: PropTypes.object.isRequired
+}
+
+export default withStyles(styles)(TeamsItem)
diff --git a/client/src/views/teams/components/TeamsList.js b/client/src/views/teams/components/TeamsList.js
new file mode 100644
index 000000000..c156b244b
--- /dev/null
+++ b/client/src/views/teams/components/TeamsList.js
@@ -0,0 +1,61 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import { Query } from 'react-apollo'
+
+import Typography from '@material-ui/core/Typography'
+import Grid from '@material-ui/core/Grid'
+
+import GET_ALL_TEAMS_QUERY from '../../../graphql/teams/GetAllTeamsQuery'
+
+import TeamsItem from './TeamsItem'
+
+export const TeamsList = ({ classes }) => (
+
+
+ {({ loading, error, data }) => {
+ console.log('GET_TEAMS_BY_OWNER: ', loading, error, data)
+ let errors
+ let queryLoader
+ if (error) {
+ errors = error.graphQLErrors.map(({ message }, i) => {
+ return (
+
+ {message}
+
+ )
+ })
+ }
+ if (!loading && !error) {
+ if (data.teams.edges.length > 0) {
+ return (
+
+ {!loading &&
+ data.teams.edges.map(team => (
+
+ )
+ }
+ } else {
+ return (
+
+
+ Loading...
+
+ {queryLoader}
+ {errors}
+
+ )
+ }
+ }}
+
+
+)
+
+TeamsList.propTypes = {
+ classes: PropTypes.object.isRequired
+}
+
+export default TeamsList
diff --git a/client/src/views/teams/index.js b/client/src/views/teams/index.js
index 69dbd99aa..96fd0e5c8 100644
--- a/client/src/views/teams/index.js
+++ b/client/src/views/teams/index.js
@@ -3,8 +3,11 @@ import PropTypes from 'prop-types'
import CssBaseline from '@material-ui/core/CssBaseline'
import Typography from '@material-ui/core/Typography'
+import Grid from '@material-ui/core/Grid'
import { withStyles } from '@material-ui/core/styles'
+import TeamsList from './components/TeamsList'
+
const styles = theme => ({
'@global': {
body: {
@@ -28,7 +31,7 @@ const styles = theme => ({
}
})
-const Home = ({ classes }) => (
+const Teams = ({ classes }) => (
@@ -41,13 +44,16 @@ const Home = ({ classes }) => (
>
Teams
+
+
)
-Home.propTypes = {
+Teams.propTypes = {
classes: PropTypes.object.isRequired
}
-export default withStyles(styles)(Home)
+export default withStyles(styles)(Teams)
+