Dev -> Engagements

src/apps/calendar/src/lib/utils/calendar.utils.ts

@@ -12,7 +12,7 @@ const statusColorMap: Record<LeaveStatus, string> = {
 
 const statusLabelMap: Record<LeaveStatus, string> = {
     [LeaveStatus.LEAVE]: 'Leave',
-    [LeaveStatus.HOLIDAY]: 'Personal Holiday',
+    [LeaveStatus.HOLIDAY]: 'Holiday',
     [LeaveStatus.WIPRO_HOLIDAY]: 'Wipro Holiday',
     [LeaveStatus.WEEKEND]: 'Weekend',
     [LeaveStatus.AVAILABLE]: 'Available',
@@ -22,7 +22,6 @@ export const legendStatusOrder: LeaveStatus[] = [
     LeaveStatus.AVAILABLE,
     LeaveStatus.LEAVE,
     LeaveStatus.HOLIDAY,
-    LeaveStatus.WIPRO_HOLIDAY,
     LeaveStatus.WEEKEND,
 ]
 

src/apps/calendar/src/pages/personal-calendar/PersonalCalendarPage.tsx

@@ -152,7 +152,7 @@ const PersonalCalendarPage: FC = () => {
                         onClick={handleSetAsHoliday}
                         disabled={!selectedDates.size || isUpdating}
                     >
-                        Set as Personal Holiday
+                        Set as Holiday
                     </Button>
                     <Button
                         secondary

src/apps/calendar/src/pages/team-calendar/TeamCalendarPage.module.scss

@@ -17,6 +17,9 @@
 
 .navigation {
     display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 8px;
     justify-content: center;
     margin: 14px 0 10px;
 }

src/apps/calendar/src/pages/team-calendar/TeamCalendarPage.tsx

@@ -1,7 +1,7 @@
 import { addMonths, endOfMonth, startOfMonth, subMonths } from 'date-fns'
 import { FC, useCallback, useEffect, useMemo, useState } from 'react'
 
-import { MonthNavigation, TeamCalendar } from '../../lib/components'
+import { CalendarLegend, MonthNavigation, TeamCalendar } from '../../lib/components'
 import { useFetchTeamLeave } from '../../lib/hooks'
 
 import styles from './TeamCalendarPage.module.scss'
@@ -57,6 +57,7 @@ const TeamCalendarPage: FC = () => {
                     onNextMonth={handleNextMonth}
                     onPrevMonth={handlePrevMonth}
                 />
+                <CalendarLegend />
             </section>
 
             <section className={styles.calendarSection}>

src/apps/profiles/src/config/constants.ts

@@ -1,5 +1,7 @@
 // import { EnvironmentConfig } from '~/config'
 
+import { UserRole } from '~/libs/core'
+
 export enum TRACKS_PROFILE_MAP {
     DEVELOP = 'Developer',
     DESIGN = 'Designer',
@@ -26,3 +28,5 @@ export enum profileEditModes {
 // (removed) CES Survey/Userflow integrations
 
 export const MAX_PRINCIPAL_SKILLS_COUNT = 10
+
+export const ADMIN_ROLES = [UserRole.administrator]

src/apps/profiles/src/lib/helpers.ts

@@ -1,5 +1,7 @@
 /* eslint-disable complexity */
-import { UserProfile } from '~/libs/core'
+import { UserProfile, UserRole } from '~/libs/core'
+
+import { ADMIN_ROLES } from '../config'
 
 declare global {
     interface Window { tcUniNav: any }
@@ -125,3 +127,37 @@ export function isValidURL(urlToValidate: string): boolean {
 export function formatPlural(count: number, baseWord: string): string {
     return `${baseWord}${count === 1 ? '' : 's'}`
 }
+
+/**
+ * Check if the user can download the profile
+ * @param authProfile - The authenticated user profile
+ * @param profile - The profile to check if the user can download
+ * @returns {boolean} - Whether the user can download the profile
+ */
+export function canDownloadProfile(authProfile: UserProfile | undefined, profile: UserProfile): boolean {
+    if (!authProfile) {
+        return false
+    }
+
+    // Check if user is viewing their own profile
+    if (authProfile.handle === profile.handle) {
+        return true
+    }
+
+    // Check if user has admin roles
+    if (authProfile.roles?.some(role => ADMIN_ROLES.includes(role.toLowerCase() as UserRole))) {
+        return true
+    }
+
+    // Check if user has PM or Talent Manager roles
+    const allowedRoles = ['Project Manager', 'Talent Manager']
+    if (authProfile
+        .roles?.some(
+            role => allowedRoles.some(allowed => role.toLowerCase() === allowed.toLowerCase()),
+        )
+    ) {
+        return true
+    }
+
+    return false
+}

src/apps/profiles/src/member-profile/about-me/AboutMe.module.scss

@@ -27,3 +27,16 @@
         padding: $sp-4 $sp-4 $sp-4 0;
     }
 }
+
+.titleWrap {
+    margin-top: $sp-8;
+}
+
+.email {
+    display: flex;
+    align-items: center;
+}
+
+.emailText {
+    margin-top: $sp-2;
+}

src/apps/profiles/src/member-profile/about-me/AboutMe.tsx

@@ -4,6 +4,7 @@ import { KeyedMutator } from 'swr'
 import classNames from 'classnames'
 
 import { NamesAndHandleAppearance, useMemberTraits, UserProfile, UserTraitIds, UserTraits } from '~/libs/core'
+import { CopyButton } from '~/apps/admin/src/lib/components/CopyButton'
 
 import { AddButton, EditMemberPropertyBtn, EmptySection } from '../../components'
 import { EDIT_MODE_QUERY_PARAM, profileEditModes } from '../../config'
@@ -119,6 +120,18 @@ const AboutMe: FC<AboutMeProps> = (props: AboutMeProps) => {
                     />
                 )
             }
+
+            {props.profile?.email
+            && (
+                <div className={styles.titleWrap}>
+                    <p className='body-main-bold'>Contact</p>
+                    <div className={styles.email}>
+                        <p className={styles.emailText}>{props.profile.email}</p>
+                        <CopyButton className={styles.copyButton} text={props.profile.email} />
+                    </div>
+                </div>
+            )}
+
         </div>
     )
 }

src/apps/profiles/src/member-profile/page-layout/ProfilePageLayout.module.scss

@@ -7,12 +7,68 @@
     height: 100%;
 
     .profileHeaderWrap {
+        position: relative;
         background: url('../../lib/assets/profile-header-bg.png') no-repeat right top / auto, linear-gradient(#0d83c5, #0e89d5);
 
         @include ltelg {
             background: url('../../lib/assets/profile-header-bg-mobile.png') no-repeat right top /100% 100%;
         }
 
+        .downloadButtonWrap {
+            position: absolute;
+            top: $sp-4;
+            right: calc((100% - #{$xxl-min}) / 2);
+            max-width: $xxl-min;
+            width: 100%;
+            display: flex;
+            justify-content: flex-end;
+            padding-right: $sp-8;
+            z-index: 10;
+
+            @include ltexl {
+                right: $sp-8;
+            }
+
+            @include ltemd {
+                padding-right: $sp-6;
+                right: $sp-6;
+            }
+
+            @include ltesm {
+                padding-right: $sp-4;
+                right: $sp-4;
+            }
+
+            @include ltelg {
+                position: absolute;
+                top: $sp-4;
+                right: $sp-4;
+                left: auto;
+                max-width: none;
+                width: auto;
+                padding: 0;
+                pointer-events: auto;
+            }
+
+            > * {
+                pointer-events: auto;
+            }
+        }
+
+        .downloadButton {
+            color: $tc-white;
+            padding: $sp-2 $sp-4;
+            border-radius: 4px;
+            font-weight: $font-weight-bold;
+            font-family: $font-roboto;
+            font-size: 16px;
+
+            &:disabled {
+                opacity: 0.6;
+                cursor: not-allowed;
+            }
+        }
+
         .profileHeaderContent {
             padding: 0;
             max-height: 260px;