Production release 2.4.10

package.json

@@ -79,8 +79,9 @@
     "webpack-merge": "^4.1.1"
   },
   "dependencies": {
-    "appirio-tech-react-components": "git+https://github.com/appirio-tech/react-components.git#feature/filestack-v3",
+    "appirio-tech-react-components": "git+https://github.com/appirio-tech/react-components.git#feature/connectv2",
     "axios": "^0.13.1",
+    "brace": "^0.11.1",
     "classnames": "^2.2.3",
     "coffeescript": "^1.12.7",
     "draft-js": "^0.10.1",
@@ -100,6 +101,8 @@
     "history": "^1.17.0",
     "html5-uploader": "^0.1.1",
     "js-cookie": "^2.1.4",
+    "jsoneditor": "^5.28.2",
+    "jsoneditor-react": "^1.0.0",
     "linkify-it": "^2.0.3",
     "lodash": "^4.16.4",
     "mobile-detect": "^1.4.2",
@@ -119,7 +122,6 @@
     "react-dotdotdot": "^1.0.4",
     "react-gateway": "^3.0.0",
     "react-infinite-scroller": "^1.1.1",
-    "react-json-view": "^1.19.1",
     "react-layout-pane": "^0.1.16",
     "react-modal": "^1.9.7",
     "react-redux": "^4.4.5",
@@ -128,7 +130,7 @@
     "react-s-alert": "^1.1.4",
     "react-scroll": "^1.7.6",
     "react-scroll-lock-component": "^1.1.2",
-    "react-select": "^0.9.1",
+    "react-select": "^2.4.0",
     "react-stickynode": "^1.2.1",
     "react-text-truncate": "^0.8.3",
     "react-transition-group": "^2.5.0",

src/api/projectMemberInvites.js

@@ -23,7 +23,16 @@ export function updateProjectMemberInvite(projectId, member) {
  */
 export function createProjectMemberInvite(projectId, member) {
   const url = `${PROJECTS_API_URL}/v4/projects/${projectId}/members/invite/`
-  return axios.post(url, { param: member})
+  return axios({
+    method: 'post',
+    url,
+    data: {
+      param: member
+    },
+    validateStatus (status) {
+      return (status >= 200 && status < 300) || status === 403
+    },
+  })
     .then(resp => {
       return resp.data.result.content
     })

src/api/projects.js

@@ -56,6 +56,7 @@ export function getProjectById(projectId) {
       _.forEach(res.attachments, a => {
         a.downloadUrl = `/projects/${projectId}/attachments/${a.id}`
       })
+      if (!res.invites) res.invites = []
       return res
     })
 }

src/api/users.js

@@ -1,12 +1,13 @@
 import _ from 'lodash'
 import { axiosInstance as axios } from './requestInterceptor'
 import { TC_API_URL, RESET_PASSWORD_URL } from '../config/constants'
+import querystring from 'querystring'
 
 /**
  * Get a user based on it's handle/username
- * 
+ *
  * @param {String} handle user handle
- * 
+ *
  * @returns {Promise<Object>} user profile data
  */
 export function getUserProfile(handle) {
@@ -18,15 +19,19 @@ export function getUserProfile(handle) {
 
 /**
  * Update user profile
- * 
+ *
  * @param {String} handle         user handle
  * @param {Object} updatedProfile updated user data
- * 
+ * @param {Object} [queryParams]  optional query params
+ *
  * @returns {Promise<Object>} user profile data
  */
-export function updateUserProfile(handle, updatedProfile) {
-  return axios.put(`${TC_API_URL}/v3/members/${handle}/`, { 
-    param: updatedProfile 
+export function updateUserProfile(handle, updatedProfile, queryParams = {}) {
+  let query = querystring.stringify(queryParams)
+  query = query ? `?${query}` : ''
+
+  return axios.put(`${TC_API_URL}/v3/members/${handle}/${query}`, {
+    param: updatedProfile
   })
     .then(resp => {
       return _.get(resp.data, 'result.content', {})
@@ -35,9 +40,9 @@ export function updateUserProfile(handle, updatedProfile) {
 
 /**
  * Get member traits
- * 
+ *
  * @param {String} handle member handle
- * 
+ *
  * @returns {Promise<Array>} member traits
  */
 export const getMemberTraits = (handle) => {
@@ -47,10 +52,10 @@ export const getMemberTraits = (handle) => {
 
 /**
  * Update member traits
- * 
+ *
  * @param {String} handle        member handle
  * @param {Array}  updatedTraits list of updated traits
- * 
+ *
  * @returns {Promise<Array>} member traits
  */
 export const updateMemberTraits = (handle, updatedTraits) => {
@@ -62,10 +67,10 @@ export const updateMemberTraits = (handle, updatedTraits) => {
 
 /**
  * Create member traits
- * 
+ *
  * @param {String} handle member handle
  * @param {Array}  traits list of traits to create
- * 
+ *
  * @returns {Promise<Array>} member traits
  */
 export const createMemberTraits = (handle, traits) => {
@@ -77,12 +82,12 @@ export const createMemberTraits = (handle, traits) => {
 
 /**
  * Update member photo
- * 
+ *
  * @param {String} handle           member handle
  * @param {Object} data             params to update photo
  * @param {String} data.contentType photo file content type
  * @param {String} data.token       token provided by pre signed URL
- * 
+ *
  * @returns {Promise<String>}       photo URL
  */
 export const updateMemberPhoto = (handle, data) => {
@@ -94,26 +99,26 @@ export const updateMemberPhoto = (handle, data) => {
 
 /**
  * Get pre-signed URL for member photo
- * 
+ *
  * @param {String} handle member handle
  * @param {File}   file   file to upload
- * 
- * @returns {Promise<Object>} data of pre-signed URL 
+ *
+ * @returns {Promise<Object>} data of pre-signed URL
  */
 export const getPreSignedUrl = (handle, file) => {
-  return axios.post(`${TC_API_URL}/v3/members/${handle}/photoUploadUrl`, { 
-    param: { 
-      contentType: file.type 
-    } 
+  return axios.post(`${TC_API_URL}/v3/members/${handle}/photoUploadUrl`, {
+    param: {
+      contentType: file.type
+    }
   })
     .then(resp => _.get(resp.data, 'result.content', {}))
 }
 
 /**
  * Check if email is available to be used for a user
- * 
+ *
  * @param {String} email email to validate
- * 
+ *
  * @returns {Promise<Object>} response body
  */
 export const checkEmailValidity = (email) => {
@@ -123,24 +128,24 @@ export const checkEmailValidity = (email) => {
 
 /**
  * Update user password
- * 
+ *
  * @param {Number} userId     user id
  * @param {Object} credential user credentials old and new one
- * 
+ *
  * @returns {Promise<Object>} response body
  */
 export const updatePassword = (userId, credential) => {
-  return axios.patch(`${TC_API_URL}/v3/users/${userId}`, { 
-    param: { credential } 
+  return axios.patch(`${TC_API_URL}/v3/users/${userId}`, {
+    param: { credential }
   })
     .then(resp => _.get(resp.data, 'result.content', {}))
 }
 
 /**
  * Send reset password email to the user
- * 
+ *
  * @param {String} email user email
- * 
+ *
  * @returns {Promise<Object>} response body
  */
 export const resetPassword = (email) => {

src/components/ActionCard/AddComment.jsx

@@ -25,7 +25,7 @@ export default class AddComment extends React.Component {
   }
 
   render() {
-    const { className, avatarUrl, authorName, placeholder, isAdding, hasError, allMembers } = this.props
+    const { className, avatarUrl, authorName, placeholder, isAdding, hasError, allMembers, projectMembers } = this.props
 
     return (
       <RichTextArea ref="richTextArea"
@@ -39,6 +39,7 @@ export default class AddComment extends React.Component {
         avatarUrl={avatarUrl}
         authorName={authorName}
         allMembers={allMembers}
+        projectMembers={projectMembers}
       />
     )
   }
@@ -54,5 +55,6 @@ AddComment.propTypes = {
   placeholder: PropTypes.string,
   hasError: PropTypes.bool,
   isAdding: PropTypes.bool,
-  allMembers: PropTypes.object
+  allMembers: PropTypes.object,
+  projectMembers: PropTypes.object
 }

src/components/ActionCard/Comment.jsx

@@ -58,7 +58,7 @@ class Comment extends React.Component {
   }
 
   render() {
-    const {message, author, date, edited, children, noInfo, self, isSaving, hasError, readonly, allMembers, canDelete} = this.props
+    const {message, author, date, edited, children, noInfo, self, isSaving, hasError, readonly, allMembers, canDelete, projectMembers} = this.props
     const messageAnchor = `comment-${message.id}`
     const messageLink = window.location.pathname.substr(0, window.location.pathname.indexOf('#')) + `#${messageAnchor}`
     const authorName = author ? (author.firstName + ' ' + author.lastName) : 'Connect user'
@@ -84,6 +84,7 @@ class Comment extends React.Component {
             authorName={authorName}
             cancelEdit={this.cancelEdit}
             allMembers={allMembers}
+            projectMembers={projectMembers}
             editingTopic = {false}
           />
         </div>
@@ -194,7 +195,7 @@ Comment.propTypes = {
    */
   readonly: PropTypes.bool,
   allMembers: PropTypes.object.isRequired,
-
+  projectMembers: PropTypes.object,
   /**
    * If true only comment text is shown without additional info
    */

src/components/Feed/Feed.jsx

@@ -86,7 +86,7 @@ class Feed extends React.Component {
       id, user, currentUser, topicMessage, totalComments, hasMoreComments, onLoadMoreComments, isLoadingComments,
       allowComments, comments, children, onNewCommentChange, onAddNewComment, isAddingComment, onSaveMessageChange,
       onEditMessage, onSaveMessage, isSavingTopic, onDeleteMessage, onDeleteTopic, isDeletingTopic, error, allMembers,
-      onEnterFullscreenClick, onExitFullscreenClick, isFullScreen, commentId
+      onEnterFullscreenClick, onExitFullscreenClick, isFullScreen, commentId, projectMembers
     } = this.props
     const { editTopicMode, headerHeight } = this.state
     let authorName = user ? user.firstName : 'Unknown'
@@ -177,6 +177,7 @@ class Feed extends React.Component {
           onSaveMessage={onSaveMessage}
           onDeleteMessage={onDeleteMessage}
           allMembers={allMembers}
+          projectMembers={projectMembers}
           isFullScreen={isFullScreen}
           headerHeight={headerHeight}
           commentId={commentId}

src/components/Feed/FeedComments.jsx

@@ -179,7 +179,7 @@ class FeedComments extends React.Component {
     const {
       comments, currentUser, onLoadMoreComments, isLoadingComments, hasMoreComments, onAddNewComment,
       onNewCommentChange, error, avatarUrl, isAddingComment, allowComments, onSaveMessage, onDeleteMessage, allMembers,
-      totalComments, isFullScreen, headerHeight
+      totalComments, isFullScreen, headerHeight, projectMembers
     } = this.props
     const { isNewCommentMobileOpen, stickyRowNext, stickyRowPrev } = this.state
     let authorName = currentUser.firstName
@@ -319,6 +319,7 @@ class FeedComments extends React.Component {
           isSaving={item.isSavingComment}
           hasError={item.error}
           allMembers={allMembers}
+          projectMembers={projectMembers}
           noInfo={item.noInfo}
           canDelete={idx !== 0}
         >
@@ -389,6 +390,7 @@ class FeedComments extends React.Component {
                     isAdding={isAddingComment}
                     hasError={error}
                     allMembers={allMembers}
+                    projectMembers={projectMembers}
                   />
                 </div>
               }

src/components/Feed/NewPost.jsx

@@ -13,7 +13,7 @@ class NewPost extends React.Component {
   }
 
   render() {
-    const {currentUser, allMembers, titlePlaceholder, contentPlaceholder, isCreating, hasError, expandedTitlePlaceholder} = this.props
+    const {currentUser, allMembers, titlePlaceholder, contentPlaceholder, isCreating, hasError, expandedTitlePlaceholder, projectMembers} = this.props
     let authorName = currentUser.firstName
     if (authorName && currentUser.lastName) {
       authorName += ' ' + currentUser.lastName
@@ -38,6 +38,7 @@ class NewPost extends React.Component {
         avatarUrl={currentUser.photoURL}
         authorName={authorName}
         allMembers={allMembers}
+        projectMembers={projectMembers}
       />
     )
   }
@@ -48,6 +49,7 @@ NewPost.propTypes = {
   expandedTitlePlaceholder: PropTypes.string,
   currentUser: PropTypes.object.isRequired,
   allMembers: PropTypes.object.isRequired,
+  projectMembers: PropTypes.object,
   onPost: PropTypes.func.isRequired,
   onNewPostChange: PropTypes.func.isRequired,
   hasError: PropTypes.bool,

src/components/FileList/AddFilePermissions.jsx

@@ -4,11 +4,12 @@ import Modal from 'react-modal'
 import { mapKeys, get } from 'lodash'
 
 import UserAutoComplete from '../UserAutoComplete/UserAutoComplete'
+import LoadingIndicator from '../LoadingIndicator/LoadingIndicator'
 
 import './AddFilePermissions.scss'
 import XMarkIcon from  '../../assets/icons/icon-x-mark.svg'
 
-const AddFilePermission = ({ onCancel, onSubmit, onChange, selectedUsers, projectMembers, loggedInUser }) => {
+const AddFilePermission = ({ onCancel, onSubmit, onChange, selectedUsers, projectMembers, loggedInUser, isSharingAttachment }) => {
   selectedUsers = selectedUsers || ''
   const mapHandlesToUserIds = handles => {
     const projectMembersByHandle = mapKeys(projectMembers, value => value.handle)
@@ -28,10 +29,18 @@ const AddFilePermission = ({ onCancel, onSubmit, onChange, selectedUsers, projec
           <span onClick={onCancel}><XMarkIcon /></span>
         </div>
 
+        <div styleName="loading-indicator-wrapper">
+          { isSharingAttachment && <LoadingIndicator isSmall /> }
+        </div>
+
         {/* Share with all members */}
         <div className="dialog-body">
           <div styleName="btn-all-members">
-            <button className="tc-btn tc-btn-primary tc-btn-md" onClick={() => onSubmit(null)}>All project members</button>
+            <button
+              className="tc-btn tc-btn-primary tc-btn-md"
+              onClick={() => onSubmit(null)}
+              disabled={isSharingAttachment}
+            >All project members</button>
           </div>
         </div>
 
@@ -41,10 +50,10 @@ const AddFilePermission = ({ onCancel, onSubmit, onChange, selectedUsers, projec
 
           <UserAutoComplete projectMembers={projectMembers} selectedUsers={selectedUsers} onUpdate={onChange} loggedInUser={loggedInUser} />
 
-          <div>
+          <div styleName="btn-selected-members">
             <button className="tc-btn tc-btn-primary tc-btn-md" 
               onClick={() => onSubmit(mapHandlesToUserIds(selectedUsers.split(',')))}
-              disabled={!selectedUsers || selectedUsers.length === 0 }
+              disabled={!selectedUsers || selectedUsers.length === 0 || isSharingAttachment }
             >Share with selected members</button>
           </div>
         </div>
@@ -59,7 +68,8 @@ AddFilePermission.propTypes = {
   onChange: PropTypes.func.isRequired, 
   selectedUsers: PropTypes.string, 
   projectMembers: PropTypes.object, 
-  loggedInUser: PropTypes.object.isRequired
+  loggedInUser: PropTypes.object.isRequired,
+  isSharingAttachment: PropTypes.bool.isRequired,
 }
 
 export default AddFilePermission