Skip to content

Commit 4e3256f

Browse files
authored
Merge pull request #14791 from woocommerce/issue/WOOMOB-1347_add_note_booking_details
[WOOMOB-1347] - Booking Note (read only)
2 parents ef44c07 + 6f047c4 commit 4e3256f

File tree

10 files changed

+4437
-3
lines changed

10 files changed

+4437
-3
lines changed
Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
package com.woocommerce.android.ui.bookings.compose
2+
3+
import androidx.compose.foundation.background
4+
import androidx.compose.foundation.clickable
5+
import androidx.compose.foundation.layout.Column
6+
import androidx.compose.foundation.layout.Row
7+
import androidx.compose.foundation.layout.fillMaxWidth
8+
import androidx.compose.foundation.layout.padding
9+
import androidx.compose.material3.HorizontalDivider
10+
import androidx.compose.material3.Icon
11+
import androidx.compose.material3.MaterialTheme
12+
import androidx.compose.material3.Text
13+
import androidx.compose.runtime.Composable
14+
import androidx.compose.ui.Alignment
15+
import androidx.compose.ui.Modifier
16+
import androidx.compose.ui.res.painterResource
17+
import androidx.compose.ui.res.stringResource
18+
import androidx.compose.ui.unit.dp
19+
import com.woocommerce.android.R
20+
import com.woocommerce.android.ui.compose.preview.LightDarkThemePreviews
21+
import com.woocommerce.android.ui.compose.theme.WooThemeWithBackground
22+
23+
@Composable
24+
fun BookingNoteSection(
25+
note: String,
26+
onClick: () -> Unit,
27+
modifier: Modifier = Modifier,
28+
) {
29+
Column(modifier = modifier) {
30+
BookingSectionHeader(R.string.booking_note_header)
31+
Column(
32+
modifier = Modifier.background(color = MaterialTheme.colorScheme.surfaceContainer)
33+
) {
34+
HorizontalDivider(thickness = 0.5.dp)
35+
Row(
36+
verticalAlignment = Alignment.CenterVertically,
37+
modifier = Modifier
38+
.fillMaxWidth()
39+
.clickable { onClick() }
40+
.padding(horizontal = 16.dp)
41+
) {
42+
if (note.isEmpty()) {
43+
BookingDetailsLabel(
44+
label = R.string.booking_note_label_add_note,
45+
modifier = Modifier
46+
.weight(1f)
47+
.padding(vertical = 12.dp)
48+
)
49+
} else {
50+
Text(
51+
text = note,
52+
style = MaterialTheme.typography.bodyLarge,
53+
color = MaterialTheme.colorScheme.onSurface,
54+
modifier = Modifier
55+
.weight(1f)
56+
.padding(vertical = 16.dp)
57+
)
58+
}
59+
Icon(
60+
painter = painterResource(id = R.drawable.ic_arrow_right),
61+
contentDescription = null,
62+
tint = MaterialTheme.colorScheme.surfaceVariant,
63+
modifier = Modifier.padding(start = 8.dp)
64+
)
65+
}
66+
HorizontalDivider(thickness = 0.5.dp)
67+
}
68+
Text(
69+
text = stringResource(R.string.booking_note_description_private),
70+
style = MaterialTheme.typography.bodySmall,
71+
color = MaterialTheme.colorScheme.onSurfaceVariant,
72+
modifier = Modifier.padding(horizontal = 16.dp, vertical = 8.dp)
73+
)
74+
}
75+
}
76+
77+
@LightDarkThemePreviews
78+
@Composable
79+
private fun BookingNoteSectionPreview() {
80+
WooThemeWithBackground {
81+
BookingNoteSection(
82+
note = "",
83+
onClick = {},
84+
modifier = Modifier.fillMaxWidth()
85+
)
86+
}
87+
}
88+
89+
@LightDarkThemePreviews
90+
@Composable
91+
private fun BookingNoteSectionWithNotePreview() {
92+
WooThemeWithBackground {
93+
BookingNoteSection(
94+
note = "The customer prefers eco-friendly products and shorter length cuts. Please ensure the stylist " +
95+
"recommends sustainable options and is prepared for a trim focusing on shorter lengths. " +
96+
"If there are any special requests or allergies, please confirm with the customer " +
97+
"prior to the appointment.",
98+
onClick = {},
99+
modifier = Modifier.fillMaxWidth()
100+
)
101+
}
102+
}

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/bookings/details/BookingDetailsScreen.kt

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ import com.woocommerce.android.ui.bookings.compose.BookingAttendanceStatus
3434
import com.woocommerce.android.ui.bookings.compose.BookingAttendanceStatusBottomSheet
3535
import com.woocommerce.android.ui.bookings.compose.BookingCustomerDetails
3636
import com.woocommerce.android.ui.bookings.compose.BookingCustomerDetailsModel
37+
import com.woocommerce.android.ui.bookings.compose.BookingNoteSection
3738
import com.woocommerce.android.ui.bookings.compose.BookingPaymentDetailsModel
3839
import com.woocommerce.android.ui.bookings.compose.BookingPaymentSection
3940
import com.woocommerce.android.ui.bookings.compose.BookingStaffMemberStatus
@@ -155,6 +156,11 @@ private fun BookingDetailsContent(
155156
modifier = Modifier.fillMaxWidth()
156157
)
157158
}
159+
BookingNoteSection(
160+
note = booking.note,
161+
onClick = {},
162+
modifier = Modifier.fillMaxWidth()
163+
)
158164
}
159165

160166
@Composable
@@ -251,7 +257,8 @@ private fun BookingDetailsPreview() {
251257
tax = "$4.50",
252258
discount = "-",
253259
total = "$59.50"
254-
)
260+
),
261+
note = ""
255262
),
256263
),
257264
onBack = {},

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/bookings/details/BookingDetailsViewModel.kt

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -214,7 +214,8 @@ class BookingDetailsViewModel @Inject constructor(
214214
cancelStatus = cancelStatus
215215
),
216216
bookingCustomerDetails = booking.order.customerInfo.toCustomerDetailsModel(),
217-
bookingPaymentDetails = booking.order.paymentInfo?.toPaymentDetailsModel(booking.currency)
217+
bookingPaymentDetails = booking.order.paymentInfo?.toPaymentDetailsModel(booking.currency),
218+
note = booking.note
218219
)
219220

220221
private fun buildStaffMemberStatus(

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/bookings/details/BookingDetailsViewState.kt

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ data class BookingUiState(
2525
val bookingsAppointmentDetails: BookingAppointmentDetailsModel,
2626
val bookingCustomerDetails: BookingCustomerDetailsModel,
2727
val bookingPaymentDetails: BookingPaymentDetailsModel?,
28+
val note: String,
2829
)
2930

3031
sealed interface BookingDetailsLoadingState {

WooCommerce/src/main/res/values/strings.xml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4277,6 +4277,9 @@
42774277
<string name="booking_duration_days">%1$d days</string>
42784278
<string name="booking_duration_second">%1$d second</string>
42794279
<string name="booking_duration_seconds">%1$d seconds</string>
4280+
<string name="booking_note_header">BOOKING NOTE</string>
4281+
<string name="booking_note_label_add_note">Add note</string>
4282+
<string name="booking_note_description_private">This is a private note. It’ll not be shared with the customer.</string>
42804283

42814284
<string name="or_use_password" a8c-src-lib="module:login">Use password to sign in</string>
42824285
<string name="about_automattic_main_page_title">About %1$s</string>

0 commit comments

Comments
 (0)