AI:remove more boilerplate

2026-02-03 09:55:40 +05:30
parent 4e5f368256
commit 52a6d379b0
17 changed files with 167 additions and 510 deletions
--- a/app/src/main/java/com/android/trisolarispms/ui/card/CardInfoScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/card/CardInfoScreen.kt
@@ -11,18 +11,11 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.AlertDialog
 import androidx.compose.material3.TextButton
 import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.DisposableEffect
 import androidx.compose.runtime.mutableStateOf
@@ -39,6 +32,7 @@ import com.airbnb.lottie.compose.LottieConstants
 import com.airbnb.lottie.compose.animateLottieCompositionAsState
 import com.airbnb.lottie.compose.rememberLottieComposition
 import com.android.trisolarispms.data.api.core.ApiClient
+import com.android.trisolarispms.ui.common.BackTopBarScaffold
 import java.util.Calendar
 import java.util.Date
 import kotlinx.coroutines.launch
@@ -101,18 +95,9 @@ fun CardInfoScreen(
        }
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Card Details") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.AutoMirrored.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
-        }
+    BackTopBarScaffold(
+        title = "Card Details",
+        onBack = onBack
    ) { padding ->
        Column(
            modifier = Modifier
--- a/app/src/main/java/com/android/trisolarispms/ui/card/IssueTemporaryCardScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/card/IssueTemporaryCardScreen.kt
@@ -9,18 +9,11 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.AlertDialog
 import androidx.compose.material3.TextButton
 import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.DisposableEffect
 import androidx.compose.runtime.collectAsState
@@ -39,6 +32,7 @@ import com.airbnb.lottie.compose.LottieCompositionSpec
 import com.airbnb.lottie.compose.LottieConstants
 import com.airbnb.lottie.compose.animateLottieCompositionAsState
 import com.airbnb.lottie.compose.rememberLottieComposition
+import com.android.trisolarispms.ui.common.BackTopBarScaffold

@Composable
@OptIn(ExperimentalMaterial3Api::class)
@@ -97,18 +91,9 @@ fun IssueTemporaryCardScreen(
        }
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Issue Temporary Card") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.AutoMirrored.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
-        }
+    BackTopBarScaffold(
+        title = "Issue Temporary Card",
+        onBack = onBack
    ) { padding ->
        Column(
            modifier = Modifier
--- a/app/src/main/java/com/android/trisolarispms/ui/payment/BookingPaymentsScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/payment/BookingPaymentsScreen.kt
@@ -12,23 +12,18 @@ import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material.icons.filled.Delete
 import androidx.compose.material3.Button
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.CircularProgressIndicator
-import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.OutlinedTextField
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextButton
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.material3.AlertDialog
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
@@ -42,11 +37,11 @@ import androidx.compose.ui.text.input.KeyboardType
 import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
 import com.android.trisolarispms.data.api.model.PaymentDto
+import com.android.trisolarispms.ui.common.BackTopBarScaffold
 import java.time.OffsetDateTime
 import java.time.format.DateTimeFormatter

@Composable
-@OptIn(ExperimentalMaterial3Api::class)
 fun BookingPaymentsScreen(
    propertyId: String,
    bookingId: String,
@@ -66,18 +61,9 @@ fun BookingPaymentsScreen(
        viewModel.load(propertyId, bookingId)
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Payments") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.AutoMirrored.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
-        }
+    BackTopBarScaffold(
+        title = "Payments",
+        onBack = onBack
    ) { padding ->
        Column(
            modifier = Modifier
--- a/app/src/main/java/com/android/trisolarispms/ui/razorpay/RazorpaySettingsScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/razorpay/RazorpaySettingsScreen.kt
@@ -11,20 +11,12 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.foundation.verticalScroll
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material3.Button
 import androidx.compose.material3.CircularProgressIndicator
-import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.OutlinedTextField
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Switch
 import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
@@ -37,9 +29,9 @@ import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
 import androidx.compose.ui.platform.ClipboardManager
 import androidx.compose.ui.platform.LocalClipboardManager
+import com.android.trisolarispms.ui.common.BackTopBarScaffold

@Composable
-@OptIn(ExperimentalMaterial3Api::class)
 fun RazorpaySettingsScreen(
    propertyId: String,
    onBack: () -> Unit,
@@ -52,18 +44,9 @@ fun RazorpaySettingsScreen(
        viewModel.load(propertyId)
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Razorpay Settings") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.AutoMirrored.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
-        }
+    BackTopBarScaffold(
+        title = "Razorpay Settings",
+        onBack = onBack
    ) { padding ->
        Column(
            modifier = Modifier
--- a/app/src/main/java/com/android/trisolarispms/ui/room/RoomFormScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/room/RoomFormScreen.kt
@@ -4,30 +4,24 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.ArrowBack
 import androidx.compose.material.icons.filled.Delete
-import androidx.compose.material.icons.filled.Done
 import androidx.compose.material.icons.filled.PhotoLibrary
 import androidx.compose.material3.AlertDialog
-import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
+import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.DropdownMenuItem
 import androidx.compose.material3.ExposedDropdownMenuBox
 import androidx.compose.material3.ExposedDropdownMenuDefaults
 import androidx.compose.material3.OutlinedTextField
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Switch
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextButton
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
@@ -38,6 +32,8 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
+import com.android.trisolarispms.ui.common.PaddedScreenColumn
+import com.android.trisolarispms.ui.common.SaveTopBarScaffold
 import com.android.trisolarispms.ui.roomtype.RoomTypeListViewModel

@Composable
@@ -72,25 +68,17 @@ fun RoomFormScreen(
        }
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text(title) },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
-                actions = {
-                    IconButton(onClick = {
+    SaveTopBarScaffold(
+        title = title,
+        onBack = onBack,
+        onSave = {
            if (roomId == null) {
                viewModel.submitCreate(propertyId, onSave)
            } else {
                viewModel.submitUpdate(propertyId, roomId, onSave)
            }
-                    }) {
-                        Icon(Icons.Default.Done, contentDescription = "Save")
-                    }
+        },
+        actions = {
            if (roomId != null) {
                IconButton(onClick = { onViewImages(roomId) }) {
                    Icon(Icons.Default.PhotoLibrary, contentDescription = "Images")
@@ -99,18 +87,9 @@ fun RoomFormScreen(
                    Icon(Icons.Default.Delete, contentDescription = "Delete Room")
                }
            }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
        }
    ) { padding ->
-        Column(
-            modifier = Modifier
-                .fillMaxSize()
-                .padding(padding)
-                .padding(24.dp),
-            verticalArrangement = Arrangement.Top
-        ) {
+        PaddedScreenColumn(padding = padding) {
            OutlinedTextField(
                value = state.roomNumber,
                onValueChange = viewModel::onRoomNumberChange,
--- a/app/src/main/java/com/android/trisolarispms/ui/room/RoomsScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/room/RoomsScreen.kt
@@ -5,7 +5,6 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
@@ -15,24 +14,19 @@ import androidx.compose.foundation.lazy.grid.GridCells
 import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
 import androidx.compose.foundation.lazy.grid.items
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material.icons.filled.Add
 import androidx.compose.material.icons.filled.Category
 import androidx.compose.material.icons.filled.CreditCard
+import androidx.compose.material.icons.filled.Groups
 import androidx.compose.material.icons.filled.Hotel
 import androidx.compose.material.icons.filled.Layers
-import androidx.compose.material.icons.filled.Groups
-import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.material3.FilterChip
 import androidx.compose.material3.DropdownMenu
 import androidx.compose.material3.DropdownMenuItem
@@ -40,15 +34,18 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
 import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
 import androidx.compose.ui.platform.LocalContext
 import android.nfc.NfcAdapter
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.alpha
 import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
+import com.android.trisolarispms.ui.common.BackTopBarScaffold
+import com.android.trisolarispms.ui.common.LoadingAndError
+import com.android.trisolarispms.ui.common.PaddedScreenColumn
 import com.android.trisolarispms.ui.roomtype.RoomTypeListViewModel
-import androidx.compose.runtime.remember
-import androidx.compose.runtime.mutableStateOf
 import androidx.compose.foundation.layout.Box

@Composable
@@ -79,15 +76,9 @@ fun RoomsScreen(
        roomTypeListViewModel.load(propertyId)
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Available Rooms") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.AutoMirrored.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
+    BackTopBarScaffold(
+        title = "Available Rooms",
+        onBack = onBack,
        actions = {
            if (canManageRooms) {
                IconButton(onClick = onViewRoomTypes) {
@@ -102,26 +93,10 @@ fun RoomsScreen(
                    Icon(Icons.Default.Add, contentDescription = "Add Room")
                }
            }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
        }
    ) { padding ->
-        Column(
-            modifier = Modifier
-                .fillMaxSize()
-                .padding(padding)
-                .padding(24.dp),
-            verticalArrangement = Arrangement.Top
-        ) {
-            if (state.isLoading) {
-                CircularProgressIndicator()
-                Spacer(modifier = Modifier.height(8.dp))
-            }
-            state.error?.let {
-                Text(text = it, color = MaterialTheme.colorScheme.error)
-                Spacer(modifier = Modifier.height(8.dp))
-            }
+        PaddedScreenColumn(padding = padding) {
+            LoadingAndError(isLoading = state.isLoading, error = state.error)
            if (!state.isLoading && state.error == null) {
                Row(
                    modifier = Modifier.fillMaxWidth(),
--- a/app/src/main/java/com/android/trisolarispms/ui/roomimage/ImageTagFormScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/roomimage/ImageTagFormScreen.kt
@@ -3,28 +3,18 @@ package com.android.trisolarispms.ui.roomimage
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.padding
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.automirrored.filled.ArrowBack
-import androidx.compose.material.icons.filled.Done
-import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.OutlinedTextField
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
+import com.android.trisolarispms.ui.common.PaddedScreenColumn
+import com.android.trisolarispms.ui.common.SaveTopBarScaffold

@Composable
-@OptIn(ExperimentalMaterial3Api::class)
 internal fun ImageTagFormScreen(
    title: String,
    name: String,
@@ -33,31 +23,12 @@ internal fun ImageTagFormScreen(
    onBack: () -> Unit,
    onSave: () -> Unit
 ) {
-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text(title) },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.AutoMirrored.Filled.ArrowBack, contentDescription = "Back")
-                    }
-                },
-                actions = {
-                    IconButton(onClick = onSave) {
-                        Icon(Icons.Default.Done, contentDescription = "Save")
-                    }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
-        }
+    SaveTopBarScaffold(
+        title = title,
+        onBack = onBack,
+        onSave = onSave
    ) { padding ->
-        Column(
-            modifier = Modifier
-                .fillMaxSize()
-                .padding(padding)
-                .padding(24.dp),
-            verticalArrangement = Arrangement.Top
-        ) {
+        PaddedScreenColumn(padding = padding) {
            OutlinedTextField(
                value = name,
                onValueChange = onNameChange,
--- a/app/src/main/java/com/android/trisolarispms/ui/roomimage/ImageTagsScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/roomimage/ImageTagsScreen.kt
@@ -2,27 +2,18 @@ package com.android.trisolarispms.ui.roomimage

 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.items
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Add
-import androidx.compose.material.icons.filled.ArrowBack
 import androidx.compose.material.icons.filled.Delete
-import androidx.compose.material3.CircularProgressIndicator
-import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
@@ -31,9 +22,11 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
 import com.android.trisolarispms.data.api.model.RoomImageTagDto
+import com.android.trisolarispms.ui.common.BackTopBarScaffold
+import com.android.trisolarispms.ui.common.LoadingAndError
+import com.android.trisolarispms.ui.common.PaddedScreenColumn

@Composable
-@OptIn(ExperimentalMaterial3Api::class)
 fun ImageTagsScreen(
    onBack: () -> Unit,
    onAdd: () -> Unit,
@@ -46,39 +39,20 @@ fun ImageTagsScreen(
        viewModel.load()
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Image Tags") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
+    BackTopBarScaffold(
+        title = "Image Tags",
+        onBack = onBack,
        actions = {
            IconButton(onClick = onAdd) {
                Icon(Icons.Default.Add, contentDescription = "Add Tag")
            }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
        }
    ) { padding ->
-        Column(
-            modifier = Modifier
-                .fillMaxSize()
-                .padding(padding)
-                .padding(24.dp),
-            verticalArrangement = Arrangement.Top
-        ) {
-            if (state.isLoading) {
-                CircularProgressIndicator()
-                Spacer(modifier = Modifier.height(8.dp))
-            }
-            state.error?.let {
-                Text(text = it, color = MaterialTheme.colorScheme.error)
-                Spacer(modifier = Modifier.height(8.dp))
-            }
+        PaddedScreenColumn(padding = padding) {
+            LoadingAndError(
+                isLoading = state.isLoading,
+                error = state.error
+            )
            if (!state.isLoading && state.error == null) {
                if (state.tags.isEmpty()) {
                    Text(text = "No tags")
--- a/app/src/main/java/com/android/trisolarispms/ui/roomimage/RoomImagesScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/roomimage/RoomImagesScreen.kt
@@ -10,27 +10,20 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxHeight
-import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.grid.rememberLazyGridState
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.ArrowBack
 import androidx.compose.material.icons.filled.UploadFile
 import androidx.compose.material3.AlertDialog
 import androidx.compose.material3.Button
-import androidx.compose.material3.CircularProgressIndicator
-import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.OutlinedTextField
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextButton
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
@@ -42,12 +35,14 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
+import com.android.trisolarispms.ui.common.BackTopBarScaffold
+import com.android.trisolarispms.ui.common.LoadingAndError
+import com.android.trisolarispms.ui.common.PaddedScreenColumn
 import okhttp3.MediaType.Companion.toMediaType
 import okhttp3.MultipartBody
 import okhttp3.RequestBody.Companion.toRequestBody

@Composable
-@OptIn(ExperimentalMaterial3Api::class)
 fun RoomImagesScreen(
    propertyId: String,
    roomId: String,
@@ -86,15 +81,9 @@ fun RoomImagesScreen(
        originalOrderIds.value = state.images.mapNotNull { it.id }
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Room Images") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
+    BackTopBarScaffold(
+        title = "Room Images",
+        onBack = onBack,
        actions = {
            IconButton(onClick = {
                pickerLauncher.launch(
@@ -103,27 +92,10 @@ fun RoomImagesScreen(
            }) {
                Icon(Icons.Default.UploadFile, contentDescription = "Pick Image")
            }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
        }
    ) { padding ->
-        Column(
-            modifier = Modifier
-                .fillMaxSize()
-                .padding(padding)
-                .padding(24.dp),
-            verticalArrangement = Arrangement.Top
-        ) {
-            if (state.isLoading) {
-                CircularProgressIndicator()
-                Spacer(modifier = Modifier.height(8.dp))
-            }
-
-            state.error?.let {
-                Text(text = it, color = MaterialTheme.colorScheme.error)
-                Spacer(modifier = Modifier.height(8.dp))
-            }
+        PaddedScreenColumn(padding = padding) {
+            LoadingAndError(isLoading = state.isLoading, error = state.error)

            Text(text = "Upload", style = MaterialTheme.typography.titleMedium)
            Spacer(modifier = Modifier.height(8.dp))
--- a/app/src/main/java/com/android/trisolarispms/ui/roomstay/BookingDetailsTabsScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/roomstay/BookingDetailsTabsScreen.kt
@@ -18,7 +18,6 @@ import androidx.compose.foundation.pager.rememberPagerState
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material.icons.filled.Edit
 import androidx.compose.material.icons.filled.QrCode
 import androidx.compose.material.icons.filled.ReceiptLong
@@ -29,13 +28,10 @@ import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Tab
 import androidx.compose.material3.TabRow
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextButton
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.DisposableEffect
@@ -57,6 +53,7 @@ import com.android.trisolarispms.data.api.core.ApiConstants
 import com.android.trisolarispms.data.api.core.FirebaseAuthTokenProvider
 import com.android.trisolarispms.data.api.model.BookingBillingMode
 import com.android.trisolarispms.data.api.model.BookingDetailsResponse
+import com.android.trisolarispms.ui.common.BackTopBarScaffold
 import com.android.trisolarispms.ui.guestdocs.GuestDocumentsTab
 import com.google.firebase.auth.FirebaseAuth
 import kotlinx.coroutines.launch
@@ -102,18 +99,9 @@ fun BookingDetailsTabsScreen(
        onDispose { detailsViewModel.stopStream() }
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Details") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.AutoMirrored.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
-        }
+    BackTopBarScaffold(
+        title = "Details",
+        onBack = onBack
    ) { padding ->
        Column(
            modifier = Modifier
--- a/app/src/main/java/com/android/trisolarispms/ui/roomstay/BookingRoomStaysScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/roomstay/BookingRoomStaysScreen.kt
@@ -8,18 +8,10 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material3.CircularProgressIndicator
-import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Switch
 import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
@@ -28,9 +20,9 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
+import com.android.trisolarispms.ui.common.BackTopBarScaffold

@Composable
-@OptIn(ExperimentalMaterial3Api::class)
 fun BookingRoomStaysScreen(
    propertyId: String,
    bookingId: String,
@@ -43,18 +35,9 @@ fun BookingRoomStaysScreen(
        viewModel.load(propertyId, bookingId)
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Room Stays") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.AutoMirrored.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
-        }
+    BackTopBarScaffold(
+        title = "Room Stays",
+        onBack = onBack
    ) { padding ->
        Column(
            modifier = Modifier
--- a/app/src/main/java/com/android/trisolarispms/ui/roomtype/AmenitiesScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/roomtype/AmenitiesScreen.kt
@@ -2,11 +2,9 @@ package com.android.trisolarispms.ui.roomtype

 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
@@ -14,17 +12,11 @@ import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.items
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Add
-import androidx.compose.material.icons.filled.ArrowBack
 import androidx.compose.material.icons.filled.Delete
-import androidx.compose.material3.CircularProgressIndicator
-import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
@@ -34,10 +26,12 @@ import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
 import com.android.trisolarispms.data.api.model.AmenityDto
 import com.android.trisolarispms.data.api.core.ApiConstants
+import com.android.trisolarispms.ui.common.BackTopBarScaffold
+import com.android.trisolarispms.ui.common.LoadingAndError
+import com.android.trisolarispms.ui.common.PaddedScreenColumn
 import coil.compose.AsyncImage

@Composable
-@OptIn(ExperimentalMaterial3Api::class)
 fun AmenitiesScreen(
    onBack: () -> Unit,
    onAdd: () -> Unit,
@@ -51,41 +45,22 @@ fun AmenitiesScreen(
        viewModel.load()
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Amenities") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
+    BackTopBarScaffold(
+        title = "Amenities",
+        onBack = onBack,
        actions = {
            if (canManageAmenities) {
                IconButton(onClick = onAdd) {
                    Icon(Icons.Default.Add, contentDescription = "Add Amenity")
                }
            }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
        }
    ) { padding ->
-        Column(
-            modifier = Modifier
-                .fillMaxSize()
-                .padding(padding)
-                .padding(24.dp),
-            verticalArrangement = Arrangement.Top
-        ) {
-            if (state.isLoading) {
-                CircularProgressIndicator()
-                Spacer(modifier = Modifier.height(8.dp))
-            }
-            state.error?.let {
-                Text(text = it, color = MaterialTheme.colorScheme.error)
-                Spacer(modifier = Modifier.height(8.dp))
-            }
+        PaddedScreenColumn(padding = padding) {
+            LoadingAndError(
+                isLoading = state.isLoading,
+                error = state.error
+            )
            if (!state.isLoading && state.error == null) {
                if (state.items.isEmpty()) {
                    Text(text = "No amenities")
--- a/app/src/main/java/com/android/trisolarispms/ui/roomtype/AmenityFormScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/roomtype/AmenityFormScreen.kt
@@ -6,27 +6,19 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.heightIn
-import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.ArrowBack
 import androidx.compose.material.icons.filled.ArrowDropDown
-import androidx.compose.material.icons.filled.Done
 import androidx.compose.material3.DropdownMenu
 import androidx.compose.material3.DropdownMenuItem
-import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.OutlinedTextField
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
@@ -42,11 +34,12 @@ import androidx.compose.ui.unit.IntSize
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.window.PopupProperties
 import androidx.lifecycle.viewmodel.compose.viewModel
+import com.android.trisolarispms.ui.common.PaddedScreenColumn
+import com.android.trisolarispms.ui.common.SaveTopBarScaffold
 import coil.compose.AsyncImage
 import com.android.trisolarispms.data.api.core.ApiConstants

@Composable
-@OptIn(ExperimentalMaterial3Api::class)
 fun AmenityFormScreen(
    title: String,
    onBack: () -> Unit,
@@ -89,31 +82,12 @@ fun AmenityFormScreen(
        (menuOffsetY - 32.dp).coerceAtLeast(0.dp)
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text(title) },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
-                actions = {
-                    IconButton(onClick = onSaveClick) {
-                        Icon(Icons.Default.Done, contentDescription = "Save")
-                    }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
-        }
+    SaveTopBarScaffold(
+        title = title,
+        onBack = onBack,
+        onSave = onSaveClick
    ) { padding ->
-        Column(
-            modifier = Modifier
-                .fillMaxSize()
-                .padding(padding)
-                .padding(24.dp),
-            verticalArrangement = Arrangement.Top
-        ) {
+        PaddedScreenColumn(padding = padding) {
            OutlinedTextField(
                value = state.name,
                onValueChange = viewModel::onNameChange,
--- a/app/src/main/java/com/android/trisolarispms/ui/roomtype/RatePlanCalendarScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/roomtype/RatePlanCalendarScreen.kt
@@ -9,19 +9,12 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.text.KeyboardOptions
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.OutlinedTextField
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextButton
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
@@ -35,6 +28,7 @@ import androidx.lifecycle.viewmodel.compose.viewModel
 import com.android.trisolarispms.ui.calendar.CalendarDayCell
 import com.android.trisolarispms.ui.calendar.CalendarDaysOfWeekHeader
 import com.android.trisolarispms.ui.calendar.CalendarMonthHeader
+import com.android.trisolarispms.ui.common.BackTopBarScaffold
 import com.kizitonwose.calendar.compose.HorizontalCalendar
 import com.kizitonwose.calendar.compose.rememberCalendarState
 import com.kizitonwose.calendar.core.DayPosition
@@ -83,18 +77,9 @@ fun RatePlanCalendarScreen(
        viewModel.loadCalendar(propertyId, ratePlanId, from, to)
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Calendar: $ratePlanCode") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.AutoMirrored.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
-        }
+    BackTopBarScaffold(
+        title = "Calendar: $ratePlanCode",
+        onBack = onBack
    ) { padding ->
        Column(
            modifier = Modifier
--- a/app/src/main/java/com/android/trisolarispms/ui/roomtype/RoomTypesScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/roomtype/RoomTypesScreen.kt
@@ -4,39 +4,32 @@ import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.ArrowBack
 import androidx.compose.material.icons.filled.Add
 import androidx.compose.material.icons.filled.AspectRatio
 import androidx.compose.material.icons.filled.Bed
 import androidx.compose.material.icons.filled.Groups
-import androidx.compose.material3.CircularProgressIndicator
-import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
 import androidx.compose.runtime.getValue
+import androidx.lifecycle.viewmodel.compose.viewModel
+import com.android.trisolarispms.ui.common.BackTopBarScaffold
+import com.android.trisolarispms.ui.common.LoadingAndError
+import com.android.trisolarispms.ui.common.PaddedScreenColumn
+import coil.compose.AsyncImage
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.unit.dp
-import androidx.lifecycle.viewmodel.compose.viewModel
-import coil.compose.AsyncImage

@Composable
-@OptIn(ExperimentalMaterial3Api::class)
 fun RoomTypesScreen(
    propertyId: String,
    onBack: () -> Unit,
@@ -51,41 +44,22 @@ fun RoomTypesScreen(
        viewModel.load(propertyId)
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Room Types") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
+    BackTopBarScaffold(
+        title = "Room Types",
+        onBack = onBack,
        actions = {
            if (canManageRoomTypes) {
                IconButton(onClick = onAdd) {
                    Icon(Icons.Default.Add, contentDescription = "Add Room Type")
                }
            }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
        }
    ) { padding ->
-        Column(
-            modifier = Modifier
-                .fillMaxSize()
-                .padding(padding)
-                .padding(24.dp),
-            verticalArrangement = Arrangement.Top
-        ) {
-            if (state.isLoading) {
-                CircularProgressIndicator()
-                Spacer(modifier = Modifier.height(8.dp))
-            }
-            state.error?.let {
-                Text(text = it, color = MaterialTheme.colorScheme.error)
-                Spacer(modifier = Modifier.height(8.dp))
-            }
+        PaddedScreenColumn(padding = padding) {
+            LoadingAndError(
+                isLoading = state.isLoading,
+                error = state.error
+            )
            if (!state.isLoading && state.error == null) {
                if (state.items.isEmpty()) {
                    Text(text = "No room types")
@@ -164,7 +138,7 @@ fun RoomTypesScreen(
                                }
                            }
                        }
-                        Spacer(modifier = Modifier.height(12.dp))
+                        androidx.compose.foundation.layout.Spacer(modifier = Modifier.height(12.dp))
                    }
                }
            }
--- a/app/src/main/java/com/android/trisolarispms/ui/settings/PropertySettingsScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/settings/PropertySettingsScreen.kt
@@ -11,22 +11,15 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.foundation.verticalScroll
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material3.Button
 import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.ExposedDropdownMenuBox
 import androidx.compose.material3.ExposedDropdownMenuDefaults
 import androidx.compose.material3.DropdownMenuItem
-import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.OutlinedTextField
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
@@ -38,6 +31,7 @@ import androidx.compose.ui.text.input.KeyboardType
 import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
 import com.android.trisolarispms.data.api.model.CancellationPenaltyMode
+import com.android.trisolarispms.ui.common.BackTopBarScaffold

@Composable
@OptIn(ExperimentalMaterial3Api::class)
@@ -58,18 +52,9 @@ fun PropertySettingsScreen(
        }
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Settings") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.AutoMirrored.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
-        }
+    BackTopBarScaffold(
+        title = "Settings",
+        onBack = onBack
    ) { padding ->
        Column(
            modifier = Modifier
--- a/app/src/main/java/com/android/trisolarispms/ui/users/PropertyAccessCodeScreen.kt
+++ b/app/src/main/java/com/android/trisolarispms/ui/users/PropertyAccessCodeScreen.kt
@@ -10,20 +10,12 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material3.Button
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.CircularProgressIndicator
-import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.material3.Checkbox
 import androidx.compose.ui.text.AnnotatedString
 import androidx.compose.ui.platform.LocalClipboardManager
@@ -37,11 +29,11 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
+import com.android.trisolarispms.ui.common.BackTopBarScaffold
 import java.time.OffsetDateTime
 import java.time.format.DateTimeFormatter

@Composable
-@OptIn(ExperimentalMaterial3Api::class)
 fun PropertyAccessCodeScreen(
    propertyId: String,
    allowedRoles: List<String>,
@@ -60,18 +52,9 @@ fun PropertyAccessCodeScreen(
        viewModel.loadPropertyCode(propertyId)
    }

-    Scaffold(
-        topBar = {
-            TopAppBar(
-                title = { Text("Generate Access Code") },
-                navigationIcon = {
-                    IconButton(onClick = onBack) {
-                        Icon(Icons.AutoMirrored.Default.ArrowBack, contentDescription = "Back")
-                    }
-                },
-                colors = TopAppBarDefaults.topAppBarColors()
-            )
-        }
+    BackTopBarScaffold(
+        title = "Generate Access Code",
+        onBack = onBack
    ) { padding ->
        Column(
            modifier = Modifier