Skip to content

Commit

Permalink
Fix(INJI-439): Made changes in the MosipVCItemDetailes component
Browse files Browse the repository at this point in the history 
Signed-off-by: anil_majji <[email protected]>
  • Loading branch information
@Anil-kumar-Majji
Anil-kumar-Majji committed Nov 23, 2023
1 parent ecef18d commit 574b5c4
Showing 1 changed file with 75 additions and 71 deletions.
146 changes: 75 additions & 71 deletions components/VC/MosipVCItem/MosipVCItemDetails.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,7 @@ export const MosipVCItemDetails: React.FC<
resizeMode="stretch"
style={Theme.Styles.openCardBgContainer}
source={Theme.OpenCard}>
<Row align="space-between" padding="10" margin="0 10 0 8">
<Row padding="3" margin="0 10 0 8">
<Column align="space-evenly" crossAlign="center">
<Image
source={getProfileImage(
Expand All @@ -96,7 +96,7 @@ export const MosipVCItemDetails: React.FC<
<QrCodeOverlay qrCodeDetailes={String(verifiableCredential)} />
<Column margin="20 0 0 0">{issuerLogo}</Column>
</Column>
<Column align="space-evenly" padding="10">
<Column padding="10" margin="0 15">
<Column>
<Text
testID="fullNameTitle"
Expand All @@ -116,8 +116,9 @@ export const MosipVCItemDetails: React.FC<
)}
</Text>
</Column>
<Row>
<Column>
<Column>
<Row>
{/* Gender */}
<Column margin="20 0 0 0">
<Text
testID="gender"
Expand All @@ -136,6 +137,26 @@ export const MosipVCItemDetails: React.FC<
)}
</Text>
</Column>
{/* Date of Borth */}
<Column margin="20 0 0 56">
<Text
testID="dateOfBirth"
weight="regular"
size="smaller"
color={Theme.Colors.DetailsLabel}>
{t('dateOfBirth')}
</Text>
<Text
testID="dateOfBirthValue"
weight="semibold"
size="smaller"
color={Theme.Colors.Details}>
{formattedDateOfBirth()}
</Text>
</Column>
</Row>
<Row>
{/* ID Type */}
<Column margin="25 0 0 0">
<Text
testID="idType"
Expand All @@ -153,108 +174,91 @@ export const MosipVCItemDetails: React.FC<
{t('nationalCard')}
</Text>
</Column>
{uin ? (
<Column margin="25 0 0 0">
<Text
testID="uin"
weight="regular"
size="smaller"
color={Theme.Colors.DetailsLabel}>
{t('uin')}
</Text>
{/* Status */}
<Column margin="25 0 0 20">
<Text
testID="status"
weight="regular"
size="smaller"
color={Theme.Colors.DetailsLabel}>
{t('status')}
</Text>
<Row
style={{
justifyContent: 'flex-start',
alignItems: 'center',
}}>
{props.vc?.isVerified && <VerifiedIcon />}
<Text
testID="uinNumber"
testID="valid"
weight="semibold"
size="smaller"
color={Theme.Colors.Details}>
{uin}
{t('valid')}
</Text>
</Column>
) : null}
</Row>
</Column>
</Row>

{vid ? (
<Column margin="25 0 0 0">
<Text
testID="vid"
weight="regular"
size="smaller"
color={Theme.Colors.DetailsLabel}>
{t('vid')}
</Text>
<Text
testID="vidNumber"
weight="semibold"
size="smaller"
color={Theme.Colors.Details}>
{vid}
</Text>
</Column>
) : null}
<Column margin="30 0 0 0">
{/* UIN or VID */}
{uin ? (
<Column margin="20 0 0 0">
<Text
testID="generatedOnTitle"
testID="uin"
weight="regular"
size="smaller"
color={Theme.Colors.DetailsLabel}>
{t('generatedOn')}
{t('uin')}
</Text>
<Text
testID="generatedOnValue"
testID="uinNumber"
weight="semibold"
size="smaller"
color={Theme.Colors.Details}>
{new Date(props.vc?.generatedOn).toLocaleDateString()}
{uin}
</Text>
</Column>
</Column>
<Column margin="0 0 0 38">
) : null}
{vid ? (
<Column margin="20 0 0 0">
<Text
testID="dateOfBirth"
style={{maxWidth: 121}}
testID="vid"
weight="regular"
size="smaller"
color={Theme.Colors.DetailsLabel}>
{t('dateOfBirth')}
{t('vid')}
</Text>
<Text
testID="dateOfBirthValue"
testID="vidNumber"
weight="semibold"
size="smaller"
color={Theme.Colors.Details}>
{formattedDateOfBirth()}
{vid}
</Text>
</Column>
<Column
style={{marginTop: Dimensions.get('window').height * 0.04}}>
) : null}
<Row>
{/* Generated On */}
<Column margin="20 0 0 0">
<Text
testID="status"
testID="generatedOnTitle"
weight="regular"
size="smaller"
color={Theme.Colors.DetailsLabel}>
{t('status')}
{t('generatedOn')}
</Text>
<Text
testID="generatedOnValue"
weight="semibold"
size="smaller"
color={Theme.Colors.Details}>
{new Date(props.vc?.generatedOn).toLocaleDateString()}
</Text>
<Row
style={{
justifyContent: 'flex-start',
alignItems: 'center',
}}>
{props.vc?.isVerified && <VerifiedIcon />}
<Text
testID="valid"
style={{maxWidth: 63}}
weight="semibold"
size="smaller"
color={Theme.Colors.Details}>
{t('valid')}
</Text>
</Row>
</Column>
<Column
style={{marginTop: Dimensions.get('window').height * 0.1}}>
{/* Phone Number */}
<Column margin="20 0 0 8">
<Text
testID="phoneNumber"
style={{maxWidth: 80}}
weight="regular"
size="smaller"
color={Theme.Colors.DetailsLabel}>
Expand All @@ -270,8 +274,8 @@ export const MosipVCItemDetails: React.FC<
)}
</Text>
</Column>
</Column>
</Row>
</Row>
</Column>
</Column>
</Row>
<View style={Theme.Styles.hrLine}></View>
Expand Down

0 comments on commit 574b5c4

Please sign in to comment.