Feature/desktop UI issues

mockzilla-management-ui/mockzilla-desktop/src/commonMain/kotlin/com/apadmi/mockzilla/desktop/ui/DesktopAppRoot.kt

@@ -84,8 +84,9 @@ fun DesktopApp(
             right = rightWidgets,
             middle = middleWidgets(
                 state, openWidgets, onCloseEditor = {
-                    openWidgets.minus(editPresetWidgetId)
-                    openWidgets = openWidgets.minus(createPresetWidgetId)
+                    openWidgets = openWidgets
+                        .minus(editPresetWidgetId)
+                        .minus(createPresetWidgetId)
                 }
             ) {
                 viewModel.setSelectedEndpoint(it)

mockzilla-management-ui/mockzilla-management-ui-common/src/commonMain/kotlin/com/apadmi/mockzilla/ui/ui/common/components/PresetCard.kt

@@ -29,6 +29,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.draw.drawBehind
 import androidx.compose.ui.geometry.CornerRadius
 import androidx.compose.ui.graphics.Color
@@ -108,6 +109,7 @@ internal fun PresetCard(
     strings: Strings.Widgets.EndpointDetails.Presets = LocalStrings.current.widgets.endpointDetails.presets
 ) = Column(
     Modifier.fillMaxWidth()
+        .clip(shape = RoundedCornerShape(12.dp))
         .clickable {
             onClicked(preset)
         }.border(
@@ -268,12 +270,16 @@ private fun ExpandableResponseBody(body: String) {
     var isExpanded by remember { mutableStateOf(false) }
     var canExpand by remember { mutableStateOf(false) }
     Box(
-        Modifier.fillMaxWidth().background(
-            MaterialTheme.colorScheme.surfaceContainerHigh,
-            shape = RoundedCornerShape(8.dp)
-        ).clickable(enabled = canExpand || isExpanded) {
-            isExpanded = !isExpanded
-        },
+        Modifier
+            .fillMaxWidth()
+            .background(
+                color = MaterialTheme.colorScheme.surfaceContainerHigh,
+                shape = RoundedCornerShape(8.dp)
+            )
+            .clip(shape = RoundedCornerShape(8.dp))
+            .clickable(enabled = canExpand || isExpanded) {
+                isExpanded = !isExpanded
+            },
     ) {
         Text(
             modifier = Modifier.padding(8.dp),

mockzilla-management-ui/mockzilla-management-ui-common/src/commonMain/kotlin/com/apadmi/mockzilla/ui/ui/common/widgets/endpoints/createeditpreset/CreateEditPresetViewModel.kt

@@ -61,10 +61,15 @@ class CreateEditPresetViewModel(
                 isSaving = false,
                 statusCode = current?.response?.statusCode.takeIf { isEditing },
                 body = current?.response?.body.takeIf { isEditing },
+                // Always starts as false because we assume plaintext if parsing
+                // the body as JSON fails
+                hasBodyError = false,
                 headers = current?.response?.headers
                     ?.map { State.Editing.RequestHeader(key = it.key, value = it.value) }
                     .takeIf { isEditing } ?: emptyList(),
-                responseType = State.Editing.ResponseType.PlainText,
+                responseType = inferResponseTypeFromBody(
+                    current?.response?.body.takeIf { isEditing }
+                ),
                 variant = variant
             )
         }.fold(
@@ -76,6 +81,17 @@ class CreateEditPresetViewModel(
         )
     }
 
+    private fun inferResponseTypeFromBody(
+        body: String?
+    ): State.Editing.ResponseType {
+        return try {
+            Json.parseToJsonElement(body ?: return State.Editing.ResponseType.PlainText)
+            State.Editing.ResponseType.Json
+        } catch (_: Exception) {
+            State.Editing.ResponseType.PlainText
+        }
+    }
+
     fun save() = viewModelScope.launch {
         val currentState = state.value as? State.Editing ?: return@launch
         val appName = when (Platform.current) {

mockzilla-management-ui/mockzilla-management-ui-common/src/commonMain/kotlin/com/apadmi/mockzilla/ui/ui/common/widgets/endpoints/createeditpreset/components/EditResponseBody.kt

@@ -14,6 +14,7 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.AlignVerticalTop
 import androidx.compose.material.icons.filled.Code
@@ -99,31 +100,33 @@ internal fun EditResponseBody(
             )
 
             Spacer(modifier = Modifier.weight(1f))
-            Icon(
-                modifier = Modifier.height(16.dp),
-                imageVector = when (state.hasBodyError) {
-                    false -> Icons.Default.Done
-                    true -> Icons.Default.ErrorOutline
-                },
-                contentDescription = null,
-                tint = when (state.hasBodyError) {
-                    true -> MaterialTheme.colorScheme.error
-                    false -> MaterialTheme.colorScheme.success.primary
-                }
-            )
 
-            Spacer(modifier = Modifier.height(2.dp))
-            Text(
-                text = when (state.hasBodyError) {
-                    true -> strings.invalidLabel
-                    false -> strings.validLabel
-                },
-                style = MaterialTheme.typography.labelMedium,
-                color = when (state.hasBodyError) {
-                    true -> MaterialTheme.colorScheme.error
-                    false -> MaterialTheme.colorScheme.success.primary
-                }
-            )
+            if (state.responseType == State.Editing.ResponseType.Json) {
+                Icon(
+                    modifier = Modifier.height(16.dp),
+                    imageVector = when (state.hasBodyError) {
+                        false -> Icons.Default.Done
+                        true -> Icons.Default.ErrorOutline
+                    },
+                    contentDescription = null,
+                    tint = when (state.hasBodyError) {
+                        true -> MaterialTheme.colorScheme.error
+                        false -> MaterialTheme.colorScheme.success.primary
+                    }
+                )
+                Spacer(modifier = Modifier.width(2.dp))
+                Text(
+                    text = when (state.hasBodyError) {
+                        true -> strings.invalidLabel
+                        false -> strings.validLabel
+                    },
+                    style = MaterialTheme.typography.labelMedium,
+                    color = when (state.hasBodyError) {
+                        true -> MaterialTheme.colorScheme.error
+                        false -> MaterialTheme.colorScheme.success.primary
+                    }
+                )
+            }
         }
 
         Row(

mockzilla-management-ui/mockzilla-management-ui-common/src/commonMain/kotlin/com/apadmi/mockzilla/ui/ui/common/widgets/endpoints/details/EndpointDetailsWidget.kt

@@ -8,6 +8,7 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.ColumnScope
 import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
@@ -106,11 +107,14 @@ private fun ColumnScope.PopulatedState(
     )
 
     PresetsContainer(
+        modifier = Modifier.padding(horizontal = 12.dp),
         state = state,
         onPresetFilterChanged = onFilterPresetChanged,
         onDefaultPresetSelected = onDefaultPresetSelected,
         onPresetMoreInfoClicked = onPresetMoreInfoClicked
     )
+
+    Spacer(modifier = Modifier.height(8.dp))
 }
 
 @Composable

mockzilla-management-ui/mockzilla-management-ui-common/src/commonMain/kotlin/com/apadmi/mockzilla/ui/ui/common/widgets/endpoints/endpoints/EndpointsWidget.kt

@@ -33,6 +33,7 @@ import androidx.compose.runtime.collectAsState
 import androidx.compose.runtime.getValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
@@ -121,6 +122,7 @@ private fun EndpointCard(
     Row(
         modifier = Modifier
             .fillMaxWidth()
+            .clip(RoundedCornerShape(10.dp))
             .clickable { onEndpointClicked(endpoint.key) }
             .background(
                 color = if (endpoint.fail) {