리다이렉트 경로 처리, 파일 정보 변환, 상태 표시 UI 등 중복된 코드를 통합하고 모듈 간 순환 의존성 및 계층 위반 해소

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/lib/features/transfer/components/TransferProgress.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+  import { formatNetworkSpeed } from "#lib/utils/index.ts";
+
+  interface Props {
+    progress?: number;
+    rate?: number; // Bytes per second
+  }
+
+  let { progress, rate }: Props = $props();
+</script>
+
+전송됨 {Math.floor((progress ?? 0) * 100)}% · {formatNetworkSpeed((rate ?? 0) * 8)}

src/lib/features/transfer/components/UploadStatusText.svelte

@@ -0,0 +1,26 @@
+<script lang="ts">
+  import type { FileUploadState } from "#lib/client/transfer/index.ts";
+  import TransferProgress from "./TransferProgress.svelte";
+
+  interface Props {
+    state: FileUploadState;
+  }
+
+  let { state }: Props = $props();
+
+  const statusTexts = {
+    queued: "대기 중",
+    "encryption-pending": "준비 중",
+    encrypting: "암호화하는 중",
+    "upload-pending": "업로드를 기다리는 중",
+    uploaded: "업로드 완료",
+    canceled: "",
+    error: "업로드 실패",
+  } satisfies Record<Exclude<FileUploadState["status"], "uploading">, string>;
+</script>
+
+{#if state.status === "uploading"}
+  <TransferProgress progress={state.progress} rate={state.rate} />
+{:else}
+  {statusTexts[state.status]}
+{/if}

src/lib/features/transfer/components/index.ts

@@ -0,0 +1,2 @@
+export { default as TransferProgress } from "./TransferProgress.svelte";
+export { default as UploadStatusText } from "./UploadStatusText.svelte";