TAL-84 - remove emsi references throughout the code

Author: vas3a

src/apps/onboarding/src/models/MemberInfo.ts

@@ -1,5 +1,6 @@
-import { MemberEmsiSkill, MemberMaxRating } from '~/apps/talent-search/src/lib/models'
+import { MemberMaxRating } from '~/apps/talent-search/src/lib/models'
 import { MemberStats } from '~/libs/core'
+import { Skill } from '~/libs/shared'
 
 import MemberAddress from './MemberAddress'
 
@@ -13,7 +14,7 @@ export default interface MemberInfo {
     email: string
     accountAge: number
     maxRating: MemberMaxRating
-    emsiSkills: Array<MemberEmsiSkill>
+    emsiSkills: Array<Skill>
     stats: Array<MemberStats>
     addresses?: MemberAddress[]
     country: string

src/apps/onboarding/src/pages/skills/index.tsx

@@ -16,12 +16,12 @@ export const PageSkillsContent: FC<{
 }> = props => {
     const navigate: any = useNavigate()
     const [loading, setLoading] = useState(false)
-    const { formInput: emsiFormInput, saveSkills: saveEmsiSkills }: MemberSkillEditor = useMemberSkillEditor()
+    const editor: MemberSkillEditor = useMemberSkillEditor()
 
     async function saveSkills(): Promise<void> {
         setLoading(true)
         try {
-            await saveEmsiSkills()
+            await editor.saveSkills()
         } catch (error) {
         }
 
@@ -46,7 +46,7 @@ export const PageSkillsContent: FC<{
                         Understanding your skills will allow us to connect you to the right opportunities.
                     </span>
                     <div className='mt-16 full-width color-black-80'>
-                        {emsiFormInput}
+                        {editor.formInput}
                     </div>
                 </div>
             </div>

src/apps/profiles/src/member-profile/MemberProfile.context.tsx

@@ -1,11 +1,11 @@
 import { createContext, FC, ReactNode, useContext, useMemo } from 'react'
 
-import { UserEMSISkill } from '~/libs/core'
+import { Skill } from '~/libs/shared'
 
 export interface MemberProfileContextValue {
     isTalentSearch?: boolean
     skillsRenderer?: (
-        skills: Pick<UserEMSISkill, 'name'|'skillId'|'skillSources'>[]
+        skills: Pick<Skill, 'name'|'id'|'skillSources'>[]
     ) => ReactNode
 }
 

src/apps/profiles/src/member-profile/skills/MemberSkillsInfo.tsx

@@ -2,7 +2,7 @@ import { Dispatch, FC, SetStateAction, useEffect, useMemo, useState } from 'reac
 import { useSearchParams } from 'react-router-dom'
 import { orderBy } from 'lodash'
 
-import { UserEMSISkill, UserProfile } from '~/libs/core'
+import { UserProfile } from '~/libs/core'
 import { ExpandableList, HowSkillsWorkModal, isSkillVerified, Skill, SkillPill } from '~/libs/shared'
 import { Button } from '~/libs/ui'
 
@@ -27,11 +27,11 @@ const MemberSkillsInfo: FC<MemberSkillsInfoProps> = (props: MemberSkillsInfoProp
 
     const { skillsRenderer, isTalentSearch }: MemberProfileContextValue = useMemberProfileContext()
 
-    const memberEMSISkills: UserEMSISkill[] = useMemo(() => orderBy(
+    const memberSkills: Skill[] = useMemo(() => orderBy(
         props.profile.emsiSkills ?? [],
         [isSkillVerified, 'name'],
         ['desc', 'asc'],
-    ) as UserEMSISkill[], [props.profile.emsiSkills])
+    ) as Skill[], [props.profile.emsiSkills])
 
     const [isEditMode, setIsEditMode]: [boolean, Dispatch<SetStateAction<boolean>>]
         = useState<boolean>(false)
@@ -76,7 +76,7 @@ const MemberSkillsInfo: FC<MemberSkillsInfoProps> = (props: MemberSkillsInfoProp
                 <div className={styles.headerWrap}>
                     <h3>Skills</h3>
                     {
-                        canEdit && memberEMSISkills.length > 0 && (
+                        canEdit && memberSkills.length > 0 && (
                             <EditMemberPropertyBtn
                                 onClick={handleEditSkillsClick}
                             />
@@ -92,11 +92,11 @@ const MemberSkillsInfo: FC<MemberSkillsInfoProps> = (props: MemberSkillsInfoProp
             </div>
 
             <div className={styles.skillsWrap}>
-                {skillsRenderer && memberEMSISkills.length > 0 && skillsRenderer(memberEMSISkills)}
-                {!skillsRenderer && memberEMSISkills.length > 0 && (
+                {skillsRenderer && memberSkills.length > 0 && skillsRenderer(memberSkills)}
+                {!skillsRenderer && memberSkills.length > 0 && (
                     <ExpandableList visible={10} itemLabel='skill'>
                         {
-                            memberEMSISkills
+                            memberSkills
                                 .map(memberEMSISkill => (
                                     <SkillPill
                                         skill={memberEMSISkill as unknown as Skill}
@@ -107,7 +107,7 @@ const MemberSkillsInfo: FC<MemberSkillsInfoProps> = (props: MemberSkillsInfoProp
                         }
                     </ExpandableList>
                 )}
-                {!memberEMSISkills.length && (
+                {!memberSkills.length && (
                     <EmptySection
                         title='Topcoder verifies and tracks skills as our members complete projects and challenges.'
                         wide
@@ -119,7 +119,7 @@ const MemberSkillsInfo: FC<MemberSkillsInfoProps> = (props: MemberSkillsInfoProp
                     </EmptySection>
                 )}
             </div>
-            {canEdit && !memberEMSISkills.length && (
+            {canEdit && !memberSkills.length && (
                 <AddButton
                     label='Add skills'
                     onClick={handleEditSkillsClick}

src/apps/profiles/src/member-profile/skills/ModifySkillsModal/ModifySkillsModal.tsx

@@ -15,12 +15,12 @@ const ModifySkillsModal: FC<ModifySkillsModalProps> = (props: ModifySkillsModalP
     const [isSaving, setIsSaving]: [boolean, Dispatch<SetStateAction<boolean>>]
         = useState<boolean>(false)
 
-    const { formInput: emsiFormInput, saveSkills: saveEmsiSkills }: MemberSkillEditor = useMemberSkillEditor()
+    const editor: MemberSkillEditor = useMemberSkillEditor()
 
     function handleModifySkillsSave(): void {
         setIsSaving(true)
 
-        saveEmsiSkills()
+        editor.saveSkills()
             .then(() => {
                 toast.success('Skills updated successfully.', { position: toast.POSITION.BOTTOM_RIGHT })
                 props.onSave()
@@ -63,7 +63,7 @@ const ModifySkillsModal: FC<ModifySkillsModalProps> = (props: ModifySkillsModalP
                     Understanding your skills will allow us to connect you to the right opportunities.
                 </p>
                 <div className={styles.skillPicker}>
-                    {emsiFormInput}
+                    {editor.formInput}
                 </div>
             </div>
         </BaseModal>

src/apps/talent-search/src/components/popular-skills/PopularSkills.tsx

@@ -9,22 +9,22 @@ import styles from './PopularSkills.module.scss'
 // TODO: Make this configurable, or read from a service.  We need to discuss
 // how we want to handle this.
 const popularSkills: Skill[] = [
-    { emsiId: 'KS120076FGP5WGWYMP0F', name: 'Java (Programming Language)' },
-    { emsiId: 'KS126QY605N7YVHFYCTW', name: 'MySQL' },
-    { emsiId: 'KS127296VDYS7ZFWVC46', name: 'Node.js' },
-    { emsiId: 'KS121F45VPV8C9W3QFYH', name: 'Cascading Style Sheets (CSS)' },
-    { emsiId: 'KS1200771D9CR9LB4MWW', name: 'JavaScript (Programming Language)' },
-    { emsiId: 'KS1261Z68KSKR1X31KS3', name: 'Machine Learning' },
-    { emsiId: 'KS120SX72T8B5VLXS1VN', name: 'Unit Testing' },
-    { emsiId: 'KS120H6772VQ0MQ5RLVD', name: 'Angular (Web Framework)' },
-    { emsiId: 'KS1200B62W5ZF38RJ7TD', name: '.NET Framework' },
-    { emsiId: 'KS125LS6N7WP4S6SFTCK', name: 'Python (Programming Language)' },
-    { emsiId: 'KS120GZ5YXC6YVM1NGPR', name: 'Android (Operating System)' },
-    { emsiId: 'ES5269FD2583B0B9875C', name: 'Figma (Design Software)' },
-    { emsiId: 'KS120V86MZWV9Z9LKQY3', name: 'Microsoft Azure' },
-    { emsiId: 'KS1206V6K46N1SDVJGBD', name: 'Adobe Illustrator' },
-    { emsiId: 'KSY4WFI1S164RQUBSPCC', name: 'Docker (Software)' },
-    { emsiId: 'KSDJCA4E89LB98JAZ7LZ', name: 'React.js' },
+    { id: 'f81d2a78-ff52-4c77-8cdb-8863601b87c7', name: 'Java (Programming Language)' },
+    { id: '1aabc882-c28d-4b56-8546-5e961b53bf5d', name: 'MySQL' },
+    { id: 'b3181231-af8f-4a44-aff2-97fe00c57d76', name: 'Node.js' },
+    { id: '4328c534-ba51-4589-a3e7-7b5ba76d2b55', name: 'Cascading Style Sheets (CSS)' },
+    { id: 'e3b2b1f1-6bbf-4989-b53d-d8531a10ea5d', name: 'JavaScript (Programming Language)' },
+    { id: '41ffc4d5-2e43-45e1-af36-ae7a23b47c21', name: 'Machine Learning' },
+    { id: '047203fc-8c85-4be0-be0b-0e2fe11c3a16', name: 'Unit Testing' },
+    { id: '8c6703bd-63dd-4f6d-9cf0-5b411e531a9f', name: 'Angular (Web Framework)' },
+    { id: '34ec4bf0-0b44-4d04-9f11-e3daa2c045ce', name: '.NET Framework' },
+    { id: 'a9bb69aa-edc2-4d5f-8141-de33a139f119', name: 'Python (Programming Language)' },
+    { id: '67c623db-09e4-499d-800b-24868b1eb85b', name: 'Android (Operating System)' },
+    { id: '36292f61-c359-42a4-89b9-95245ee494ea', name: 'Figma (Design Software)' },
+    { id: 'cf39f07c-0e7a-48a2-acec-21834900c437', name: 'Microsoft Azure' },
+    { id: 'b33f8342-8015-4244-afea-5fd089bf52a6', name: 'Adobe Illustrator' },
+    { id: 'f21aecd2-5c67-4783-97a4-a77c67cf4f67', name: 'Docker (Software)' },
+    { id: '43baf79e-3632-4b04-889a-7202cbf62a6c', name: 'React.js' },
 ]
 
 interface PopularSkillsProps {
@@ -41,7 +41,7 @@ const PopularSkills: FC<PopularSkillsProps> = props => {
         // Either delete the value from the list, if we're toggling one that's already in the list
         // Or add the new item to the list
         props.selectedSkills.forEach(filterSkill => {
-            if (filterSkill.emsiId === skill.emsiId) {
+            if (filterSkill.id === skill.id) {
                 deleted = true
             } else {
                 newFilter.push(filterSkill)
@@ -59,7 +59,7 @@ const PopularSkills: FC<PopularSkillsProps> = props => {
     }, [props.onChange, props.selectedSkills])
 
     function isSelected(skill: Skill): boolean {
-        return !!props.selectedSkills.find(s => s.emsiId === skill.emsiId)
+        return !!props.selectedSkills.find(s => s.id === skill.id)
     }
 
     return (
@@ -69,7 +69,7 @@ const PopularSkills: FC<PopularSkillsProps> = props => {
             <div className={styles.pills}>
                 {popularSkills.map(skill => (
                     <SkillPill
-                        key={skill.emsiId}
+                        key={skill.id}
                         skill={skill}
                         selected={isSelected(skill)}
                         onClick={toggleSkill}

src/apps/talent-search/src/components/profile-skills-match/ProfileSkillsMatch.tsx

@@ -1,26 +1,25 @@
 import { FC } from 'react'
 import classNames from 'classnames'
 
-import { UserEMSISkill } from '~/libs/core'
-import { EmsiSkill, ExpandableList, isSkillVerified, Skill, SkillPill } from '~/libs/shared'
+import { ExpandableList, isSkillVerified, Skill, SkillPill } from '~/libs/shared'
 
 import { useIsMatchingSkill } from '../../lib/utils'
 
 import styles from './ProfileSkillsMatch.module.scss'
 
 interface ProfileSkillsMatchProps {
     matchValue: number
-    profileSkills: Pick<UserEMSISkill, 'name'|'skillId'|'skillSources'>[]
+    profileSkills: Pick<Skill, 'name'|'id'|'skillSources'>[]
     queriedSkills: Skill[]
 }
 
 const ProfileSkillsMatch: FC<ProfileSkillsMatchProps> = props => {
     const isMatchingSkill = useIsMatchingSkill(props.queriedSkills)
-    const matchedSkills = (props.profileSkills as unknown as EmsiSkill[]).filter(isMatchingSkill)
-    const unMatchedSkills = (props.profileSkills as unknown as EmsiSkill[]).filter(s => !isMatchingSkill(s))
+    const matchedSkills = props.profileSkills.filter(isMatchingSkill)
+    const unMatchedSkills = props.profileSkills.filter(s => !isMatchingSkill(s))
     const provenMatched = matchedSkills.filter(isSkillVerified)
     const selfSkillmatched = matchedSkills.filter(s => !isSkillVerified(s))
-    const missingSkills = props.queriedSkills.filter(qs => !matchedSkills.find(ms => ms.skillId === qs.emsiId))
+    const missingSkills = props.queriedSkills.filter(qs => !matchedSkills.find(ms => ms.id === qs.id))
 
     return (
         <div className={styles.wrap}>
@@ -41,7 +40,7 @@ const ProfileSkillsMatch: FC<ProfileSkillsMatchProps> = props => {
                             </div>
                             <div className={styles.skillsList}>
                                 {provenMatched.map(skill => (
-                                    <SkillPill skill={skill} theme='verified' key={skill.skillId} />
+                                    <SkillPill skill={skill} theme='verified' key={skill.id} />
                                 ))}
                             </div>
                         </>
@@ -54,7 +53,7 @@ const ProfileSkillsMatch: FC<ProfileSkillsMatchProps> = props => {
                             </div>
                             <div className={styles.skillsList}>
                                 {selfSkillmatched.map(skill => (
-                                    <SkillPill skill={skill} theme='dark' key={skill.skillId} />
+                                    <SkillPill skill={skill} theme='dark' key={skill.id} />
                                 ))}
                             </div>
                         </>
@@ -82,7 +81,7 @@ const ProfileSkillsMatch: FC<ProfileSkillsMatchProps> = props => {
                     <div className={styles.skillsList}>
                         <ExpandableList visible={10} itemLabel='skill'>
                             {unMatchedSkills.map(skill => (
-                                <SkillPill skill={skill} theme='dark' key={skill.skillId} />
+                                <SkillPill skill={skill} theme='dark' key={skill.id} />
                             ))}
                         </ExpandableList>
                     </div>

src/apps/talent-search/src/components/search-input/SearchInput.tsx

@@ -2,7 +2,7 @@ import { FC, MouseEvent, Ref, useMemo } from 'react'
 import classNames from 'classnames'
 
 import { IconOutline, InputMultiselectOption } from '~/libs/ui'
-import { EmsiSkill, EmsiSkillSources, InputSkillSelector, Skill } from '~/libs/shared'
+import { InputSkillSelector, Skill, SkillSources } from '~/libs/shared'
 
 import { SKILL_SEARCH_LIMIT } from '../../config'
 
@@ -18,16 +18,16 @@ interface SearchInputProps {
 }
 
 const SearchInput: FC<SearchInputProps> = props => {
-    const emsiSkills: EmsiSkill[] = useMemo(() => props.skills.map(s => ({
+    const skills: Skill[] = useMemo(() => props.skills.map(s => ({
+        id: s.id,
         name: s.name,
-        skillId: s.emsiId,
-        skillSources: [EmsiSkillSources.selfPicked],
+        skillSources: [SkillSources.selfPicked],
     })), [props.skills])
 
     function onChange(ev: any): void {
         const options = (ev.target.value as unknown) as InputMultiselectOption[]
         props.onChange(options.map(v => ({
-            emsiId: v.value,
+            id: v.value,
             name: v.label as string,
         })))
     }
@@ -41,13 +41,13 @@ const SearchInput: FC<SearchInputProps> = props => {
 
     const searchIcon = useMemo(() => (
         <div
-            className={classNames(styles.searchIcon, !emsiSkills.length && styles.disabled)}
+            className={classNames(styles.searchIcon, !skills.length && styles.disabled)}
             onClick={handleSearchClick}
             onTouchStart={handleSearchClick as any}
         >
             <IconOutline.SearchIcon />
         </div>
-    ), [props.onSearch, emsiSkills])
+    ), [props.onSearch, skills])
 
     return (
         <div className={styles.wrap}>
@@ -58,13 +58,13 @@ const SearchInput: FC<SearchInputProps> = props => {
                 useWrapper={false}
                 theme='clear'
                 dropdownIcon={searchIcon}
-                value={emsiSkills}
+                value={skills}
                 onChange={onChange}
                 onSubmit={props.onSearch}
                 inputRef={props.inputRef}
                 limit={SKILL_SEARCH_LIMIT}
             />
-            {emsiSkills.length >= SKILL_SEARCH_LIMIT && (
+            {skills.length >= SKILL_SEARCH_LIMIT && (
                 <div className={styles.maxLimit}>
                     {`You can only search up to ${SKILL_SEARCH_LIMIT} skills at one time`}
                 </div>

src/apps/talent-search/src/components/talent-card/TalentCard.tsx

@@ -129,7 +129,7 @@ const TalentCard: FC<TalentCardProps> = props => {
                     <div ref={restLabelRef} className={styles.unmatchedSkills}>+0 more matched skill</div>
                     {matchedSkills.length > 0 && matchedSkills.map(skill => (
                         <SkillPill
-                            key={skill.skillId}
+                            key={skill.id}
                             theme='dark'
                             skill={skill}
                         />

src/apps/talent-search/src/lib/models/Member.ts

@@ -1,6 +1,7 @@
+import { Skill } from '~/libs/shared'
+
 import { MemberDisplayName } from './MemberDisplayName'
 import MemberAddress from './MemberAddress'
-import MemberEmsiSkill from './MemberEmsiSkill'
 import MemberMaxRating from './MemberMaxRating'
 import MemberStats from './MemberStats'
 
@@ -12,7 +13,7 @@ export default interface Member {
     createdAt: number;
     description: string;
     email: string;
-    emsiSkills: Array <MemberEmsiSkill>;
+    emsiSkills: Array <Skill>;
     firstName: string;
     handle: string;
     homeCountryCode: string;