fix #1233 add your first repo from meeting

src/server/graphql/models/Team/createFirstTeam/addSeedProjects.js

@@ -1,46 +1,38 @@
 import shortid from 'shortid';
 import getRethink from '../../../../database/rethinkDriver';
 import {ACTIVE, FUTURE} from '../../../../../universal/utils/constants';
-import {ContentState, convertToRaw} from 'draft-js';
+import convertToProjectContent from 'universal/utils/draftjs/convertToProjectContent';
 
-const removeSpaces = (str) => str.split(/\s/).filter((s) => s.length).join(' ');
-
-const convertToRawDraftJSON = (spacedText) => {
-  const text = removeSpaces(spacedText);
-  const contentState = ContentState.createFromText(text);
-  const raw = convertToRaw(contentState);
-  return JSON.stringify(raw);
-};
 
 const SEED_PROJECTS = [
   {
     status: ACTIVE,
     sortOrder: 0,
-    content: convertToRawDraftJSON(`
+    content: convertToProjectContent(`
       Invite any missing team members to join the team. Tap on ‘Team Settings’
       in the dashboard header above.
     `)
   },
   {
     status: ACTIVE,
     sortOrder: 1,
-    content: convertToRawDraftJSON(`
+    content: convertToProjectContent(`
       Try a test run of an Action Meeting. Tap on ‘Meeting Lobby’ in
-      the dashboard header above.
+      the dashboard header above. #private
     `)
   },
   {
     status: FUTURE,
     sortOrder: 0,
-    content: convertToRawDraftJSON(`
+    content: convertToProjectContent(`
       Make good teaming a habit! Schedule a weekly Action Meeting with your
       team. Pro-tip: include a link to the meeting lobby.
     `)
   },
   {
     status: FUTURE,
     sortOrder: 1,
-    content: convertToRawDraftJSON(`
+    content: convertToProjectContent(`
       Add integrations (like Slack, GitHub…) for your team.
       See the Integrations tab under Team Settings
     `)

src/universal/components/EditorLinkViewer/EditorLinkViewer.js

@@ -111,8 +111,8 @@ const styleThunk = (theme, props) => ({
     fontSize: appTheme.typography.s5,
     padding: '0 .25rem',
     position: 'absolute',
-    zIndex: ui.ziMenu,
-    //zIndex: 1
+    zIndex: ui.ziMenu
+    // zIndex: 1
   },
 
   closing: {

src/universal/components/OutcomeOrNullCard/OutcomeOrNullCard.js

@@ -8,6 +8,7 @@ export default class OutcomeOrNullCard extends Component {
   static propTypes = {
     area: PropTypes.string,
     hasDragStyles: PropTypes.bool,
+    handleAddProject: PropTypes.func,
     isAgenda: PropTypes.bool,
     isDragging: PropTypes.bool,
     myUserId: PropTypes.string,
@@ -34,14 +35,15 @@ export default class OutcomeOrNullCard extends Component {
   }
 
   render() {
-    const {area, hasDragStyles, isAgenda, myUserId, outcome, isDragging} = this.props;
+    const {area, handleAddProject, hasDragStyles, isAgenda, myUserId, outcome, isDragging} = this.props;
     const {contentState} = this.state;
     const {createdBy, teamMember: {preferredName}} = outcome;
     const showOutcome = contentState.hasText() || createdBy === myUserId;
     return showOutcome ?
       <OutcomeCardContainer
         area={area}
         contentState={contentState}
+        handleAddProject={handleAddProject}
         hasDragStyles={hasDragStyles}
         isDragging={isDragging}
         isAgenda={isAgenda}

src/universal/containers/GitHubReposMenuRoot/GitHubReposMenuRoot.js

@@ -40,7 +40,18 @@ const subscriptions = [
 
 const cacheConfig = {ttl: DEFAULT_TTL};
 
-const GitHubReposMenuRoot = ({atmosphere, projectId, setError, clearError, closePortal, setCoords, maxWidth}) => {
+const GitHubReposMenuRoot = (rootProps) => {
+  const {
+    area,
+    atmosphere,
+    handleAddProject,
+    projectId,
+    setError,
+    clearError,
+    closePortal,
+    setCoords,
+    maxWidth
+  } = rootProps;
   const [teamId] = projectId.split('::');
   return (
     <QueryRenderer
@@ -55,6 +66,8 @@ const GitHubReposMenuRoot = ({atmosphere, projectId, setError, clearError, close
             {error && <ErrorComponent height={'14rem'} width={maxWidth} error={error} />}
             {props && <AnimatedFade key="1" onEnter={setCoords}>
               <GitHubRepoListMenu
+                area={area}
+                handleAddProject={handleAddProject}
                 viewer={props.viewer}
                 teamId={teamId}
                 projectId={projectId}
@@ -77,7 +90,9 @@ const GitHubReposMenuRoot = ({atmosphere, projectId, setError, clearError, close
 };
 
 GitHubReposMenuRoot.propTypes = {
+  area: PropTypes.string,
   atmosphere: PropTypes.object.isRequired,
+  handleAddProject: PropTypes.func,
   maxWidth: PropTypes.number.isRequired,
   projectId: PropTypes.string.isRequired,
   viewer: PropTypes.object,

src/universal/modules/meeting/components/MeetingAgendaCards/MeetingAgendaCards.js

@@ -6,14 +6,15 @@ import ui from 'universal/styles/ui';
 import {cashay} from 'cashay';
 import shortid from 'shortid';
 import CreateCard from 'universal/components/CreateCard/CreateCard';
-import {ACTIVE} from 'universal/utils/constants';
+import {ACTIVE, MEETING} from 'universal/utils/constants';
 import withHotkey from 'react-hotkey-hoc';
 import OutcomeOrNullCard from 'universal/components/OutcomeOrNullCard/OutcomeOrNullCard';
 
-const handleAddProjectFactory = (teamMemberId, agendaId) => () => {
+const handleAddProjectFactory = (teamMemberId, agendaId) => (content) => () => {
   const [, teamId] = teamMemberId.split('::');
   const newProject = {
     id: `${teamId}::${shortid.generate()}`,
+    content,
     status: ACTIVE,
     teamMemberId,
     sortOrder: 0,
@@ -22,14 +23,20 @@ const handleAddProjectFactory = (teamMemberId, agendaId) => () => {
   cashay.mutate('createProject', {variables: {newProject}});
 };
 
-const makeCards = (array, dispatch, myTeamMemberId, itemStyle) => {
+const makeCards = (array, dispatch, myTeamMemberId, itemStyle, handleAddProject) => {
   return array.map((outcome) => {
     const {id} = outcome;
     const key = `$outcomeCard${id}`;
     const [myUserId] = myTeamMemberId.split('::');
     return (
       <div className={css(itemStyle)} key={key}>
-        <OutcomeOrNullCard isAgenda myUserId={myUserId} outcome={outcome} />
+        <OutcomeOrNullCard
+          area={MEETING}
+          handleAddProject={handleAddProject}
+          isAgenda
+          myUserId={myUserId}
+          outcome={outcome}
+        />
       </div>
     );
   });
@@ -52,17 +59,18 @@ const makePlaceholders = (length, itemStyle) => {
 const MeetingAgendaCards = (props) => {
   const {agendaId, bindHotkey, dispatch, myTeamMemberId, outcomes, styles} = props;
   const handleAddProject = handleAddProjectFactory(myTeamMemberId, agendaId);
+  const addBlankProject = handleAddProject();
   bindHotkey('p', handleAddProject);
   return (
     <div className={css(styles.root)}>
       {/* Get Cards */}
       {outcomes.length !== 0 &&
-      makeCards(outcomes, dispatch, myTeamMemberId, styles.item)
+      makeCards(outcomes, dispatch, myTeamMemberId, styles.item, handleAddProject)
       }
       {/* Input Card */}
       <div className={css(styles.item)}>
         <CreateCard
-          handleAddProject={handleAddProject}
+          handleAddProject={addBlankProject}
           hasControls
         />
       </div>

src/universal/modules/outcomeCard/components/GitHubRepoListMenu/GitHubRepoListMenu.js

@@ -1,13 +1,17 @@
+import PropTypes from 'prop-types';
 import React, {Component} from 'react';
 import {createFragmentContainer} from 'react-relay';
 import {withRouter} from 'react-router-dom';
 import MenuItem from 'universal/modules/menu/components/MenuItem/MenuItem';
 import CreateGitHubIssueMutation from 'universal/mutations/CreateGitHubIssueMutation';
+import {MEETING} from 'universal/utils/constants';
+import convertToProjectContent from 'universal/utils/draftjs/convertToProjectContent';
 import fromGlobalId from 'universal/utils/relay/fromGlobalId';
-import PropTypes from 'prop-types';
 
 class GitHubRepoListMenu extends Component {
   static propTypes = {
+    area: PropTypes.string.isRequired,
+    handleAddProject: PropTypes.func,
     viewer: PropTypes.object.isRequired,
     relay: PropTypes.object.isRequired,
     history: PropTypes.object.isRequired,
@@ -39,13 +43,18 @@ class GitHubRepoListMenu extends Component {
   }
 
   render() {
-    const {relay: {environment}, history, closePortal, projectId, setError, clearError, teamId} = this.props;
+    const {area, handleAddProject, relay: {environment}, history, closePortal, projectId, setError, clearError, teamId} = this.props;
     if (this.filteredRepos.length === 0) {
+      const inMeeting = area === MEETING;
+      const handleClick = inMeeting ?
+        handleAddProject(convertToProjectContent('#private Connect my GitHub account in Team Settings after the meeting')) :
+        () => history.push(`/team/${teamId}/settings/integrations/github`);
+      const label = inMeeting ? 'No repos! Remind me to set up GitHub' : 'Add your first GitHub repo';
       return (
         <div>
           <MenuItem
-            label="Add your first GitHub Repo"
-            onClick={() => history.push(`/team/${teamId}/settings/integrations/github`)}
+            label={label}
+            onClick={handleClick}
             closePortal={closePortal}
           />
         </div>

src/universal/modules/outcomeCard/components/OutcomeCard/OutcomeCard.js

@@ -11,7 +11,7 @@ import appTheme from 'universal/styles/theme/appTheme';
 import labels from 'universal/styles/theme/labels';
 import ui from 'universal/styles/ui';
 import withStyles from 'universal/styles/withStyles';
-import {ACTIVE, DONE, FUTURE, STUCK, USER_DASH} from 'universal/utils/constants';
+import {ACTIVE, DONE, FUTURE, STUCK} from 'universal/utils/constants';
 import isProjectArchived from 'universal/utils/isProjectArchived';
 import isProjectPrivate from 'universal/utils/isProjectPrivate';
 
@@ -25,6 +25,7 @@ const OutcomeCard = (props) => {
     isAgenda,
     isDragging,
     isEditing,
+    handleAddProject,
     hasDragStyles,
     outcome,
     setEditorRef,
@@ -69,13 +70,14 @@ const OutcomeCard = (props) => {
         />
         <ProjectIntegrationLink integration={integration} />
         <OutcomeCardFooter
+          area={area}
           cardHasHover={cardHasHover}
           cardHasFocus={cardHasFocus}
           editorState={editorState}
+          handleAddProject={handleAddProject}
           isAgenda={isAgenda}
           isPrivate={isPrivate}
           outcome={outcome}
-          showTeam={area === USER_DASH}
           teamMembers={teamMembers}
           toggleMenuState={toggleMenuState}
         />
@@ -91,6 +93,7 @@ OutcomeCard.propTypes = {
   cardHasHover: PropTypes.bool,
   cardHasFocus: PropTypes.bool,
   cardHasIntegration: PropTypes.bool,
+  handleAddProject: PropTypes.func,
   hasDragStyles: PropTypes.bool,
   isAgenda: PropTypes.bool,
   isDragging: PropTypes.bool,

src/universal/modules/outcomeCard/components/OutcomeCardFooter/OutcomeCardFooter.js

@@ -11,6 +11,7 @@ import removeAllRangesForEntity from 'universal/utils/draftjs/removeAllRangesFor
 import isProjectArchived from 'universal/utils/isProjectArchived';
 import {clearError, setError} from 'universal/utils/relay/mutationCallbacks';
 import OutcomeCardFooterButton from '../OutcomeCardFooterButton/OutcomeCardFooterButton';
+import {USER_DASH} from 'universal/utils/constants';
 
 const fetchGitHubRepos = () => System.import('universal/containers/GitHubReposMenuRoot/GitHubReposMenuRoot');
 const fetchStatusMenu = () => System.import('universal/modules/outcomeCard/components/OutcomeCardStatusMenu/OutcomeCardStatusMenu');
@@ -66,17 +67,19 @@ class OutcomeCardFooter extends Component {
 
   render() {
     const {
+      area,
       cardHasFocus,
       cardHasHover,
       editorState,
+      handleAddProject,
       isAgenda,
       isPrivate,
       outcome,
-      showTeam,
       styles,
       teamMembers,
       toggleMenuState
     } = this.props;
+    const showTeam = area === USER_DASH;
     const {teamMember: owner, integration, team: {name: teamName}} = outcome;
     const {service} = integration || {};
     const isArchived = isProjectArchived(outcome.tags);
@@ -140,6 +143,8 @@ class OutcomeCardFooter extends Component {
                   maxHeight={225}
                   originAnchor={originAnchor}
                   queryVars={{
+                    area,
+                    handleAddProject,
                     projectId: outcome.id,
                     setError: this.setError,
                     clearError: this.clearError
@@ -181,9 +186,11 @@ class OutcomeCardFooter extends Component {
 }
 
 OutcomeCardFooter.propTypes = {
+  area: PropTypes.string.isRequired,
   cardHasFocus: PropTypes.bool,
   cardHasHover: PropTypes.bool,
   editorState: PropTypes.object,
+  handleAddProject: PropTypes.func,
   isAgenda: PropTypes.bool,
   isArchived: PropTypes.bool,
   isPrivate: PropTypes.bool,

src/universal/modules/outcomeCard/containers/OutcomeCard/OutcomeCardContainer.js

@@ -134,7 +134,7 @@ class OutcomeCardContainer extends Component {
 
   render() {
     const {cardHasFocus, cardHasHover, isEditing, editorRef, editorState} = this.state;
-    const {area, hasDragStyles, isAgenda, outcome, teamMembers, isDragging} = this.props;
+    const {area, handleAddProject, hasDragStyles, isAgenda, outcome, teamMembers, isDragging} = this.props;
     return (
       <div
         tabIndex={-1}
@@ -153,6 +153,7 @@ class OutcomeCardContainer extends Component {
           editorState={editorState}
           cardHasHover={cardHasHover}
           cardHasFocus={cardHasFocus}
+          handleAddProject={handleAddProject}
           hasDragStyles={hasDragStyles}
           isAgenda={isAgenda}
           isDragging={isDragging}
@@ -171,6 +172,7 @@ class OutcomeCardContainer extends Component {
 OutcomeCardContainer.propTypes = {
   area: PropTypes.string,
   contentState: PropTypes.object.isRequired,
+  handleAddProject: PropTypes.func,
   outcome: PropTypes.shape({
     id: PropTypes.string,
     content: PropTypes.string,