Backend Refactoring

client/src/components/EditProfile.js

@@ -220,7 +220,7 @@ class EditProfile extends Component {
     checkProfanity = () => {
         var profanityExists = false;
         const profanities = Object.keys(this.state).map((key) => {
-            if (typeof(this.state[key]) === "string") {
+            if (typeof(this.state[key]) === "string" && key != "name") {
                 const k = `${key}_profane`
                 const isProfane = this.profanityFilter.isProfane(this.state[key])
                 this.setState({[k]: isProfane})

client/src/components/Members.js

@@ -8,31 +8,12 @@ import "./css/Members.css";
 import environment from "./Environment";
 import { Link } from "react-router-dom";
 
-// edit this query to pull on the team members
-const getUsersQuery = graphql`
-  query MembersQuery {
-    user_profile {
-      team {
-        members {
-          name
-          school
-          grad_year
-          contact
-          skills
-          experience
-        }
-      }
-    }
-  }
-`;
-
 class Members extends Component {
   render() {
     let memberCards = [];
 
     // sample users array
     let users = [];
-    console.log("Team: " + this.props.members);
     if (this.props.members) {
       users = this.props.members;
     }
@@ -47,11 +28,12 @@ class Members extends Component {
           name={user.name}
           grad_year={user.grad_year}
           school={user.school}
-          contact={user.contact}
+          contact={user.email}
           skills={user.skills.filter(function(el) {
             return Boolean(el);
           })}
           experience={user.experience}
+          slackid={user.slackid}
         />
       );
     }

client/src/components/MembersBlank.js

@@ -46,11 +46,12 @@ class Members extends Component {
           name={user.name}
           grad_year={user.grad_year}
           school={user.school}
-          contact={user.contact}
+          contact={user.email}
           skills={user.skills.filter(function(el) {
             return Boolean(el);
           })}
           experience={user.experience}
+          slackid={user.slackid}
         />
       );
     }

client/src/components/TeamCard.js

@@ -1,79 +1,100 @@
-import React, { Component } from 'react';
-import { Button, Card, Popup, Container, Label, TextArea, Placeholder } from 'semantic-ui-react';
-import JoinTeam from './ui_subcomponents/JoinTeam';
-import './css/TeamCard.css';
+import React, { Component } from "react";
+import {
+  Button,
+  Card,
+  Popup,
+  Container,
+  Label,
+  TextArea,
+  Placeholder,
+} from "semantic-ui-react";
+import JoinTeam from "./ui_subcomponents/JoinTeam";
+import "./css/TeamCard.css";
 import { Link, useParams } from "react-router-dom";
 
 class TeamCard extends Component {
-	constructor(props) {
-        super(props)
-        this.state = {
-            showModal: false
-        }
-    }
-    closeModal = () => {
-      console.log("close individual")
-      this.setState({ showModal: false });
+  constructor(props) {
+    super(props);
+    this.state = {
+      showModal: false,
     };
-    render() {
-		// let contact;
-		// contact = <Popup
-		// trigger={<Button basic={true} color='blue' content='Join Team!' />}
-		// content="Team has been joined!"
-		// on='click'
-		// hideOnScroll
-		// />
-		var colors = [
-			'violet',
-			'yellow',
-			'orange'
-		]
-		var count = 0;
-		var skill;
-		// var viewskill;
-		let link = "/team/" + this.props.id;
-		var colors = ["#A0CCC9", "#EBABCA"];
-		var count = 0;
-		var viewskill = this.props.interests.map((skill) => (
-		<Label
-			size="mini"
-			className="labelStyle"
-			style={{
-			backgroundColor: colors[count++ % 2],
-			}}
-		>
-			{skill}
-		</Label>
-		));
-		var button = this.props.team ? <Placeholder></Placeholder> : <Button className="contact" content='Join Team' onClick={() => this.setState({showModal: true})} />;
-		var text = this.props.team ? "newTeam" : "teamUp";
-		return (
-			<Card className="card1" basic={false} color='blue' centered='true'>
-				<Card.Content className="content">
-					<Card.Header><Container style={{overflow: 'auto', maxHeight: 60, minHeight: 60 }}>{this.props.name}</Container></Card.Header>
-					{/* <Card.Meta>ID: {this.props.id}</Card.Meta> */}
-					<div className="ui divider"></div>
-					<Card.Description className="card-description">
-						{viewskill}
-					</Card.Description>
-					<Card.Description className="card-description">
-						<Container className="about" >Bio: {this.props.description}</Container>
-					</Card.Description>
-					<Card.Description>
-					<div className="ui divider"></div>
-							{button}
-							<JoinTeam {...this.props} showModal={this.state.showModal} closeModal={this.closeModal} />
-							<Link to={link}>
-								<Button
-									className={text}
-									content="View Team"
-								/>
-							</Link>
-					</Card.Description>
-				</Card.Content>
-			</Card>
-		);
-	};
-};
+  }
+  closeModal = () => {
+    console.log("close individual");
+    this.setState({ showModal: false });
+  };
+  render() {
+    // let contact;
+    // contact = <Popup
+    // trigger={<Button basic={true} color='blue' content='Join Team!' />}
+    // content="Team has been joined!"
+    // on='click'
+    // hideOnScroll
+    // />
+    var colors = ["violet", "yellow", "orange"];
+    var count = 0;
+    var skill;
+    // var viewskill;
+    let link = "/team/" + this.props.id;
+    var colors = ["#A0CCC9", "#EBABCA"];
+    var count = 0;
+    var viewskill = this.props.interests.map((skill) => (
+      <Label
+        size="mini"
+        className="labelStyle"
+        style={{
+          backgroundColor: colors[count++ % 2],
+        }}
+      >
+        {skill}
+      </Label>
+    ));
+    var button = this.props.team ? (
+      <Placeholder />
+    ) : (
+      <Button
+        className="contact"
+        content="Join Team"
+        onClick={() => this.setState({ showModal: true })}
+      />
+    );
+    var text = this.props.team ? "newTeam" : "teamUp";
+    return (
+      <Card className="card1" basic={false} color="blue" centered="true">
+        <Card.Content className="content">
+          <Card.Header>
+            <Container
+              style={{ overflow: "auto", maxHeight: 60, minHeight: 60 }}
+            >
+              {this.props.name}
+            </Container>
+          </Card.Header>
+          {/* <Card.Meta>ID: {this.props.id}</Card.Meta> */}
+          <div className="ui divider" />
+          <Card.Description className="card-description">
+            {viewskill}
+          </Card.Description>
+          <Card.Description className="card-description">
+            <Container className="about">
+              Bio: {this.props.description}
+            </Container>
+          </Card.Description>
+          <Card.Description>
+            <div className="ui divider" />
+            {button}
+            <JoinTeam
+              {...this.props}
+              showModal={this.state.showModal}
+              closeModal={this.closeModal}
+            />
+            <Link to={link}>
+              <Button className={text} content="View Team" />
+            </Link>
+          </Card.Description>
+        </Card.Content>
+      </Card>
+    );
+  }
+}
 
 export default TeamCard;

client/src/components/TeamInformation.js

@@ -1,18 +1,18 @@
 import React, { Component } from "react";
 import {
-    Card,
-    Form,
-    TextArea,
-    Button,
-    Label,
-    Icon,
-    Message
-} from 'semantic-ui-react'
-import './css/TeamInformation.css'
-import skills from '../constants/skills'
-import {commitMutation} from 'react-relay';
-import {graphql} from 'babel-plugin-relay/macro';
-import environment from './Environment';
+  Card,
+  Form,
+  TextArea,
+  Button,
+  Label,
+  Icon,
+  Message,
+} from "semantic-ui-react";
+import "./css/TeamInformation.css";
+import skills from "../constants/skills";
+import { commitMutation } from "react-relay";
+import { graphql } from "babel-plugin-relay/macro";
+import environment from "./Environment";
 
 const mutation = graphql`
   mutation TeamInformationMutation(
@@ -39,31 +39,30 @@ class TeamInformation extends Component {
   constructor(props) {
     super(props);
     console.log([...new Set([...skills, ...this.props.interests])]);
-  const skillUpdate = this.props.interests.map(interest => {
+    const skillUpdate = this.props.interests.map((interest) => {
       return {
-          "key": interest,
-          "text": interest,
-          "value": interest
-      }
-  })
-  this.state = {
-    teamBio: this.props.teamBio,
-    newTeamBio: this.props.teamBio,
-    projectIdea: this.props.projectIdea,
-    newProjectIdea: this.props.projectIdea,
-    active: false,
-    interests: this.props.interests,
-    newInterests: this.props.interests,
-    search: "",
-    interest_options: [...new Set([...skills, ...skillUpdate])],
-    save_message_hidden: true,
-    save_success: false,
-    edit: false,
-  };
-
-}
+        key: interest,
+        text: interest,
+        value: interest,
+      };
+    });
+    this.state = {
+      teamBio: this.props.teamBio,
+      newTeamBio: this.props.teamBio,
+      projectIdea: this.props.projectIdea,
+      newProjectIdea: this.props.projectIdea,
+      active: false,
+      interests: this.props.interests,
+      newInterests: this.props.interests,
+      search: "",
+      interest_options: [...new Set([...skills, ...skillUpdate])],
+      save_message_hidden: true,
+      save_success: false,
+      edit: false,
+    };
+  }
   render() {
-    console.log(this.state.interest_options)
+    console.log(this.state.interest_options);
     var colors = ["#A0CCC9", "#EBABCA"];
     var count = 0;
     var interestLabels = this.state.interests.map((interest) => (
@@ -77,7 +76,7 @@ class TeamInformation extends Component {
         {interest}
       </Label>
     ));
-    console.log(this.state.interests)
+    console.log(this.state.interests);
     if (this.props.editable) {
       if (!this.state.edit) {
         console.log(this.state.teamBio);
@@ -116,7 +115,9 @@ class TeamInformation extends Component {
                     disabled="disabled"
                   />
                 </Form>
-                <Card.Description className="interests">Interests</Card.Description>
+                <Card.Description className="interests">
+                  Interests
+                </Card.Description>
                 <Card.Description>{interestLabels}</Card.Description>
               </Card.Content>
             </Card>
@@ -280,7 +281,6 @@ class TeamInformation extends Component {
     this.onChange();
     this.setState({ newInterests: value });
   };
-
 }
 
 export default TeamInformation;