Skip to content

Commit

Permalink
bugfix #187
Browse files Browse the repository at this point in the history
  • Loading branch information
@srikanth716
srikanth716 committed Nov 15, 2022
1 parent 60d5172 commit 3b95b61
Show file tree
Hide file tree
Showing 3 changed files with 97 additions and 74 deletions.
16 changes: 9 additions & 7 deletions locales/en.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,12 +19,12 @@
"allowCameraButton": "Allow access to camera"
},
"VcDetails": {
"idType":"ID type",
"nationalCard":"National Identity Card",
"idType": "ID type",
"nationalCard": "National Identity Card",
"generatedOn": "Generated on",
"uin":"UIN",
"vid":"VID",
"idtype":"Idtype",
"uin": "UIN",
"vid": "VID",
"idtype": "Idtype",
"status": "Status",
"valid": "Valid",
"photo": "Photo",
Expand Down Expand Up @@ -103,12 +103,14 @@
"header": "Enter the MOSIP-provided UIN or VID of the {{vcLabel}} you wish to retrieve",
"generateVc": "Generate {{vcLabel}}",
"enterId": "Enter your {{idType}}",
"noUIN/VID": "Don't have your UIN/VID? Get it here"
"noUIN/VID": "Don't have your UIN/VID? Get it here",
"requestingOTP": "Requesting OTP..."
},
"GetIdInputModal": {
"header": "To retrieve your UIN or VID, enter your Application {{vcLabel}} number",
"getUIN": "Get UIN/VID",
"applicationId": "Application {{vcLabel}} number",
"requestingOTP": "Requesting OTP...",
"qstnMarkToolTip" : "Application {{vcLabel}} Number is printed on the acknowledgment provided after enrollment"
},
"OtpVerificationModal": {
Expand Down Expand Up @@ -292,4 +294,4 @@
"allowAccess": "Allow access to camera"
}
}
}
}
149 changes: 82 additions & 67 deletions screens/Home/MyVcs/GetIdInputModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,9 @@ import {
GetIdInputModalProps,
useGetIdInputModal,
} from './GetIdInputModalController';
import { KeyboardAvoidingView, Platform } from 'react-native';
import { useTranslation } from 'react-i18next';
import { MessageOverlay } from '../../../components/MessageOverlay';

export const GetIdInputModal: React.FC<GetIdInputModalProps> = (props) => {
const { t } = useTranslation('GetIdInputModal');
Expand All @@ -20,74 +22,87 @@ export const GetIdInputModal: React.FC<GetIdInputModalProps> = (props) => {

return (
<Modal onDismiss={props.onDismiss} isVisible={props.isVisible}>
<Column fill align="space-between" padding="32 24">
<Text align="center">
{t('header', { vcLabel: controller.vcLabel.singular })}
</Text>
<Column>
<Row crossAlign="flex-end">
<Column fill>
<Input
placeholder={!controller.id ? inputLabel : ''}
label={controller.id ? inputLabel : ''}
labelStyle={{
color: controller.isInvalid
? Theme.Colors.errorMessage
: Theme.Colors.textValue,
}}
style={Theme.Styles.placeholder}
value={controller.id}
keyboardType="number-pad"
rightIcon={
<Tooltip
popover={
<Text>
{t('qstnMarkToolTip', {
vcLabel: controller.vcLabel.singular,
})}
</Text>
}
width={Dimensions.get('screen').width * 0.8}
height={Dimensions.get('screen').height * 0.2}
backgroundColor={'lightgray'}
withPointer={true}
skipAndroidStatusBar={true}
onOpen={controller.ACTIVATE_ICON_COLOR}
onClose={controller.DEACTIVATE_ICON_COLOR}>
{controller.isInvalid ? (
<Icon
name="error"
size={18}
color={
!controller.iconColor
? Theme.Colors.errorMessage
: Theme.Colors.Icon
}
/>
) : (
<Icon
name={'help'}
size={18}
color={!controller.iconColor ? null : Theme.Colors.Icon}
/>
)}
</Tooltip>
}
errorStyle={{ color: Theme.Colors.errorMessage }}
errorMessage={controller.idError}
onChangeText={controller.INPUT_ID}
ref={(node) => !controller.idInputRef && controller.READY(node)}
/>
</Column>
</Row>
<Button
title={t('getUIN', { vcLabel: controller.vcLabel.singular })}
margin="24 0 0 0"
onPress={controller.VALIDATE_INPUT}
loading={controller.isRequestingOtp}
/>
<KeyboardAvoidingView
style={{ flex: 1 }}
behavior={Platform.OS === 'ios' ? 'padding' : 'height'}>
<Column fill align="space-between" padding="32 24">
<Text align="center">
{t('header', { vcLabel: controller.vcLabel.singular })}
</Text>
<Column>
<Row crossAlign="flex-end">
<Column fill>
<Input
placeholder={!controller.id ? inputLabel : ''}
label={controller.id ? inputLabel : ''}
labelStyle={{
color: controller.isInvalid
? Theme.Colors.errorMessage
: Theme.Colors.textValue,
}}
style={Theme.Styles.placeholder}
value={controller.id}
keyboardType="number-pad"
rightIcon={
<Tooltip
popover={
<Text>
{t('qstnMarkToolTip', {
vcLabel: controller.vcLabel.singular,
})}
</Text>
}
width={Dimensions.get('screen').width * 0.8}
height={Dimensions.get('screen').height * 0.2}
backgroundColor={'lightgray'}
withPointer={true}
skipAndroidStatusBar={true}
onOpen={controller.ACTIVATE_ICON_COLOR}
onClose={controller.DEACTIVATE_ICON_COLOR}>
{controller.isInvalid ? (
<Icon
name="error"
size={18}
color={
!controller.iconColor
? Theme.Colors.errorMessage
: Theme.Colors.Icon
}
/>
) : (
<Icon
name={'help'}
size={18}
color={
!controller.iconColor ? null : Theme.Colors.Icon
}
/>
)}
</Tooltip>
}
errorStyle={{ color: Theme.Colors.errorMessage }}
errorMessage={controller.idError}
onChangeText={controller.INPUT_ID}
ref={(node) =>
!controller.idInputRef && controller.READY(node)
}
/>
</Column>
</Row>
<Button
title={t('getUIN', { vcLabel: controller.vcLabel.singular })}
margin="24 0 0 0"
onPress={controller.VALIDATE_INPUT}
loading={controller.isRequestingOtp}
/>
</Column>
</Column>
</Column>
<MessageOverlay
isVisible={controller.isRequestingOtp}
title={t('requestingOTP')}
progress
/>
</KeyboardAvoidingView>
</Modal>
);
};
6 changes: 6 additions & 0 deletions screens/Home/MyVcs/IdInputModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import { KeyboardAvoidingView, Platform, TextInput } from 'react-native';
import { TouchableOpacity } from 'react-native';
import { individualId } from '../../../shared/constants';
import { GET_INDIVIDUAL_ID } from '../../../shared/constants';
import { MessageOverlay } from '../../../components/MessageOverlay';

export const IdInputModal: React.FC<IdInputModalProps> = (props) => {
const { t } = useTranslation('IdInputModal');
Expand Down Expand Up @@ -104,6 +105,11 @@ export const IdInputModal: React.FC<IdInputModalProps> = (props) => {
)}
</Column>
</Column>
<MessageOverlay
isVisible={controller.isRequestingOtp}
title={t('requestingOTP')}
progress
/>
</KeyboardAvoidingView>
</Modal>
);
Expand Down

0 comments on commit 3b95b61

Please sign in to comment.