1
1
package com.threegap.bitnagil.presentation.home.component.template
2
2
3
+ import androidx.compose.animation.AnimatedVisibility
4
+ import androidx.compose.animation.core.EaseInOutBack
5
+ import androidx.compose.animation.core.EaseOut
6
+ import androidx.compose.animation.core.EaseOutBounce
7
+ import androidx.compose.animation.core.EaseOutQuart
8
+ import androidx.compose.animation.core.keyframes
9
+ import androidx.compose.animation.core.tween
10
+ import androidx.compose.animation.fadeIn
11
+ import androidx.compose.animation.fadeOut
12
+ import androidx.compose.animation.scaleIn
13
+ import androidx.compose.animation.scaleOut
3
14
import androidx.compose.foundation.background
4
15
import androidx.compose.foundation.layout.Arrangement
5
16
import androidx.compose.foundation.layout.Box
@@ -12,6 +23,7 @@ import androidx.compose.foundation.layout.size
12
23
import androidx.compose.foundation.shape.RoundedCornerShape
13
24
import androidx.compose.material3.Text
14
25
import androidx.compose.runtime.Composable
26
+ import androidx.compose.runtime.derivedStateOf
15
27
import androidx.compose.runtime.getValue
16
28
import androidx.compose.runtime.mutableStateOf
17
29
import androidx.compose.runtime.remember
@@ -23,8 +35,10 @@ import androidx.compose.ui.tooling.preview.Preview
23
35
import androidx.compose.ui.unit.dp
24
36
import com.threegap.bitnagil.designsystem.BitnagilTheme
25
37
import com.threegap.bitnagil.designsystem.R
38
+ import com.threegap.bitnagil.designsystem.component.atom.BitnagilIcon
26
39
import com.threegap.bitnagil.designsystem.component.atom.BitnagilIconButton
27
40
import com.threegap.bitnagil.designsystem.modifier.clickableWithoutRipple
41
+ import com.threegap.bitnagil.presentation.home.model.RoutinesUiModel
28
42
import com.threegap.bitnagil.presentation.home.util.formatDayOfMonth
29
43
import com.threegap.bitnagil.presentation.home.util.formatDayOfWeekShort
30
44
import com.threegap.bitnagil.presentation.home.util.formatMonthYear
@@ -35,11 +49,21 @@ import java.time.LocalDate
35
49
fun WeeklyDatePicker (
36
50
selectedDate : LocalDate ,
37
51
weeklyDates : List <LocalDate >,
52
+ routines : RoutinesUiModel ,
38
53
onDateSelect : (LocalDate ) -> Unit ,
39
54
onPreviousWeekClick : () -> Unit ,
40
55
onNextWeekClick : () -> Unit ,
41
56
modifier : Modifier = Modifier ,
42
57
) {
58
+ val today = remember { LocalDate .now() }
59
+ val completionStates by remember(routines) {
60
+ derivedStateOf {
61
+ weeklyDates.associateWith { date ->
62
+ routines.routines[date.toString()]?.allCompleted ? : false
63
+ }
64
+ }
65
+ }
66
+
43
67
Column (
44
68
modifier = modifier,
45
69
) {
@@ -91,7 +115,8 @@ fun WeeklyDatePicker(
91
115
DateItem (
92
116
date = date,
93
117
isSelected = selectedDate == date,
94
- isToday = date == LocalDate .now(),
118
+ isToday = date == today,
119
+ isCompleted = completionStates[date] ? : false ,
95
120
onDateClick = { onDateSelect(date) },
96
121
)
97
122
}
@@ -104,6 +129,7 @@ private fun DateItem(
104
129
date : LocalDate ,
105
130
isSelected : Boolean ,
106
131
isToday : Boolean ,
132
+ isCompleted : Boolean ,
107
133
onDateClick : () -> Unit ,
108
134
modifier : Modifier = Modifier ,
109
135
) {
@@ -133,6 +159,36 @@ private fun DateItem(
133
159
color = if (! isSelected) BitnagilTheme .colors.coolGray70 else BitnagilTheme .colors.white,
134
160
)
135
161
}
162
+
163
+ Column (
164
+ modifier = Modifier .size(12 .dp),
165
+ ) {
166
+ AnimatedVisibility (
167
+ visible = isCompleted,
168
+ enter = scaleIn(
169
+ initialScale = 0f ,
170
+ animationSpec = keyframes {
171
+ durationMillis = 600
172
+ 0f at 0 using EaseOutQuart
173
+ 1.3f at 300 using EaseInOutBack
174
+ 1f at 600 using EaseOutBounce
175
+ },
176
+ ) + fadeIn(
177
+ animationSpec = tween(300 , easing = EaseOut ),
178
+ ),
179
+ exit = scaleOut(
180
+ targetScale = 0.8f ,
181
+ animationSpec = tween(200 ),
182
+ ) + fadeOut(
183
+ animationSpec = tween(200 ),
184
+ ),
185
+ ) {
186
+ BitnagilIcon (
187
+ id = R .drawable.ic_routine_success,
188
+ tint = null ,
189
+ )
190
+ }
191
+ }
136
192
}
137
193
}
138
194
@@ -143,8 +199,9 @@ private fun WeeklyDatePickerPreview() {
143
199
144
200
WeeklyDatePicker (
145
201
selectedDate = selectedDate,
146
- onDateSelect = { selectedDate = it },
147
202
weeklyDates = selectedDate.getCurrentWeekDays(),
203
+ routines = RoutinesUiModel (),
204
+ onDateSelect = { selectedDate = it },
148
205
onPreviousWeekClick = { selectedDate = selectedDate.minusWeeks(1 ) },
149
206
onNextWeekClick = { selectedDate = selectedDate.plusWeeks(1 ) },
150
207
)
0 commit comments