Fix AppBar padding and alignment issues

AppBar was missing a start padding that caused it to extend to the edge of the screen on Compact size classes.

Updated the SearchBar component usage away from the deprecated method version as an internal usage of Modifier.fillMaxWidth in the deprecated method was now causing the AppBar to always fill max width on all Window Size Classes (vs the intended end-aligned smaller version in non-Compact)

Author: Clara Bayarri

Jetcaster/mobile/src/main/java/com/example/jetcaster/ui/home/Home.kt

@@ -58,6 +58,7 @@ import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.SearchBar
+import androidx.compose.material3.SearchBarDefaults
 import androidx.compose.material3.SnackbarHost
 import androidx.compose.material3.SnackbarHostState
 import androidx.compose.material3.Surface
@@ -383,31 +384,39 @@ private fun HomeAppBar(
         modifier = modifier
             .fillMaxWidth()
             .background(Color.Transparent)
-            .padding(end = 16.dp, top = 8.dp, bottom = 8.dp)
+            .padding(end = 16.dp, top = 8.dp, bottom = 8.dp, start = 16.dp)
     ) {
         SearchBar(
-            query = "",
-            onQueryChange = {},
-            placeholder = {
-                Text(stringResource(id = R.string.search_for_a_podcast))
-            },
-            onSearch = {},
-            active = false,
-            onActiveChange = {},
-            leadingIcon = {
-                Icon(
-                    imageVector = Icons.Default.Search,
-                    contentDescription = null
-                )
-            },
-            trailingIcon = {
-                Icon(
-                    imageVector = Icons.Default.AccountCircle,
-                    contentDescription = stringResource(R.string.cd_account)
+            inputField = {
+                SearchBarDefaults.InputField(
+                    query = "",
+                    onQueryChange = {},
+                    onSearch = {},
+                    expanded = false,
+                    onExpandedChange = {},
+                    enabled = true,
+                    placeholder = {
+                        Text(stringResource(id = R.string.search_for_a_podcast))
+                    },
+                    leadingIcon = {
+                        Icon(
+                            imageVector = Icons.Default.Search,
+                            contentDescription = null
+                        )
+                    },
+                    trailingIcon = {
+                        Icon(
+                            imageVector = Icons.Default.AccountCircle,
+                            contentDescription = stringResource(R.string.cd_account)
+                        )
+                    },
+                    interactionSource = null,
+                    modifier = if (isExpanded) Modifier.fillMaxWidth() else Modifier
                 )
             },
-            modifier = if (isExpanded) Modifier else Modifier.fillMaxWidth()
-        ) { }
+            expanded = false,
+            onExpandedChange = {}
+        ) {}
     }
 }