🐛 Fix skill display issue (#582)

* comment filter * replace a tag with span when there is no marketing url
SSWConsulting · Jan 4, 2024 · 1454f96 · 1454f96
1 parent 7a8d28f
commit 1454f96
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 24 deletions.
diff --git a/src/components/skills-list/skills-list.js b/src/components/skills-list/skills-list.js
@@ -5,6 +5,14 @@ const SkillsList = ({ crmData }) => {
   const intermediateSkills = crmData?.skills?.intermediateSkills ?? [];
   const advancedSkills = crmData?.skills?.advancedSkills ?? [];
 
+  const SkillLink = ({ skill }) => {
+    return skill.marketingPageUrl ? (
+      <a href={skill.marketingPageUrl}>{skill.service}</a>
+    ) : (
+      <span>{skill.service}</span>
+    );
+  };
+
   return (
     <>
       {((advancedSkills && !!advancedSkills.length) ||
@@ -14,7 +22,7 @@ const SkillsList = ({ crmData }) => {
           <span>
             {advancedSkills.map((skill, i, arr) => (
               <strong key={`advancedSkill-${i}`}>
-                <a href={skill.marketingPageUrl}>{skill.service}</a>
+                <SkillLink skill={skill} />
                 {(i !== arr.length - 1 ||
                   (i === arr.length - 1 && intermediateSkills.length > 0)) && (
                   <span className="skill-separator"> | </span>
@@ -23,7 +31,7 @@ const SkillsList = ({ crmData }) => {
             ))}
             {intermediateSkills.map((skill, i, arr) => (
               <span key={`intermediateSkill-${i}`}>
-                <a href={skill.marketingPageUrl}>{skill.service}</a>
+                <SkillLink skill={skill} />
                 {i !== arr.length - 1 && (
                   <span className="skill-separator"> | </span>
                 )}
@@ -39,6 +47,7 @@ const SkillsList = ({ crmData }) => {
 
 SkillsList.propTypes = {
   crmData: PropTypes.object.isRequired,
+  skill: PropTypes.object.isRequired,
 };
 
 export default SkillsList;
diff --git a/src/helpers/CRMApi.js b/src/helpers/CRMApi.js
@@ -61,28 +61,27 @@ const getUsersSkills = async () => {
   });
 
   const usersSkillsReq = await axios.get(`${crmUrl}/ssw_userskills`);
-  const usersSkills = usersSkillsReq.data.value
-    .map((us) => {
-      const skill = skills.find((s) => s.ssw_skillid === us._ssw_skillid_value);
-      const marketingPage =
-        skill?.[
-          '_ssw_marketingpage_value@OData.Community.Display.V1.FormattedValue'
-        ] ?? '';
-
-      const userSkill = {
-        userId: us._ssw_systemuserid_value,
-        experienceLevel: getExperienceLevel(us.ssw_level),
-        sortOrder: us.ssw_sortorder || null,
-        technology: skill?.ssw_name ?? '',
-        marketingPage,
-        marketingPageUrl: consultingPages[marketingPage],
-        published:
-          skill?.['[email protected]'] ?? '',
-      };
-
-      return userSkill;
-    })
-    .filter((us) => us.published === 'Published');
+  const usersSkills = usersSkillsReq.data.value.map((us) => {
+    const skill = skills.find((s) => s.ssw_skillid === us._ssw_skillid_value);
+    const marketingPage =
+      skill?.[
+        '_ssw_marketingpage_value@OData.Community.Display.V1.FormattedValue'
+      ] ?? '';
+
+    const userSkill = {
+      userId: us._ssw_systemuserid_value,
+      experienceLevel: getExperienceLevel(us.ssw_level),
+      sortOrder: us.ssw_sortorder || null,
+      technology: skill?.ssw_name ?? '',
+      marketingPage,
+      marketingPageUrl: consultingPages[marketingPage],
+      published:
+        skill?.['[email protected]'] ?? '',
+    };
+
+    return userSkill;
+  });
+  // .filter((us) => us.published === 'Published');
 
   return usersSkills;
 };