fix(ui): Make AudioRecordingStatus more responsive for landscape mode

Signed-off-by: Myzel394 <50424412+Myzel394@users.noreply.github.com>

app/src/main/java/app/myzel394/alibi/ui/components/RecorderScreen/molecules/RecordingControl.kt

@@ -1,8 +1,11 @@
 package app.myzel394.alibi.ui.components.RecorderScreen.molecules
 
+import android.content.res.Configuration
 import androidx.compose.animation.core.animateFloatAsState
 import androidx.compose.animation.core.tween
+import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.runtime.Composable
@@ -14,6 +17,8 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.alpha
+import androidx.compose.ui.platform.LocalConfiguration
+import androidx.compose.ui.unit.dp
 import app.myzel394.alibi.ui.components.RecorderScreen.atoms.DeleteButton
 import app.myzel394.alibi.ui.components.RecorderScreen.atoms.PauseResumeButton
 import app.myzel394.alibi.ui.components.RecorderScreen.atoms.SaveButton
@@ -23,6 +28,7 @@ import kotlinx.coroutines.delay
 
 @Composable
 fun RecordingControl(
+    modifier: Modifier = Modifier,
     initialDelay: Long = 0L,
     isPaused: Boolean,
     recordingTime: Long,
@@ -30,6 +36,7 @@ fun RecordingControl(
     onPauseResume: () -> Unit,
     onSave: () -> Unit,
 ) {
+    val orientation = LocalConfiguration.current.orientation
     val animateIn = rememberInitialRecordingAnimation(recordingTime)
 
     var deleteButtonAlphaIsIn by rememberSaveable {
@@ -85,8 +92,55 @@ fun RecordingControl(
         }
     }
 
+    when (orientation) {
+        Configuration.ORIENTATION_LANDSCAPE -> {
+            Column(
+                horizontalAlignment = Alignment.CenterHorizontally,
+                verticalArrangement = Arrangement.spacedBy(16.dp),
+                modifier = modifier,
+            ) {
+                Box(
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .alpha(saveButtonAlpha),
+                    contentAlignment = Alignment.Center,
+                ) {
+                    SaveButton(
+                        onSave = onSave,
+                        modifier = Modifier.fillMaxWidth(),
+                    )
+                }
+
+                Box(
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .alpha(pauseButtonAlpha),
+                    contentAlignment = Alignment.Center,
+                ) {
+                    PauseResumeButton(
+                        isPaused = isPaused,
+                        onChange = onPauseResume,
+                    )
+                }
+
+                Box(
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .alpha(deleteButtonAlpha),
+                    contentAlignment = Alignment.Center,
+                ) {
+                    DeleteButton(
+                        onDelete = onDelete,
+                        modifier = Modifier.fillMaxWidth(),
+                    )
+                }
+            }
+        }
+
+        else -> {
             Row(
                 verticalAlignment = Alignment.CenterVertically,
+                modifier = modifier,
             ) {
                 Box(
                     modifier = Modifier
@@ -119,4 +173,6 @@ fun RecordingControl(
                     SaveButton(onSave = onSave)
                 }
             }
+        }
+    }
 }

app/src/main/java/app/myzel394/alibi/ui/components/RecorderScreen/molecules/RecordingStatus.kt

@@ -40,6 +40,7 @@ fun RecordingStatus(
     progress: Float,
     recordingStart: LocalDateTime,
     maxDuration: Long,
+    progressModifier: Modifier = Modifier.width(300.dp),
 ) {
     val animateIn = rememberInitialRecordingAnimation(recordingTime)
 
@@ -73,9 +74,8 @@ fun RecordingStatus(
             )
         ) {
             LinearProgressIndicator(
-                progress = progress,
+                progress = { progress },
-                modifier = Modifier
+                modifier = progressModifier,
-                    .width(300.dp)
             )
         }
 

app/src/main/java/app/myzel394/alibi/ui/components/RecorderScreen/organisms/AudioRecordingStatus.kt

@@ -1,9 +1,12 @@
 package app.myzel394.alibi.ui.components.RecorderScreen.organisms
 
+import android.content.res.Configuration
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.widthIn
 import androidx.compose.material3.HorizontalDivider
@@ -16,6 +19,7 @@ import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalConfiguration
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.unit.dp
 import app.myzel394.alibi.ui.components.RecorderScreen.atoms.RealtimeAudioVisualizer
@@ -33,6 +37,7 @@ fun AudioRecordingStatus(
     audioRecorder: AudioRecorderModel,
 ) {
     val context = LocalContext.current
+    val configuration = LocalConfiguration.current.orientation
 
     val scope = rememberCoroutineScope()
 
@@ -62,6 +67,61 @@ fun AudioRecordingStatus(
                 .weight(1f),
         )
 
+        when (configuration) {
+            Configuration.ORIENTATION_LANDSCAPE -> {
+                Row(
+                    verticalAlignment = Alignment.CenterVertically,
+                    horizontalArrangement = Arrangement.SpaceEvenly,
+                ) {
+                    Column(
+                        verticalArrangement = Arrangement
+                            .spacedBy(16.dp),
+                        horizontalAlignment = Alignment.CenterHorizontally,
+                        modifier = Modifier.weight(3f),
+                    ) {
+                        RecordingStatus(
+                            recordingTime = audioRecorder.recordingTime,
+                            progress = audioRecorder.progress,
+                            recordingStart = audioRecorder.recordingStart,
+                            maxDuration = audioRecorder.settings!!.maxDuration,
+                            progressModifier = Modifier.fillMaxWidth(.9f),
+                        )
+
+                        MicrophoneStatus(audioRecorder)
+                    }
+
+                    RecordingControl(
+                        modifier = Modifier
+                            .weight(1f)
+                            .fillMaxWidth(),
+                        isPaused = audioRecorder.isPaused,
+                        recordingTime = audioRecorder.recordingTime,
+                        onDelete = {
+                            scope.launch {
+                                runCatching {
+                                    audioRecorder.stopRecording(context)
+                                }
+                                runCatching {
+                                    audioRecorder.destroyService(context)
+                                }
+                                audioRecorder.batchesFolder!!.deleteRecordings()
+                            }
+                        },
+                        onPauseResume = {
+                            if (audioRecorder.isPaused) {
+                                audioRecorder.resumeRecording()
+                            } else {
+                                audioRecorder.pauseRecording()
+                            }
+                        },
+                        onSave = {
+                            audioRecorder.onRecordingSave(false)
+                        }
+                    )
+                }
+            }
+
+            else -> {
                 RecordingStatus(
                     recordingTime = audioRecorder.recordingTime,
                     progress = audioRecorder.progress,
@@ -105,4 +165,6 @@ fun AudioRecordingStatus(
                     )
                 }
             }
+        }
+    }
 }