feat: Add RotateDeviceToPortrait to CustomRecordingNotificationsScreen

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

app/src/main/java/app/myzel394/alibi/ui/components/atoms/RotateDeviceToPortrait.kt

@@ -0,0 +1,39 @@
+package app.myzel394.alibi.ui.components.atoms
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.widthIn
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Rotate90DegreesCw
+import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.unit.dp
+import app.myzel394.alibi.R
+
+@Composable
+fun RotateDeviceToPortrait(
+    modifier: Modifier = Modifier
+        .fillMaxWidth()
+        .widthIn(max = 300.dp),
+) {
+    Column(
+        modifier = modifier,
+        verticalArrangement = Arrangement.spacedBy(16.dp),
+        horizontalAlignment = Alignment.CenterHorizontally
+    ) {
+        Icon(
+            Icons.Default.Rotate90DegreesCw,
+            contentDescription = stringResource(R.string.ui_rotateDevice_portrait_label),
+            modifier = Modifier.size(48.dp),
+            tint = MaterialTheme.colorScheme.tertiary,
+        )
+        Text(stringResource(R.string.ui_rotateDevice_portrait_label))
+    }
+}

app/src/main/java/app/myzel394/alibi/ui/screens/CustomRecordingNotificationsScreen.kt

@@ -1,18 +1,11 @@
 package app.myzel394.alibi.ui.screens
 
-import androidx.compose.foundation.clickable
-import androidx.compose.foundation.gestures.scrollable
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Column
+import android.content.res.Configuration
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.lazy.LazyColumn
-import androidx.compose.foundation.lazy.LazyRow
-import androidx.compose.foundation.rememberScrollState
-import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.ArrowBack
+import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
@@ -29,22 +22,20 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.input.nestedscroll.nestedScroll
+import androidx.compose.ui.platform.LocalConfiguration
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.semantics.contentDescription
-import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.unit.dp
-import androidx.navigation.NavController
 import app.myzel394.alibi.R
 import app.myzel394.alibi.dataStore
 import app.myzel394.alibi.db.AppSettings
 import app.myzel394.alibi.db.NotificationSettings
 import app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.atoms.LandingElement
-import app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.atoms.NotificationPresetSelect
-import app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.molecules.EditNotificationInput
 import app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.organisms.NotificationEditor
+import app.myzel394.alibi.ui.components.atoms.RotateDeviceToPortrait
 import kotlinx.coroutines.launch
 
 @OptIn(ExperimentalMaterial3Api::class)
@@ -81,7 +72,7 @@ fun CustomRecordingNotificationsScreen(
                 navigationIcon = {
                     IconButton(onClick = onBackNavigate) {
                         Icon(
-                            Icons.Default.ArrowBack,
+                            Icons.AutoMirrored.Filled.ArrowBack,
                             contentDescription = "Back"
                         )
                     }
@@ -92,33 +83,50 @@ fun CustomRecordingNotificationsScreen(
         modifier = Modifier
             .nestedScroll(scrollBehavior.nestedScrollConnection)
     ) { padding ->
-        if (showEditor) {
-            val scope = rememberCoroutineScope()
+        val orientation = LocalConfiguration.current.orientation
 
-            NotificationEditor(
-                modifier = Modifier
-                    .padding(padding)
-                    .padding(vertical = 16.dp),
-                onNotificationChange = { notificationSettings ->
-                    scope.launch {
-                        dataStore.updateData { settings ->
-                            settings.setNotificationSettings(notificationSettings.let {
-                                if (it.preset == NotificationSettings.Preset.Default)
-                                    null
-                                else
-                                    it
-                            })
+        when (orientation) {
+            Configuration.ORIENTATION_PORTRAIT -> {
+                if (showEditor) {
+                    val scope = rememberCoroutineScope()
+
+                    NotificationEditor(
+                        modifier = Modifier
+                            .padding(padding)
+                            .padding(vertical = 16.dp),
+                        onNotificationChange = { notificationSettings ->
+                            scope.launch {
+                                dataStore.updateData { settings ->
+                                    settings.setNotificationSettings(notificationSettings.let {
+                                        if (it.preset == NotificationSettings.Preset.Default)
+                                            null
+                                        else
+                                            it
+                                    })
+                                }
+                            }
+                            onBackNavigate()
                         }
-                    }
-                    onBackNavigate()
+                    )
+                } else {
+                    LandingElement(
+                        onOpenEditor = {
+                            showEditor = true
+                        }
+                    )
                 }
-            )
-        } else {
-            LandingElement(
-                onOpenEditor = {
-                    showEditor = true
+            }
+
+            else -> {
+                Box(
+                    modifier = Modifier
+                        .fillMaxSize()
+                        .padding(padding),
+                    contentAlignment = Alignment.Center,
+                ) {
+                    RotateDeviceToPortrait()
                 }
-            )
+            }
         }
     }
 }

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

@@ -1,4 +1,4 @@
-<resources xmlns:android="http://schemas.android.com/apk/res/android" xmlns:xliff="urn:oasis:names:tc:xliff:document:1.2">
+<resources xmlns:xliff="urn:oasis:names:tc:xliff:document:1.2">
     <string name="app_name">Alibi</string>
 
     <string name="dialog_close_cancel_label">Cancel</string>
@@ -189,4 +189,5 @@
     <string name="ui_settings_option_saveFolder_explainMediaFolder_openFolderExplanation">Tap on a folder to open it in the Files app</string>
     <string name="ui_videoRecorder_action_start_settings_cameraLens_unknown_label">Unknown</string>
     <string name="ui_settings_option_saveFolder_explainInternalFolder_explanation">To protect your privacy, Alibi stores its batches into its own private, encrypted storage. This storage is only accessible by Alibi and can\'t be accessed by other apps or by a possible intruder. Once you save the recording, you will be asked where you want to save the recording to.</string>
+    <string name="ui_rotateDevice_portrait_label">Please rotate your device to portait mode</string>
 </resources>