From 99c996b20ed16d6911a9a3b72c06a2c3c0a04148 Mon Sep 17 00:00:00 2001
From: corpi <lj845854@gmail.com>
Date: Fri, 13 Feb 2026 15:52:44 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EB=AA=A8=EB=8B=AC=EC=97=90=EC=84=9C=20?=
 =?UTF-8?q?enter=EB=A5=BC=20=EB=88=8C=EB=A0=80=EC=9D=84=20=EB=95=8C=20?=
 =?UTF-8?q?=EB=8B=A4=EC=9D=8C=ED=99=94=EB=A9=B4=EC=9C=BC=EB=A1=9C=20?=
 =?UTF-8?q?=EB=84=98=EC=96=B4=EA=B0=80=EB=8F=84=EB=A1=9D=20=EC=8B=A4?=
 =?UTF-8?q?=ED=96=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/debrief/page.tsx                      | 27 +++++++++++--------
 .../boarding/ui/BoardingMissionForm.tsx       | 21 +++++++++++----
 2 files changed, 32 insertions(+), 16 deletions(-)

diff --git a/src/app/debrief/page.tsx b/src/app/debrief/page.tsx
index 642d759..b67cbea 100644
--- a/src/app/debrief/page.tsx
+++ b/src/app/debrief/page.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { useEffect, useState } from 'react';
+import { FormEvent, useEffect, useState } from 'react';
 import { useRouter } from 'next/navigation';
 import { getCurrentVoyage, saveToHistory, saveCurrentVoyage } from '@/shared/lib/store';
 import { Voyage, VoyageStatus } from '@/shared/types';
@@ -38,6 +38,11 @@ export default function DebriefPage() {
     router.push('/log');
   };
 
+  const handleSubmit = (event: FormEvent<HTMLFormElement>) => {
+    event.preventDefault();
+    handleSave();
+  };
+
   if (!voyage) return null;
 
   const statusOptions: { value: VoyageStatus; label: string; desc: string }[] = [
@@ -53,7 +58,7 @@ export default function DebriefPage() {
         <p className="text-slate-400">이번 항해를 짧게 기록하고 마무리하세요.</p>
       </header>
 
-      <div className="space-y-8 flex-1">
+      <form onSubmit={handleSubmit} className="space-y-8 flex-1">
         {/* Question 1: Status */}
         <section>
           <label className="block text-sm font-medium text-slate-300 mb-3">
@@ -63,6 +68,7 @@ export default function DebriefPage() {
             {statusOptions.map((opt) => (
               <button
                 key={opt.value}
+                type="button"
                 onClick={() => setStatus(opt.value)}
                 className={`p-4 rounded-xl border text-left transition-all ${
                   status === opt.value
@@ -104,15 +110,14 @@ export default function DebriefPage() {
             className="w-full bg-slate-900/30 border border-slate-800 rounded-lg px-4 py-3 text-slate-200 focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500 outline-none transition-all"
           />
         </section>
-      </div>
-
-      <button
-        onClick={handleSave}
-        disabled={!status}
-        className="w-full mt-10 py-4 bg-indigo-600 hover:bg-indigo-500 disabled:bg-slate-800 disabled:text-slate-500 text-white font-bold rounded-xl transition-all shadow-lg shadow-indigo-900/20"
-      >
-        항해일지 저장
-      </button>
+        <button
+          type="submit"
+          disabled={!status}
+          className="w-full mt-10 py-4 bg-indigo-600 hover:bg-indigo-500 disabled:bg-slate-800 disabled:text-slate-500 text-white font-bold rounded-xl transition-all shadow-lg shadow-indigo-900/20"
+        >
+          항해일지 저장
+        </button>
+      </form>
     </div>
   );
 }
diff --git a/src/features/boarding/ui/BoardingMissionForm.tsx b/src/features/boarding/ui/BoardingMissionForm.tsx
index 8ce2db3..ded32a1 100644
--- a/src/features/boarding/ui/BoardingMissionForm.tsx
+++ b/src/features/boarding/ui/BoardingMissionForm.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { useState } from 'react';
+import { FormEvent, useState } from 'react';
 
 export function BoardingMissionForm({
   onDock,
@@ -15,9 +15,19 @@ export function BoardingMissionForm({
 }) {
   const [mission, setMission] = useState('');
   const trimmedMission = mission.trim();
+  const canSubmit = Boolean(trimmedMission);
+
+  const handleSubmit = (event: FormEvent<HTMLFormElement>) => {
+    event.preventDefault();
+    if (!canSubmit) return;
+    onDock(trimmedMission);
+  };
 
   return (
-    <div className={`flex flex-col ${compact ? 'gap-6' : 'space-y-8 flex-1'}`}>
+    <form
+      onSubmit={handleSubmit}
+      className={`flex flex-col ${compact ? 'gap-6' : 'space-y-8 flex-1'}`}
+    >
       <div className="space-y-3">
         <label className="block text-sm font-medium text-slate-300">
           이번 항해의 핵심 목표
@@ -35,6 +45,7 @@ export function BoardingMissionForm({
       <div className={`flex ${compact ? 'justify-end gap-3' : 'mt-8 flex-col gap-3'} w-full`}>
         {onCancel && (
           <button
+            type="button"
             onClick={onCancel}
             className="rounded-xl border border-slate-700 bg-transparent px-4 py-2 font-semibold text-slate-300 transition-colors hover:bg-slate-900/60 hover:text-white"
           >
@@ -42,13 +53,13 @@ export function BoardingMissionForm({
           </button>
         )}
         <button
-          onClick={() => onDock(trimmedMission)}
-          disabled={!trimmedMission}
+          type="submit"
+          disabled={!canSubmit}
           className={`rounded-xl bg-indigo-600 font-bold text-white transition-all shadow-lg shadow-indigo-900/30 hover:bg-indigo-500 disabled:bg-slate-800 disabled:text-slate-500 ${compact ? 'px-6 py-2' : 'w-full py-4 text-lg'}`}
         >
           도킹 완료 (출항)
         </button>
       </div>
-    </div>
+    </form>
   );
 }