import { ComposeDBField, ComposeDBImageMetadata, composeDBProfileFieldFiveColorDisposition, dispositionFor, HasuraImageFieldKey, isHasuraImageField, Maybe, profileMapping, } from '@metafam/utils'; import { toSvg } from 'jdenticon'; import { isAddress } from 'viem'; import GuildCoverImageFull from '#assets/guild-background-full.jpeg'; import GuildCoverImageSmall from '#assets/guild-background-small.jpeg'; import PlayerCoverImageSmall from '#assets/player-background-small.jpg'; import { AccountType_Enum, Player } from '#graphql/autogen/hasura-sdk'; import { GuildPlayer, Patron, PlayerProfile } from '#graphql/types'; import { optimizedImage } from './imageHelpers'; export const getPlayerImage = ( player?: Maybe, ) => { const key = 'profileImageURL'; const link = optimizedImage(key, player?.profile?.[key]); const svg = toSvg(getPlayerName(player), 200); const blob = new Blob([svg], { type: 'image/svg+xml' }); const profileIcon = URL.createObjectURL(blob); return { profileIcon, link }; }; export const getPlayerBanner = (player: Maybe): string => { const key = 'bannerImageURL'; return ( optimizedImage(key, player?.profile?.[key], { height: 100 }) ?? PlayerCoverImageSmall.src ); }; export const getPlayerBannerFull = (player?: Maybe): string => { const key = 'bannerImageURL'; return optimizedImage(key, player?.profile?.[key]) || ''; }; export const getPlayerBackgroundFull = (player?: Maybe): string => { const key = 'backgroundImageURL'; return optimizedImage(key, player?.profile?.[key]) || ''; }; export const getGuildCoverImageFull = (): string => GuildCoverImageFull.src; export const getGuildCoverImageSmall = (): string => GuildCoverImageSmall.src; export const getPlayerUsername = (player?: Maybe): string | undefined => formatIfAddress(player?.profile?.username ?? undefined); export const getPlayerURL = ( player?: Maybe, opts: { rel?: boolean; default?: string } = {}, ) => { let { username } = player?.profile ?? {}; username ??= player?.ethereumAddress; const { rel: relative = true } = opts; if (username) { const path = `/player/${username}`; return `${relative ? '' : 'https://my.metagame.wtf'}${path}`; } return opts.default; }; export const getPlayerName = ( player?: Maybe, ): string | undefined => player?.profile?.name || formatIfAddress(player?.profile?.username ?? undefined) || formatAddress(player?.ethereumAddress); export const getPlayerDescription = ( player?: Maybe, ): string | undefined => player?.profile?.description ?? undefined; export const getPlayerMeetwithWalletCalendarUrl = ( player?: Maybe, ): string | undefined => player?.accounts?.find((acc) => acc.type === AccountType_Enum.Meetwithwallet) ?.identifier || undefined; export const formatAddress = (address = ''): string => `${address.slice(0, 6)}…${address.slice(-4)}`; export const formatIfAddress = (username = ''): string => isAddress(username) ? formatAddress(username) : username; export const hasImage = (player?: Maybe): boolean => !!player?.profile?.profileImageURL; export const hasuraToComposeDBProfile = ( profile: PlayerProfile, images: Record>, ) => { // todo we should be able to make this typesafe const composeDBPayload: Record = {}; Object.entries(profileMapping).forEach(([hasuraID, composeDBID]) => { const composeDBKey = composeDBID as ComposeDBField; const hasuraKey = hasuraID as keyof typeof profileMapping; if (isHasuraImageField(hasuraKey)) { const imageMetadata = images[hasuraKey as HasuraImageFieldKey]; if (imageMetadata) { composeDBPayload[composeDBKey] = imageMetadata; } } else { const hasuraValue = profile[hasuraKey]; if (hasuraValue != null) { if (composeDBKey === composeDBProfileFieldFiveColorDisposition) { const maskString = dispositionFor(hasuraValue as number); if (maskString) { composeDBPayload[composeDBKey] = maskString; } } else { composeDBPayload[composeDBKey] = hasuraValue; } } } }); return composeDBPayload; };