feat: Add NotificationPresetSelect; Add more presets

app/src/main/java/app/myzel394/alibi/db/AppSettings.kt

@@ -8,7 +8,6 @@ import com.arthenica.ffmpegkit.FFmpegKit
 import com.arthenica.ffmpegkit.ReturnCode
 import kotlinx.serialization.Serializable
 import kotlinx.serialization.json.Json
-import org.json.JSONObject
 import java.io.File
 import java.time.LocalDateTime
 import java.time.format.DateTimeFormatter.ISO_DATE_TIME
@@ -427,23 +426,41 @@ data class NotificationSettings(
         val titleID: Int,
         val messageID: Int,
         val showOngoing: Boolean,
+        val iconID: Int,
     ) {
         data object Default : Preset(
             R.string.ui_audioRecorder_state_recording_title,
             R.string.ui_audioRecorder_state_recording_description,
             true,
+            R.drawable.launcher_monochrome_noopacity,
         )
 
         data object Weather : Preset(
             R.string.ui_audioRecorder_state_recording_fake_weather_title,
             R.string.ui_audioRecorder_state_recording_fake_weather_description,
             false,
+            R.drawable.ic_cloud
         )
 
         data object Player : Preset(
-            R.string.ui_audioRecorder_state_recording_fake_weather_title,
-            R.string.ui_audioRecorder_state_recording_fake_weather_description,
+            R.string.ui_audioRecorder_state_recording_fake_player_title,
+            R.string.ui_audioRecorder_state_recording_fake_player_description,
+            true,
+            R.drawable.ic_note,
+        )
+
+        data object Browser : Preset(
+            R.string.ui_audioRecorder_state_recording_fake_browser_title,
+            R.string.ui_audioRecorder_state_recording_fake_browser_description,
+            true,
+            R.drawable.ic_download,
+        )
+
+        data object VPN : Preset(
+            R.string.ui_audioRecorder_state_recording_fake_vpn_title,
+            R.string.ui_audioRecorder_state_recording_fake_vpn_description,
             false,
+            R.drawable.ic_vpn,
         )
     }
 
@@ -456,5 +473,13 @@ data class NotificationSettings(
                 preset = preset,
             )
         }
+
+        val PRESETS = listOf(
+            Preset.Default,
+            Preset.Weather,
+            Preset.Player,
+            Preset.Browser,
+            Preset.VPN,
+        )
     }
 }

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

@@ -0,0 +1,61 @@
+package app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.atoms
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+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.draw.clip
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.unit.dp
+import app.myzel394.alibi.db.NotificationSettings
+
+@Composable
+fun NotificationPresetSelect(
+    modifier: Modifier = Modifier,
+    preset: NotificationSettings.Preset
+) {
+    Row(
+        verticalAlignment = Alignment.CenterVertically,
+        horizontalArrangement = Arrangement.spacedBy(16.dp),
+        modifier = Modifier
+            .clip(MaterialTheme.shapes.large)
+            .background(MaterialTheme.colorScheme.surfaceVariant.copy(alpha = 0.4f))
+            .border(
+                width = 1.dp,
+                shape = MaterialTheme.shapes.large,
+                color = MaterialTheme.colorScheme.outline.copy(alpha = 0.4f)
+            )
+            .padding(horizontal = 16.dp, vertical = 8.dp)
+            .then(modifier),
+    ) {
+        PreviewIcon(
+            modifier = Modifier.size(32.dp),
+            painter = painterResource(id = preset.iconID),
+        )
+        Column(
+            horizontalAlignment = Alignment.Start,
+            verticalArrangement = Arrangement.spacedBy(4.dp),
+        ) {
+            Text(
+                text = stringResource(preset.titleID),
+                style = MaterialTheme.typography.titleMedium,
+                fontWeight = FontWeight.Bold,
+            )
+            Text(
+                text = stringResource(preset.messageID),
+                style = MaterialTheme.typography.bodyMedium,
+                fontWeight = FontWeight.Normal,
+            )
+        }
+    }
+}

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

@@ -0,0 +1,42 @@
+package app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.atoms
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.graphics.painter.Painter
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.unit.dp
+import app.myzel394.alibi.R
+
+@Composable
+fun PreviewIcon(
+    modifier: Modifier = Modifier,
+    painter: Painter,
+) {
+    Column(
+        horizontalAlignment = Alignment.CenterHorizontally,
+        verticalArrangement = Arrangement.Center,
+        modifier = Modifier
+            .then(modifier)
+            .clip(CircleShape)
+            .background(MaterialTheme.colorScheme.secondary)
+            .padding(1.dp)
+    ) {
+        Image(
+            painter = painter,
+            contentDescription = null,
+            colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.onPrimary),
+        )
+    }
+}

app/src/main/java/app/myzel394/alibi/ui/components/CustomRecordingNotificationsScreen/molecules/EditNotificationInput.kt

@@ -1,4 +1,4 @@
-package app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.atoms
+package app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.molecules
 
 import androidx.compose.animation.core.animateFloatAsState
 import androidx.compose.animation.core.tween
@@ -41,6 +41,7 @@ import androidx.compose.ui.text.input.ImeAction
 import androidx.compose.ui.text.input.KeyboardType
 import androidx.compose.ui.unit.dp
 import app.myzel394.alibi.R
+import app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.atoms.PreviewIcon
 import app.myzel394.alibi.ui.effects.rememberForceUpdate
 import com.maxkeppeler.sheets.input.models.InputText
 import java.time.Duration
@@ -72,19 +73,11 @@ fun EditNotificationInput(
     ) {
         val headlineSize = 22.dp
 
-        Box(
-            modifier = Modifier
-                .size(headlineSize)
-                .clip(CircleShape)
-                .background(MaterialTheme.colorScheme.secondary)
-                .padding(1.dp),
-        ) {
-            Image(
-                painter = painterResource(id = R.drawable.launcher_foreground),
-                contentDescription = null,
-                colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.onPrimary),
-            )
-        }
+        PreviewIcon(
+            modifier = Modifier.size(headlineSize),
+            painter = painterResource(id = R.drawable.launcher_foreground)
+        )
+
         Column(
             horizontalAlignment = Alignment.Start,
             verticalArrangement = Arrangement.spacedBy(16.dp),

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

@@ -1,33 +1,25 @@
 package app.myzel394.alibi.ui.screens
 
-import androidx.compose.animation.AnimatedVisibility
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.rememberScrollState
-import androidx.compose.foundation.verticalScroll
+import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.ArrowBack
-import androidx.compose.material3.Divider
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
-import androidx.compose.material3.LargeTopAppBar
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
-import androidx.compose.material3.Snackbar
-import androidx.compose.material3.SnackbarHost
 import androidx.compose.material3.Text
 import androidx.compose.material3.TopAppBar
 import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.material3.rememberTopAppBarState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.collectAsState
-import androidx.compose.runtime.rememberCoroutineScope
-import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.input.nestedscroll.nestedScroll
 import androidx.compose.ui.platform.LocalContext
@@ -37,24 +29,9 @@ import androidx.navigation.NavController
 import app.myzel394.alibi.R
 import app.myzel394.alibi.dataStore
 import app.myzel394.alibi.db.AppSettings
-import app.myzel394.alibi.ui.SUPPORTS_DARK_MODE_NATIVELY
-import app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.atoms.EditNotificationInput
-import app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.atoms.LandingElement
-import app.myzel394.alibi.ui.components.SettingsScreen.atoms.BitrateTile
-import app.myzel394.alibi.ui.components.SettingsScreen.atoms.CustomNotificationTile
-import app.myzel394.alibi.ui.components.SettingsScreen.atoms.EncoderTile
-import app.myzel394.alibi.ui.components.SettingsScreen.atoms.ForceExactMaxDurationTile
-import app.myzel394.alibi.ui.components.SettingsScreen.atoms.ImportExport
-import app.myzel394.alibi.ui.components.SettingsScreen.atoms.InAppLanguagePicker
-import app.myzel394.alibi.ui.components.SettingsScreen.atoms.IntervalDurationTile
-import app.myzel394.alibi.ui.components.SettingsScreen.atoms.MaxDurationTile
-import app.myzel394.alibi.ui.components.SettingsScreen.atoms.OutputFormatTile
-import app.myzel394.alibi.ui.components.SettingsScreen.atoms.SamplingRateTile
-import app.myzel394.alibi.ui.components.SettingsScreen.atoms.ThemeSelector
-import app.myzel394.alibi.ui.components.atoms.GlobalSwitch
-import app.myzel394.alibi.ui.components.atoms.MessageBox
-import app.myzel394.alibi.ui.components.atoms.MessageType
-import kotlinx.coroutines.launch
+import app.myzel394.alibi.db.NotificationSettings
+import app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.atoms.NotificationPresetSelect
+import app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.molecules.EditNotificationInput
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
@@ -93,10 +70,12 @@ fun CustomRecordingNotificationsScreen(
     ) { padding ->
         if (settings.notificationSettings == null) {
         }
-        Box(
+        Column(
             modifier = Modifier
+                .fillMaxSize()
                 .padding(padding)
-                .padding(vertical = 64.dp)
+                .padding(vertical = 64.dp, horizontal = 16.dp),
+            verticalArrangement = Arrangement.SpaceBetween,
         ) {
             EditNotificationInput(
                 modifier = Modifier
@@ -109,7 +88,22 @@ fun CustomRecordingNotificationsScreen(
                 onTitleChange = {},
                 onDescriptionChange = {},
             )
+            LazyColumn(
+                verticalArrangement = Arrangement.spacedBy(8.dp),
+            ) {
+                items(NotificationSettings.PRESETS.size) {
+                    val preset = NotificationSettings.PRESETS[it]
 
+                    NotificationPresetSelect(
+                        modifier = Modifier
+                            .fillMaxWidth()
+                            .clickable {
+
+                            },
+                        preset = preset,
+                    )
+                }
+            }
         }
     }
 }

app/src/main/res/drawable/ic_cloud.xml

@@ -0,0 +1,5 @@
+<vector android:height="24dp" android:tint="#000000"
+    android:viewportHeight="24" android:viewportWidth="24"
+    android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="@android:color/white" android:pathData="M19.35,10.04C18.67,6.59 15.64,4 12,4 9.11,4 6.6,5.64 5.35,8.04 2.34,8.36 0,10.91 0,14c0,3.31 2.69,6 6,6h13c2.76,0 5,-2.24 5,-5 0,-2.64 -2.05,-4.78 -4.65,-4.96z"/>
+</vector>

app/src/main/res/drawable/ic_download.xml

@@ -0,0 +1,5 @@
+<vector android:height="24dp" android:tint="#000000"
+    android:viewportHeight="24" android:viewportWidth="24"
+    android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="@android:color/white" android:pathData="M19,9h-4V3H9v6H5l7,7 7,-7zM5,18v2h14v-2H5z"/>
+</vector>

app/src/main/res/drawable/ic_note.xml

@@ -0,0 +1,5 @@
+<vector android:height="24dp" android:tint="#000000"
+    android:viewportHeight="24" android:viewportWidth="24"
+    android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="@android:color/white" android:pathData="M12,3v10.55c-0.59,-0.34 -1.27,-0.55 -2,-0.55 -2.21,0 -4,1.79 -4,4s1.79,4 4,4 4,-1.79 4,-4V7h4V3h-6z"/>
+</vector>

app/src/main/res/drawable/ic_vpn.xml

@@ -0,0 +1,5 @@
+<vector android:height="24dp" android:tint="#000000"
+    android:viewportHeight="24" android:viewportWidth="24"
+    android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="@android:color/white" android:pathData="M12.65,10C11.83,7.67 9.61,6 7,6c-3.31,0 -6,2.69 -6,6s2.69,6 6,6c2.61,0 4.83,-1.67 5.65,-4H17v4h4v-4h2v-4H12.65zM7,14c-1.1,0 -2,-0.9 -2,-2s0.9,-2 2,-2 2,0.9 2,2 -0.9,2 -2,2z"/>
+</vector>

app/src/main/res/drawable/launcher_monochrome_noopacity.xml

@@ -0,0 +1,10 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="250dp"
+    android:height="250dp"
+    android:viewportWidth="250"
+    android:viewportHeight="250">
+  <path
+      android:pathData="M191,125C191,161.45 161.45,191 125,191C88.55,191 59,161.45 59,125C59,88.55 88.55,59 125,59C161.45,59 191,88.55 191,125ZM110,137C110,142.52 105.52,147 100,147C94.48,147 90,142.52 90,137C90,131.48 94.48,127 100,127C105.52,127 110,131.48 110,137ZM150,147C155.52,147 160,142.52 160,137C160,131.48 155.52,127 150,127C144.48,127 140,131.48 140,137C140,142.52 144.48,147 150,147Z"
+      android:fillColor="#000000"
+      android:fillType="evenOdd"/>
+</vector>

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

@@ -78,4 +78,10 @@
     <string name="ui_settings_customNotifications_landing_description">Due to Android\'s restrictions, Alibi has to show a notification while recording. To hide the fact that you\'re using Alibi, you can customize the notification.</string>
     <string name="ui_settings_customNotifications_landing_help_hideNotifications">Alternatively, you can also simply disable notifications</string>
     <string name="ui_settings_customNotifications_landing_getStarted">Create own notification</string>
+    <string name="ui_audioRecorder_state_recording_fake_player_title">Playing Audio</string>
+    <string name="ui_audioRecorder_state_recording_fake_player_description">Now playing: Despacito</string>
+    <string name="ui_audioRecorder_state_recording_fake_browser_title">Downloading attachments.zip</string>
+    <string name="ui_audioRecorder_state_recording_fake_browser_description">Downloading file...</string>
+    <string name="ui_audioRecorder_state_recording_fake_vpn_title">Connected to VPN</string>
+    <string name="ui_audioRecorder_state_recording_fake_vpn_description">Connection Secured</string>
 </resources>