diff --git a/apps/easypid/src/features/wallet/FunkeCredentialsScreen.tsx b/apps/easypid/src/features/wallet/FunkeCredentialsScreen.tsx index 9de6cc2a..b7d59f9f 100644 --- a/apps/easypid/src/features/wallet/FunkeCredentialsScreen.tsx +++ b/apps/easypid/src/features/wallet/FunkeCredentialsScreen.tsx @@ -95,6 +95,8 @@ export function FunkeCredentialsScreen() { backgroundColor={credential.display.backgroundColor ?? '$grey-100'} issuer={credential.display.issuer.name} logo={credential.display.issuer.logo} + // TODO: we should have RAW metadata (date instance) and human metadata (string) + issuedAt={credential.metadata.issuedAt ? new Date(credential.metadata.issuedAt) : undefined} onPress={() => { pushToCredential(credential.id) }} @@ -121,10 +123,18 @@ interface FunkeCredentialRowCardProps { textColor: string issuer: string logo: DisplayImage | undefined + issuedAt?: Date onPress: () => void } -function FunkeCredentialRowCard({ name, backgroundColor, textColor, logo, onPress }: FunkeCredentialRowCardProps) { +function FunkeCredentialRowCard({ + name, + backgroundColor, + textColor, + logo, + issuedAt, + onPress, +}: FunkeCredentialRowCardProps) { const { pressStyle, handlePressIn, handlePressOut } = useScaleAnimation({ scaleInValue: 0.99 }) const icon = logo?.url ? ( @@ -155,9 +165,11 @@ function FunkeCredentialRowCard({ name, backgroundColor, textColor, logo, onPres {name.toLocaleUpperCase()} - - Issued on {formatDate(new Date(), { includeTime: false })} - + {issuedAt && ( + + Issued on {formatDate(issuedAt, { includeTime: false })} + + )} } />