Skip to content

Commit 0e809bf

Browse files
sanderPostmasanderPostma
authored
Merge pull request #78 from Sphereon-Opensource/feature/VDX-298
VDX-298: Do not show deeplink button on desktop browser.
2 parents 5c4d277 + e34eb2c commit 0e809bf

6 files changed

Lines changed: 21 additions & 109 deletions

File tree

‎packages/oid4vci-demo-frontend/src/components/AuthenticationQR/index.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -111,7 +111,7 @@ class AuthenticationQR extends Component<AuthenticationQRProps> {
111111
render() {
112112
// Show the loader until we have details on which parameters to load into the QR code
113113
return this.state.qrCode ? (
114-
<NonMobileOS><div>{this.state.qrCode}</div></NonMobileOS>
114+
<div>{this.state.qrCode}</div>
115115
) : (
116116
<BallTriangle color="#352575" height="100" width="100" />
117117
)

‎packages/oid4vci-demo-frontend/src/configs/account.banqup.json‎

Lines changed: 0 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,6 @@
1515
"src": "banqup/logo.svg"
1616
},
1717
"mobile": {
18-
"logo": {
19-
"src": "banqup/logo.svg",
20-
"alt": "banqup",
21-
"width": 65,
22-
"height": 65
23-
},
2418
"backgroundColor": "#EFFFF5"
2519
}
2620
},
@@ -55,12 +49,6 @@
5549
"src": "banqup/logo.svg"
5650
},
5751
"mobile": {
58-
"logo": {
59-
"src": "banqup/logo.svg",
60-
"alt": "banqup",
61-
"width": 65,
62-
"height": 65
63-
},
6452
"backgroundColor": "#EFFFF5"
6553
},
6654
"rightPaneGrid": {
@@ -158,12 +146,6 @@
158146
"rightPaneButtonHeight": "48px",
159147
"rightPaneButtonStepId": "toCompanyFlow",
160148
"mobile": {
161-
"logo": {
162-
"src": "bank/logo.svg",
163-
"alt": "bank",
164-
"width": 65,
165-
"height": 65
166-
}
167149
}
168150
},
169151
"infoRequest": {
@@ -177,12 +159,6 @@
177159
"src": "banqup/logo.svg"
178160
},
179161
"mobile": {
180-
"logo": {
181-
"src": "banqup/logo.svg",
182-
"alt": "banqup",
183-
"width": 65,
184-
"height": 65
185-
},
186162
"backgroundColor": "#EFFFF5"
187163
},
188164
"form": [
@@ -241,12 +217,6 @@
241217
"src": "banqup/logo.svg"
242218
},
243219
"mobile": {
244-
"logo": {
245-
"src": "banqup/logo.svg",
246-
"alt": "banqup",
247-
"width": 65,
248-
"height": 65
249-
}
250220
}
251221
},
252222
"verifyEmail": {

‎packages/oid4vci-demo-frontend/src/configs/identity.banqup.json‎

Lines changed: 1 addition & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -19,12 +19,6 @@
1919
"src": "banqup/logo.svg"
2020
},
2121
"mobile": {
22-
"logo": {
23-
"src": "banqup/logo.svg",
24-
"alt": "banqup",
25-
"width": 65,
26-
"height": 65
27-
},
2822
"backgroundColor": "#EFFFF5"
2923
},
3024
"rightPaneGrid": {
@@ -114,12 +108,6 @@
114108
"src": "banqup/logo.svg"
115109
},
116110
"mobile": {
117-
"logo": {
118-
"src": "banqup/logo.svg",
119-
"alt": "banqup",
120-
"width": 65,
121-
"height": 65
122-
},
123111
"backgroundColor": "#EFFFF5"
124112
}
125113
},
@@ -154,12 +142,6 @@
154142
"src": "banqup/logo.svg"
155143
},
156144
"mobile": {
157-
"logo": {
158-
"src": "banqup/logo.svg",
159-
"alt": "banqup",
160-
"width": 65,
161-
"height": 65
162-
},
163145
"backgroundColor": "#EFFFF5"
164146
},
165147
"form": [
@@ -237,13 +219,7 @@
237219
"src": "banqup/logo.svg"
238220
},
239221
"mobile": {
240-
"bottomParagraph": "mobile_right_pane_bottom_paragraph",
241-
"logo": {
242-
"src": "banqup/logo.svg",
243-
"alt": "banqup",
244-
"width": 65,
245-
"height": 65
246-
}
222+
"bottomParagraph": "mobile_right_pane_bottom_paragraph"
247223
}
248224
},
249225
"issueSuccess": {
@@ -262,12 +238,6 @@
262238
"rightPaneButtonHeight": "48px",
263239
"rightPaneButtonStepId": "toCompanyFlow",
264240
"mobile": {
265-
"logo": {
266-
"src": "bank/logo.svg",
267-
"alt": "bank",
268-
"width": 65,
269-
"height": 65
270-
}
271241
}
272242
},
273243
"verifyIdentity": {

‎packages/oid4vci-demo-frontend/src/configs/legal-entity.banqup.json‎

Lines changed: 1 addition & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -19,12 +19,6 @@
1919
"src": "banqup/logo.svg"
2020
},
2121
"mobile": {
22-
"logo": {
23-
"src": "banqup/logo.svg",
24-
"alt": "banqup",
25-
"width": 65,
26-
"height": 65
27-
},
2822
"backgroundColor": "#EFFFF5"
2923
},
3024
"rightPaneGrid": {
@@ -104,12 +98,6 @@
10498
"src": "banqup/logo.svg"
10599
},
106100
"mobile": {
107-
"logo": {
108-
"src": "banqup/logo.svg",
109-
"alt": "banqup",
110-
"width": 65,
111-
"height": 65
112-
},
113101
"backgroundColor": "#EFFFF5"
114102
}
115103
},
@@ -144,12 +132,6 @@
144132
"src": "banqup/logo.svg"
145133
},
146134
"mobile": {
147-
"logo": {
148-
"src": "banqup/logo.svg",
149-
"alt": "banqup",
150-
"width": 65,
151-
"height": 65
152-
},
153135
"backgroundColor": "#EFFFF5"
154136
},
155137
"form": [
@@ -231,13 +213,7 @@
231213
"src": "banqup/logo.svg"
232214
},
233215
"mobile": {
234-
"bottomParagraph": "mobile_right_pane_bottom_paragraph",
235-
"logo": {
236-
"src": "banqup/logo.svg",
237-
"alt": "banqup",
238-
"width": 65,
239-
"height": 65
240-
}
216+
"bottomParagraph": "mobile_right_pane_bottom_paragraph"
241217
}
242218
},
243219
"issueSuccess": {
@@ -256,12 +232,6 @@
256232
"rightPaneButtonHeight": "48px",
257233
"rightPaneButtonStepId": "toAccountFlow",
258234
"mobile": {
259-
"logo": {
260-
"src": "bank/logo.svg",
261-
"alt": "bank",
262-
"width": 65,
263-
"height": 65
264-
}
265235
}
266236
}
267237
},

‎packages/oid4vci-demo-frontend/src/pages/SSICredentialIssueRequestPage/index.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -153,12 +153,12 @@ const SSICredentialIssueRequestPage: React.FC = () => {
153153
marginTop: isNarrowScreen ? 20 : '15%',
154154
alignItems: 'center'
155155
}}>
156-
<NonMobile>
156+
<NonMobileOS>
157157
<div style={{flexGrow: 1, marginBottom: 34}}>
158158
{qrCode}
159159
</div>
160-
</NonMobile>
161-
<Mobile>
160+
</NonMobileOS>
161+
<MobileOS>
162162
<div style={{
163163
gap: 24,
164164
display: 'flex',
@@ -171,7 +171,7 @@ const SSICredentialIssueRequestPage: React.FC = () => {
171171
}
172172
<DeepLink style={{flexGrow: 1, marginTop: '20px'}} link={state?.uri!}/>
173173
</div>
174-
</Mobile>
174+
</MobileOS>
175175
</div>
176176
<div style={{marginTop: "20px"}}>
177177
<NonMobileOS>

‎packages/oid4vci-demo-frontend/src/pages/SSICredentialVerifyRequestPage/index.tsx‎

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import {AuthorizationResponsePayload} from "@sphereon/did-auth-siop"
77
import MemoizedAuthenticationQR from '../../components/AuthenticationQR'
88
import SSIPrimaryButton from "../../components/SSIPrimaryButton"
99
import {useMediaQuery} from "react-responsive"
10-
import {Mobile, MobileOS, NonMobile} from "../../index"
10+
import {Mobile, MobileOS, NonMobile, NonMobileOS} from "../../index"
1111
import {useFlowRouter} from "../../router/flow-router"
1212
import {useEcosystem} from "../../ecosystem/ecosystem"
1313
import {SSICredentialVerifyRequestPageConfig} from "../../ecosystem/ecosystem-config"
@@ -80,7 +80,7 @@ export default function SSICredentialVerifyRequestPage(): React.ReactElement | n
8080
...(isTabletOrMobile && { gap: 24, ...(pageConfig.mobile?.backgroundColor && { backgroundColor: pageConfig.mobile.backgroundColor }) }),
8181
...(!isTabletOrMobile && { justifyContent: 'center', backgroundColor: '#FFFFFF' }),
8282
}}>
83-
{(isTabletOrMobile && pageConfig?.logo) &&
83+
{(isTabletOrMobile && pageConfig?.mobile?.logo) &&
8484
<img
8585
src={`${pageConfig.mobile?.logo?.src}`}
8686
alt={`${pageConfig.mobile?.logo?.alt}`}
@@ -106,16 +106,18 @@ export default function SSICredentialVerifyRequestPage(): React.ReactElement | n
106106
marginTop: `${isTabletOrMobile ? 20 : pageConfig.rightPaneLeftPane?.qrCode?.marginTop ?? '25%'}`,
107107
alignItems: 'center'
108108
}}>
109-
<div style={{flexGrow: 1, display: 'flex', justifyContent: 'center', marginBottom: 0}}>
110-
{/*Whether the QR code is shown (mobile) is handled in the component itself */}
111-
{<MemoizedAuthenticationQR ecosystem={ecosystem}
112-
fgColor={'rgba(50, 57, 72, 1)'}
113-
width={pageConfig.rightPaneLeftPane?.qrCode?.width ?? 300}
114-
vpDefinitionId={flowRouter.getVpDefinitionId()}
115-
onAuthRequestRetrieved={console.log}
116-
onSignInComplete={onSignInComplete}
117-
setQrCodeData={setDeepLink}/>}
118-
</div>
109+
<NonMobileOS>
110+
<div style={{flexGrow: 1, display: 'flex', justifyContent: 'center', marginBottom: 0}}>
111+
{/*Whether the QR code is shown (mobile) is handled in the component itself */}
112+
{<MemoizedAuthenticationQR ecosystem={ecosystem}
113+
fgColor={'rgba(50, 57, 72, 1)'}
114+
width={pageConfig.rightPaneLeftPane?.qrCode?.width ?? 300}
115+
vpDefinitionId={flowRouter.getVpDefinitionId()}
116+
onAuthRequestRetrieved={console.log}
117+
onSignInComplete={onSignInComplete}
118+
setQrCodeData={setDeepLink}/>}
119+
</div>
120+
</NonMobileOS>
119121
<MobileOS>
120122
<div style={{gap: 24, display: 'flex', flexDirection: 'column', alignItems: 'center', overflow: 'hidden'}}>
121123
{ pageConfig.mobile?.image &&

0 commit comments

Comments
 (0)