Introduce top-level AppFrame component

app/src/main/java/com/kernelmaft/zanbur/components.kt

@@ -1,15 +1,33 @@
 package com.kernelmaft.zanbur
 
+import androidx.compose.foundation.layout.Arrangement.Center
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.ColumnScope
 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.material3.Button
 import androidx.compose.material3.ButtonDefaults
+import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment.Companion.CenterHorizontally
 import androidx.compose.ui.Modifier
 
 
+
+@Composable fun AppFrame ( content : @Composable () -> Unit ) {
+	ZanburTheme {
+		Scaffold { scaffoldPadding ->
+			CenteringColumn ( Modifier . padding (scaffoldPadding) . fillMaxSize () ) {
+				content ()
+			}
+		}
+	}
+}
+
 @Composable fun SceneSwitcher ( group : Group , onSwitch : (Scene) -> Unit ) {
 	CenteringColumn {
 		Text ( group . name )
@@ -20,9 +38,20 @@ import androidx.compose.ui.Modifier
 				if ( scene . id == group . currentScene ?. id ) ButtonDefaults . buttonColors ()
 				else ButtonDefaults . filledTonalButtonColors ()
 
-			Button ( { onSwitch (scene) } , Modifier . fillMaxWidth () , true , ButtonDefaults . shape , colors ) {
+			Button (
+				{ onSwitch (scene) } ,
+				Modifier . fillMaxWidth () ,
+				true ,
+				ButtonDefaults . shape ,
+				colors ,
+			) {
 				Text ( scene . name )
 			}
 		}
 	}
 }
+
+@Composable fun CenteringColumn (
+	modifier : Modifier = Modifier ,
+	content : @Composable ColumnScope . () -> Unit ,
+) = Column ( modifier , Center , CenterHorizontally , content )

app/src/main/java/com/kernelmaft/zanbur/main.kt

@@ -1,17 +1,11 @@
 package com.kernelmaft.zanbur
 
-import kotlinx.coroutines.Dispatchers.IO
-import kotlinx.coroutines.flow.firstOrNull
-import kotlinx.coroutines.launch
 import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.activity.enableEdgeToEdge
 import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
-import androidx.compose.material3.Scaffold
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.setValue
@@ -20,6 +14,9 @@ import androidx.compose.ui.unit.dp
 import androidx.datastore.preferences.core.edit
 import androidx.datastore.preferences.core.stringPreferencesKey
 import androidx.lifecycle.lifecycleScope
+import kotlinx.coroutines.Dispatchers.IO
+import kotlinx.coroutines.flow.firstOrNull
+import kotlinx.coroutines.launch
 
 
 
@@ -47,17 +44,12 @@ class MainActivity : ComponentActivity () {
 
 		enableEdgeToEdge ()
 		setContent {
-			ZanburTheme {
+			AppFrame {
-				Scaffold { scaffoldPadding ->
+				Column ( Modifier . width ( 300 . dp ) ) {
-					CenteringColumn ( Modifier . padding (scaffoldPadding) . fillMaxSize () ) {
+					groups . forEach { group ->
-
+						SceneSwitcher (group) {
-						Column ( Modifier . width ( 300 . dp ) ) {
+							AppState . setCurrentScene ( group . id , it )
-							groups . forEach { group ->
+							publishSceneChange ( group , it )
-								SceneSwitcher (group) {
-									AppState . setCurrentScene ( group . id , it )
-									publishSceneChange ( group , it )
-								}
-							}
 						}
 					}
 				}

app/src/main/java/com/kernelmaft/zanbur/theme.kt

@@ -1,21 +1,17 @@
 package com.kernelmaft.zanbur
 
 import androidx.compose.foundation.isSystemInDarkTheme
-import androidx.compose.foundation.layout.Arrangement.Center
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.ColumnScope
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.MaterialTheme.shapes
 import androidx.compose.material3.MaterialTheme.typography
 import androidx.compose.material3.dynamicDarkColorScheme
 import androidx.compose.material3.dynamicLightColorScheme
 import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment.Companion.CenterHorizontally
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.unit.dp
 
 
+
 val compactSpacing = 16 . dp
 
 @Composable fun ZanburTheme ( content : @Composable () -> Unit ) {
@@ -29,8 +25,3 @@ val compactSpacing = 16 . dp
 
 	MaterialTheme ( colorScheme, shapes , typography , content )
 }
-
-@Composable fun CenteringColumn (
-	modifier : Modifier = Modifier ,
-	content : @Composable ColumnScope . () -> Unit ,
-) = Column ( modifier , Center , CenterHorizontally , content )