fix: synchronous reorder for keywords and sites (v0.3.0)

app/build.gradle.kts

@@ -24,8 +24,8 @@ android {
  applicationId = "com.hotdeal.alarm"
  minSdk = 31
  targetSdk = 35
-        versionCode = 29
+        versionCode = 30
-        versionName = "0.2.9"
+        versionName = "0.3.0"
 
  testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"
  vectorDrawables {

app/src/main/java/com/hotdeal/alarm/presentation/components/DragDropListState.kt

@@ -1,11 +1,6 @@
 package com.hotdeal.alarm.presentation.components
 
-import androidx.compose.animation.core.Animatable
-import androidx.compose.animation.core.Spring
-import androidx.compose.animation.core.spring
 import androidx.compose.foundation.gestures.detectDragGesturesAfterLongPress
-import androidx.compose.foundation.gestures.scrollBy
-import androidx.compose.foundation.lazy.LazyListItemInfo
 import androidx.compose.foundation.lazy.LazyListState
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
@@ -13,126 +8,110 @@ import androidx.compose.ui.geometry.Offset
 import androidx.compose.ui.graphics.graphicsLayer
 import androidx.compose.ui.input.pointer.pointerInput
 import androidx.compose.ui.zIndex
-import kotlinx.coroutines.CoroutineScope
-import kotlinx.coroutines.launch
 
 /**
- * Compose LazyColumn Drag & Drop Reordering State
+ * Key 기반 드래그 앤 드롭 Reorder 시스템
+ *
+ * - 각 아이템에 item-level long-press 제스처를 적용하여 드래그 시작
+ * - 드래그 중 다른 아이템의 중심점과 겹치면 swap 실행
+ * - swap 시 delta 보정으로 시각적 점프 방지
+ * - 비드래그 아이템은 animateItemPlacement()로 부드러운 슬라이드
  */
 @Composable
-fun rememberDragDropListState(
+fun rememberReorderState(
-    lazyListState: LazyListState,
+    listState: LazyListState,
-    onMove: (Int, Int) -> Unit,
+    onSwap: (fromListIndex: Int, toListIndex: Int) -> Boolean
-    onDragEnd: () -> Unit = {}
+): ReorderState {
-): DragDropListState {
+    return remember(listState) {
-    val scope = rememberCoroutineScope()
+        ReorderState(listState, onSwap)
-    val state = remember(lazyListState) {
-        DragDropListState(
-            lazyListState = lazyListState,
-            onMove = onMove,
-            onDragEnd = onDragEnd,
-            scope = scope
-        )
     }
-    return state
 }
 
-class DragDropListState(
+@Stable
-    val lazyListState: LazyListState,
+class ReorderState(
-    private val onMove: (Int, Int) -> Unit,
+    val listState: LazyListState,
-    private val onDragEnd: () -> Unit,
+    private val onSwap: (Int, Int) -> Boolean
-    private val scope: CoroutineScope
 ) {
-    var initiallyDraggedElement by mutableStateOf<LazyListItemInfo?>(null)
+    /** 현재 드래그 중인 아이템의 key (null이면 드래그 없음) */
+    var draggedKey by mutableStateOf<Any?>(null)
         private set
 
-    var currentIndexOfDraggedItem by mutableStateOf<Int?>(null)
+    /** 누적 드래그 Y축 오프셋 */
+    var dragDelta by mutableFloatStateOf(0f)
         private set
 
-    private val dragOffset = Animatable(0f)
+    fun startDrag(key: Any) {
-
+        draggedKey = key
-    val elementOffset: Float
+        dragDelta = 0f
-        get() = dragOffset.value
-
-    fun onDragStart(offset: Offset) {
-        lazyListState.layoutInfo.visibleItemsInfo
-            .firstOrNull { item -> offset.y.toInt() in item.offset..(item.offset + item.size) }
-            ?.also { item ->
-                currentIndexOfDraggedItem = item.index
-                initiallyDraggedElement = item
-            }
     }
 
-    fun onDragInterrupted() {
+    fun updateDrag(delta: Offset) {
-        initiallyDraggedElement = null
+        if (draggedKey == null) return
-        currentIndexOfDraggedItem = null
+        dragDelta += delta.y
-        scope.launch {
+        checkOverlap()
-            dragOffset.snapTo(0f)
-        }
     }
 
-    fun onDrag(change: Offset) {
+    fun endDrag() {
-        scope.launch {
+        draggedKey = null
-            dragOffset.snapTo(dragOffset.value + change.y)
+        dragDelta = 0f
+    }
 
-            val currentElement = initiallyDraggedElement ?: return@launch
+    private fun checkOverlap() {
-            val startOffset = currentElement.offset + dragOffset.value
+        val dragged = listState.layoutInfo.visibleItemsInfo
-            val endOffset = startOffset + currentElement.size
+            .firstOrNull { it.key == draggedKey } ?: return
 
-            val hoveredItem = lazyListState.layoutInfo.visibleItemsInfo
+        val draggedMid = dragged.offset + dragged.size / 2f + dragDelta
+
+        val target = listState.layoutInfo.visibleItemsInfo
             .firstOrNull { item ->
-                    val itemMid = item.offset + item.size / 2
+                item.key != draggedKey &&
-                    val isMidInRange = itemMid in startOffset.toInt()..endOffset.toInt()
+                draggedMid >= item.offset.toFloat() &&
-                    isMidInRange && item.index != currentIndexOfDraggedItem
+                draggedMid < (item.offset + item.size).toFloat()
-                }
+            } ?: return
 
-            if (hoveredItem != null) {
+        if (dragged.index == target.index) return
-                val currentIndex = currentIndexOfDraggedItem ?: return@launch
+
-                val targetIndex = hoveredItem.index
+        val swapped = onSwap(dragged.index, target.index)
-                onMove(currentIndex, targetIndex)
+        if (swapped) {
-                currentIndexOfDraggedItem = targetIndex
+            // swap 후 아이템이 새 위치로 이동하므로, 시각적 점프를 막기 위해 delta 보정
+            dragDelta += if (dragged.index < target.index) {
+                -target.size.toFloat()
+            } else {
+                target.size.toFloat()
+            }
         }
     }
 }
 
-    fun onDragStop() {
+/**
-        onDragEnd()
+ * 개별 아이템에 부착하는 드래그 핸들 + 시각 효과 Modifier
-        scope.launch {
+ * - 길게 누르면 드래그 시작
-            dragOffset.animateTo(0f, spring(stiffness = Spring.StiffnessMediumLow))
+ * - 드래그 중 아이템이 떠오르며 그림자 및 스케일업
-            initiallyDraggedElement = null
+ */
-            currentIndexOfDraggedItem = null
+fun Modifier.reorderableItem(
-        }
+    state: ReorderState,
-    }
+    key: Any
-}
+): Modifier {
-
+    val isDragged = state.draggedKey == key
-fun Modifier.dragDropGesture(
+    return this
-    dragDropState: DragDropListState
+        .zIndex(if (isDragged) 10f else 0f)
-): Modifier = this.pointerInput(dragDropState) {
-    detectDragGesturesAfterLongPress(
-        onDragStart = { offset -> dragDropState.onDragStart(offset) },
-        onDragEnd = { dragDropState.onDragStop() },
-        onDragCancel = { dragDropState.onDragInterrupted() },
-        onDrag = { change, dragAmount ->
-            change.consume()
-            dragDropState.onDrag(dragAmount)
-        }
-    )
-}
-
-fun Modifier.dragDropItem(
-    index: Int,
-    dragDropState: DragDropListState
-): Modifier = this.then(
-    if (index == dragDropState.currentIndexOfDraggedItem) {
-        Modifier
-            .zIndex(10f)
         .graphicsLayer {
-                translationY = dragDropState.elementOffset
+            if (isDragged) {
+                translationY = state.dragDelta
                 scaleX = 1.03f
                 scaleY = 1.03f
-                shadowElevation = 8f
+                shadowElevation = 16f
             }
-    } else {
-        Modifier
         }
+        .pointerInput(key) {
+            detectDragGesturesAfterLongPress(
+                onDragStart = { state.startDrag(key) },
+                onDrag = { change, dragAmount ->
+                    change.consume()
+                    state.updateDrag(dragAmount)
+                },
+                onDragEnd = { state.endDrag() },
+                onDragCancel = { state.endDrag() }
             )
+        }
+}

app/src/main/java/com/hotdeal/alarm/presentation/main/MainViewModel.kt

@@ -109,11 +109,13 @@ class MainViewModel @Inject constructor(
     }
 
     fun reorderSites(fromIndex: Int, toIndex: Int) {
-        viewModelScope.launch {
+        // siteOrder는 appSettings.siteOrder에서 stateIn으로 가져오므로
+        // appSettings를 즉시 저장하고 Flow가 업데이트되도록 함
         val current = siteOrder.value.toMutableList()
         if (fromIndex in current.indices && toIndex in current.indices) {
             val item = current.removeAt(fromIndex)
             current.add(toIndex, item)
+            viewModelScope.launch {
                 appSettings.setSiteOrder(current)
             }
         }
@@ -128,7 +130,6 @@ class MainViewModel @Inject constructor(
                     isEnabled = true
                 )
             )
-            // 키워드 순서 맨 앞에 추가
             val currentOrder = appSettings.keywordOrder.first().toMutableList()
             currentOrder.add(0, newId)
             appSettings.setKeywordOrder(currentOrder)
@@ -151,12 +152,16 @@ class MainViewModel @Inject constructor(
     }
 
     fun reorderKeywords(fromIndex: Int, toIndex: Int) {
-        val state = uiState.value as? MainUiState.Success ?: return
+        // uiState를 동기적으로 즉시 업데이트하여 빠른 드래그 시 stale 데이터 방지
-        viewModelScope.launch {
+        val state = _uiState.value as? MainUiState.Success ?: return
         val current = state.keywords.toMutableList()
         if (fromIndex in current.indices && toIndex in current.indices) {
             val item = current.removeAt(fromIndex)
             current.add(toIndex, item)
+            // UI 즉시 갱신
+            _uiState.value = state.copy(keywords = current)
+            // DataStore 비동기 영속화
+            viewModelScope.launch {
                 appSettings.setKeywordOrder(current.map { it.id })
             }
         }

version.json

@@ -1,7 +1,7 @@
 {
-  "version": "0.2.9",
+  "version": "0.3.0",
-  "versionCode": 29,
+  "versionCode": 30,
-  "updateUrl": "https://git.webpluss.net/sanjeok77/hotdeal_alarm/releases/download/v0.2.9/app-release.apk",
+  "updateUrl": "https://git.webpluss.net/sanjeok77/hotdeal_alarm/releases/download/v0.3.0/app-release.apk",
   "changelog": [
     "사이트 및 키워드 순서 조절을 터치 드래그 앤 드롭(Drag & Drop) 방식으로 전면 업그레이드",
     "앱 내 업데이트 시 다운로드 완료 후 설치 화면으로 안 넘어가는 버그 수정",