Refactor confirmation code handling in receive transfer flow

- Removed the previous validation logic for the confirmation code and replaced it with a direct input field for user entry.
- Updated the UI to enhance user experience by allowing manual input of the confirmation code instead of selecting from generated options.
- Simplified the page load function by eliminating unnecessary retrieval of the confirmation code.

This commit improves the usability of the confirmation process during file transfers.

Signed-off-by: Pushkar Mishra <[email protected]>

Author: pushkarm029

core/src/lib.rs

@@ -8,8 +8,7 @@ use std::sync::{mpsc::Sender, Arc};
 // ARK-Core imports
 use dropx_receiver::{
     receive_files, ReceiveFilesBubble, ReceiveFilesConnectingEvent, ReceiveFilesReceivingEvent,
-    ReceiveFilesRequest as ReceiverRequest, ReceiveFilesSubscriber, ReceiverConfig,
-    ReceiverProfile,
+    ReceiveFilesRequest as ReceiverRequest, ReceiveFilesSubscriber, ReceiverProfile,
 };
 use dropx_sender::{
     send_files, SendFilesBubble, SendFilesConnectingEvent, SendFilesRequest, SendFilesSendingEvent,
@@ -241,7 +240,7 @@ impl IrohInstance {
             ticket,
             confirmation,
             profile,
-            config: Some(ReceiverConfig::default()),
+            config: None,
         };
 
         // Create shared collection for tracking received files

src/routes/transfers/receive/confirm/+page.svelte

@@ -1,27 +1,18 @@
 <script>
 	import { goto } from '$app/navigation';
-	import Code from '$lib/components/Code.svelte';
+	import Button from '$lib/components/Button.svelte';
 	import ChevronLeft from '$lib/components/icons/ChevronLeft.svelte';
-	import { invoke } from '@tauri-apps/api/core';
 
 	export let data;
 
-	let isValidHash = invoke('is_valid_ticket', { ticket: data.hash });
+	let confirmationCode = '';
 
-	if (!isValidHash) {
-		goto('/transfers');
-	}
-
-	let codes = [data.confirmationCode];
+	async function handleSubmit() {
+		if (confirmationCode.trim() === '') return;
+		const fullTicket = `${data.hash}:${confirmationCode.trim()}`;
 
-	while (codes.length < 3) {
-		const randomCode = Math.floor(Math.random() * 100);
-		if (!codes.includes(randomCode)) {
-			codes.push(randomCode);
-		}
+		goto('/transfers/transferring?ticket=' + encodeURIComponent(fullTicket));
 	}
-
-	codes = codes.sort(() => Math.random() - 0.5);
 </script>
 
 <header class="my-2 flex flex-row justify-between px-4 py-2">
@@ -38,23 +29,28 @@
 
 <div class="mt-48 flex w-full flex-col items-center gap-1">
 	<span class="text-center text-lg font-medium text-gray-modern-900"
-		>Chose the confirmation Code</span
+		>Enter confirmation code</span
 	>
 	<span class="text-center text-sm text-gray-modern-500"
-		>Make sure code confirmation are matched</span
+		>Enter the confirmation code from the sender</span
 	>
-	<div class="mt-6 flex flex-row gap-6">
-		{#each codes as code}
-			<Code
-				{code}
-				on:click={async () => {
-					if (code === data.confirmationCode) {
-						goto('/transfers/transferring?ticket=' + data.hash);
-					} else {
-						goto('/transfers/failed');
-					}
-				}}
-			/>
-		{/each}
+	<div class="mt-6 flex w-full max-w-sm flex-col gap-4 px-4">
+		<input
+			bind:value={confirmationCode}
+			type="text"
+			placeholder="Confirmation code"
+			class="w-full rounded-lg border border-gray-200 p-3 text-center text-lg shadow-lg"
+			on:keypress={(e) => {
+				if (e.key === 'Enter') {
+					handleSubmit();
+				}
+			}}
+		/>
+		<Button
+			disabled={confirmationCode.trim() === ''}
+			on:click={handleSubmit}
+		>
+			Continue
+		</Button>
 	</div>
 </div>

src/routes/transfers/receive/confirm/+page.ts

@@ -1,6 +1,5 @@
 import { redirect } from '@sveltejs/kit';
 import type { PageLoad } from './$types';
-import { getConfirmationCode } from '$lib/util';
 
 export const load: PageLoad = ({ url }) => {
 	const hash = url.searchParams.get('hash');
@@ -9,10 +8,7 @@ export const load: PageLoad = ({ url }) => {
 		redirect(302, '/');
 	}
 
-	const confirmationCode = getConfirmationCode(hash);
-
 	return {
-		hash,
-		confirmationCode
+		hash
 	};
 };