feat(LOY-195): digital team member card button on my pages overview

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

@@ -0,0 +1,37 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
+import { Typography } from "@scandic-hotels/design-system/Typography"
+
+import { env } from "@/env/server"
+
+import { getIntl } from "@/i18n"
+
+import styles from "./digitalTeamMemberCard.module.css"
+
+import type { User } from "@/types/user"
+
+interface DigitalTeamMemberCardProps {
+  user: User
+}
+
+export default async function DigitalTeamMemberCard(
+  // TODO: Make a check whether user is eligible for benefits or not
+  _props: DigitalTeamMemberCardProps
+) {
+  if (!env.ENABLE_DTMC) {
+    return null
+  }
+
+  const intl = await getIntl()
+
+  return (
+    <button className={styles.card} type="button">
+      <Typography variant="Body/Paragraph/mdBold">
+        <span className={styles.text}>
+          {/* @ts-expect-error Icon is supported in font, just not in React Material Symbols package */}
+          <MaterialIcon icon="id_card" size={24} color="CurrentColor" />
+          {intl.formatMessage({ defaultMessage: "Show Team Member Card" })}
+        </span>
+      </Typography>
+    </button>
+  )
+}