Enable multiple FBs

client/package.json

@@ -19,10 +19,10 @@
   "license": "READ LICENSE.MD",
   "devDependencies": {
     "@babel/cli": "^7.1.2",
-    "@babel/core": "^7.1.2",
-    "@babel/plugin-proposal-class-properties": "^7.1.0",
+    "@babel/core": "^7.4.0",
+    "@babel/plugin-proposal-class-properties": "^7.4.0",
     "@babel/plugin-syntax-dynamic-import": "^7.0.0",
-    "@babel/preset-env": "^7.1.0",
+    "@babel/preset-env": "^7.4.2",
     "@babel/preset-react": "^7.0.0",
     "autoprefixer": "^8.6.5",
     "babel-core": "^7.0.0-bridge.0",
@@ -34,7 +34,7 @@
     "babel-plugin-transform-react-jsx": "^6.24.1",
     "connect-history-api-fallback": "^1.5.0",
     "css-loader": "^0.28.11",
-    "eslint": "^5.6.1",
+    "eslint": "^5.15.3",
     "eslint-config-prettier": "^3.1.0",
     "eslint-config-standard": "^12.0.0",
     "eslint-config-standard-react": "^7.0.2",
@@ -49,7 +49,7 @@
     "html-webpack-plugin": "^3.2.0",
     "koa-connect": "^2.0.1",
     "mini-css-extract-plugin": "^0.4.4",
-    "node-sass": "^4.9.3",
+    "node-sass": "^4.11.0",
     "optimize-css-assets-webpack-plugin": "^4.0.3",
     "postcss-loader": "^2.1.6",
     "prettier": "^1.14.3",
@@ -90,9 +90,9 @@
     "minilog": "^3.1.0",
     "prop-types": "^15.6.2",
     "query-string": "^6.2.0",
-    "react": "^16.6.1",
+    "react": "^16.8.4",
     "react-apollo": "^2.2.4",
-    "react-dom": "^16.6.1",
+    "react-dom": "^16.8.4",
     "react-router-dom": "^4.3.1",
     "recompose": "^0.30.0",
     "subscriptions-transport-ws": "^0.9.15"

client/src/views/manage-teams/components/ManageTeamProfileFBView.js

@@ -40,32 +40,34 @@ const styles = theme => ({
 export const ManageTeamProvileFBView = ({ classes, team }) => {
   log.debug('ManageTeamProvileFBView', team, team.fb[0], team.fb[0].avatar)
 
-  let avatar = (team.fb[0].avatar !== undefined && team.fb[0].avatar !== null) ? team.fb[0].avatar : process.env.STORAGE_URL + '/module-teams/module-default/aa-avatar-default.png'
-
-  return (
-    <Grid item xs={12} className={classes.fbContainer}>
-      <Card className={classes.card}>
-        <div className={classes.cardDetails}>
-          <CardMedia
-            className={classes.cardMedia}
-            image={avatar}
-            title={team.name}
-          />
-          <CardContent className={classes.cardContent}>
-            <Typography gutterBottom variant='h5' component='h2'>
-              {team.fb[0].name}
-            </Typography>
-            <Typography variant='caption' color='textSecondary'>
-              {team.fb[0].kind}
-            </Typography>
-          </CardContent>
-          <CardActions>
-            <ManageTeamProfileFBEdit slug={team.slug} fb={team.fb[0]} />
-          </CardActions>
-        </div>
-      </Card>
-    </Grid>
-  )
+  let fbs = team.fb;
+  return fbs.map((fb, index) => {
+    let avatar = (fb.avatar !== undefined && fb.avatar !== null) ? fb.avatar : process.env.STORAGE_URL + '/module-teams/module-default/aa-avatar-default.png'
+    return (
+      <Grid item xs={12} className={classes.fbContainer} key={`fb-${index}`}>
+        <Card className={classes.card}>
+          <div className={classes.cardDetails}>
+            <CardMedia
+              className={classes.cardMedia}
+              image={avatar}
+              title={fb.name}
+            />
+            <CardContent className={classes.cardContent}>
+              <Typography gutterBottom variant='h5' component='h2'>
+                {fb.name}
+              </Typography>
+              <Typography variant='caption' color='textSecondary'>
+                {fb.kind}
+              </Typography>
+            </CardContent>
+            <CardActions>
+              <ManageTeamProfileFBEdit slug={team.slug} fb={fb} />
+            </CardActions>
+          </div>
+        </Card>
+      </Grid>
+    )
+  })
 }
 
 ManageTeamProvileFBView.propTypes = {