[#311] TodoListView에서 제목만 있을 경우 UI를 개선한다 (#315)

* feat: row에 상시 최근 업데이트 시간을 뜨도록 추가

* ui: 완료 여부 ui를 상시 보여주도록 수정

* ui: 중요 표시 UI 이동

Author: opficdev

DevLog/UI/Common/Component/RelativeTimeText.swift

@@ -0,0 +1,39 @@
+//
+//  RelativeTimeText.swift
+//  DevLog
+//
+//  Created by opfic on 3/25/26.
+//
+
+import SwiftUI
+
+struct RelativeTimeText: View {
+    let date: Date
+    var bodyFont: Font = .caption2
+    var bodyColor: Color = .gray
+
+    var body: some View {
+        TimelineView(.periodic(from: .now, by: 1.0)) { context in
+            Text(relativeTimeText(from: date, now: context.date) + " 업데이트")
+                .font(bodyFont)
+                .foregroundStyle(bodyColor)
+        }
+    }
+
+    private func relativeTimeText(from date: Date, now: Date) -> String {
+        let seconds = Int(now.timeIntervalSince(date))
+
+        if seconds < 60 {
+            return "\(max(0, seconds))초 전"
+        } else if seconds < 3600 {
+            let minutes = seconds / 60
+            return "\(minutes)분 전"
+        } else if seconds < 86400 {
+            let hours = seconds / 3600
+            return "\(hours)시간 전"
+        } else {
+            let days = seconds / 86400
+            return "\(days)일 전"
+        }
+    }
+}

DevLog/UI/Common/Component/TodoItemRow.swift

@@ -8,6 +8,7 @@
 import SwiftUI
 
 struct TodoItemRow: View {
+    @Environment(\.sceneWidth) private var sceneWidth
     private let item: TodoListItem
 
     init(_ item: TodoListItem) {
@@ -16,18 +17,12 @@ struct TodoItemRow: View {
 
     var body: some View {
         HStack {
-            VStack(alignment: .leading, spacing: 5) {
+            Image(systemName: "checkmark.circle")
+                .resizable()
+                .frame(width: sceneWidth * 0.08, height: sceneWidth * 0.08)
+                .foregroundStyle(item.isCompleted ? .green : .secondary)
+            VStack(alignment: .leading, spacing: 0) {
                 HStack {
-                    if item.isPinned {
-                        Image(systemName: "star.fill")
-                            .font(.headline)
-                            .foregroundStyle(.orange)
-                    }
-                    if item.isCompleted {
-                        Image(systemName: "checkmark.circle.fill")
-                            .font(.headline)
-                            .foregroundStyle(.green)
-                    }
                     Text(item.title)
                         .font(.headline)
                         .foregroundStyle(Color(.label))
@@ -39,6 +34,15 @@ struct TodoItemRow: View {
                             .fixedSize(horizontal: true, vertical: false)
                     }
                 }
+                HStack(spacing: 4) {
+                    if item.isPinned {
+                        Image(systemName: "star.fill")
+                            .font(.headline)
+                            .foregroundStyle(.orange)
+                    }
+                    RelativeTimeText(date: item.updatedAt)
+                }
+                .frame(height: UIFont.preferredFont(forTextStyle: .headline).lineHeight)
                 if !item.tags.isEmpty {
                     TagList(item.tags, lineLimit: 1)
                 }
@@ -48,6 +52,6 @@ struct TodoItemRow: View {
                 .font(.caption2.bold())
                 .foregroundStyle(.gray)
         }
-        .padding(.vertical, item.tags.isEmpty ? 20 : 4)
+        .padding(.vertical, 12)
     }
 }

DevLog/UI/Home/HomeView.swift

@@ -408,11 +408,7 @@ private struct RecentTodoRow: View {
                         .font(.caption.weight(.semibold))
                         .foregroundStyle(todo.kind.color)
 
-                    TimelineView(.periodic(from: .now, by: 1.0)) { context in
-                        Text(timeAgoText(from: todo.updatedAt, now: context.date))
-                            .font(.caption2)
-                            .foregroundStyle(Color.gray)
-                    }
+                    RelativeTimeText(date: todo.updatedAt)
                 }
 
                 if !todo.tags.isEmpty {
@@ -421,21 +417,4 @@ private struct RecentTodoRow: View {
             }
         }
     }
-
-    private func timeAgoText(from date: Date, now: Date) -> String {
-        let seconds = Int(now.timeIntervalSince(date))
-
-        if seconds < 60 {
-            return "\(max(0, seconds))초 전"
-        } else if seconds < 3600 {
-            let minutes = seconds / 60
-            return "\(minutes)분 전"
-        } else if seconds < 86400 {
-            let hours = seconds / 3600
-            return "\(hours)시간 전"
-        } else {
-            let days = seconds / 86400
-            return "\(days)일 전"
-        }
-    }
 }