Fix/final UI fixes

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

@@ -55,7 +55,7 @@
  return null;
  });
 
- if (permissions === "prompt") {
+ if (permissions === "prompt" || permissions === "denied") {
  permissions = await requestPermissions();
  }
 
@@ -340,7 +340,6 @@
  ? "Vote signed successfully!"
  : "Message signed successfully!",
  );
-
  // Check if this was from a deep link
  const deepLinkData = sessionStorage.getItem("deepLinkData");
  if (deepLinkData) {

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

@@ -41,6 +41,16 @@ export function LoginMain(): JSX.Element {
  new URL(data.uri).searchParams.get('session') as string
  );
  };
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
 
  useEffect(() => {
  getOfferData()
@@ -77,20 +87,39 @@ export function LoginMain(): JSX.Element {
  <div>
  {isMobileDevice() ? (
  <div className='flex flex-col gap-4 items-center'>
+ <div className='text-xs text-gray-500 text-center max-w-xs'>
+ Click the button to open your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </div>
  <a
  href={qr ? getDeepLinkUrl(qr) : '#'}
  className='px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors text-center'
  >
  Login with eID Wallet
  </a>
- <div className='text-xs text-gray-500 text-center max-w-xs'>
- Click the button to open your eID wallet app
- </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The button is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
  </div>
  ) : (
+ <div className='flex flex-col gap-4 items-center'>
+ <p className="text-gray-600">
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </p>
  <div className='p-2 rounded-md bg-white w-fit'>
  {qr && <QRCode value={qr} />}
  </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
+ </div>
  )}
  </div>
  <div className='absolute right-0 rotate-90 top-1/2'>
@@ -110,12 +139,14 @@ export function LoginMain(): JSX.Element {
  separation, where all your personal content is stored in
  your own sovereign eVault, not on centralised servers.
  </div>
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <Image
  src='/assets/w3dslogo.svg'
  alt='W3DS logo'
  width={100}
  height={20}
  />
+ </a>
  </div>
  </div>
  </main>

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

@@ -66,6 +66,17 @@ export default function LoginPage() {
  return () => eventSource.close();
  }, [sessionId, login]);
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  return (
  <div className="flex flex-col items-center justify-center gap-4 min-h-screen px-4 pb-safe">
  {/* Logo + Tagline */}
@@ -89,13 +100,13 @@ export default function LoginPage() {
  {isMobile ? (
  <>
  <span>Click the button below using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  ) : (
  <>
  <span>Scan the QR using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  )}
@@ -156,8 +167,9 @@ export default function LoginPage() {
  </div>
  </div>
  </Card>
-
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <img src="/W3DS.svg" alt="w3ds Logo" className="max-h-8" />
+ </a>
  </div>
  );
 }

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

@@ -1,7 +1,7 @@
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
- /* config options here */
+/* config options here */
 };
 
 export default nextConfig;

platforms/group-charter-manager/package.json

@@ -15,6 +15,7 @@
  "@milkdown/preset-gfm": "^7.15.2",
  "@milkdown/react": "^7.15.2",
  "@milkdown/theme-nord": "^7.15.2",
+ "@next/env": "^15.4.7",
  "@radix-ui/react-alert-dialog": "^1.1.7",
  "@radix-ui/react-dialog": "^1.1.7",
  "@radix-ui/react-dropdown-menu": "^2.1.7",
@@ -29,35 +30,35 @@
  "@tiptap/starter-kit": "^2.24.0",
  "@toast-ui/react-editor": "^3.2.3",
  "axios": "^1.6.7",
+ "class-variance-authority": "^0.7.1",
+ "clsx": "^2.1.1",
  "cmdk": "^1.1.1",
  "draft-js": "^0.11.7",
  "lucide-react": "^0.453.0",
  "marked": "^16.1.1",
+ "next": "15.4.2",
  "qrcode.react": "^4.2.0",
+ "react": "19.1.0",
+ "react-dom": "19.1.0",
  "react-draft-wysiwyg": "^1.15.0",
+ "react-hook-form": "^7.55.0",
  "react-markdown": "^10.1.0",
  "react-markdown-editor-lite": "^1.3.4",
  "react-quill": "^2.0.0",
  "remark-gfm": "^4.0.1",
- "turndown": "^7.2.0",
- "class-variance-authority": "^0.7.1",
- "clsx": "^2.1.1",
- "next": "15.4.2",
- "react": "19.1.0",
- "react-dom": "19.1.0",
- "react-hook-form": "^7.55.0",
  "tailwind-merge": "^3.3.1",
  "tailwindcss-animate": "^1.0.7",
+ "turndown": "^7.2.0",
  "zod": "^3.24.2"
  },
  "devDependencies": {
  "@eslint/eslintrc": "^3",
  "@tailwindcss/postcss": "^4.1.11",
  "@types/draft-js": "^0.11.18",
- "@types/turndown": "^5.0.5",
  "@types/node": "^20",
  "@types/react": "^19",
  "@types/react-dom": "^19",
+ "@types/turndown": "^5.0.5",
  "eslint": "^9",
  "eslint-config-next": "15.4.2",
  "tailwindcss": "^4.1.11",

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

@@ -70,10 +70,21 @@ export default function LoginScreen() {
  };
  };
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  if (isLoading) {
  return (
  <div className="flex h-screen items-center justify-center">
- <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900"></div>
+ <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900" />
  </div>
  );
  }
@@ -101,15 +112,15 @@ export default function LoginScreen() {
  />
  <h1 className="text-3xl font-bold">Group Charter</h1>
  </div>
- <p class="text-gray-600">
+ <p className="text-gray-600">
  Coordinate your group in the MetaState
  </p>
  </div>
  <div className="bg-white/50 p-8 rounded-lg shadow-lg max-w-md w-full">
  <div className="text-center mb-8">
-
+
  <p className="text-gray-600">
- Scan the QR code to login with your W3DS identity
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
  </p>
  </div>
 
@@ -142,7 +153,9 @@ export default function LoginScreen() {
 
  <div className="text-center">
  <p className="text-sm text-gray-500">
- Use your W3DS wallet to scan this QR code and authenticate
+ <span className="mb-1 block font-bold text-gray-600">The {isMobileDevice() ? "button": "code"} is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
  </p>
  </div>
 
@@ -155,13 +168,15 @@ export default function LoginScreen() {
  servers.
  </div>
 
- <Image
- src="/W3DS.svg"
- alt="W3DS Logo"
- width={50}
- height={20}
- className="mx-auto mt-5"
- />
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
+ <Image
+ src="/W3DS.svg"
+ alt="W3DS Logo"
+ width={50}
+ height={20}
+ className="mx-auto mt-5"
+ />
+ </a>
  </div>
  </div>
  );

platforms/pictique/package.json

@@ -4,7 +4,7 @@
 	"version": "0.0.1",
 	"type": "module",
 	"scripts": {
- "dev": "vite dev",
+ "dev": "vite dev --host",
  "build": "vite build",
  "preview": "vite preview",
  "prepare": "svelte-kit sync || echo ''",

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

@@ -1,13 +1,17 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
-	import { PUBLIC_PICTIQUE_BASE_URL } from '$env/static/public';
+	import {
+ PUBLIC_APP_STORE_EID_WALLET,
+ PUBLIC_PICTIQUE_BASE_URL,
+ PUBLIC_PLAY_STORE_EID_WALLET
+	} from '$env/static/public';
 	import { W3dslogo } from '$lib/icons';
 	import { Qr } from '$lib/ui';
 	import { apiClient, setAuthId, setAuthToken } from '$lib/utils';
+	import { getDeepLinkUrl, isMobileDevice } from '$lib/utils/mobile-detection';
 	import { onMount } from 'svelte';
 	import { onDestroy } from 'svelte';
 	import { qrcode } from 'svelte-qrcode-action';
-	import { isMobileDevice, getDeepLinkUrl } from '$lib/utils/mobile-detection';
 
 	let qrData: string;
 	let isMobile = false;
@@ -16,7 +20,22 @@
  isMobile = window.innerWidth <= 640; // Tailwind's `sm` breakpoint
 	}
 
+	let getAppStoreLink: () => string = () => '';
+
 	onMount(async () => {
+ getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ }
+
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return 'https://apps.apple.com/in/app/eid-for-w3ds/id6747748667';
+ }
+
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ };
+
  checkMobile();
  window.addEventListener('resize', checkMobile);
 
@@ -60,7 +79,7 @@
 	>
  <h2>
  {#if isMobileDevice()}
- Login with your <b><u>eID Wallet</u></b>
+ Login with your <a href={getAppStoreLink()}><b><u>eID Wallet</u></b></a>
  {:else}
  Scan the QR code using your <b><u>eID App</u></b> to login
  {/if}
@@ -108,7 +127,9 @@
  {/if}
 
  <p class="text-center">
- <span class="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span class="mb-1 block font-bold text-gray-600"
+ >The {isMobileDevice() ? 'button' : 'code'} is valid for 60 seconds</span
+ >
  <span class="block font-light text-gray-600">Please refresh the page if it expires</span
  >
  </p>
@@ -120,6 +141,7 @@
  centralised servers.
  </p>
 	</div>
-
-	<W3dslogo />
+	<a href="https://metastate.foundation" target="_blank">
+ <W3dslogo />
+	</a>
 </div>

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

@@ -18,6 +18,7 @@
 	let ownerProfile = $derived.by(async () => {
  if (ownerId) {
  const response = await apiClient.get<userProfile>(`/api/users/${ownerId}`);
+ console.log('Owner Profile:', response.data);
  return response.data;
  }
 	});
@@ -27,6 +28,7 @@
  loading = true;
  error = null;
  const response = await apiClient.get<userProfile>(`/api/users/${profileId}`);
+ console.log('Fetched Profile:', response.data);
  profile = response.data;
  } catch (err) {
  error = err instanceof Error ? err.message : 'Failed to load profile';

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

@@ -55,7 +55,7 @@
  return null;
  });
 
- if (permissions === "prompt") {
+ if (permissions === "prompt" || permissions === "denied") {
  permissions = await requestPermissions();
  }
 
@@ -340,7 +340,6 @@
  ? "Vote signed successfully!"
  : "Message signed successfully!",
  );
-
  // Check if this was from a deep link
  const deepLinkData = sessionStorage.getItem("deepLinkData");
  if (deepLinkData) {

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

@@ -41,6 +41,16 @@ export function LoginMain(): JSX.Element {
  new URL(data.uri).searchParams.get('session') as string
  );
  };
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
 
  useEffect(() => {
  getOfferData()
@@ -77,20 +87,39 @@ export function LoginMain(): JSX.Element {
  <div>
  {isMobileDevice() ? (
  <div className='flex flex-col gap-4 items-center'>
+ <div className='text-xs text-gray-500 text-center max-w-xs'>
+ Click the button to open your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </div>
  <a
  href={qr ? getDeepLinkUrl(qr) : '#'}
  className='px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors text-center'
  >
  Login with eID Wallet
  </a>
- <div className='text-xs text-gray-500 text-center max-w-xs'>
- Click the button to open your eID wallet app
- </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The button is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
  </div>
  ) : (
+ <div className='flex flex-col gap-4 items-center'>
+ <p className="text-gray-600">
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </p>
  <div className='p-2 rounded-md bg-white w-fit'>
  {qr && <QRCode value={qr} />}
  </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
+ </div>
  )}
  </div>
  <div className='absolute right-0 rotate-90 top-1/2'>
@@ -110,12 +139,14 @@ export function LoginMain(): JSX.Element {
  separation, where all your personal content is stored in
  your own sovereign eVault, not on centralised servers.
  </div>
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <Image
  src='/assets/w3dslogo.svg'
  alt='W3DS logo'
  width={100}
  height={20}
  />
+ </a>
  </div>
  </div>
  </main>

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

@@ -66,6 +66,17 @@ export default function LoginPage() {
  return () => eventSource.close();
  }, [sessionId, login]);
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  return (
  <div className="flex flex-col items-center justify-center gap-4 min-h-screen px-4 pb-safe">
  {/* Logo + Tagline */}
@@ -89,13 +100,13 @@ export default function LoginPage() {
  {isMobile ? (
  <>
  <span>Click the button below using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  ) : (
  <>
  <span>Scan the QR using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  )}
@@ -156,8 +167,9 @@ export default function LoginPage() {
  </div>
  </div>
  </Card>
-
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <img src="/W3DS.svg" alt="w3ds Logo" className="max-h-8" />
+ </a>
  </div>
  );
 }

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

@@ -1,7 +1,7 @@
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
- /* config options here */
+/* config options here */
 };
 
 export default nextConfig;

platforms/group-charter-manager/package.json

@@ -15,6 +15,7 @@
  "@milkdown/preset-gfm": "^7.15.2",
  "@milkdown/react": "^7.15.2",
  "@milkdown/theme-nord": "^7.15.2",
+ "@next/env": "^15.4.7",
  "@radix-ui/react-alert-dialog": "^1.1.7",
  "@radix-ui/react-dialog": "^1.1.7",
  "@radix-ui/react-dropdown-menu": "^2.1.7",
@@ -29,35 +30,35 @@
  "@tiptap/starter-kit": "^2.24.0",
  "@toast-ui/react-editor": "^3.2.3",
  "axios": "^1.6.7",
+ "class-variance-authority": "^0.7.1",
+ "clsx": "^2.1.1",
  "cmdk": "^1.1.1",
  "draft-js": "^0.11.7",
  "lucide-react": "^0.453.0",
  "marked": "^16.1.1",
+ "next": "15.4.2",
  "qrcode.react": "^4.2.0",
+ "react": "19.1.0",
+ "react-dom": "19.1.0",
  "react-draft-wysiwyg": "^1.15.0",
+ "react-hook-form": "^7.55.0",
  "react-markdown": "^10.1.0",
  "react-markdown-editor-lite": "^1.3.4",
  "react-quill": "^2.0.0",
  "remark-gfm": "^4.0.1",
- "turndown": "^7.2.0",
- "class-variance-authority": "^0.7.1",
- "clsx": "^2.1.1",
- "next": "15.4.2",
- "react": "19.1.0",
- "react-dom": "19.1.0",
- "react-hook-form": "^7.55.0",
  "tailwind-merge": "^3.3.1",
  "tailwindcss-animate": "^1.0.7",
+ "turndown": "^7.2.0",
  "zod": "^3.24.2"
  },
  "devDependencies": {
  "@eslint/eslintrc": "^3",
  "@tailwindcss/postcss": "^4.1.11",
  "@types/draft-js": "^0.11.18",
- "@types/turndown": "^5.0.5",
  "@types/node": "^20",
  "@types/react": "^19",
  "@types/react-dom": "^19",
+ "@types/turndown": "^5.0.5",
  "eslint": "^9",
  "eslint-config-next": "15.4.2",
  "tailwindcss": "^4.1.11",

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

@@ -70,10 +70,21 @@ export default function LoginScreen() {
  };
  };
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  if (isLoading) {
  return (
  <div className="flex h-screen items-center justify-center">
- <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900"></div>
+ <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900" />
  </div>
  );
  }
@@ -101,15 +112,15 @@ export default function LoginScreen() {
  />
  <h1 className="text-3xl font-bold">Group Charter</h1>
  </div>
- <p class="text-gray-600">
+ <p className="text-gray-600">
  Coordinate your group in the MetaState
  </p>
  </div>
  <div className="bg-white/50 p-8 rounded-lg shadow-lg max-w-md w-full">
  <div className="text-center mb-8">
-
+
  <p className="text-gray-600">
- Scan the QR code to login with your W3DS identity
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
  </p>
  </div>
 
@@ -142,7 +153,9 @@ export default function LoginScreen() {
 
  <div className="text-center">
  <p className="text-sm text-gray-500">
- Use your W3DS wallet to scan this QR code and authenticate
+ <span className="mb-1 block font-bold text-gray-600">The {isMobileDevice() ? "button": "code"} is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
  </p>
  </div>
 
@@ -155,13 +168,15 @@ export default function LoginScreen() {
  servers.
  </div>
 
- <Image
- src="/W3DS.svg"
- alt="W3DS Logo"
- width={50}
- height={20}
- className="mx-auto mt-5"
- />
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
+ <Image
+ src="/W3DS.svg"
+ alt="W3DS Logo"
+ width={50}
+ height={20}
+ className="mx-auto mt-5"
+ />
+ </a>
  </div>
  </div>
  );

platforms/pictique/package.json

@@ -4,7 +4,7 @@
 	"version": "0.0.1",
 	"type": "module",
 	"scripts": {
- "dev": "vite dev",
+ "dev": "vite dev --host",
  "build": "vite build",
  "preview": "vite preview",
  "prepare": "svelte-kit sync || echo ''",

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

@@ -1,13 +1,17 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
-	import { PUBLIC_PICTIQUE_BASE_URL } from '$env/static/public';
+	import {
+ PUBLIC_APP_STORE_EID_WALLET,
+ PUBLIC_PICTIQUE_BASE_URL,
+ PUBLIC_PLAY_STORE_EID_WALLET
+	} from '$env/static/public';
 	import { W3dslogo } from '$lib/icons';
 	import { Qr } from '$lib/ui';
 	import { apiClient, setAuthId, setAuthToken } from '$lib/utils';
+	import { getDeepLinkUrl, isMobileDevice } from '$lib/utils/mobile-detection';
 	import { onMount } from 'svelte';
 	import { onDestroy } from 'svelte';
 	import { qrcode } from 'svelte-qrcode-action';
-	import { isMobileDevice, getDeepLinkUrl } from '$lib/utils/mobile-detection';
 
 	let qrData: string;
 	let isMobile = false;
@@ -16,7 +20,22 @@
  isMobile = window.innerWidth <= 640; // Tailwind's `sm` breakpoint
 	}
 
+	let getAppStoreLink: () => string = () => '';
+
 	onMount(async () => {
+ getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ }
+
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return 'https://apps.apple.com/in/app/eid-for-w3ds/id6747748667';
+ }
+
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ };
+
  checkMobile();
  window.addEventListener('resize', checkMobile);
 
@@ -60,7 +79,7 @@
 	>
  <h2>
  {#if isMobileDevice()}
- Login with your <b><u>eID Wallet</u></b>
+ Login with your <a href={getAppStoreLink()}><b><u>eID Wallet</u></b></a>
  {:else}
  Scan the QR code using your <b><u>eID App</u></b> to login
  {/if}
@@ -108,7 +127,9 @@
  {/if}
 
  <p class="text-center">
- <span class="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span class="mb-1 block font-bold text-gray-600"
+ >The {isMobileDevice() ? 'button' : 'code'} is valid for 60 seconds</span
+ >
  <span class="block font-light text-gray-600">Please refresh the page if it expires</span
  >
  </p>
@@ -120,6 +141,7 @@
  centralised servers.
  </p>
 	</div>
-
-	<W3dslogo />
+	<a href="https://metastate.foundation" target="_blank">
+ <W3dslogo />
+	</a>
 </div>

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

@@ -18,6 +18,7 @@
 	let ownerProfile = $derived.by(async () => {
  if (ownerId) {
  const response = await apiClient.get<userProfile>(`/api/users/${ownerId}`);
+ console.log('Owner Profile:', response.data);
  return response.data;
  }
 	});
@@ -27,6 +28,7 @@
  loading = true;
  error = null;
  const response = await apiClient.get<userProfile>(`/api/users/${profileId}`);
+ console.log('Fetched Profile:', response.data);
  profile = response.data;
  } catch (err) {
  error = err instanceof Error ? err.message : 'Failed to load profile';

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

@@ -55,7 +55,7 @@
  return null;
  });
 
- if (permissions === "prompt") {
+ if (permissions === "prompt" || permissions === "denied") {
  permissions = await requestPermissions();
  }
 
@@ -340,7 +340,6 @@
  ? "Vote signed successfully!"
  : "Message signed successfully!",
  );
-
  // Check if this was from a deep link
  const deepLinkData = sessionStorage.getItem("deepLinkData");
  if (deepLinkData) {

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

@@ -41,6 +41,16 @@ export function LoginMain(): JSX.Element {
  new URL(data.uri).searchParams.get('session') as string
  );
  };
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
 
  useEffect(() => {
  getOfferData()
@@ -77,20 +87,39 @@ export function LoginMain(): JSX.Element {
  <div>
  {isMobileDevice() ? (
  <div className='flex flex-col gap-4 items-center'>
+ <div className='text-xs text-gray-500 text-center max-w-xs'>
+ Click the button to open your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </div>
  <a
  href={qr ? getDeepLinkUrl(qr) : '#'}
  className='px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors text-center'
  >
  Login with eID Wallet
  </a>
- <div className='text-xs text-gray-500 text-center max-w-xs'>
- Click the button to open your eID wallet app
- </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The button is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
  </div>
  ) : (
+ <div className='flex flex-col gap-4 items-center'>
+ <p className="text-gray-600">
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </p>
  <div className='p-2 rounded-md bg-white w-fit'>
  {qr && <QRCode value={qr} />}
  </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
+ </div>
  )}
  </div>
  <div className='absolute right-0 rotate-90 top-1/2'>
@@ -110,12 +139,14 @@ export function LoginMain(): JSX.Element {
  separation, where all your personal content is stored in
  your own sovereign eVault, not on centralised servers.
  </div>
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <Image
  src='/assets/w3dslogo.svg'
  alt='W3DS logo'
  width={100}
  height={20}
  />
+ </a>
  </div>
  </div>
  </main>

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

@@ -66,6 +66,17 @@ export default function LoginPage() {
  return () => eventSource.close();
  }, [sessionId, login]);
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  return (
  <div className="flex flex-col items-center justify-center gap-4 min-h-screen px-4 pb-safe">
  {/* Logo + Tagline */}
@@ -89,13 +100,13 @@ export default function LoginPage() {
  {isMobile ? (
  <>
  <span>Click the button below using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  ) : (
  <>
  <span>Scan the QR using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  )}
@@ -156,8 +167,9 @@ export default function LoginPage() {
  </div>
  </div>
  </Card>
-
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <img src="/W3DS.svg" alt="w3ds Logo" className="max-h-8" />
+ </a>
  </div>
  );
 }

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

@@ -1,7 +1,7 @@
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
- /* config options here */
+/* config options here */
 };
 
 export default nextConfig;

platforms/group-charter-manager/package.json

@@ -15,6 +15,7 @@
  "@milkdown/preset-gfm": "^7.15.2",
  "@milkdown/react": "^7.15.2",
  "@milkdown/theme-nord": "^7.15.2",
+ "@next/env": "^15.4.7",
  "@radix-ui/react-alert-dialog": "^1.1.7",
  "@radix-ui/react-dialog": "^1.1.7",
  "@radix-ui/react-dropdown-menu": "^2.1.7",
@@ -29,35 +30,35 @@
  "@tiptap/starter-kit": "^2.24.0",
  "@toast-ui/react-editor": "^3.2.3",
  "axios": "^1.6.7",
+ "class-variance-authority": "^0.7.1",
+ "clsx": "^2.1.1",
  "cmdk": "^1.1.1",
  "draft-js": "^0.11.7",
  "lucide-react": "^0.453.0",
  "marked": "^16.1.1",
+ "next": "15.4.2",
  "qrcode.react": "^4.2.0",
+ "react": "19.1.0",
+ "react-dom": "19.1.0",
  "react-draft-wysiwyg": "^1.15.0",
+ "react-hook-form": "^7.55.0",
  "react-markdown": "^10.1.0",
  "react-markdown-editor-lite": "^1.3.4",
  "react-quill": "^2.0.0",
  "remark-gfm": "^4.0.1",
- "turndown": "^7.2.0",
- "class-variance-authority": "^0.7.1",
- "clsx": "^2.1.1",
- "next": "15.4.2",
- "react": "19.1.0",
- "react-dom": "19.1.0",
- "react-hook-form": "^7.55.0",
  "tailwind-merge": "^3.3.1",
  "tailwindcss-animate": "^1.0.7",
+ "turndown": "^7.2.0",
  "zod": "^3.24.2"
  },
  "devDependencies": {
  "@eslint/eslintrc": "^3",
  "@tailwindcss/postcss": "^4.1.11",
  "@types/draft-js": "^0.11.18",
- "@types/turndown": "^5.0.5",
  "@types/node": "^20",
  "@types/react": "^19",
  "@types/react-dom": "^19",
+ "@types/turndown": "^5.0.5",
  "eslint": "^9",
  "eslint-config-next": "15.4.2",
  "tailwindcss": "^4.1.11",

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

@@ -70,10 +70,21 @@ export default function LoginScreen() {
  };
  };
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  if (isLoading) {
  return (
  <div className="flex h-screen items-center justify-center">
- <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900"></div>
+ <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900" />
  </div>
  );
  }
@@ -101,15 +112,15 @@ export default function LoginScreen() {
  />
  <h1 className="text-3xl font-bold">Group Charter</h1>
  </div>
- <p class="text-gray-600">
+ <p className="text-gray-600">
  Coordinate your group in the MetaState
  </p>
  </div>
  <div className="bg-white/50 p-8 rounded-lg shadow-lg max-w-md w-full">
  <div className="text-center mb-8">
-
+
  <p className="text-gray-600">
- Scan the QR code to login with your W3DS identity
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
  </p>
  </div>
 
@@ -142,7 +153,9 @@ export default function LoginScreen() {
 
  <div className="text-center">
  <p className="text-sm text-gray-500">
- Use your W3DS wallet to scan this QR code and authenticate
+ <span className="mb-1 block font-bold text-gray-600">The {isMobileDevice() ? "button": "code"} is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
  </p>
  </div>
 
@@ -155,13 +168,15 @@ export default function LoginScreen() {
  servers.
  </div>
 
- <Image
- src="/W3DS.svg"
- alt="W3DS Logo"
- width={50}
- height={20}
- className="mx-auto mt-5"
- />
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
+ <Image
+ src="/W3DS.svg"
+ alt="W3DS Logo"
+ width={50}
+ height={20}
+ className="mx-auto mt-5"
+ />
+ </a>
  </div>
  </div>
  );

platforms/pictique/package.json

@@ -4,7 +4,7 @@
 	"version": "0.0.1",
 	"type": "module",
 	"scripts": {
- "dev": "vite dev",
+ "dev": "vite dev --host",
  "build": "vite build",
  "preview": "vite preview",
  "prepare": "svelte-kit sync || echo ''",

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

@@ -1,13 +1,17 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
-	import { PUBLIC_PICTIQUE_BASE_URL } from '$env/static/public';
+	import {
+ PUBLIC_APP_STORE_EID_WALLET,
+ PUBLIC_PICTIQUE_BASE_URL,
+ PUBLIC_PLAY_STORE_EID_WALLET
+	} from '$env/static/public';
 	import { W3dslogo } from '$lib/icons';
 	import { Qr } from '$lib/ui';
 	import { apiClient, setAuthId, setAuthToken } from '$lib/utils';
+	import { getDeepLinkUrl, isMobileDevice } from '$lib/utils/mobile-detection';
 	import { onMount } from 'svelte';
 	import { onDestroy } from 'svelte';
 	import { qrcode } from 'svelte-qrcode-action';
-	import { isMobileDevice, getDeepLinkUrl } from '$lib/utils/mobile-detection';
 
 	let qrData: string;
 	let isMobile = false;
@@ -16,7 +20,22 @@
  isMobile = window.innerWidth <= 640; // Tailwind's `sm` breakpoint
 	}
 
+	let getAppStoreLink: () => string = () => '';
+
 	onMount(async () => {
+ getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ }
+
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return 'https://apps.apple.com/in/app/eid-for-w3ds/id6747748667';
+ }
+
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ };
+
  checkMobile();
  window.addEventListener('resize', checkMobile);
 
@@ -60,7 +79,7 @@
 	>
  <h2>
  {#if isMobileDevice()}
- Login with your <b><u>eID Wallet</u></b>
+ Login with your <a href={getAppStoreLink()}><b><u>eID Wallet</u></b></a>
  {:else}
  Scan the QR code using your <b><u>eID App</u></b> to login
  {/if}
@@ -108,7 +127,9 @@
  {/if}
 
  <p class="text-center">
- <span class="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span class="mb-1 block font-bold text-gray-600"
+ >The {isMobileDevice() ? 'button' : 'code'} is valid for 60 seconds</span
+ >
  <span class="block font-light text-gray-600">Please refresh the page if it expires</span
  >
  </p>
@@ -120,6 +141,7 @@
  centralised servers.
  </p>
 	</div>
-
-	<W3dslogo />
+	<a href="https://metastate.foundation" target="_blank">
+ <W3dslogo />
+	</a>
 </div>

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

@@ -18,6 +18,7 @@
 	let ownerProfile = $derived.by(async () => {
  if (ownerId) {
  const response = await apiClient.get<userProfile>(`/api/users/${ownerId}`);
+ console.log('Owner Profile:', response.data);
  return response.data;
  }
 	});
@@ -27,6 +28,7 @@
  loading = true;
  error = null;
  const response = await apiClient.get<userProfile>(`/api/users/${profileId}`);
+ console.log('Fetched Profile:', response.data);
  profile = response.data;
  } catch (err) {
  error = err instanceof Error ? err.message : 'Failed to load profile';

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

@@ -55,7 +55,7 @@
  return null;
  });
 
- if (permissions === "prompt") {
+ if (permissions === "prompt" || permissions === "denied") {
  permissions = await requestPermissions();
  }
 
@@ -340,7 +340,6 @@
  ? "Vote signed successfully!"
  : "Message signed successfully!",
  );
-
  // Check if this was from a deep link
  const deepLinkData = sessionStorage.getItem("deepLinkData");
  if (deepLinkData) {

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

@@ -41,6 +41,16 @@ export function LoginMain(): JSX.Element {
  new URL(data.uri).searchParams.get('session') as string
  );
  };
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
 
  useEffect(() => {
  getOfferData()
@@ -77,20 +87,39 @@ export function LoginMain(): JSX.Element {
  <div>
  {isMobileDevice() ? (
  <div className='flex flex-col gap-4 items-center'>
+ <div className='text-xs text-gray-500 text-center max-w-xs'>
+ Click the button to open your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </div>
  <a
  href={qr ? getDeepLinkUrl(qr) : '#'}
  className='px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors text-center'
  >
  Login with eID Wallet
  </a>
- <div className='text-xs text-gray-500 text-center max-w-xs'>
- Click the button to open your eID wallet app
- </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The button is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
  </div>
  ) : (
+ <div className='flex flex-col gap-4 items-center'>
+ <p className="text-gray-600">
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </p>
  <div className='p-2 rounded-md bg-white w-fit'>
  {qr && <QRCode value={qr} />}
  </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
+ </div>
  )}
  </div>
  <div className='absolute right-0 rotate-90 top-1/2'>
@@ -110,12 +139,14 @@ export function LoginMain(): JSX.Element {
  separation, where all your personal content is stored in
  your own sovereign eVault, not on centralised servers.
  </div>
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <Image
  src='/assets/w3dslogo.svg'
  alt='W3DS logo'
  width={100}
  height={20}
  />
+ </a>
  </div>
  </div>
  </main>

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

@@ -66,6 +66,17 @@ export default function LoginPage() {
  return () => eventSource.close();
  }, [sessionId, login]);
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  return (
  <div className="flex flex-col items-center justify-center gap-4 min-h-screen px-4 pb-safe">
  {/* Logo + Tagline */}
@@ -89,13 +100,13 @@ export default function LoginPage() {
  {isMobile ? (
  <>
  <span>Click the button below using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  ) : (
  <>
  <span>Scan the QR using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  )}
@@ -156,8 +167,9 @@ export default function LoginPage() {
  </div>
  </div>
  </Card>
-
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <img src="/W3DS.svg" alt="w3ds Logo" className="max-h-8" />
+ </a>
  </div>
  );
 }

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

@@ -1,7 +1,7 @@
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
- /* config options here */
+/* config options here */
 };
 
 export default nextConfig;

platforms/group-charter-manager/package.json

@@ -15,6 +15,7 @@
  "@milkdown/preset-gfm": "^7.15.2",
  "@milkdown/react": "^7.15.2",
  "@milkdown/theme-nord": "^7.15.2",
+ "@next/env": "^15.4.7",
  "@radix-ui/react-alert-dialog": "^1.1.7",
  "@radix-ui/react-dialog": "^1.1.7",
  "@radix-ui/react-dropdown-menu": "^2.1.7",
@@ -29,35 +30,35 @@
  "@tiptap/starter-kit": "^2.24.0",
  "@toast-ui/react-editor": "^3.2.3",
  "axios": "^1.6.7",
+ "class-variance-authority": "^0.7.1",
+ "clsx": "^2.1.1",
  "cmdk": "^1.1.1",
  "draft-js": "^0.11.7",
  "lucide-react": "^0.453.0",
  "marked": "^16.1.1",
+ "next": "15.4.2",
  "qrcode.react": "^4.2.0",
+ "react": "19.1.0",
+ "react-dom": "19.1.0",
  "react-draft-wysiwyg": "^1.15.0",
+ "react-hook-form": "^7.55.0",
  "react-markdown": "^10.1.0",
  "react-markdown-editor-lite": "^1.3.4",
  "react-quill": "^2.0.0",
  "remark-gfm": "^4.0.1",
- "turndown": "^7.2.0",
- "class-variance-authority": "^0.7.1",
- "clsx": "^2.1.1",
- "next": "15.4.2",
- "react": "19.1.0",
- "react-dom": "19.1.0",
- "react-hook-form": "^7.55.0",
  "tailwind-merge": "^3.3.1",
  "tailwindcss-animate": "^1.0.7",
+ "turndown": "^7.2.0",
  "zod": "^3.24.2"
  },
  "devDependencies": {
  "@eslint/eslintrc": "^3",
  "@tailwindcss/postcss": "^4.1.11",
  "@types/draft-js": "^0.11.18",
- "@types/turndown": "^5.0.5",
  "@types/node": "^20",
  "@types/react": "^19",
  "@types/react-dom": "^19",
+ "@types/turndown": "^5.0.5",
  "eslint": "^9",
  "eslint-config-next": "15.4.2",
  "tailwindcss": "^4.1.11",

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

@@ -70,10 +70,21 @@ export default function LoginScreen() {
  };
  };
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  if (isLoading) {
  return (
  <div className="flex h-screen items-center justify-center">
- <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900"></div>
+ <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900" />
  </div>
  );
  }
@@ -101,15 +112,15 @@ export default function LoginScreen() {
  />
  <h1 className="text-3xl font-bold">Group Charter</h1>
  </div>
- <p class="text-gray-600">
+ <p className="text-gray-600">
  Coordinate your group in the MetaState
  </p>
  </div>
  <div className="bg-white/50 p-8 rounded-lg shadow-lg max-w-md w-full">
  <div className="text-center mb-8">
-
+
  <p className="text-gray-600">
- Scan the QR code to login with your W3DS identity
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
  </p>
  </div>
 
@@ -142,7 +153,9 @@ export default function LoginScreen() {
 
  <div className="text-center">
  <p className="text-sm text-gray-500">
- Use your W3DS wallet to scan this QR code and authenticate
+ <span className="mb-1 block font-bold text-gray-600">The {isMobileDevice() ? "button": "code"} is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
  </p>
  </div>
 
@@ -155,13 +168,15 @@ export default function LoginScreen() {
  servers.
  </div>
 
- <Image
- src="/W3DS.svg"
- alt="W3DS Logo"
- width={50}
- height={20}
- className="mx-auto mt-5"
- />
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
+ <Image
+ src="/W3DS.svg"
+ alt="W3DS Logo"
+ width={50}
+ height={20}
+ className="mx-auto mt-5"
+ />
+ </a>
  </div>
  </div>
  );

platforms/pictique/package.json

@@ -4,7 +4,7 @@
 	"version": "0.0.1",
 	"type": "module",
 	"scripts": {
- "dev": "vite dev",
+ "dev": "vite dev --host",
  "build": "vite build",
  "preview": "vite preview",
  "prepare": "svelte-kit sync || echo ''",

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

@@ -1,13 +1,17 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
-	import { PUBLIC_PICTIQUE_BASE_URL } from '$env/static/public';
+	import {
+ PUBLIC_APP_STORE_EID_WALLET,
+ PUBLIC_PICTIQUE_BASE_URL,
+ PUBLIC_PLAY_STORE_EID_WALLET
+	} from '$env/static/public';
 	import { W3dslogo } from '$lib/icons';
 	import { Qr } from '$lib/ui';
 	import { apiClient, setAuthId, setAuthToken } from '$lib/utils';
+	import { getDeepLinkUrl, isMobileDevice } from '$lib/utils/mobile-detection';
 	import { onMount } from 'svelte';
 	import { onDestroy } from 'svelte';
 	import { qrcode } from 'svelte-qrcode-action';
-	import { isMobileDevice, getDeepLinkUrl } from '$lib/utils/mobile-detection';
 
 	let qrData: string;
 	let isMobile = false;
@@ -16,7 +20,22 @@
  isMobile = window.innerWidth <= 640; // Tailwind's `sm` breakpoint
 	}
 
+	let getAppStoreLink: () => string = () => '';
+
 	onMount(async () => {
+ getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ }
+
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return 'https://apps.apple.com/in/app/eid-for-w3ds/id6747748667';
+ }
+
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ };
+
  checkMobile();
  window.addEventListener('resize', checkMobile);
 
@@ -60,7 +79,7 @@
 	>
  <h2>
  {#if isMobileDevice()}
- Login with your <b><u>eID Wallet</u></b>
+ Login with your <a href={getAppStoreLink()}><b><u>eID Wallet</u></b></a>
  {:else}
  Scan the QR code using your <b><u>eID App</u></b> to login
  {/if}
@@ -108,7 +127,9 @@
  {/if}
 
  <p class="text-center">
- <span class="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span class="mb-1 block font-bold text-gray-600"
+ >The {isMobileDevice() ? 'button' : 'code'} is valid for 60 seconds</span
+ >
  <span class="block font-light text-gray-600">Please refresh the page if it expires</span
  >
  </p>
@@ -120,6 +141,7 @@
  centralised servers.
  </p>
 	</div>
-
-	<W3dslogo />
+	<a href="https://metastate.foundation" target="_blank">
+ <W3dslogo />
+	</a>
 </div>

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

@@ -18,6 +18,7 @@
 	let ownerProfile = $derived.by(async () => {
  if (ownerId) {
  const response = await apiClient.get<userProfile>(`/api/users/${ownerId}`);
+ console.log('Owner Profile:', response.data);
  return response.data;
  }
 	});
@@ -27,6 +28,7 @@
  loading = true;
  error = null;
  const response = await apiClient.get<userProfile>(`/api/users/${profileId}`);
+ console.log('Fetched Profile:', response.data);
  profile = response.data;
  } catch (err) {
  error = err instanceof Error ? err.message : 'Failed to load profile';

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

@@ -55,7 +55,7 @@
  return null;
  });
 
- if (permissions === "prompt") {
+ if (permissions === "prompt" || permissions === "denied") {
  permissions = await requestPermissions();
  }
 
@@ -340,7 +340,6 @@
  ? "Vote signed successfully!"
  : "Message signed successfully!",
  );
-
  // Check if this was from a deep link
  const deepLinkData = sessionStorage.getItem("deepLinkData");
  if (deepLinkData) {

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

@@ -41,6 +41,16 @@ export function LoginMain(): JSX.Element {
  new URL(data.uri).searchParams.get('session') as string
  );
  };
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
 
  useEffect(() => {
  getOfferData()
@@ -77,20 +87,39 @@ export function LoginMain(): JSX.Element {
  <div>
  {isMobileDevice() ? (
  <div className='flex flex-col gap-4 items-center'>
+ <div className='text-xs text-gray-500 text-center max-w-xs'>
+ Click the button to open your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </div>
  <a
  href={qr ? getDeepLinkUrl(qr) : '#'}
  className='px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors text-center'
  >
  Login with eID Wallet
  </a>
- <div className='text-xs text-gray-500 text-center max-w-xs'>
- Click the button to open your eID wallet app
- </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The button is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
  </div>
  ) : (
+ <div className='flex flex-col gap-4 items-center'>
+ <p className="text-gray-600">
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </p>
  <div className='p-2 rounded-md bg-white w-fit'>
  {qr && <QRCode value={qr} />}
  </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
+ </div>
  )}
  </div>
  <div className='absolute right-0 rotate-90 top-1/2'>
@@ -110,12 +139,14 @@ export function LoginMain(): JSX.Element {
  separation, where all your personal content is stored in
  your own sovereign eVault, not on centralised servers.
  </div>
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <Image
  src='/assets/w3dslogo.svg'
  alt='W3DS logo'
  width={100}
  height={20}
  />
+ </a>
  </div>
  </div>
  </main>

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

@@ -66,6 +66,17 @@ export default function LoginPage() {
  return () => eventSource.close();
  }, [sessionId, login]);
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  return (
  <div className="flex flex-col items-center justify-center gap-4 min-h-screen px-4 pb-safe">
  {/* Logo + Tagline */}
@@ -89,13 +100,13 @@ export default function LoginPage() {
  {isMobile ? (
  <>
  <span>Click the button below using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  ) : (
  <>
  <span>Scan the QR using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  )}
@@ -156,8 +167,9 @@ export default function LoginPage() {
  </div>
  </div>
  </Card>
-
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <img src="/W3DS.svg" alt="w3ds Logo" className="max-h-8" />
+ </a>
  </div>
  );
 }

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

@@ -1,7 +1,7 @@
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
- /* config options here */
+/* config options here */
 };
 
 export default nextConfig;

platforms/group-charter-manager/package.json

@@ -15,6 +15,7 @@
  "@milkdown/preset-gfm": "^7.15.2",
  "@milkdown/react": "^7.15.2",
  "@milkdown/theme-nord": "^7.15.2",
+ "@next/env": "^15.4.7",
  "@radix-ui/react-alert-dialog": "^1.1.7",
  "@radix-ui/react-dialog": "^1.1.7",
  "@radix-ui/react-dropdown-menu": "^2.1.7",
@@ -29,35 +30,35 @@
  "@tiptap/starter-kit": "^2.24.0",
  "@toast-ui/react-editor": "^3.2.3",
  "axios": "^1.6.7",
+ "class-variance-authority": "^0.7.1",
+ "clsx": "^2.1.1",
  "cmdk": "^1.1.1",
  "draft-js": "^0.11.7",
  "lucide-react": "^0.453.0",
  "marked": "^16.1.1",
+ "next": "15.4.2",
  "qrcode.react": "^4.2.0",
+ "react": "19.1.0",
+ "react-dom": "19.1.0",
  "react-draft-wysiwyg": "^1.15.0",
+ "react-hook-form": "^7.55.0",
  "react-markdown": "^10.1.0",
  "react-markdown-editor-lite": "^1.3.4",
  "react-quill": "^2.0.0",
  "remark-gfm": "^4.0.1",
- "turndown": "^7.2.0",
- "class-variance-authority": "^0.7.1",
- "clsx": "^2.1.1",
- "next": "15.4.2",
- "react": "19.1.0",
- "react-dom": "19.1.0",
- "react-hook-form": "^7.55.0",
  "tailwind-merge": "^3.3.1",
  "tailwindcss-animate": "^1.0.7",
+ "turndown": "^7.2.0",
  "zod": "^3.24.2"
  },
  "devDependencies": {
  "@eslint/eslintrc": "^3",
  "@tailwindcss/postcss": "^4.1.11",
  "@types/draft-js": "^0.11.18",
- "@types/turndown": "^5.0.5",
  "@types/node": "^20",
  "@types/react": "^19",
  "@types/react-dom": "^19",
+ "@types/turndown": "^5.0.5",
  "eslint": "^9",
  "eslint-config-next": "15.4.2",
  "tailwindcss": "^4.1.11",

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

@@ -70,10 +70,21 @@ export default function LoginScreen() {
  };
  };
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  if (isLoading) {
  return (
  <div className="flex h-screen items-center justify-center">
- <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900"></div>
+ <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900" />
  </div>
  );
  }
@@ -101,15 +112,15 @@ export default function LoginScreen() {
  />
  <h1 className="text-3xl font-bold">Group Charter</h1>
  </div>
- <p class="text-gray-600">
+ <p className="text-gray-600">
  Coordinate your group in the MetaState
  </p>
  </div>
  <div className="bg-white/50 p-8 rounded-lg shadow-lg max-w-md w-full">
  <div className="text-center mb-8">
-
+
  <p className="text-gray-600">
- Scan the QR code to login with your W3DS identity
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
  </p>
  </div>
 
@@ -142,7 +153,9 @@ export default function LoginScreen() {
 
  <div className="text-center">
  <p className="text-sm text-gray-500">
- Use your W3DS wallet to scan this QR code and authenticate
+ <span className="mb-1 block font-bold text-gray-600">The {isMobileDevice() ? "button": "code"} is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
  </p>
  </div>
 
@@ -155,13 +168,15 @@ export default function LoginScreen() {
  servers.
  </div>
 
- <Image
- src="/W3DS.svg"
- alt="W3DS Logo"
- width={50}
- height={20}
- className="mx-auto mt-5"
- />
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
+ <Image
+ src="/W3DS.svg"
+ alt="W3DS Logo"
+ width={50}
+ height={20}
+ className="mx-auto mt-5"
+ />
+ </a>
  </div>
  </div>
  );

platforms/pictique/package.json

@@ -4,7 +4,7 @@
 	"version": "0.0.1",
 	"type": "module",
 	"scripts": {
- "dev": "vite dev",
+ "dev": "vite dev --host",
  "build": "vite build",
  "preview": "vite preview",
  "prepare": "svelte-kit sync || echo ''",

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

@@ -1,13 +1,17 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
-	import { PUBLIC_PICTIQUE_BASE_URL } from '$env/static/public';
+	import {
+ PUBLIC_APP_STORE_EID_WALLET,
+ PUBLIC_PICTIQUE_BASE_URL,
+ PUBLIC_PLAY_STORE_EID_WALLET
+	} from '$env/static/public';
 	import { W3dslogo } from '$lib/icons';
 	import { Qr } from '$lib/ui';
 	import { apiClient, setAuthId, setAuthToken } from '$lib/utils';
+	import { getDeepLinkUrl, isMobileDevice } from '$lib/utils/mobile-detection';
 	import { onMount } from 'svelte';
 	import { onDestroy } from 'svelte';
 	import { qrcode } from 'svelte-qrcode-action';
-	import { isMobileDevice, getDeepLinkUrl } from '$lib/utils/mobile-detection';
 
 	let qrData: string;
 	let isMobile = false;
@@ -16,7 +20,22 @@
  isMobile = window.innerWidth <= 640; // Tailwind's `sm` breakpoint
 	}
 
+	let getAppStoreLink: () => string = () => '';
+
 	onMount(async () => {
+ getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ }
+
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return 'https://apps.apple.com/in/app/eid-for-w3ds/id6747748667';
+ }
+
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ };
+
  checkMobile();
  window.addEventListener('resize', checkMobile);
 
@@ -60,7 +79,7 @@
 	>
  <h2>
  {#if isMobileDevice()}
- Login with your <b><u>eID Wallet</u></b>
+ Login with your <a href={getAppStoreLink()}><b><u>eID Wallet</u></b></a>
  {:else}
  Scan the QR code using your <b><u>eID App</u></b> to login
  {/if}
@@ -108,7 +127,9 @@
  {/if}
 
  <p class="text-center">
- <span class="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span class="mb-1 block font-bold text-gray-600"
+ >The {isMobileDevice() ? 'button' : 'code'} is valid for 60 seconds</span
+ >
  <span class="block font-light text-gray-600">Please refresh the page if it expires</span
  >
  </p>
@@ -120,6 +141,7 @@
  centralised servers.
  </p>
 	</div>
-
-	<W3dslogo />
+	<a href="https://metastate.foundation" target="_blank">
+ <W3dslogo />
+	</a>
 </div>

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

@@ -18,6 +18,7 @@
 	let ownerProfile = $derived.by(async () => {
  if (ownerId) {
  const response = await apiClient.get<userProfile>(`/api/users/${ownerId}`);
+ console.log('Owner Profile:', response.data);
  return response.data;
  }
 	});
@@ -27,6 +28,7 @@
  loading = true;
  error = null;
  const response = await apiClient.get<userProfile>(`/api/users/${profileId}`);
+ console.log('Fetched Profile:', response.data);
  profile = response.data;
  } catch (err) {
  error = err instanceof Error ? err.message : 'Failed to load profile';

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

@@ -55,7 +55,7 @@
  return null;
  });
 
- if (permissions === "prompt") {
+ if (permissions === "prompt" || permissions === "denied") {
  permissions = await requestPermissions();
  }
 
@@ -340,7 +340,6 @@
  ? "Vote signed successfully!"
  : "Message signed successfully!",
  );
-
  // Check if this was from a deep link
  const deepLinkData = sessionStorage.getItem("deepLinkData");
  if (deepLinkData) {

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

@@ -41,6 +41,16 @@ export function LoginMain(): JSX.Element {
  new URL(data.uri).searchParams.get('session') as string
  );
  };
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
 
  useEffect(() => {
  getOfferData()
@@ -77,20 +87,39 @@ export function LoginMain(): JSX.Element {
  <div>
  {isMobileDevice() ? (
  <div className='flex flex-col gap-4 items-center'>
+ <div className='text-xs text-gray-500 text-center max-w-xs'>
+ Click the button to open your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </div>
  <a
  href={qr ? getDeepLinkUrl(qr) : '#'}
  className='px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors text-center'
  >
  Login with eID Wallet
  </a>
- <div className='text-xs text-gray-500 text-center max-w-xs'>
- Click the button to open your eID wallet app
- </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The button is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
  </div>
  ) : (
+ <div className='flex flex-col gap-4 items-center'>
+ <p className="text-gray-600">
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </p>
  <div className='p-2 rounded-md bg-white w-fit'>
  {qr && <QRCode value={qr} />}
  </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
+ </div>
  )}
  </div>
  <div className='absolute right-0 rotate-90 top-1/2'>
@@ -110,12 +139,14 @@ export function LoginMain(): JSX.Element {
  separation, where all your personal content is stored in
  your own sovereign eVault, not on centralised servers.
  </div>
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <Image
  src='/assets/w3dslogo.svg'
  alt='W3DS logo'
  width={100}
  height={20}
  />
+ </a>
  </div>
  </div>
  </main>

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

@@ -66,6 +66,17 @@ export default function LoginPage() {
  return () => eventSource.close();
  }, [sessionId, login]);
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  return (
  <div className="flex flex-col items-center justify-center gap-4 min-h-screen px-4 pb-safe">
  {/* Logo + Tagline */}
@@ -89,13 +100,13 @@ export default function LoginPage() {
  {isMobile ? (
  <>
  <span>Click the button below using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  ) : (
  <>
  <span>Scan the QR using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  )}
@@ -156,8 +167,9 @@ export default function LoginPage() {
  </div>
  </div>
  </Card>
-
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <img src="/W3DS.svg" alt="w3ds Logo" className="max-h-8" />
+ </a>
  </div>
  );
 }

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

@@ -1,7 +1,7 @@
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
- /* config options here */
+/* config options here */
 };
 
 export default nextConfig;

platforms/group-charter-manager/package.json

@@ -15,6 +15,7 @@
  "@milkdown/preset-gfm": "^7.15.2",
  "@milkdown/react": "^7.15.2",
  "@milkdown/theme-nord": "^7.15.2",
+ "@next/env": "^15.4.7",
  "@radix-ui/react-alert-dialog": "^1.1.7",
  "@radix-ui/react-dialog": "^1.1.7",
  "@radix-ui/react-dropdown-menu": "^2.1.7",
@@ -29,35 +30,35 @@
  "@tiptap/starter-kit": "^2.24.0",
  "@toast-ui/react-editor": "^3.2.3",
  "axios": "^1.6.7",
+ "class-variance-authority": "^0.7.1",
+ "clsx": "^2.1.1",
  "cmdk": "^1.1.1",
  "draft-js": "^0.11.7",
  "lucide-react": "^0.453.0",
  "marked": "^16.1.1",
+ "next": "15.4.2",
  "qrcode.react": "^4.2.0",
+ "react": "19.1.0",
+ "react-dom": "19.1.0",
  "react-draft-wysiwyg": "^1.15.0",
+ "react-hook-form": "^7.55.0",
  "react-markdown": "^10.1.0",
  "react-markdown-editor-lite": "^1.3.4",
  "react-quill": "^2.0.0",
  "remark-gfm": "^4.0.1",
- "turndown": "^7.2.0",
- "class-variance-authority": "^0.7.1",
- "clsx": "^2.1.1",
- "next": "15.4.2",
- "react": "19.1.0",
- "react-dom": "19.1.0",
- "react-hook-form": "^7.55.0",
  "tailwind-merge": "^3.3.1",
  "tailwindcss-animate": "^1.0.7",
+ "turndown": "^7.2.0",
  "zod": "^3.24.2"
  },
  "devDependencies": {
  "@eslint/eslintrc": "^3",
  "@tailwindcss/postcss": "^4.1.11",
  "@types/draft-js": "^0.11.18",
- "@types/turndown": "^5.0.5",
  "@types/node": "^20",
  "@types/react": "^19",
  "@types/react-dom": "^19",
+ "@types/turndown": "^5.0.5",
  "eslint": "^9",
  "eslint-config-next": "15.4.2",
  "tailwindcss": "^4.1.11",

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

@@ -70,10 +70,21 @@ export default function LoginScreen() {
  };
  };
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  if (isLoading) {
  return (
  <div className="flex h-screen items-center justify-center">
- <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900"></div>
+ <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900" />
  </div>
  );
  }
@@ -101,15 +112,15 @@ export default function LoginScreen() {
  />
  <h1 className="text-3xl font-bold">Group Charter</h1>
  </div>
- <p class="text-gray-600">
+ <p className="text-gray-600">
  Coordinate your group in the MetaState
  </p>
  </div>
  <div className="bg-white/50 p-8 rounded-lg shadow-lg max-w-md w-full">
  <div className="text-center mb-8">
-
+
  <p className="text-gray-600">
- Scan the QR code to login with your W3DS identity
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
  </p>
  </div>
 
@@ -142,7 +153,9 @@ export default function LoginScreen() {
 
  <div className="text-center">
  <p className="text-sm text-gray-500">
- Use your W3DS wallet to scan this QR code and authenticate
+ <span className="mb-1 block font-bold text-gray-600">The {isMobileDevice() ? "button": "code"} is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
  </p>
  </div>
 
@@ -155,13 +168,15 @@ export default function LoginScreen() {
  servers.
  </div>
 
- <Image
- src="/W3DS.svg"
- alt="W3DS Logo"
- width={50}
- height={20}
- className="mx-auto mt-5"
- />
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
+ <Image
+ src="/W3DS.svg"
+ alt="W3DS Logo"
+ width={50}
+ height={20}
+ className="mx-auto mt-5"
+ />
+ </a>
  </div>
  </div>
  );

platforms/pictique/package.json

@@ -4,7 +4,7 @@
 	"version": "0.0.1",
 	"type": "module",
 	"scripts": {
- "dev": "vite dev",
+ "dev": "vite dev --host",
  "build": "vite build",
  "preview": "vite preview",
  "prepare": "svelte-kit sync || echo ''",

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

@@ -1,13 +1,17 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
-	import { PUBLIC_PICTIQUE_BASE_URL } from '$env/static/public';
+	import {
+ PUBLIC_APP_STORE_EID_WALLET,
+ PUBLIC_PICTIQUE_BASE_URL,
+ PUBLIC_PLAY_STORE_EID_WALLET
+	} from '$env/static/public';
 	import { W3dslogo } from '$lib/icons';
 	import { Qr } from '$lib/ui';
 	import { apiClient, setAuthId, setAuthToken } from '$lib/utils';
+	import { getDeepLinkUrl, isMobileDevice } from '$lib/utils/mobile-detection';
 	import { onMount } from 'svelte';
 	import { onDestroy } from 'svelte';
 	import { qrcode } from 'svelte-qrcode-action';
-	import { isMobileDevice, getDeepLinkUrl } from '$lib/utils/mobile-detection';
 
 	let qrData: string;
 	let isMobile = false;
@@ -16,7 +20,22 @@
  isMobile = window.innerWidth <= 640; // Tailwind's `sm` breakpoint
 	}
 
+	let getAppStoreLink: () => string = () => '';
+
 	onMount(async () => {
+ getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ }
+
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return 'https://apps.apple.com/in/app/eid-for-w3ds/id6747748667';
+ }
+
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ };
+
  checkMobile();
  window.addEventListener('resize', checkMobile);
 
@@ -60,7 +79,7 @@
 	>
  <h2>
  {#if isMobileDevice()}
- Login with your <b><u>eID Wallet</u></b>
+ Login with your <a href={getAppStoreLink()}><b><u>eID Wallet</u></b></a>
  {:else}
  Scan the QR code using your <b><u>eID App</u></b> to login
  {/if}
@@ -108,7 +127,9 @@
  {/if}
 
  <p class="text-center">
- <span class="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span class="mb-1 block font-bold text-gray-600"
+ >The {isMobileDevice() ? 'button' : 'code'} is valid for 60 seconds</span
+ >
  <span class="block font-light text-gray-600">Please refresh the page if it expires</span
  >
  </p>
@@ -120,6 +141,7 @@
  centralised servers.
  </p>
 	</div>
-
-	<W3dslogo />
+	<a href="https://metastate.foundation" target="_blank">
+ <W3dslogo />
+	</a>
 </div>

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

@@ -18,6 +18,7 @@
 	let ownerProfile = $derived.by(async () => {
  if (ownerId) {
  const response = await apiClient.get<userProfile>(`/api/users/${ownerId}`);
+ console.log('Owner Profile:', response.data);
  return response.data;
  }
 	});
@@ -27,6 +28,7 @@
  loading = true;
  error = null;
  const response = await apiClient.get<userProfile>(`/api/users/${profileId}`);
+ console.log('Fetched Profile:', response.data);
  profile = response.data;
  } catch (err) {
  error = err instanceof Error ? err.message : 'Failed to load profile';

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

@@ -55,7 +55,7 @@
  return null;
  });
 
- if (permissions === "prompt") {
+ if (permissions === "prompt" || permissions === "denied") {
  permissions = await requestPermissions();
  }
 
@@ -340,7 +340,6 @@
  ? "Vote signed successfully!"
  : "Message signed successfully!",
  );
-
  // Check if this was from a deep link
  const deepLinkData = sessionStorage.getItem("deepLinkData");
  if (deepLinkData) {

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

@@ -41,6 +41,16 @@ export function LoginMain(): JSX.Element {
  new URL(data.uri).searchParams.get('session') as string
  );
  };
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
 
  useEffect(() => {
  getOfferData()
@@ -77,20 +87,39 @@ export function LoginMain(): JSX.Element {
  <div>
  {isMobileDevice() ? (
  <div className='flex flex-col gap-4 items-center'>
+ <div className='text-xs text-gray-500 text-center max-w-xs'>
+ Click the button to open your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </div>
  <a
  href={qr ? getDeepLinkUrl(qr) : '#'}
  className='px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors text-center'
  >
  Login with eID Wallet
  </a>
- <div className='text-xs text-gray-500 text-center max-w-xs'>
- Click the button to open your eID wallet app
- </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The button is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
  </div>
  ) : (
+ <div className='flex flex-col gap-4 items-center'>
+ <p className="text-gray-600">
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </p>
  <div className='p-2 rounded-md bg-white w-fit'>
  {qr && <QRCode value={qr} />}
  </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
+ </div>
  )}
  </div>
  <div className='absolute right-0 rotate-90 top-1/2'>
@@ -110,12 +139,14 @@ export function LoginMain(): JSX.Element {
  separation, where all your personal content is stored in
  your own sovereign eVault, not on centralised servers.
  </div>
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <Image
  src='/assets/w3dslogo.svg'
  alt='W3DS logo'
  width={100}
  height={20}
  />
+ </a>
  </div>
  </div>
  </main>

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

@@ -66,6 +66,17 @@ export default function LoginPage() {
  return () => eventSource.close();
  }, [sessionId, login]);
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  return (
  <div className="flex flex-col items-center justify-center gap-4 min-h-screen px-4 pb-safe">
  {/* Logo + Tagline */}
@@ -89,13 +100,13 @@ export default function LoginPage() {
  {isMobile ? (
  <>
  <span>Click the button below using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  ) : (
  <>
  <span>Scan the QR using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  )}
@@ -156,8 +167,9 @@ export default function LoginPage() {
  </div>
  </div>
  </Card>
-
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <img src="/W3DS.svg" alt="w3ds Logo" className="max-h-8" />
+ </a>
  </div>
  );
 }

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

@@ -1,7 +1,7 @@
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
- /* config options here */
+/* config options here */
 };
 
 export default nextConfig;

platforms/group-charter-manager/package.json

@@ -15,6 +15,7 @@
  "@milkdown/preset-gfm": "^7.15.2",
  "@milkdown/react": "^7.15.2",
  "@milkdown/theme-nord": "^7.15.2",
+ "@next/env": "^15.4.7",
  "@radix-ui/react-alert-dialog": "^1.1.7",
  "@radix-ui/react-dialog": "^1.1.7",
  "@radix-ui/react-dropdown-menu": "^2.1.7",
@@ -29,35 +30,35 @@
  "@tiptap/starter-kit": "^2.24.0",
  "@toast-ui/react-editor": "^3.2.3",
  "axios": "^1.6.7",
+ "class-variance-authority": "^0.7.1",
+ "clsx": "^2.1.1",
  "cmdk": "^1.1.1",
  "draft-js": "^0.11.7",
  "lucide-react": "^0.453.0",
  "marked": "^16.1.1",
+ "next": "15.4.2",
  "qrcode.react": "^4.2.0",
+ "react": "19.1.0",
+ "react-dom": "19.1.0",
  "react-draft-wysiwyg": "^1.15.0",
+ "react-hook-form": "^7.55.0",
  "react-markdown": "^10.1.0",
  "react-markdown-editor-lite": "^1.3.4",
  "react-quill": "^2.0.0",
  "remark-gfm": "^4.0.1",
- "turndown": "^7.2.0",
- "class-variance-authority": "^0.7.1",
- "clsx": "^2.1.1",
- "next": "15.4.2",
- "react": "19.1.0",
- "react-dom": "19.1.0",
- "react-hook-form": "^7.55.0",
  "tailwind-merge": "^3.3.1",
  "tailwindcss-animate": "^1.0.7",
+ "turndown": "^7.2.0",
  "zod": "^3.24.2"
  },
  "devDependencies": {
  "@eslint/eslintrc": "^3",
  "@tailwindcss/postcss": "^4.1.11",
  "@types/draft-js": "^0.11.18",
- "@types/turndown": "^5.0.5",
  "@types/node": "^20",
  "@types/react": "^19",
  "@types/react-dom": "^19",
+ "@types/turndown": "^5.0.5",
  "eslint": "^9",
  "eslint-config-next": "15.4.2",
  "tailwindcss": "^4.1.11",

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

@@ -70,10 +70,21 @@ export default function LoginScreen() {
  };
  };
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  if (isLoading) {
  return (
  <div className="flex h-screen items-center justify-center">
- <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900"></div>
+ <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900" />
  </div>
  );
  }
@@ -101,15 +112,15 @@ export default function LoginScreen() {
  />
  <h1 className="text-3xl font-bold">Group Charter</h1>
  </div>
- <p class="text-gray-600">
+ <p className="text-gray-600">
  Coordinate your group in the MetaState
  </p>
  </div>
  <div className="bg-white/50 p-8 rounded-lg shadow-lg max-w-md w-full">
  <div className="text-center mb-8">
-
+
  <p className="text-gray-600">
- Scan the QR code to login with your W3DS identity
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
  </p>
  </div>
 
@@ -142,7 +153,9 @@ export default function LoginScreen() {
 
  <div className="text-center">
  <p className="text-sm text-gray-500">
- Use your W3DS wallet to scan this QR code and authenticate
+ <span className="mb-1 block font-bold text-gray-600">The {isMobileDevice() ? "button": "code"} is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
  </p>
  </div>
 
@@ -155,13 +168,15 @@ export default function LoginScreen() {
  servers.
  </div>
 
- <Image
- src="/W3DS.svg"
- alt="W3DS Logo"
- width={50}
- height={20}
- className="mx-auto mt-5"
- />
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
+ <Image
+ src="/W3DS.svg"
+ alt="W3DS Logo"
+ width={50}
+ height={20}
+ className="mx-auto mt-5"
+ />
+ </a>
  </div>
  </div>
  );

platforms/pictique/package.json

@@ -4,7 +4,7 @@
 	"version": "0.0.1",
 	"type": "module",
 	"scripts": {
- "dev": "vite dev",
+ "dev": "vite dev --host",
  "build": "vite build",
  "preview": "vite preview",
  "prepare": "svelte-kit sync || echo ''",

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

@@ -1,13 +1,17 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
-	import { PUBLIC_PICTIQUE_BASE_URL } from '$env/static/public';
+	import {
+ PUBLIC_APP_STORE_EID_WALLET,
+ PUBLIC_PICTIQUE_BASE_URL,
+ PUBLIC_PLAY_STORE_EID_WALLET
+	} from '$env/static/public';
 	import { W3dslogo } from '$lib/icons';
 	import { Qr } from '$lib/ui';
 	import { apiClient, setAuthId, setAuthToken } from '$lib/utils';
+	import { getDeepLinkUrl, isMobileDevice } from '$lib/utils/mobile-detection';
 	import { onMount } from 'svelte';
 	import { onDestroy } from 'svelte';
 	import { qrcode } from 'svelte-qrcode-action';
-	import { isMobileDevice, getDeepLinkUrl } from '$lib/utils/mobile-detection';
 
 	let qrData: string;
 	let isMobile = false;
@@ -16,7 +20,22 @@
  isMobile = window.innerWidth <= 640; // Tailwind's `sm` breakpoint
 	}
 
+	let getAppStoreLink: () => string = () => '';
+
 	onMount(async () => {
+ getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ }
+
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return 'https://apps.apple.com/in/app/eid-for-w3ds/id6747748667';
+ }
+
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ };
+
  checkMobile();
  window.addEventListener('resize', checkMobile);
 
@@ -60,7 +79,7 @@
 	>
  <h2>
  {#if isMobileDevice()}
- Login with your <b><u>eID Wallet</u></b>
+ Login with your <a href={getAppStoreLink()}><b><u>eID Wallet</u></b></a>
  {:else}
  Scan the QR code using your <b><u>eID App</u></b> to login
  {/if}
@@ -108,7 +127,9 @@
  {/if}
 
  <p class="text-center">
- <span class="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span class="mb-1 block font-bold text-gray-600"
+ >The {isMobileDevice() ? 'button' : 'code'} is valid for 60 seconds</span
+ >
  <span class="block font-light text-gray-600">Please refresh the page if it expires</span
  >
  </p>
@@ -120,6 +141,7 @@
  centralised servers.
  </p>
 	</div>
-
-	<W3dslogo />
+	<a href="https://metastate.foundation" target="_blank">
+ <W3dslogo />
+	</a>
 </div>

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

@@ -18,6 +18,7 @@
 	let ownerProfile = $derived.by(async () => {
  if (ownerId) {
  const response = await apiClient.get<userProfile>(`/api/users/${ownerId}`);
+ console.log('Owner Profile:', response.data);
  return response.data;
  }
 	});
@@ -27,6 +28,7 @@
  loading = true;
  error = null;
  const response = await apiClient.get<userProfile>(`/api/users/${profileId}`);
+ console.log('Fetched Profile:', response.data);
  profile = response.data;
  } catch (err) {
  error = err instanceof Error ? err.message : 'Failed to load profile';

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

@@ -55,7 +55,7 @@
  return null;
  });
 
- if (permissions === "prompt") {
+ if (permissions === "prompt" || permissions === "denied") {
  permissions = await requestPermissions();
  }
 
@@ -340,7 +340,6 @@
  ? "Vote signed successfully!"
  : "Message signed successfully!",
  );
-
  // Check if this was from a deep link
  const deepLinkData = sessionStorage.getItem("deepLinkData");
  if (deepLinkData) {

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

@@ -41,6 +41,16 @@ export function LoginMain(): JSX.Element {
  new URL(data.uri).searchParams.get('session') as string
  );
  };
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
 
  useEffect(() => {
  getOfferData()
@@ -77,20 +87,39 @@ export function LoginMain(): JSX.Element {
  <div>
  {isMobileDevice() ? (
  <div className='flex flex-col gap-4 items-center'>
+ <div className='text-xs text-gray-500 text-center max-w-xs'>
+ Click the button to open your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </div>
  <a
  href={qr ? getDeepLinkUrl(qr) : '#'}
  className='px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors text-center'
  >
  Login with eID Wallet
  </a>
- <div className='text-xs text-gray-500 text-center max-w-xs'>
- Click the button to open your eID wallet app
- </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The button is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
  </div>
  ) : (
+ <div className='flex flex-col gap-4 items-center'>
+ <p className="text-gray-600">
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
+ </p>
  <div className='p-2 rounded-md bg-white w-fit'>
  {qr && <QRCode value={qr} />}
  </div>
+ <div className="text-center mt-4">
+ <p className="text-sm text-gray-500">
+ <span className="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
+ </p>
+ </div>
+ </div>
  )}
  </div>
  <div className='absolute right-0 rotate-90 top-1/2'>
@@ -110,12 +139,14 @@ export function LoginMain(): JSX.Element {
  separation, where all your personal content is stored in
  your own sovereign eVault, not on centralised servers.
  </div>
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <Image
  src='/assets/w3dslogo.svg'
  alt='W3DS logo'
  width={100}
  height={20}
  />
+ </a>
  </div>
  </div>
  </main>

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

@@ -66,6 +66,17 @@ export default function LoginPage() {
  return () => eventSource.close();
  }, [sessionId, login]);
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  return (
  <div className="flex flex-col items-center justify-center gap-4 min-h-screen px-4 pb-safe">
  {/* Logo + Tagline */}
@@ -89,13 +100,13 @@ export default function LoginPage() {
  {isMobile ? (
  <>
  <span>Click the button below using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  ) : (
  <>
  <span>Scan the QR using your</span>
- <span className="font-bold underline">eID App</span>
+ <a href={getAppStoreLink()}><span className="font-bold underline">eID App</span></a>
  <span>to login</span>
  </>
  )}
@@ -156,8 +167,9 @@ export default function LoginPage() {
  </div>
  </div>
  </Card>
-
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
  <img src="/W3DS.svg" alt="w3ds Logo" className="max-h-8" />
+ </a>
  </div>
  );
 }

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

@@ -1,7 +1,7 @@
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
- /* config options here */
+/* config options here */
 };
 
 export default nextConfig;

platforms/group-charter-manager/package.json

@@ -15,6 +15,7 @@
  "@milkdown/preset-gfm": "^7.15.2",
  "@milkdown/react": "^7.15.2",
  "@milkdown/theme-nord": "^7.15.2",
+ "@next/env": "^15.4.7",
  "@radix-ui/react-alert-dialog": "^1.1.7",
  "@radix-ui/react-dialog": "^1.1.7",
  "@radix-ui/react-dropdown-menu": "^2.1.7",
@@ -29,35 +30,35 @@
  "@tiptap/starter-kit": "^2.24.0",
  "@toast-ui/react-editor": "^3.2.3",
  "axios": "^1.6.7",
+ "class-variance-authority": "^0.7.1",
+ "clsx": "^2.1.1",
  "cmdk": "^1.1.1",
  "draft-js": "^0.11.7",
  "lucide-react": "^0.453.0",
  "marked": "^16.1.1",
+ "next": "15.4.2",
  "qrcode.react": "^4.2.0",
+ "react": "19.1.0",
+ "react-dom": "19.1.0",
  "react-draft-wysiwyg": "^1.15.0",
+ "react-hook-form": "^7.55.0",
  "react-markdown": "^10.1.0",
  "react-markdown-editor-lite": "^1.3.4",
  "react-quill": "^2.0.0",
  "remark-gfm": "^4.0.1",
- "turndown": "^7.2.0",
- "class-variance-authority": "^0.7.1",
- "clsx": "^2.1.1",
- "next": "15.4.2",
- "react": "19.1.0",
- "react-dom": "19.1.0",
- "react-hook-form": "^7.55.0",
  "tailwind-merge": "^3.3.1",
  "tailwindcss-animate": "^1.0.7",
+ "turndown": "^7.2.0",
  "zod": "^3.24.2"
  },
  "devDependencies": {
  "@eslint/eslintrc": "^3",
  "@tailwindcss/postcss": "^4.1.11",
  "@types/draft-js": "^0.11.18",
- "@types/turndown": "^5.0.5",
  "@types/node": "^20",
  "@types/react": "^19",
  "@types/react-dom": "^19",
+ "@types/turndown": "^5.0.5",
  "eslint": "^9",
  "eslint-config-next": "15.4.2",
  "tailwindcss": "^4.1.11",

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

@@ -70,10 +70,21 @@ export default function LoginScreen() {
  };
  };
 
+ const getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ }
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return "https://apps.apple.com/in/app/eid-for-w3ds/id6747748667"
+ }
+ return "https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet";
+ };
+
  if (isLoading) {
  return (
  <div className="flex h-screen items-center justify-center">
- <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900"></div>
+ <div className="animate-spin rounded-full h-32 w-32 border-b-2 border-gray-900" />
  </div>
  );
  }
@@ -101,15 +112,15 @@ export default function LoginScreen() {
  />
  <h1 className="text-3xl font-bold">Group Charter</h1>
  </div>
- <p class="text-gray-600">
+ <p className="text-gray-600">
  Coordinate your group in the MetaState
  </p>
  </div>
  <div className="bg-white/50 p-8 rounded-lg shadow-lg max-w-md w-full">
  <div className="text-center mb-8">
-
+
  <p className="text-gray-600">
- Scan the QR code to login with your W3DS identity
+ Scan the QR code using your <a href={getAppStoreLink()}><b><u>eID App</u></b></a> to login
  </p>
  </div>
 
@@ -142,7 +153,9 @@ export default function LoginScreen() {
 
  <div className="text-center">
  <p className="text-sm text-gray-500">
- Use your W3DS wallet to scan this QR code and authenticate
+ <span className="mb-1 block font-bold text-gray-600">The {isMobileDevice() ? "button": "code"} is valid for 60 seconds</span>
+ <span className="block font-light text-gray-600">Please refresh the page if it expires</span
+ >
  </p>
  </div>
 
@@ -155,13 +168,15 @@ export default function LoginScreen() {
  servers.
  </div>
 
- <Image
- src="/W3DS.svg"
- alt="W3DS Logo"
- width={50}
- height={20}
- className="mx-auto mt-5"
- />
+ <a href="https://metastate.foundation" target="_blank" rel="noopener noreferrer">
+ <Image
+ src="/W3DS.svg"
+ alt="W3DS Logo"
+ width={50}
+ height={20}
+ className="mx-auto mt-5"
+ />
+ </a>
  </div>
  </div>
  );

platforms/pictique/package.json

@@ -4,7 +4,7 @@
 	"version": "0.0.1",
 	"type": "module",
 	"scripts": {
- "dev": "vite dev",
+ "dev": "vite dev --host",
  "build": "vite build",
  "preview": "vite preview",
  "prepare": "svelte-kit sync || echo ''",

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

@@ -1,13 +1,17 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
-	import { PUBLIC_PICTIQUE_BASE_URL } from '$env/static/public';
+	import {
+ PUBLIC_APP_STORE_EID_WALLET,
+ PUBLIC_PICTIQUE_BASE_URL,
+ PUBLIC_PLAY_STORE_EID_WALLET
+	} from '$env/static/public';
 	import { W3dslogo } from '$lib/icons';
 	import { Qr } from '$lib/ui';
 	import { apiClient, setAuthId, setAuthToken } from '$lib/utils';
+	import { getDeepLinkUrl, isMobileDevice } from '$lib/utils/mobile-detection';
 	import { onMount } from 'svelte';
 	import { onDestroy } from 'svelte';
 	import { qrcode } from 'svelte-qrcode-action';
-	import { isMobileDevice, getDeepLinkUrl } from '$lib/utils/mobile-detection';
 
 	let qrData: string;
 	let isMobile = false;
@@ -16,7 +20,22 @@
  isMobile = window.innerWidth <= 640; // Tailwind's `sm` breakpoint
 	}
 
+	let getAppStoreLink: () => string = () => '';
+
 	onMount(async () => {
+ getAppStoreLink = () => {
+ const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+ if (/android/i.test(userAgent)) {
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ }
+
+ if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+ return 'https://apps.apple.com/in/app/eid-for-w3ds/id6747748667';
+ }
+
+ return 'https://play.google.com/store/apps/details?id=foundation.metastate.eid_wallet';
+ };
+
  checkMobile();
  window.addEventListener('resize', checkMobile);
 
@@ -60,7 +79,7 @@
 	>
  <h2>
  {#if isMobileDevice()}
- Login with your <b><u>eID Wallet</u></b>
+ Login with your <a href={getAppStoreLink()}><b><u>eID Wallet</u></b></a>
  {:else}
  Scan the QR code using your <b><u>eID App</u></b> to login
  {/if}
@@ -108,7 +127,9 @@
  {/if}
 
  <p class="text-center">
- <span class="mb-1 block font-bold text-gray-600">The code is valid for 60 seconds</span>
+ <span class="mb-1 block font-bold text-gray-600"
+ >The {isMobileDevice() ? 'button' : 'code'} is valid for 60 seconds</span
+ >
  <span class="block font-light text-gray-600">Please refresh the page if it expires</span
  >
  </p>
@@ -120,6 +141,7 @@
  centralised servers.
  </p>
 	</div>
-
-	<W3dslogo />
+	<a href="https://metastate.foundation" target="_blank">
+ <W3dslogo />
+	</a>
 </div>

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

@@ -18,6 +18,7 @@
 	let ownerProfile = $derived.by(async () => {
  if (ownerId) {
  const response = await apiClient.get<userProfile>(`/api/users/${ownerId}`);
+ console.log('Owner Profile:', response.data);
  return response.data;
  }
 	});
@@ -27,6 +28,7 @@
  loading = true;
  error = null;
  const response = await apiClient.get<userProfile>(`/api/users/${profileId}`);
+ console.log('Fetched Profile:', response.data);
  profile = response.data;
  } catch (err) {
  error = err instanceof Error ? err.message : 'Failed to load profile';