Skip to content

Commit 71d40f2

Browse files
sosweethamcoodos
sosweetham
and
coodos
authored
Fix/final UI fixes (#301)
* fix: pictique issues * fix: charter * fix: blabsy * fix: evoting * fix: just remove env dependency totally --------- Co-authored-by: Merul Dhiman <[email protected]>
1 parent e7fcfcc commit 71d40f2

File tree

10 files changed

+166
-142
lines changed

10 files changed

+166
-142
lines changed

‎infrastructure/eid-wallet/src/routes/(app)/scan-qr/+page.svelte‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@
5555
return null;
5656
});
5757
58-
if (permissions === "prompt") {
58+
if (permissions === "prompt" || permissions === "denied") {
5959
permissions = await requestPermissions();
6060
}
6161
@@ -340,7 +340,6 @@
340340
? "Vote signed successfully!"
341341
: "Message signed successfully!",
342342
);
343-
344343
// Check if this was from a deep link
345344
const deepLinkData = sessionStorage.getItem("deepLinkData");
346345
if (deepLinkData) {

‎platforms/blabsy/src/components/login/login-main.tsx‎

Lines changed: 34 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,16 @@ export function LoginMain(): JSX.Element {
4141
new URL(data.uri).searchParams.get('session') as string
4242
);
4343
};
44+
const getAppStoreLink = () => {
45+
const userAgent = navigator.userAgent || navigator.vendor || window.opera;
46+
if (/android/i.test(userAgent)) {
47+
return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
48+
}
49+
if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
50+
return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
51+
}
52+
return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
53+
};
4454

4555
useEffect(() => {
4656
getOfferData()
@@ -77,20 +87,39 @@ export function LoginMain(): JSX.Element {
7787
<div>
7888
{isMobileDevice() ? (
7989
<div className='flex flex-col gap-4 items-center'>
90+
<div className='text-xs text-gray-500 text-center max-w-xs'>
91+
Click the button to open your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
92+
</div>
8093
<a
8194
href={qr ? getDeepLinkUrl(qr) : '#'}
8295
className='px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors text-center'
8396
>
8497
Login with eID Wallet
8598
</a>
86-
<div className='text-xs text-gray-500 text-center max-w-xs'>
87-
Click the button to open your eID wallet app
88-
</div>
99+
<div className="text-center mt-4">
100+
<p className="text-sm text-gray-500">
101+
<span className="mb-1 block font-bold text-gray-600">The button is valid for 60 seconds</span>
102+
<span className="block font-light text-gray-600">Please refresh the page if it expires</span
103+
>
104+
</p>
105+
</div>
89106
</div>
90107
) : (
108+
<div className='flex flex-col gap-4 items-center'>
109+
<p className="text-gray-600">
110+
Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
111+
</p>
91112
<div className='p-2 rounded-md bg-white w-fit'>
92113
{qr && <QRCode value={qr} />}
93114
</div>
115+
<div className="text-center mt-4">
116+
<p className="text-sm text-gray-500">
117+
<span className="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
118+
<span className="block font-light text-gray-600">Please refresh the page if it expires</span
119+
>
120+
</p>
121+
</div>
122+
</div>
94123
)}
95124
</div>
96125
<div className='absolute right-0 rotate-90 top-1/2'>
@@ -110,12 +139,14 @@ export function LoginMain(): JSX.Element {
110139
separation, where all your personal content is stored in
111140
your own sovereign eVault, not on centralised servers.
112141
</div>
142+
<a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
113143
<Image
114144
src='/assets/w3dslogo.svg'
115145
alt='W3DS logo'
116146
width={100}
117147
height={20}
118148
/>
149+
</a>
119150
</div>
120151
</div>
121152
</main>

‎platforms/eVoting/src/app/(auth)/login/page.tsx‎

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,17 @@ export default function LoginPage() {
6666
return () => eventSource.close();
6767
}, [sessionId, login]);
6868

69+
const getAppStoreLink = () => {
70+
const userAgent = navigator.userAgent || navigator.vendor || window.opera;
71+
if (/android/i.test(userAgent)) {
72+
return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
73+
}
74+
if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
75+
return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
76+
}
77+
return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
78+
};
79+
6980
return (
7081
<div className="flex flex-col items-center justify-center gap-4 min-h-screen px-4 pb-safe">
7182
{/* Logo + Tagline */}
@@ -89,13 +100,13 @@ export default function LoginPage() {
89100
{isMobile ? (
90101
<>
91102
<span>Click the button below using your</span>
92-
<span className="font-bold underline">eID App</span>
103+
<a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
93104
<span>to login</span>
94105
</>
95106
) : (
96107
<>
97108
<span>Scan the QR using your</span>
98-
<span className="font-bold underline">eID App</span>
109+
<a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
99110
<span>to login</span>
100111
</>
101112
)}
@@ -156,8 +167,9 @@ export default function LoginPage() {
156167
</div>
157168
</div>
158169
</Card>
159-
170+
<a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
160171
<img src="/W3DS.svg" alt="w3ds Logo" className="max-h-8" />
172+
</a>
161173
</div>
162174
);
163175
}

‎platforms/group-charter-manager/next.config.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import type { NextConfig } from "next";
22

33
const nextConfig: NextConfig = {
4-
/* config options here */
4+
/* config options here */
55
};
66

77
export default nextConfig;

‎platforms/group-charter-manager/package.json‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@
1515
"@milkdown/preset-gfm": "^7.15.2",
1616
"@milkdown/react": "^7.15.2",
1717
"@milkdown/theme-nord": "^7.15.2",
18+
"@next/env": "^15.4.7",
1819
"@radix-ui/react-alert-dialog": "^1.1.7",
1920
"@radix-ui/react-dialog": "^1.1.7",
2021
"@radix-ui/react-dropdown-menu": "^2.1.7",
@@ -29,35 +30,35 @@
2930
"@tiptap/starter-kit": "^2.24.0",
3031
"@toast-ui/react-editor": "^3.2.3",
3132
"axios": "^1.6.7",
33+
"class-variance-authority": "^0.7.1",
34+
"clsx": "^2.1.1",
3235
"cmdk": "^1.1.1",
3336
"draft-js": "^0.11.7",
3437
"lucide-react": "^0.453.0",
3538
"marked": "^16.1.1",
39+
"next": "15.4.2",
3640
"qrcode.react": "^4.2.0",
41+
"react": "19.1.0",
42+
"react-dom": "19.1.0",
3743
"react-draft-wysiwyg": "^1.15.0",
44+
"react-hook-form": "^7.55.0",
3845
"react-markdown": "^10.1.0",
3946
"react-markdown-editor-lite": "^1.3.4",
4047
"react-quill": "^2.0.0",
4148
"remark-gfm": "^4.0.1",
42-
"turndown": "^7.2.0",
43-
"class-variance-authority": "^0.7.1",
44-
"clsx": "^2.1.1",
45-
"next": "15.4.2",
46-
"react": "19.1.0",
47-
"react-dom": "19.1.0",
48-
"react-hook-form": "^7.55.0",
4949
"tailwind-merge": "^3.3.1",
5050
"tailwindcss-animate": "^1.0.7",
51+
"turndown": "^7.2.0",
5152
"zod": "^3.24.2"
5253
},
5354
"devDependencies": {
5455
"@eslint/eslintrc": "^3",
5556
"@tailwindcss/postcss": "^4.1.11",
5657
"@types/draft-js": "^0.11.18",
57-
"@types/turndown": "^5.0.5",
5858
"@types/node": "^20",
5959
"@types/react": "^19",
6060
"@types/react-dom": "^19",
61+
"@types/turndown": "^5.0.5",
6162
"eslint": "^9",
6263
"eslint-config-next": "15.4.2",
6364
"tailwindcss": "^4.1.11",

‎platforms/group-charter-manager/src/components/auth/login-screen.tsx‎

Lines changed: 27 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -70,10 +70,21 @@ export default function LoginScreen() {
7070
};
7171
};
7272

73+
const getAppStoreLink = () => {
74+
const userAgent = navigator.userAgent || navigator.vendor || window.opera;
75+
if (/android/i.test(userAgent)) {
76+
return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
77+
}
78+
if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
79+
return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
80+
}
81+
return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
82+
};
83+
7384
if (isLoading) {
7485
return (
7586
<div className="flex h-screen items-center justify-center">
76-
<div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900"></div>
87+
<div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900" />
7788
</div>
7889
);
7990
}
@@ -101,15 +112,15 @@ export default function LoginScreen() {
101112
/>
102113
<h1 className="text-3xl font-bold">Group Charter</h1>
103114
</div>
104-
<p class="text-gray-600">
115+
<p className="text-gray-600">
105116
Coordinate your group in the MetaState
106117
</p>
107118
</div>
108119
<div className="bg-white/50 p-8 rounded-lg shadow-lg max-w-md w-full">
109120
<div className="text-center mb-8">
110-
121+
111122
<p className="text-gray-600">
112-
Scan the QR code to login with your W3DS identity
123+
Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
113124
</p>
114125
</div>
115126

@@ -142,7 +153,9 @@ export default function LoginScreen() {
142153

143154
<div className="text-center">
144155
<p className="text-sm text-gray-500">
145-
Use your W3DS wallet to scan this QR code and authenticate
156+
<span className="mb-1 block font-bold text-gray-600">The {isMobileDevice() ? "button": "code"} is valid for 60 seconds</span>
157+
<span className="block font-light text-gray-600">Please refresh the page if it expires</span
158+
>
146159
</p>
147160
</div>
148161

@@ -155,13 +168,15 @@ export default function LoginScreen() {
155168
servers.
156169
</div>
157170

158-
<Image
159-
src="/W3DS.svg"
160-
alt="W3DS Logo"
161-
width={50}
162-
height={20}
163-
className="mx-auto mt-5"
164-
/>
171+
<a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
172+
<Image
173+
src="/W3DS.svg"
174+
alt="W3DS Logo"
175+
width={50}
176+
height={20}
177+
className="mx-auto mt-5"
178+
/>
179+
</a>
165180
</div>
166181
</div>
167182
);

‎platforms/pictique/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
"version": "0.0.1",
55
"type": "module",
66
"scripts": {
7-
"dev": "vite dev",
7+
"dev": "vite dev --host",
88
"build": "vite build",
99
"preview": "vite preview",
1010
"prepare": "svelte-kit sync || echo ''",

‎platforms/pictique/src/routes/(auth)/auth/+page.svelte‎

Lines changed: 28 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,17 @@
11
<script lang="ts">
22
import { goto } from '$app/navigation';
3-
import { PUBLIC_PICTIQUE_BASE_URL } from '$env/static/public';
3+
import {
4+
PUBLIC_APP_STORE_EID_WALLET,
5+
PUBLIC_PICTIQUE_BASE_URL,
6+
PUBLIC_PLAY_STORE_EID_WALLET
7+
} from '$env/static/public';
48
import { W3dslogo } from '$lib/icons';
59
import { Qr } from '$lib/ui';
610
import { apiClient, setAuthId, setAuthToken } from '$lib/utils';
11+
import { getDeepLinkUrl, isMobileDevice } from '$lib/utils/mobile-detection';
712
import { onMount } from 'svelte';
813
import { onDestroy } from 'svelte';
914
import { qrcode } from 'svelte-qrcode-action';
10-
import { isMobileDevice, getDeepLinkUrl } from '$lib/utils/mobile-detection';
1115
1216
let qrData: string;
1317
let isMobile = false;
@@ -16,7 +20,22 @@
1620
isMobile = window.innerWidth <= 640; // Tailwind's `sm` breakpoint
1721
}
1822
23+
let getAppStoreLink: () => string = () => '';
24+
1925
onMount(async () => {
26+
getAppStoreLink = () => {
27+
const userAgent = navigator.userAgent || navigator.vendor || window.opera;
28+
if (/android/i.test(userAgent)) {
29+
return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
30+
}
31+
32+
if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
33+
return 'https://apps.apple.com/in/app/eid-for-w3ds/id6747748667';
34+
}
35+
36+
return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
37+
};
38+
2039
checkMobile();
2140
window.addEventListener('resize', checkMobile);
2241
@@ -60,7 +79,7 @@
6079
>
6180
<h2>
6281
{#if isMobileDevice()}
63-
Login with your <b><u>eID Wallet</u></b>
82+
Login with your <a href={getAppStoreLink()}><b><u>eID Wallet</u></b></a>
6483
{:else}
6584
Scan the QR code using your <b><u>eID App</u></b> to login
6685
{/if}
@@ -108,7 +127,9 @@
108127
{/if}
109128

110129
<p class="text-center">
111-
<span class="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
130+
<span class="mb-1 block font-bold text-gray-600"
131+
>The {isMobileDevice() ? 'button' : 'code'} is valid for 60 seconds</span
132+
>
112133
<span class="block font-light text-gray-600">Please refresh the page if it expires</span
113134
>
114135
</p>
@@ -120,6 +141,7 @@
120141
centralised servers.
121142
</p>
122143
</div>
123-
124-
<W3dslogo />
144+
<a href="https://metastate.foundation" target="_blank">
145+
<W3dslogo />
146+
</a>
125147
</div>

‎platforms/pictique/src/routes/(protected)/profile/[id]/+page.svelte‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@
1818
let ownerProfile = $derived.by(async () => {
1919
if (ownerId) {
2020
const response = await apiClient.get<userProfile>(`/api/users/${ownerId}`);
21+
console.log('Owner Profile:', response.data);
2122
return response.data;
2223
}
2324
});
@@ -27,6 +28,7 @@
2728
loading = true;
2829
error = null;
2930
const response = await apiClient.get<userProfile>(`/api/users/${profileId}`);
31+
console.log('Fetched Profile:', response.data);
3032
profile = response.data;
3133
} catch (err) {
3234
error = err instanceof Error ? err.message : 'Failed to load profile';

0 commit comments

Comments
 (0)