chore: heygermany customer project

2026-07-11 10:52:27 +02:00
commit 6c231d1d36
370 changed files with 35571 additions and 0 deletions
--- a/apps/website/components/company/CandidateProfileAvatar.tsx
+++ b/apps/website/components/company/CandidateProfileAvatar.tsx
@@ -0,0 +1,216 @@
+import { Box } from '@pikku/mantine/core'
+import { IconUser } from '@tabler/icons-react'
+import { useEffect, useState } from 'react'
+
+const countryCodeToEmoji: Record<string, string> = {
+  AFG: '🇦🇫',
+  ALB: '🇦🇱',
+  DZA: '🇩🇿',
+  AND: '🇦🇩',
+  AGO: '🇦🇴',
+  ARG: '🇦🇷',
+  ARM: '🇦🇲',
+  AUS: '🇦🇺',
+  AUT: '🇦🇹',
+  AZE: '🇦🇿',
+  BHR: '🇧🇭',
+  BGD: '🇧🇩',
+  BLR: '🇧🇾',
+  BEL: '🇧🇪',
+  BIH: '🇧🇦',
+  BOL: '🇧🇴',
+  BRA: '🇧🇷',
+  BGR: '🇧🇬',
+  KHM: '🇰🇭',
+  CMR: '🇨🇲',
+  CAN: '🇨🇦',
+  CHL: '🇨🇱',
+  CHN: '🇨🇳',
+  COL: '🇨🇴',
+  CRI: '🇨🇷',
+  HRV: '🇭🇷',
+  CUB: '🇨🇺',
+  CYP: '🇨🇾',
+  CZE: '🇨🇿',
+  DNK: '🇩🇰',
+  ECU: '🇪🇨',
+  EGY: '🇪🇬',
+  SLV: '🇸🇻',
+  EST: '🇪🇪',
+  ETH: '🇪🇹',
+  FIN: '🇫🇮',
+  FRA: '🇫🇷',
+  GEO: '🇬🇪',
+  DEU: '🇩🇪',
+  GHA: '🇬🇭',
+  GRC: '🇬🇷',
+  GTM: '🇬🇹',
+  HND: '🇭🇳',
+  HUN: '🇭🇺',
+  ISL: '🇮🇸',
+  IND: '🇮🇳',
+  IDN: '🇮🇩',
+  IRN: '🇮🇷',
+  IRQ: '🇮🇶',
+  IRL: '🇮🇪',
+  ISR: '🇮🇱',
+  ITA: '🇮🇹',
+  JPN: '🇯🇵',
+  JOR: '🇯🇴',
+  KAZ: '🇰🇿',
+  KEN: '🇰🇪',
+  KWT: '🇰🇼',
+  KGZ: '🇰🇬',
+  LAO: '🇱🇦',
+  LVA: '🇱🇻',
+  LBN: '🇱🇧',
+  LBY: '🇱🇾',
+  LTU: '🇱🇹',
+  LUX: '🇱🇺',
+  MYS: '🇲🇾',
+  MEX: '🇲🇽',
+  MDA: '🇲🇩',
+  MNG: '🇲🇳',
+  MNE: '🇲🇪',
+  MAR: '🇲🇦',
+  NPL: '🇳🇵',
+  NLD: '🇳🇱',
+  NZL: '🇳🇿',
+  NIC: '🇳🇮',
+  NGA: '🇳🇬',
+  MKD: '🇲🇰',
+  NOR: '🇳🇴',
+  OMN: '🇴🇲',
+  PAK: '🇵🇰',
+  PAN: '🇵🇦',
+  PRY: '🇵🇾',
+  PER: '🇵🇪',
+  PHL: '🇵🇭',
+  POL: '🇵🇱',
+  PRT: '🇵🇹',
+  QAT: '🇶🇦',
+  ROU: '🇷🇴',
+  RUS: '🇷🇺',
+  SAU: '🇸🇦',
+  SRB: '🇷🇸',
+  SGP: '🇸🇬',
+  SVK: '🇸🇰',
+  SVN: '🇸🇮',
+  ZAF: '🇿🇦',
+  KOR: '🇰🇷',
+  ESP: '🇪🇸',
+  LKA: '🇱🇰',
+  SDN: '🇸🇩',
+  SWE: '🇸🇪',
+  CHE: '🇨🇭',
+  SYR: '🇸🇾',
+  TWN: '🇹🇼',
+  TJK: '🇹🇯',
+  THA: '🇹🇭',
+  TUN: '🇹🇳',
+  TUR: '🇹🇷',
+  TKM: '🇹🇲',
+  UGA: '🇺🇬',
+  UKR: '🇺🇦',
+  ARE: '🇦🇪',
+  GBR: '🇬🇧',
+  USA: '🇺🇸',
+  URY: '🇺🇾',
+  UZB: '🇺🇿',
+  VEN: '🇻🇪',
+  VNM: '🇻🇳',
+  YEM: '🇾🇪',
+  ZMB: '🇿🇲',
+  ZWE: '🇿🇼',
+}
+
+const getCountryFlag = (countryCode: string | null): string => {
+  if (!countryCode) return '🌍'
+
+  return countryCodeToEmoji[countryCode.toUpperCase()] || '🌍'
+}
+
+type CandidateProfileAvatarProps = {
+  countryCode: string | null
+  imageBorderWidth: number
+  badgeBorderWidth: number
+  badgeOffset: number
+  badgeSize: number
+  iconSize: number
+  name: string
+  profileImageUrl?: string | null
+  size: number
+}
+
+export function CandidateProfileAvatar({
+  countryCode,
+  imageBorderWidth,
+  badgeBorderWidth,
+  badgeOffset,
+  badgeSize,
+  iconSize,
+  name,
+  profileImageUrl,
+  size,
+}: CandidateProfileAvatarProps) {
+  const [imageFailed, setImageFailed] = useState(false)
+
+  useEffect(() => {
+    setImageFailed(false)
+  }, [profileImageUrl])
+
+  const showImage = Boolean(profileImageUrl) && !imageFailed
+
+  return (
+    <Box pos="relative" style={{ width: size, height: size, flexShrink: 0 }}>
+      <Box
+        style={{
+          width: size,
+          height: size,
+          borderRadius: '50%',
+          backgroundColor: 'var(--mantine-color-gray-1)',
+          border: `${imageBorderWidth}px solid var(--mantine-color-gray-3)`,
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          overflow: 'hidden',
+        }}
+      >
+        {showImage ? (
+          <Box
+            component="img"
+            src={profileImageUrl!}
+            alt={`${name} profile image`}
+            onError={() => setImageFailed(true)}
+            style={{
+              width: '100%',
+              height: '100%',
+              objectFit: 'cover',
+              display: 'block',
+            }}
+          />
+        ) : (
+          <IconUser size={iconSize} color="var(--mantine-color-gray-5)" />
+        )}
+      </Box>
+      <Box
+        style={{
+          position: 'absolute',
+          bottom: badgeOffset,
+          right: badgeOffset,
+          fontSize: `${Math.round(badgeSize * 0.58)}px`,
+          width: badgeSize,
+          height: badgeSize,
+          backgroundColor: 'white',
+          border: `${badgeBorderWidth}px solid var(--mantine-color-gray-3)`,
+          borderRadius: '50%',
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+        }}
+      >
+        {getCountryFlag(countryCode)}
+      </Box>
+    </Box>
+  )
+}