Update mentee and mentor card #170

[AnsarMahir]

Purpose

The purpose of this PR is to fix #170

Goals

Approach

Changes cannot be done directly to the components inside the Mentee card as these components are being used in different places across the site. The hardcoded values had to changed as they do not support dynamic transitions.

Screenshots

Checklist

• This PR doesn't commit any keys, passwords, tokens, usernames, or other secrets.
• I have read and understood the development best practices guidelines ( http://bit.ly/sef-best-practices )
• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation

Related PRs

Test environment

Learning

[mayura-andrew]

@AnsarMahir there are conflictings right? Please resolve

[mayura-andrew]

@AnsarMahir If you're using SVGs, please move them to the assets/svg folder. You can refer to how other SVGs are handled in the codebase for consistency.

[mayura-andrew]

@AnsarMahir Can you add screenshot of some example ?

[AnsarMahir]

@anjula-sack did the requested changes

[anjula-sack]

Total application count is also there in the mentor application.

[AnsarMahir]

This issue is that , I tried already to simplify the logic as below

const appliedMenteesCount = mentor?.application?.appliedMenteesCount ?? 0;
  const availableMenteeSlots = mentor?.application?.availableMenteeSlots ?? 0;

but it pop up an error,
"Property 'appliedMenteesCount' does not exist on type '{ firstName: string; lastName: string; email: string; contactNo: string; country: string; position: string; expertise: string; bio: string; isPastMentor: boolean; reasonToMentor: string; profilePic: string; ... 10 more ...; canCommit?: boolean | undefined; }'."

Tried to fix that error by adding

 appliedMenteesCount?: number; 
  availableMenteeSlots?: number;

to the mentor interface, but did not work out. :(. That's why just left it as it is