Merge pull request #18 from data-sy/feat/improve-input-ux

# feat: improve timer creation ux

Author: data-sy

QuickLabelTimer/QuickLabelTimer/Configuration/AppConfig.swift

@@ -0,0 +1,16 @@
+//
+//  AppConfig.swift
+//  QuickLabelTimer
+//
+//  Created by 이소연 on 8/31/25.
+//
+/// 앱의 기능적 설정 및 정책을 관리하는 중앙 저장소
+///
+/// - 사용 목적: 앱의 동작과 관련된 상수들을 한 곳에서 관리
+
+import Foundation
+
+enum AppConfig {
+    static let maxLabelLength = 100
+    // TODO: 설정값들 여기로 모으기 (예: static let maxRunningTimers = 10)
+}

…ickLabelTimer/Views/Style/AppTheme.swift …kLabelTimer/Configuration/AppTheme.swiftQuickLabelTimer/QuickLabelTimer/Views/Style/AppTheme.swift renamed to QuickLabelTimer/QuickLabelTimer/Configuration/AppTheme.swift QuickLabelTimer/QuickLabelTimer/Views/Style/AppTheme.swift renamed to QuickLabelTimer/QuickLabelTimer/Configuration/AppTheme.swift

@@ -0,0 +1,27 @@
+//
+//  LabelSanitizer.swift
+//  QuickLabelTimer
+//
+//  Created by 이소연 on 9/1/25.
+//
+/// 라벨 문자열을 정리(sanitize)하는 유틸리티
+///
+/// - 사용 목적: 사용자가 입력한 라벨 문자열을 최종 저장/실행 시점에 깨끗하게 정리
+
+enum LabelSanitizer {
+
+    static func sanitizeOnSubmit(_ input: String, maxLength: Int) -> String {
+        var result = input
+            // 줄바꿈을 공백으로 (복붙 대비)
+            .replacingOccurrences(of: #"\s*\n+\s*"#, with: " ", options: .regularExpression)
+            // 연속 공백을 하나로
+            .replacingOccurrences(of: #"\s{2,}"#, with: " ", options: .regularExpression)
+            // 앞뒤 공백 제거
+            .trimmingCharacters(in: .whitespacesAndNewlines)
+        // 최대 길이 넘지 못하게
+        if result.count > maxLength {
+            result = String(result.prefix(maxLength))
+        }
+        return result
+    }
+}

QuickLabelTimer/QuickLabelTimer/Utils/LabelSanitizer.swift

@@ -14,9 +14,11 @@ import SwiftUI
 class AddTimerViewModel: ObservableObject {
     private let timerService: TimerServiceProtocol
 
+    let maxLabelLength = AppConfig.maxLabelLength
+    
     @Published var label = ""
     @Published var hours = 0
-    @Published var minutes = 5
+    @Published var minutes = 0
     @Published var seconds = 0
     @Published var selectedMode: AlarmMode
     @Published var activeAlert: AppAlert?
@@ -37,8 +39,10 @@ class AddTimerViewModel: ObservableObject {
     func startTimer() {
         let attributes = AlarmNotificationPolicy.getBools(from: selectedMode)
 
+        let sanitizedLabelForSubmit = LabelSanitizer.sanitizeOnSubmit(label, maxLength: AppConfig.maxLabelLength)
+
         let success = timerService.addTimer(
-            label: label,
+            label: sanitizedLabelForSubmit,
             hours: hours,
             minutes: minutes,
             seconds: seconds,
@@ -57,8 +61,5 @@ class AddTimerViewModel: ObservableObject {
 
     func resetInputFields() {
         label = ""
-        hours = 0
-        minutes = 5
-        seconds = 0
     }
 }

QuickLabelTimer/QuickLabelTimer/ViewModels/AddTimerViewModel.swift

@@ -15,6 +15,8 @@ class EditPresetViewModel: ObservableObject {
     private let preset: TimerPreset
     private let presetRepository: PresetRepositoryProtocol
     private let timerService: TimerServiceProtocol
+
+    let maxLabelLength = AppConfig.maxLabelLength
 
     @Published var label: String
     @Published var hours: Int
@@ -23,7 +25,6 @@ class EditPresetViewModel: ObservableObject {
     @Published var selectedMode: AlarmMode
     @Published var activeAlert: AppAlert?
     @Published var isDeleted = false
-//    @Published var isShowingHideAlert = false
 
     // 재생, 저장 유효성
     var totalSeconds: Int { hours * 3600 + minutes * 60 + seconds }
@@ -32,6 +33,10 @@ class EditPresetViewModel: ObservableObject {
     var isDurationValid: Bool { totalSeconds > 0 }
     var canStart: Bool { isLabelValid && isDurationValid }
     var canSave:  Bool { isLabelValid && isDurationValid }
+    // 실제 저장되는 라벨
+    private var sanitizedLabelForSubmit: String {
+        LabelSanitizer.sanitizeOnSubmit(label, maxLength: maxLabelLength)
+    }
 
     init(preset: TimerPreset, presetRepository: PresetRepositoryProtocol, timerService: TimerServiceProtocol) {
         self.preset = preset
@@ -56,7 +61,7 @@ class EditPresetViewModel: ObservableObject {
         let attributes = AlarmNotificationPolicy.getBools(from: selectedMode)
         presetRepository.updatePreset(
             preset,
-            label: label,
+            label: sanitizedLabelForSubmit,
             hours: hours,
             minutes: minutes,
             seconds: seconds,

QuickLabelTimer/QuickLabelTimer/ViewModels/EditPresetViewModel.swift

@@ -34,10 +34,6 @@ struct AddTimerView: View {
                 onStart: {
                     if isLabelFocused { isLabelFocused = false }
                     viewModel.startTimer()
-//                    // TODO: 기존 코드에서 DispatchQueue를 없앤 상태. 만약 문제가 발생한다면 다시 투입할 예정
-//                    DispatchQueue.main.async {
-//                        viewModel.startTimer()
-//                    }
                 }
             )
             .appAlert(item: $viewModel.activeAlert)

QuickLabelTimer/QuickLabelTimer/Views/AddTimerView.swift

@@ -11,29 +11,102 @@
 import SwiftUI
 
 struct LabelInputField: View {
+    let warningThreshold: Int = 80
+    
     @Binding var label: String
     @FocusState.Binding var isFocused: Bool
+    @State private var showLimitToast = false
+    @State private var prevCount = 0
 
     var body: some View {
-        HStack {
-            Text("레이블")
-                .font(.body)
-                .foregroundColor(.primary)
-
-            Divider()
-                .frame(height: 20)
-                .overlay(Color.gray.opacity(0.4))
-            
-            TextField("레이블을 입력하세요", text: $label)
-                .focused($isFocused)
-                .frame(maxWidth: .infinity)
+        ZStack(alignment: .bottom) {
+            HStack {
+                Text("라벨")
+                    .font(.body)
+                    .foregroundColor(.primary)
+                
+                Divider()
+                    .frame(height: 20)
+                    .overlay(Color.gray.opacity(0.4))
+                
+                TextField("라벨 입력 (비워두면 자동 생성)", text: $label)
+                    .focused($isFocused)
+                    .textInputAutocapitalization(.none)
+                    .frame(maxWidth: .infinity)
+                Spacer()
+                
+                // 카운터: 80 이상일 때부터 표시
+                if label.count >= warningThreshold {
+                    Text("\(label.count) / \(AppConfig.maxLabelLength)")
+                        .font(.caption)
+                        .foregroundColor(colorForCount(label.count))
+                        .transition(.opacity.combined(with: .move(edge: .trailing)))
+                        .animation(.easeInOut(duration: 0.2), value: label.count)
+                        .layoutPriority(1)
+                }
+            }
+            .padding(.vertical, 16)
 
+            // 토스트
+            if showLimitToast {
+                ToastView(text: "최대 \(AppConfig.maxLabelLength)자까지 입력할 수 있어요")
+                    .transition(.move(edge: .bottom).combined(with: .opacity))
+                    .padding(.bottom, 8)
+            }
         }
+        .accessibilityElement(children: .combine)
+        .accessibilityLabel("타이머 라벨")
+        .accessibilityValue(label.isEmpty ? "입력되지 않음" : label)
+        .accessibilityHint("타이머의 라벨을 입력해 주세요. 비워두면 자동으로 라벨이 생성됩니다.")
         .padding(.vertical, 16)
         .contentShape(Rectangle())
         .onTapGesture {
             isFocused = true
         }
+        .onChange(of: label) { newValue in
+            let count = newValue.count
+            if count > AppConfig.maxLabelLength {
+                
+                label = String(newValue.prefix(AppConfig.maxLabelLength))
+
+                // 초과 진입 시점에만 토스트 + 가벼운 햅틱
+                if prevCount <= AppConfig.maxLabelLength {
+                    showLimitToastBriefly()
+                    lightHaptic()
+                }
+            }
+            prevCount = label.count
+        }
+    }
+    
+    private func colorForCount(_ count: Int) -> Color {
+        if count >= AppConfig.maxLabelLength { return .red }
+        if count >= warningThreshold { return .orange }
+        return .secondary
+    }
+
+    private func showLimitToastBriefly() {
+        withAnimation { showLimitToast = true }
+        DispatchQueue.main.asyncAfter(deadline: .now() + 1.4) {
+            withAnimation { showLimitToast = false }
+        }
+    }
+
+    private func lightHaptic() {
+        #if os(iOS)
+        UIImpactFeedbackGenerator(style: .light).impactOccurred()
+        #endif
     }
 }
 
+// 심플 토스트 뷰
+struct ToastView: View {
+    let text: String
+    var body: some View {
+        Text(text)
+            .font(.footnote)
+            .padding(.horizontal, 12)
+            .padding(.vertical, 8)
+            .background(.ultraThinMaterial, in: Capsule())
+    }
+}

QuickLabelTimer/QuickLabelTimer/Views/Components/Input/LabelInputField.swift

@@ -32,7 +32,10 @@ struct TimerInputForm: View {
                     .fixedSize()
                 TimeChipButton(label: "+5분", action: addFiveMinutes)
             }
-            LabelInputField(label: $label, isFocused: $isLabelFocused)
+            LabelInputField(
+                label: $label,
+                isFocused: $isLabelFocused
+            )
             Divider()
             HStack(spacing: 24) {
                 TimePickerGroup(

QuickLabelTimer/QuickLabelTimer/Views/Components/Input/TimerInputForm.swift

@@ -72,6 +72,7 @@ struct MainTabView: View {
                 .tag(Tab.favorites)
         }
         .tabViewStyle(.page(indexDisplayMode: .automatic))
+        .ignoresSafeArea(.keyboard, edges: .bottom)
         .animation(.easeInOut, value: selectedTab)
         .background(AppTheme.pageBackground)
         .onReceive(timerDidStart.receive(on: RunLoop.main)) { _ in

QuickLabelTimer/QuickLabelTimer/Views/MainTabView.swift

@@ -32,6 +32,7 @@ struct TimerView: View {
                     Spacer()
                 }
                 .padding(.horizontal)
+                .ignoresSafeArea(.keyboard, edges: .bottom)
                 .navigationTitle("타이머 실행")
                 .navigationBarTitleDisplayMode(.inline)
                 .toolbar {