Merge branch 'develop' into tco23-BS-comps

Author: kkartunov

__tests__/shared/components/ProfilePage/__snapshots__/index.jsx.snap

@@ -5,7 +5,7 @@ exports[`renders a full Profile correctly 1`] = `
   className="src-shared-components-ProfilePage-___styles__outer-container___3in3p"
 >
   <div>
-    <ProfileHeader
+    <Connect(ProfileHeader)
       info={
         Object {
           "competitionCountryCode": "USA",
@@ -717,7 +717,7 @@ exports[`renders an empty Profile correctly 1`] = `
   className="src-shared-components-ProfilePage-___styles__outer-container___3in3p"
 >
   <div>
-    <ProfileHeader
+    <Connect(ProfileHeader)
       info={
         Object {
           "competitionCountryCode": "USA",

__tests__/shared/components/__snapshots__/Content.jsx.snap

@@ -491,7 +491,7 @@ exports[`Matches shallow shapshot 1`] = `
     <li>
       <Link
         replace={false}
-        to="/__community__/wipro"
+        to="/__community__/wipro/challenges"
       >
         TopGear (Wipro) community
       </Link>

src/server/index.js

@@ -185,6 +185,7 @@ async function onExpressJsSetup(server) {
           + ` ${config.CDN.PUBLIC}`
           + ' https://d1of0acg2orgco.cloudfront.net'
           + ' https://d24oibycet9bsb.cloudfront.net'
+          + ' https://d1mwkvp2xbqfs9.cloudfront.net'
           + ' https://43d132d5dbff47c59d9d53ad448f93c2.js.ubembed.com;'
         + " frame-src 'self'"
           + ` ${config.URL.AUTH}`

src/server/services/communities.js

@@ -116,6 +116,17 @@ export async function getMetadata(communityId) {
   if (metadata.groupIds) {
     metadata.groupIds = await extendByChildGroups(metadata.groupIds);
   }
+
+  // FIXME: This is a tempory patch to resolve "Backstage Error" that's showing up on Topgear
+  // app due to missing "Wipro All" authorized group
+  // Roll this back as soon as the root cause is fixed
+  // which is likely either in topcoder-react-lib that handles merging groups (https://github.com/topcoder-platform/topcoder-react-lib/blob/c637525211550bea283390e52490fce7f6dd44a8/src/services/groups.js#L107)
+  // or Groups Api
+  if (communityId === 'wipro') {
+    logger.info('Getting metadata for Topgear. Existing Authorized Groups', JSON.stringify(metadata.authorizedGroupIds));
+    metadata.authorizedGroupIds = _.uniq(metadata.authorizedGroupIds.concat('b7f7c0f8-8ee8-409e-9e5c-33404983b635'));
+    logger.info('After adding "Wipro All" group', JSON.stringify(metadata.authorizedGroupIds));
+  }
   getMetadata.cache[communityId] = { data: metadata, timestamp: now };
   return _.cloneDeep(metadata);
 }

src/shared/components/Content/index.jsx

@@ -413,7 +413,7 @@ export default function Content() {
           </Link>
         </li>
         <li>
-          <Link to="/__community__/wipro">
+          <Link to="/__community__/wipro/challenges">
             TopGear (Wipro) community
           </Link>
         </li>

src/shared/components/ProfilePage/Header/index.jsx

@@ -3,17 +3,23 @@
  */
 import React, { useEffect, useState } from 'react';
 import PT from 'prop-types';
+import { connect } from 'react-redux';
 
+import { actions } from 'topcoder-react-lib';
 import { isomorphy } from 'topcoder-react-utils';
 
-// import VerifiedBadge from 'assets/images/profile/verified-badge.svg';
-// import InfoIcon from 'assets/images/profile/ico-info.svg';
-// import Tooltip from 'components/Tooltip';
+import VerifiedBadge from 'assets/images/profile/verified-badge.svg';
+import InfoIcon from 'assets/images/profile/ico-info.svg';
+import Tooltip from 'components/Tooltip';
 
 import './styles.scss';
 
-const ProfileHeader = ({ info }) => {
+const verifiedBadgeLookerId = '3322';
+
+const ProfileHeader = ({ getLookerDone, lookerInfo, info }) => {
   const [imageUrl, setimageUrl] = useState();
+  const [isMemberVerified, setIsMemberVerified] = useState(false);
+  const { handle } = info;
 
   useEffect(() => {
     let url = '';
@@ -25,16 +31,29 @@ const ProfileHeader = ({ info }) => {
     setimageUrl(url);
   }, []);
 
+  useEffect(() => {
+    if (!lookerInfo || lookerInfo.error) {
+      getLookerDone(verifiedBadgeLookerId);
+    }
+  }, []);
+
+  useEffect(() => {
+    if (!lookerInfo || lookerInfo.error) {
+      return;
+    }
+    const { lookerData } = lookerInfo;
+    const currentUserData = lookerData.find(x => x['user.handle'] === handle);
+    setIsMemberVerified(currentUserData && currentUserData['member_verification.status'] === 'Verified');
+  }, [lookerInfo]);
+
   const loadImageError = () => {
     setimageUrl(null);
   };
 
-  // const tooltipContent = (
-  //   <div styleName="tooltip-content">verified member</div>
-  // );
+  const tooltipContent = (
+    <div styleName="tooltip-content">verified member</div>
+  );
 
-  const { handle } = info;
-  // const isMemberVerified = true;
 
   return (
     <div styleName="container">
@@ -55,24 +74,22 @@ const ProfileHeader = ({ info }) => {
             {handle}
           </div>
 
-          {/* { */}
-          {/*   isMemberVerified && ( */}
-          {/*     <div styleName="verified-member"> */}
-          {/*       <VerifiedBadge /> */}
-
-          {/*       <span>verified member</span> */}
-
-          {/*       <div styleName="info"> */}
-          {/*         <Tooltip */}
-          {/*           content={tooltipContent} */}
-          {/*           trigger={['hover', 'focus']} */}
-          {/*         > */}
-          {/*           <InfoIcon /> */}
-          {/*         </Tooltip> */}
-          {/*       </div> */}
-          {/*     </div> */}
-          {/*   ) */}
-          {/* } */}
+          {isMemberVerified && (
+            <div styleName="verified-member">
+              <VerifiedBadge />
+
+              <span>verified member</span>
+
+              <div styleName="info">
+                <Tooltip
+                  content={tooltipContent}
+                  trigger={['hover', 'focus']}
+                >
+                  <InfoIcon />
+                </Tooltip>
+              </div>
+            </div>
+          )}
         </div>
 
       </div>
@@ -85,8 +102,34 @@ ProfileHeader.defaultProps = {
   info: {},
 };
 
+function mapStateToProps(state) {
+  const {
+    looker: {
+      dataSet,
+    },
+  } = state;
+  return {
+    lookerInfo: dataSet[verifiedBadgeLookerId],
+  };
+}
+
+function mapDispatchToProps(dispatch) {
+  return {
+    getLookerDone: (lookerId) => {
+      dispatch(actions.looker.getLookerDone(lookerId));
+    },
+  };
+}
+
 ProfileHeader.propTypes = {
   info: PT.shape(),
+  lookerInfo: PT.shape().isRequired,
+  getLookerDone: PT.func.isRequired,
 };
 
-export default ProfileHeader;
+const Container = connect(
+  mapStateToProps,
+  mapDispatchToProps,
+)(ProfileHeader);
+
+export default Container;