Client: Manage Team Edit Details Dialog

api/database/datamodel.graphql

@@ -42,6 +42,7 @@ type TeamProfile {
   motto: String
   avatar: String
   updatedAt: DateTime!
+  createdAt: DateTime!
 }
 
 type TeamStatus {

api/src/index.js

@@ -94,7 +94,7 @@ const resolvers = {
       return member
     },
     async createTeam(parent, { name, slug, owner }, ctx, info) {
-      return ctx.db.mutation.createTeam({ data: { name: name, slug: slug, owner: owner, members: { create: { member:{ connect:{ authId: owner} }, role: 'OWNER' } } } }, TEAMS_FRAGMENT)
+      return ctx.db.mutation.createTeam({ data: { name: name, slug: slug, owner: owner, members: { create: { member:{ connect:{ authId: owner} }, role: 'OWNER' } }, profile:{create:{avatar:"a"} } } }, TEAMS_FRAGMENT)
         .catch((err) => {
           console.log('createTeam error: ', err)
           return err

client/src/views/common/MessageCard.js

@@ -37,7 +37,7 @@ export const MessageCard = ({ classes, message, children }) => (
 MessageCard.propTypes = {
   children: PropTypes.node,
   classes: PropTypes.object.isRequired,
-  message: PropTypes.string.isRequired
+  message: PropTypes.string
 }
 
 export default withStyles(styles)(MessageCard)

client/src/views/dashboard/components/CreateTeamDialog.js

@@ -109,7 +109,7 @@ export class CreateTeamDialog extends Component {
                       fullWidth
                       value={this.state.name}
                       onChange={this.handleChange}
-                      error={e => this.state.errors.name !== '' || error}
+                      error={this.state.errors.name !== '' || error}
                     />
                     {this.state.errors.name !== '' && (<FormHelperText>{this.state.errors.name}</FormHelperText>)}
                     {error && (<FormHelperText>{errors}</FormHelperText>)}

client/src/views/dashboard/components/DashTeam.js

@@ -74,7 +74,7 @@ export const DashTeam = ({ classes, user = null }) => {
             } else {
               return (
                 <Grid container spacing={40}>
-                  <Grid xs={10}>
+                  <Grid item xs={10}>
                     <MessageCard message='No teams yet...'>
                       <CreateTeamDialog authId={authId} />
                     </MessageCard>

client/src/views/dashboard/components/ManageTeamEdit.js

@@ -38,21 +38,20 @@ export class ManageTeamEdit extends Component {
 
   render () {
     console.log(this.props, this.props.slug)
+    const { authId } = this.props
     return (
       <Mutation
         mutation={UPDATE_TEAM_PROFILE}
-        update={(cache, { data: { deleteTeam } }) => {
-          const data = cache.readQuery({ query: GET_TEAMS_BY_OWNER })
-          console.log('Mutation cache update: ', deleteTeam, data)
-          data.getTeamsByOwner.push(deleteTeam)
-          cache.writeQuery({ query: GET_TEAMS_BY_OWNER, data })
-        }}
+        refetchQueries={[
+          {
+            query: GET_TEAMS_BY_OWNER,
+            variables: { authId }
+          }
+        ]}
       >
         {(updateTeamProfile, { loading, error, data }) => {
           let errors
           let loader
-          let description
-          let motto
           if (loading) {
             loader = <Typography variant='caption'>Submitting team...</Typography>
           }
@@ -84,21 +83,17 @@ export class ManageTeamEdit extends Component {
                   <TextField
                     autoFocus
                     margin='dense'
-                    id='teammotto'
+                    id='motto'
                     label='Team Motto'
                     type='text'
                     fullWidth
                     value={this.state.motto}
                     onChange={this.handleChange}
-                    inputRef={node => {
-                      motto = node
-                    }}
                   />
                   <DialogContentText>Team description:</DialogContentText>
                   <TextField
-                    autoFocus
                     margin='dense'
-                    id='teamDescription'
+                    id='description'
                     label='Team Description'
                     type='text'
                     rows={4}
@@ -106,9 +101,6 @@ export class ManageTeamEdit extends Component {
                     fullWidth
                     value={this.state.description}
                     onChange={this.handleChange}
-                    inputRef={node => {
-                      description = node
-                    }}
                   />
                   {loader}
                   {errors}
@@ -118,7 +110,7 @@ export class ManageTeamEdit extends Component {
                     Cancel
                   </Button>
                   <Button onClick={e => {
-                    this.handleSubmit(e, updateTeamProfile, this.props.slug, description, motto)
+                    this.handleSubmit(e, updateTeamProfile, this.props.slug)
                   }} color='primary'>
                     Update Team
                   </Button>
@@ -151,18 +143,19 @@ export class ManageTeamEdit extends Component {
     }
   }
 
-  async handleSubmit (e, updateTeamProfile, slug, description, motto) {
+  async handleSubmit (e, updateTeamProfile, slug) {
     e.preventDefault()
     const currentUser = await getItem('user')
     let authId = JSON.parse(currentUser)
     authId = authId.authId
-    await updateTeamProfile({ variables: { slug, owner: authId, description: description, motto: motto } })
+    await updateTeamProfile({ variables: { slug, owner: authId, description: this.state.description, motto: this.state.motto } })
   }
 }
 
 ManageTeamEdit.propTypes = {
   classes: PropTypes.object.isRequired,
-  slug: PropTypes.string.isRequired
+  slug: PropTypes.string.isRequired,
+  authId: PropTypes.string
 }
 
 export default withRouter(ManageTeamEdit)

client/src/views/dashboard/components/ManageTeamsList.js

@@ -102,7 +102,7 @@ export const ManageTeamsList = ({ classes, user = null }) => {
             } else {
               return (
                 <Grid container spacing={40}>
-                  <Grid xs={10}>
+                  <Grid item xs={10}>
                     <MessageCard message='You don&rsquo;t have any teams. Create one!'>
                       <CreateTeamDialog authId={authId} />
                     </MessageCard>
@@ -113,7 +113,7 @@ export const ManageTeamsList = ({ classes, user = null }) => {
           } else {
             return (
               <Grid container spacing={40}>
-                <Grid xs={12}>
+                <Grid item xs={12}>
                   <MessageCard message='Loading...' />
                   if (errors !== null) (<MessageCard message={errors} />)
                 </Grid>