Merged in feat/LOY-232-DTMC-API-INTEGRATION (pull request #2454)

feat(LOY-232): DTMC API Integration

* feat(LOY-232): DTMC API Integration

* feat(LOY-232): use employment data in team member card

* refactor(LOY-232): remove static data, return employment details in parsed response & fix tests

* refactor(LOY-232): improve DTMC API Linking error control flow + make res type safe

* fix(LOY-232): remove unused utils

* fix(LOY-232): error vars


Approved-by: Christian Andolf
Approved-by: Erik Tiekstra

apps/scandic-web/components/MyPages/DigitalTeamMemberCard/Content.tsx

@@ -6,6 +6,7 @@ import { useIntl } from "react-intl"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { debounce } from "@/utils/debounce"
+import { getEmployeeInfo } from "@/utils/user"
 
 import styles from "./digitalTeamMemberCard.module.css"
 
@@ -20,6 +21,9 @@ export default function DigitalTeamMemberCardContent({
 }: DigitalTeamMemberCardCardProps) {
   const intl = useIntl()
   const cardRef = useRef<HTMLDivElement>(null)
+
+  const employeeInfo = getEmployeeInfo(user)
+  const notAvailableText = "N/A"
   const [isHovering, setIsHovering] = useState(false)
   const [coords, setCoords] = useState({ x: 0, y: 0 })
   const shimmerRef = useRef<HTMLDivElement>(null)
@@ -117,17 +121,13 @@ export default function DigitalTeamMemberCardContent({
               <span>
                 {intl.formatMessage({ defaultMessage: "Team Member" })}
               </span>
-              {/* TODO: Should display country of employment */}
-              {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
-              <span>SWE</span>
+              <span>{employeeInfo?.country || notAvailableText}</span>
             </div>
           </Typography>
           <div className={styles.middle}>
             <div className={styles.employeeNumber}>
               <Typography variant="Title/sm">
-                {/* TODO: Should display employee number */}
-                {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
-                <div>123 456</div>
+                <div>{employeeInfo?.employeeId || notAvailableText}</div>
               </Typography>
               <svg
                 width="42"
@@ -153,15 +153,12 @@ export default function DigitalTeamMemberCardContent({
           </div>
           <Typography variant="Tag/sm">
             <div className={styles.bottom}>
+              <span>{employeeInfo?.location || notAvailableText}</span>
               <span>
-                {/* TODO: Should display department of employment */}
-                {/* eslint-disable formatjs/no-literal-string-in-jsx */}
-                Haymarket by Scandic
-                {/* eslint-enable */}
+                {employeeInfo?.retired
+                  ? intl.formatMessage({ defaultMessage: "Retired" })
+                  : intl.formatMessage({ defaultMessage: "Employee" })}
               </span>
-              {/* TODO: Should display current state of employment */}
-              {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
-              <span>Employee</span>
             </div>
           </Typography>
         </div>

apps/scandic-web/components/MyPages/DigitalTeamMemberCard/index.tsx

@@ -1,5 +1,7 @@
 import { env } from "@/env/server"
 
+import { isEmployeeLinked } from "@/utils/user"
+
 import DigitalTeamMemberCardClient from "./Client"
 
 import type { User } from "@scandic-hotels/trpc/types/user"
@@ -15,7 +17,9 @@ export default async function DigitalTeamMemberCard({
     return null
   }
 
-  // TODO: Make a check whether user is eligible for benefits or not
-
+  const hasEmploymentData = isEmployeeLinked(user)
+  if (!hasEmploymentData) {
+    return null
+  }
   return <DigitalTeamMemberCardClient user={user} />
 }