CF19

src/components/AssetsLibrary/FilesGridView.jsx

@@ -10,6 +10,7 @@ import DeleteFileLinkModal from '../LinksMenu/DeleteFileLinkModal'
 import EditFileAttachment from '../LinksMenu/EditFileAttachment'
 import SubFolder from './SubFolder'
 import ItemOperations from './ItemOperations'
+import UserTooltip from '../User/UserTooltip'
 
 import FolderIcon from '../../assets/icons/v.2.5/icon-folder-small.svg'
 
@@ -28,6 +29,7 @@ const FilesGridView = ({
   title,
   selectedUsers,
   onAddAttachment,
+  assetsMembers,
   isSharingAttachment,
   discardAttachments,
   onChangePermissions,
@@ -78,6 +80,7 @@ const FilesGridView = ({
           link={ subFolderContent }
           renderLink={ renderLink }
           goBack={goBack}
+          assetsMembers={assetsMembers}
           onDeletePostAttachment={onDeletePostAttachment}
           loggedInUser={loggedInUser}
           formatModifyDate={formatModifyDate}
@@ -99,6 +102,7 @@ const FilesGridView = ({
             <li styleName="assets-gridview-header" key="assets-gridview-header">
               <div styleName="flex-item-title item-type">Type</div>
               <div styleName="flex-item-title item-name">Name</div>
+              <div styleName="flex-item-title item-created-by">Created By</div>
               <div styleName="flex-item-title item-modified">Modified</div>
               <div styleName="flex-item-title item-action"/>
             </li>
@@ -119,12 +123,22 @@ const FilesGridView = ({
               const canEdit = `${link.createdBy}` === `${loggedInUser.userId}`
 
               const changeSubFolder = () => onChangeSubFolder(link)
+              const owner = _.find(assetsMembers, m => m.userId === _.parseInt(link.createdBy))
 
               if (Array.isArray(link.children) && link.children.length > 0) {
                 return (
                   <li styleName="assets-gridview-row" onClick={changeSubFolder} key={'assets-gridview-folder-' + idx}>
                     <div styleName="flex-item item-type"><FolderIcon /></div>
                     <div styleName="flex-item item-name hand"><p>{formatFolderTitle(link.title)}</p></div>
+                    <div styleName="flex-item item-created-by">
+                      {!owner && (<div className="user-block txt-italic">Unknown</div>)}
+                      {owner && (
+                        <div className="spacing">
+                          <div className="user-block">
+                            <UserTooltip usr={owner} id={idx} size={35} />
+                          </div>
+                        </div>)}
+                    </div>
                     <div styleName="flex-item item-modified">{formatModifyDate(link)}</div>
                     <div styleName="flex-item item-action"/>
                   </li>)
@@ -161,6 +175,15 @@ const FilesGridView = ({
                       <img width={42} height={42} src={iconPath} />
                     </div>
                     <div styleName="flex-item item-name"><p>{renderLink(link)}</p></div>
+                    <div styleName="flex-item item-created-by">
+                      {!owner && (<div className="user-block txt-italic">Unknown</div>)}
+                      {owner && (
+                        <div className="spacing">
+                          <div className="user-block">
+                            <UserTooltip usr={owner} id={idx} size={35} />
+                          </div>
+                        </div>)}
+                    </div>
                     <div styleName="flex-item item-modified">{formatModifyDate(link)}</div>
                     <div styleName="flex-item item-action">
                       {canEdit && (

src/components/AssetsLibrary/GridView.scss

@@ -85,7 +85,7 @@
   }
 }
 
-.item-modified {
+.item-modified, .item-created-by {
   -webkit-box-flex: 0;
   -ms-flex: none;
   flex: none;
@@ -134,4 +134,11 @@
 
 .assets-gridview-container-active {
   position: relative;
+}
+
+:global {
+  .user-block .tooltip-container {
+    text-align: left;
+    line-height: 20px;
+  }
 }

src/components/AssetsLibrary/LinksGridView.jsx

@@ -8,6 +8,7 @@ import DeleteLinkModal from '../LinksMenu/DeleteLinkModal'
 import EditLinkModal from '../LinksMenu/EditLinkModal'
 import SubFolder from './SubFolder'
 import ItemOperations from './ItemOperations'
+import UserTooltip from '../User/UserTooltip'
 
 import FolderIcon from '../../assets/icons/v.2.5/icon-folder-small.svg'
 import LinkIcon from '../../assets/icons/link-12.svg'
@@ -28,6 +29,7 @@ const LinksGridView = ({
   title,
   formatModifyDate,
   formatFolderTitle,
+  assetsMembers,
 }) => {
   const renderLink = (link) => {
     if (link.onClick) {
@@ -58,8 +60,9 @@ const LinksGridView = ({
           link={ subFolderContent }
           renderLink={ renderLink }
           goBack={goBack}
-          formatModifyDate={formatModifyDate}
+          assetsMembers={assetsMembers}
           isLinkSubFolder
+          formatModifyDate={formatModifyDate}
         />)}
       {(!subFolderContent) && (
         <div styleName={cn({'assets-gridview-container-active': (linkToEdit >= 0  || linkToDelete >= 0)}, '')}>
@@ -69,6 +72,7 @@ const LinksGridView = ({
             <li styleName="assets-gridview-header" key="assets-gridview-header">
               <div styleName="flex-item-title item-type">Type</div>
               <div styleName="flex-item-title item-name">Name</div>
+              <div styleName="flex-item-title item-created-by">Created By</div>
               <div styleName="flex-item-title item-modified">Modified</div>
               <div styleName="flex-item-title item-action"/>
             </li>
@@ -87,12 +91,24 @@ const LinksGridView = ({
               const onEditCancel = () => onEditIntent(-1)
               const handleEditClick = () => onEditIntent(idx)
               const changeSubFolder = () => onChangeSubFolder(link)
+              const owner = _.find(assetsMembers, m => m.userId === _.parseInt(link.createdBy))
 
               if (Array.isArray(link.children) && link.children.length > 0) {
                 return (
                   <li styleName="assets-gridview-row" onClick={changeSubFolder} key={'assets-gridview-folder-' + idx}>
                     <div styleName="flex-item item-type"><FolderIcon /></div>
                     <div styleName="flex-item item-name hand"><p>{formatFolderTitle(link.title)}</p></div>
+                    <div styleName="flex-item item-created-by">
+                      {!owner && !link.createdBy && (<div className="user-block">—</div>)}
+                      {!owner && link.createdBy !== 'CoderBot' && (<div className="user-block txt-italic">Unknown</div>)}
+                      {!owner && link.createdBy === 'CoderBot' && (<div className="user-block">CoderBot</div>)}
+                      {owner && (
+                        <div className="spacing">
+                          <div className="user-block">
+                            <UserTooltip usr={owner} id={idx} size={35} />
+                          </div>
+                        </div>)}
+                    </div>
                     <div styleName="flex-item item-modified">{formatModifyDate(link)}</div>
                     <div styleName="flex-item item-action"/>
                   </li>)
@@ -119,6 +135,16 @@ const LinksGridView = ({
                   <li styleName="assets-gridview-row" key={'assets-gridview-item-' +idx}>
                     <div styleName="flex-item item-type"><LinkIcon/></div>
                     <div styleName="flex-item item-name"><p>{renderLink(link)}</p></div>
+                    <div styleName="flex-item item-created-by">
+                      {!owner && !link.createdBy && (<div className="user-block">—</div>)}
+                      {!owner && link.createdBy && (<div className="user-block txt-italic">Unknown</div>)}
+                      {owner && (
+                        <div className="spacing">
+                          <div className="user-block">
+                            <UserTooltip usr={owner} id={idx} size={35} />
+                          </div>
+                        </div>)}
+                    </div>
                     <div styleName="flex-item item-modified">{formatModifyDate(link)}</div>
                     <div styleName="flex-item item-action">
                       {(canEdit || canDelete) && (

src/components/AssetsLibrary/SubFolder.jsx

@@ -1,9 +1,11 @@
 import React from 'react'
 import PropTypes from 'prop-types'
+import _ from 'lodash'
 import cn from 'classnames'
 
 import DeleteFileLinkModal from '../LinksMenu/DeleteFileLinkModal'
 import ItemOperations from './ItemOperations'
+import UserTooltip from '../User/UserTooltip'
 import FolderIcon from '../../assets/icons/v.2.5/icon-folder-small.svg'
 
 import './GridView.scss'
@@ -54,8 +56,9 @@ class SubFolder extends React.Component {
   }
 
   render() {
-    const { link, renderLink, goBack, formatModifyDate, isLinkSubFolder } = this.props
+    const { link, renderLink, goBack, formatModifyDate, isLinkSubFolder, assetsMembers } = this.props
     const { linkToDelete } = this.state
+
     return (
       <div styleName={cn({'assets-gridview-container-active': (linkToDelete >= 0)}, '')}>
         {(linkToDelete >= 0) && <div styleName="assets-gridview-modal-overlay"/>}
@@ -64,17 +67,20 @@ class SubFolder extends React.Component {
           <li styleName="assets-gridview-header" key="assets-gridview-header">
             <div styleName="flex-item-title item-type">Type</div>
             <div styleName="flex-item-title item-name">Name</div>
+            <div styleName="flex-item-title item-created-by">Created By</div>
             <div styleName="flex-item-title item-modified">Modified</div>
             <div styleName="flex-item-title item-action"/>
           </li>
           <li styleName="assets-gridview-row" key="assets-gridview-subfolder" onClick={goBack}>
             <div styleName="flex-item item-type"><FolderIcon /></div>
             <div styleName="flex-item item-name hand">..</div>
+            <div styleName="flex-item item-created-by"/>
             <div styleName="flex-item item-modified"/>
             <div styleName="flex-item item-action"/>
           </li>
           {
             link.children.map((childLink, i) => {
+              const owner = _.find(assetsMembers, m => m.userId === _.parseInt(childLink.createdBy))
               if (linkToDelete === i) {
                 return (
                   <li styleName="delete-confirmation-modal" key={'delete-confirmation-post-attachment-' + i}>
@@ -100,6 +106,16 @@ class SubFolder extends React.Component {
               return (<li styleName="assets-gridview-row" key={`childlink-${childLink.address}-${i}`}>
                 <div styleName="flex-item item-type"><img width={42} height={42} src={ iconPath } /></div>
                 <div styleName="flex-item item-name"><p>{renderLink(childLink)}</p></div>
+                <div styleName="flex-item item-created-by">
+                  {!owner && childLink.createdBy !== 'CoderBot' && (<div className="user-block txt-italic">Unknown</div>)}
+                  {!owner && childLink.createdBy === 'CoderBot' && (<div className="user-block">CoderBot</div>)}
+                  {owner && (
+                    <div className="spacing">
+                      <div className="user-block">
+                        <UserTooltip usr={owner} id={i} size={35} />
+                      </div>
+                    </div>)}
+                </div>
                 <div styleName="flex-item item-modified">{formatModifyDate(childLink)}</div>
                 <div styleName="flex-item item-action">
                   {childLink.deletable && this.hasAccess(childLink.createdBy) && (
@@ -123,7 +139,6 @@ SubFolder.propTypes = {
   onDeletePostAttachment: PropTypes.func,
   goBack: PropTypes.func.isRequired,
   loggedInUser: PropTypes.object,
-  formatModifyDate: PropTypes.func.isRequired,
 }
 
 export default SubFolder

src/components/Footer/Footer.jsx

@@ -10,10 +10,11 @@ require('./Footer.scss')
 const Footer = () => {
   const currentYear = moment().format('YYYY')
   const otherNavigationItems = [
-    {img: '', text: 'About', link: 'https://www.topcoder.com/about/', target: '_blank'},
-    {img: '', text: 'Contact us', link: 'https://www.topcoder.com/contact/', target: '_blank'},
-    {img: '', text: 'Privacy', link: 'https://www.topcoder.com/community/how-it-works/privacy-policy/', target: '_blank'},
-    {img: '', text: 'Terms', link: 'https://connect.topcoder.com/terms', target: '_blank'}
+    {img: '', text: 'About', link: 'https://www.topcoder.com/company/', target: '_blank'},
+    {img: '', text: 'Contact us', link: 'https://www.topcoder.com/contact-us/', target: '_blank'},
+    {img: '', text: 'Privacy', link: 'https://www.topcoder.com/privacy-policy/', target: '_blank'},
+    {img: '', text: 'Terms', link: 'https://connect.topcoder.com/terms', target: '_blank'},
+    {img: '', text: 'Our Process', link: 'https://www.topcoder.com/solutions/how-it-works/', target: '_blank'}
   ]
   const isProjectDetails = /projects\/\d+/.test(window.location.pathname)
   const isCreateProject = window.location.pathname.startsWith(NEW_PROJECT_PATH)

src/components/FooterV2/FooterV2.jsx

@@ -5,10 +5,11 @@ import './FooterV2.scss'
 const FooterV2 = () => (
   <div className="footer-v2">
     <ul className="footer-links">
-      <li><a href="https://www.topcoder.com/about/" target="_blank">About</a></li>
-      <li><a href="https://www.topcoder.com/contact/" target="_blank">Contact us</a></li>
+      <li><a href="https://www.topcoder.com/company/" target="_blank">About</a></li>
+      <li><a href="https://www.topcoder.com/contact-us/" target="_blank">Contact us</a></li>
       <li><a href="https://www.topcoder.com/community/how-it-works/privacy-policy/" target="_blank">Privacy</a></li>
       <li><a href="https://connect.topcoder.com/terms" target="_blank">Terms</a></li>
+      <li><a href="https://www.topcoder.com/solutions/how-it-works/" target="_blank">Our Process</a></li>
     </ul>
     <div className="footer-copyright">
       © Topcoder { moment().format('YYYY') }

src/components/MenuItem/MenuItem.jsx

@@ -21,7 +21,8 @@ const MenuItem = ({
   isAccordionOpen,
   onAccordionToggle,
   match,
-  wrapperClass
+  wrapperClass,
+  toolTipText,
 }) => {
   const matchedPath = match && match.path
   const isChildActive = children && some(children, c => c.to === matchedPath)
@@ -47,7 +48,7 @@ const MenuItem = ({
             {label}
           </span>
           <span styleName="right">
-            {!!count && <NotificationBadge count={count} />}
+            {!!count && <NotificationBadge count={count} text={toolTipText} />}
           </span>
         </NavLink>
       )}
@@ -68,7 +69,7 @@ const MenuItem = ({
               {label}
             </span>
             <span styleName="right">
-              {!!count && <NotificationBadge count={count} />}
+              {!!count && <NotificationBadge count={count} text={toolTipText} />}
             </span>
 
             <ArrowUpIcon className={styles.arrowUpIcon} />
@@ -100,7 +101,8 @@ MenuItem.propTypes = {
   children: PT.array,
   isAccordionOpen: PT.bool,
   onAccordionToggle: PT.func,
-  wrapperClass: PT.string
+  wrapperClass: PT.string,
+  toolTipText: PT.string,
 }
 
 export default withRouter(MenuItem)

src/components/MenuList/MenuList.jsx

@@ -21,7 +21,8 @@ MenuList.propTypes = {
       to: PT.string.isRequired,
       Icon: PT.func.isRequired,
       exact: PT.bool,
-      isActive: PT.func
+      isActive: PT.func,
+      toolTipText: PT.string
     })
   ),
   onAccordionToggle: PT.func.isRequired

src/components/MobilePage/MobilePage.scss

@@ -11,6 +11,14 @@
     overflow: hidden;
     overflow-y: scroll;
   }
+
+  .mobile-page-gateway {
+    z-index: 10000;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+  }
 }
 
 .container {

src/components/NotificationBadge/NotificationBadge.scss

@@ -1,15 +1,16 @@
 @import '~tc-ui/src/styles/tc-includes';
 
 .badge {
-    display: inline-flex;
-    background: $tc-red-70;
-    color: white;
-    @include roboto-bold;
-    border-radius: 100%;
-    height: 17px;
-    line-height: 17px;
-    justify-content: center;
-    align-items: center;
-    width: 17px;
-    font-size: 11px;
-}
+  display: inline-flex;
+  background: $tc-red-70;
+  color: white;
+  @include roboto-bold;
+  border-radius: 100%;
+  line-height: 17px;
+  justify-content: center;
+  align-items: center;
+  min-width: 17px;
+  min-height: 17px;
+  padding: 0 2px;
+  font-size: 11px;
+}