github/inji-wallet
1
1
Fork 0
mirror of https://github.com/mosip/inji-wallet.git synced 2026-01-09 13:38:01 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix: QR code display in small iOS screen

Browse Source
This commit is contained in:
Paolo Miguel de Leon
2022-10-13 15:06:45 +08:00
parent 188e3ced49
commit 9ecc01fbf4
2 changed files with 81 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ios/MOSIPResidentApp.xcodeproj/project.pbxproj
View File

@@ -302,7 +302,7 @@
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
CLANG_ENABLE_MODULES = YES;
CODE_SIGN_ENTITLEMENTS = MOSIPResidentApp/MOSIPResidentApp.entitlements;
CURRENT_PROJECT_VERSION = 10.3;
CURRENT_PROJECT_VERSION = 10.5;
DEVELOPMENT_TEAM = 9L83VVTX8B;
ENABLE_BITCODE = NO;
GCC_PREPROCESSOR_DEFINITIONS = (
@@ -335,7 +335,7 @@
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
CLANG_ENABLE_MODULES = YES;
CODE_SIGN_ENTITLEMENTS = MOSIPResidentApp/MOSIPResidentApp.entitlements;
CURRENT_PROJECT_VERSION = 10.3;
CURRENT_PROJECT_VERSION = 10.5;
DEVELOPMENT_TEAM = 9L83VVTX8B;
INFOPLIST_FILE = MOSIPResidentApp/Info.plist;
IPHONEOS_DEPLOYMENT_TARGET = 12.0;

131
screens/Request/RequestScreen.tsx
View File

@@ -4,7 +4,7 @@ import { Button, Centered, Column, Row, Text } from '../../components/ui';
import { Colors } from '../../components/ui/styleUtils';
import { useRequestScreen } from './RequestScreenController';
import { useTranslation } from 'react-i18next';
import { TFunction, useTranslation } from 'react-i18next';
import { Switch } from 'react-native-elements';
import { Platform } from 'react-native';
@@ -15,63 +15,90 @@ export const RequestScreen: React.FC = () => {
return (
<Column fill padding="24" backgroundColor={Colors.LightGrey}>
{controller.isBluetoothDenied && (
<Centered fill>
<Text color={Colors.Red} align="center">
{t('bluetoothDenied', { vcLabel: controller.vcLabel.singular })}
</Text>
<Button
margin={[32, 0, 0, 0]}
title={t('gotoSettings')}
onPress={controller.GOTO_SETTINGS}
/>
</Centered>
<BluetoothPrompt t={t} controller={controller} />
)}
{!controller.isCheckingBluetoothService &&
!controller.isBluetoothDenied ? (
<Column fill>
<Text align="center">
{t('showQrCode', { vcLabel: controller.vcLabel.singular })}
</Text>
<Centered fill>
{controller.connectionParams !== '' ? (
<QRCode
size={200}
value={controller.connectionParams}
backgroundColor={Colors.LightGrey}
/>
) : null}
</Centered>
<Row align="center" crossAlign="center" margin={[0, 0, 48, 0]}>
<Text margin={[0, 16, 0, 0]}>Offline</Text>
<Switch
value={controller.sharingProtocol === 'ONLINE'}
onValueChange={controller.SWITCH_PROTOCOL}
disabled={Platform.OS === 'ios'}
/>
<Text margin={[0, 0, 0, 16]}>Online</Text>
</Row>
{controller.statusMessage !== '' && (
<Column elevation={1} padding="16 24">
<Text>{controller.statusMessage}</Text>
{controller.statusHint !== '' && (
<Text size="small" color={Colors.Grey}>
{controller.statusHint}
</Text>
)}
{controller.isStatusCancellable && (
<Button
margin={[8, 0, 0, 0]}
title={t('cancel', { ns: 'common' })}
onPress={controller.CANCEL}
/>
)}
</Column>
<Column align="flex-end" fill>
{controller.isWaitingForConnection && (
<SharingCode t={t} controller={controller} />
)}
<StatusMessage t={t} controller={controller} />
</Column>
) : null}
</Column>
);
};
const BluetoothPrompt: React.FC<RequestScreenProps> = ({ t, controller }) => {
return (
<Centered fill>
<Text color={Colors.Red} align="center">
{t('bluetoothDenied', { vcLabel: controller.vcLabel.singular })}
</Text>
<Button
margin={[32, 0, 0, 0]}
title={t('gotoSettings')}
onPress={controller.GOTO_SETTINGS}
/>
</Centered>
);
};
const StatusMessage: React.FC<RequestScreenProps> = ({ t, controller }) => {
return (
controller.statusMessage !== '' && (
<Column elevation={1} padding="16 24">
<Text>{controller.statusMessage}</Text>
{controller.statusHint !== '' && (
<Text size="small" color={Colors.Grey}>
{controller.statusHint}
</Text>
)}
{controller.isStatusCancellable && (
<Button
margin={[8, 0, 0, 0]}
title={t('cancel', { ns: 'common' })}
onPress={controller.CANCEL}
/>
)}
</Column>
)
);
};
const SharingCode: React.FC<RequestScreenProps> = ({ t, controller }) => {
return (
<React.Fragment>
<Text align="center">
{t('showQrCode', { vcLabel: controller.vcLabel.singular })}
</Text>
<Centered fill>
{controller.connectionParams !== '' ? (
<QRCode
size={200}
value={controller.connectionParams}
backgroundColor={Colors.LightGrey}
/>
) : null}
</Centered>
<Row align="center" crossAlign="center" margin={[0, 0, 48, 0]}>
<Text margin={[0, 16, 0, 0]}>Offline</Text>
<Switch
value={controller.sharingProtocol === 'ONLINE'}
onValueChange={controller.SWITCH_PROTOCOL}
disabled={Platform.OS === 'ios'}
/>
<Text margin={[0, 0, 0, 16]}>Online</Text>
</Row>
</React.Fragment>
);
};
interface RequestScreenProps {
t: TFunction;
controller: ReturnType<typeof useRequestScreen>;
}