feat: 확인 완료 버튼 추가

apps/web/src/features/support-portal/lib/support-feedback-status.ts

@@ -0,0 +1,46 @@
+export const SUPPORT_FEEDBACK_STATUS_CODES = [
+  'NEW',
+  'RECEIVED',
+  'IN_PROGRESS',
+  'COMPLETED',
+  'ON_HOLD',
+] as const;
+
+export type SupportFeedbackStatusCode =
+  (typeof SUPPORT_FEEDBACK_STATUS_CODES)[number];
+
+const LEGACY_STATUS_TO_CURRENT: Record<string, SupportFeedbackStatusCode> = {
+  INIT: 'NEW',
+  ON_REVIEW: 'RECEIVED',
+  DETAILED_REVIEW: 'RECEIVED',
+  IN_PROGRESS: 'IN_PROGRESS',
+  RESOLVED: 'COMPLETED',
+  PENDING: 'ON_HOLD',
+};
+
+const STATUS_LABELS: Record<SupportFeedbackStatusCode, string> = {
+  NEW: '신규',
+  RECEIVED: '접수',
+  IN_PROGRESS: '진행중',
+  COMPLETED: '완료',
+  ON_HOLD: '보류',
+};
+
+export const normalizeSupportFeedbackStatus = (
+  value?: string | null,
+): SupportFeedbackStatusCode | null => {
+  if (!value) return null;
+
+  if (
+    (SUPPORT_FEEDBACK_STATUS_CODES as readonly string[]).includes(value)
+  ) {
+    return value as SupportFeedbackStatusCode;
+  }
+
+  return LEGACY_STATUS_TO_CURRENT[value] ?? null;
+};
+
+export const getSupportFeedbackStatusLabel = (value?: string | null) => {
+  const normalized = normalizeSupportFeedbackStatus(value);
+  return normalized ? STATUS_LABELS[normalized] : value || '상태 미상';
+};

apps/web/src/features/support-portal/ui/support-status-badge.ui.tsx

@@ -13,8 +13,16 @@
  * License for the specific language governing permissions and limitations
  * under the License.
  */
+import {
+  getSupportFeedbackStatusLabel,
+  normalizeSupportFeedbackStatus,
+} from '../lib/support-feedback-status';
+
 const statusMap: Record<string, string> = {
+  NEW: 'bg-[#f2d5d5] text-[#8c3030]',
   RECEIVED: 'bg-[#f3ead0] text-[#7d5b16]',
+  COMPLETED: 'bg-[#dcede3] text-[#2f6f52]',
+  ON_HOLD: 'bg-[#f7dfd3] text-[#8b4228]',
   PENDING_APPROVAL: 'bg-[#f7dfd3] text-[#8b4228]',
   APPROVED: 'bg-[#d6e9d8] text-[#1e5d39]',
   IN_PROGRESS: 'bg-[#d9e7f5] text-[#204f79]',
@@ -31,15 +39,27 @@ const statusMap: Record<string, string> = {
 interface Props {
   label: string;
   value: string;
+  normalizeFeedbackStatus?: boolean;
 }
 
-const SupportStatusBadge = ({ label, value }: Props) => {
+const SupportStatusBadge = ({
+  label,
+  value,
+  normalizeFeedbackStatus = false,
+}: Props) => {
+  const normalizedValue = normalizeFeedbackStatus
+    ? normalizeSupportFeedbackStatus(value) ?? value
+    : value;
+  const displayValue = normalizeFeedbackStatus
+    ? getSupportFeedbackStatusLabel(value)
+    : value;
+
   return (
-    <span className={`inline-flex items-center gap-2 rounded-full px-3 py-1 text-xs font-medium ${statusMap[value] ?? 'bg-[#ece8e1] text-[#5f5649]'}`}>
+    <span className={`inline-flex items-center gap-2 rounded-full px-3 py-1 text-xs font-medium ${statusMap[normalizedValue] ?? 'bg-[#ece8e1] text-[#5f5649]'}`}>
       <span className="uppercase tracking-[0.16em] opacity-70">{label}</span>
-      <span>{value}</span>
+      <span>{displayValue}</span>
     </span>
   );
 };
 
-export default SupportStatusBadge;
+export default SupportStatusBadge;