mirror of
https://github.com/mosip/inji-wallet.git
synced 2026-01-09 05:27:57 -05:00
[INJIMOB-956]: [Release] Update swift pacakge for VcRenderer (#2092)
* [INJIMOB-956]: Support SVG list (#2090) Signed-off-by: balachandarg-tw <balachandar.g@thoughtworks.com> * [INJIMOB-956] chore: update vc-renderer swift package version Signed-off-by: KiruthikaJeyashankar <kiruthikavjshankar@gmail.com> Co-authored-by: balachandarg-tw <balachandar.g@thoughtworks.com> --------- Signed-off-by: balachandarg-tw <balachandar.g@thoughtworks.com> Signed-off-by: KiruthikaJeyashankar <kiruthikavjshankar@gmail.com> Co-authored-by: KiruthikaJeyashankar <kiruthikavjshankar@gmail.com>
This commit is contained in:
@@ -409,5 +409,5 @@ fileignoreconfig:
|
||||
- filename: shared/vcRenderer/VcRenderer.ts
|
||||
checksum: 02f7d58fb149ecd3f10dd0bdfb6e85c4b3ae41d29a40d192056ffec0367b53c6
|
||||
- filename: components/VC/Views/VCDetailView.tsx
|
||||
checksum: 28537e64ff03c0bf9580d02fda145b49181a073c3df3f792674275a62f1e5667
|
||||
checksum: 890c216a5632ac77b938f2f58f2123a669ea45b933a41931b8e7324e315f2d50
|
||||
version: "1.0"
|
||||
|
||||
@@ -4,6 +4,7 @@ import Icon from 'react-native-vector-icons/FontAwesome';
|
||||
import Feather from 'react-native-vector-icons/Feather';
|
||||
import {
|
||||
Dimensions,
|
||||
FlatList,
|
||||
Image,
|
||||
ImageBackground,
|
||||
ImageBackgroundProps,
|
||||
@@ -55,31 +56,9 @@ export const VCDetailView: React.FC<VCItemDetailsProps> = (
|
||||
const verifiableCredential = props.credential;
|
||||
const wellknownDisplayProperty = new Display(props.wellknown);
|
||||
|
||||
const [svgAspectRatio, setSvgAspectRatio] = useState<number | null>(null);
|
||||
|
||||
const {width: deviceWidth} = Dimensions.get('window');
|
||||
const targetHeight = svgAspectRatio
|
||||
? deviceWidth * svgAspectRatio
|
||||
: deviceWidth * 0.7;
|
||||
|
||||
const svgTemplate =
|
||||
Array.isArray(props.svgTemplate) && props.svgTemplate.length > 0
|
||||
? props.svgTemplate[0]
|
||||
: null;
|
||||
|
||||
useEffect(() => {
|
||||
if (svgTemplate) {
|
||||
const match = svgTemplate.match(/viewBox="0 0 (\d+) (\d+)"/);
|
||||
if (match) {
|
||||
const [, w, h] = match.map(Number);
|
||||
setSvgAspectRatio(h / w);
|
||||
} else {
|
||||
setSvgAspectRatio(null);
|
||||
}
|
||||
} else {
|
||||
setSvgAspectRatio(null);
|
||||
}
|
||||
}, [svgTemplate]);
|
||||
const CARD_WIDTH = deviceWidth * 0.8;
|
||||
const CARD_SPACING = 16;
|
||||
|
||||
const shouldShowHrLine = verifiableCredential => {
|
||||
let availableFieldNames: string[] = [];
|
||||
@@ -134,26 +113,70 @@ export const VCDetailView: React.FC<VCItemDetailsProps> = (
|
||||
return (
|
||||
<>
|
||||
<Column scroll>
|
||||
{svgTemplate ? (
|
||||
{Array.isArray(props.svgTemplate) && props.svgTemplate.length > 0 ? (
|
||||
<Column padding="30 0 0 0">
|
||||
<Column padding="0 16 0 16">
|
||||
<SvgCss
|
||||
xml={svgTemplate}
|
||||
width="100%"
|
||||
height={targetHeight}
|
||||
preserveAspectRatio="xMidYMid meet"
|
||||
style={{backgroundColor: 'transparent'}}
|
||||
/>
|
||||
</Column>
|
||||
{svgTemplate?.includes(QR_IMAGE_ID) && (
|
||||
<Button
|
||||
testID="zoomQrCode"
|
||||
title="Tap to zoom QR Code"
|
||||
type="gradient"
|
||||
size="Large"
|
||||
onPress={() => setShowQrOverlay(true)}
|
||||
/>
|
||||
)}
|
||||
<FlatList
|
||||
data={props.svgTemplate}
|
||||
keyExtractor={(_, index) => `svg-${index}`}
|
||||
horizontal
|
||||
showsHorizontalScrollIndicator={false}
|
||||
pagingEnabled={props.svgTemplate.length > 1}
|
||||
snapToInterval={
|
||||
props.svgTemplate.length > 1
|
||||
? CARD_WIDTH + CARD_SPACING
|
||||
: undefined
|
||||
}
|
||||
decelerationRate="fast"
|
||||
snapToAlignment="start"
|
||||
contentContainerStyle={{
|
||||
paddingHorizontal: 16,
|
||||
justifyContent: 'center',
|
||||
alignItems:
|
||||
props.svgTemplate.length === 1 ? 'center' : 'flex-start',
|
||||
}}
|
||||
ItemSeparatorComponent={() => (
|
||||
<View style={{width: CARD_SPACING}} />
|
||||
)}
|
||||
renderItem={({item}) => {
|
||||
let aspectRatio: number | null = null;
|
||||
const match = item.match(/viewBox="0 0 (\d+) (\d+)"/);
|
||||
if (match) {
|
||||
const [, w, h] = match.map(Number);
|
||||
aspectRatio = h / w;
|
||||
}
|
||||
|
||||
const targetWidth =
|
||||
props.svgTemplate.length === 1
|
||||
? deviceWidth - 32
|
||||
: CARD_WIDTH;
|
||||
const targetHeight = aspectRatio
|
||||
? targetWidth * aspectRatio
|
||||
: targetWidth * 0.7;
|
||||
|
||||
return (
|
||||
<Column style={{width: targetWidth}}>
|
||||
<SvgCss
|
||||
xml={item}
|
||||
width="100%"
|
||||
height={targetHeight}
|
||||
preserveAspectRatio="xMidYMid meet"
|
||||
/>
|
||||
|
||||
<View style={{height: 12}} />
|
||||
|
||||
{item.includes(QR_IMAGE_ID) && (
|
||||
<Button
|
||||
testID="zoomQrCode"
|
||||
title="Tap to zoom QR Code"
|
||||
type="gradient"
|
||||
size="Large"
|
||||
onPress={() => setShowQrOverlay(true)}
|
||||
/>
|
||||
)}
|
||||
</Column>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
|
||||
{showQrOverlay && (
|
||||
<QrCodeOverlay
|
||||
@@ -257,7 +280,7 @@ export const VCDetailView: React.FC<VCItemDetailsProps> = (
|
||||
</Column>
|
||||
)}
|
||||
</Column>
|
||||
{!svgTemplate &&
|
||||
{!props.svgTemplate &&
|
||||
props.vcHasImage &&
|
||||
!props.verifiableCredentialData?.vcMetadata.isExpired && (
|
||||
<View
|
||||
|
||||
@@ -1,6 +1,15 @@
|
||||
{
|
||||
"originHash" : "a3146fb582ba55930e9db89f50cf0454e89ade6fb6a380b0e7d649e8527e703a",
|
||||
"pins" : [
|
||||
{
|
||||
"identity" : "aexml",
|
||||
"kind" : "remoteSourceControl",
|
||||
"location" : "https://github.com/tadija/AEXML.git",
|
||||
"state" : {
|
||||
"revision" : "db806756c989760b35108146381535aec231092b",
|
||||
"version" : "4.7.0"
|
||||
}
|
||||
},
|
||||
{
|
||||
"identity" : "alamofire",
|
||||
"kind" : "remoteSourceControl",
|
||||
@@ -79,7 +88,7 @@
|
||||
"location" : "https://github.com/mosip/inji-vc-renderer-ios-swift.git",
|
||||
"state" : {
|
||||
"branch" : "release-0.1.x",
|
||||
"revision" : "58237eae6caf198d725ecfcd397b4d6f8f2d87bd"
|
||||
"revision" : "97842f70c7bc510afb0bb415b9806b4e722808f0"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
||||
Reference in New Issue
Block a user