Skip to content

Commit 99628f9

Browse files
Add Button and IconButton components with hand cursor and migrate existing usages (#10)
* Initial plan * Add Button and IconButton components with hand cursor Co-authored-by: FabiPunktExe <66797305+FabiPunktExe@users.noreply.github.com> * Apply hand cursor only when button is enabled Co-authored-by: FabiPunktExe <66797305+FabiPunktExe@users.noreply.github.com> * Update all Button and IconButton usages to use new wrapper components Co-authored-by: FabiPunktExe <66797305+FabiPunktExe@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: FabiPunktExe <66797305+FabiPunktExe@users.noreply.github.com>
1 parent b349986 commit 99628f9

File tree

5 files changed

+117
-12
lines changed

5 files changed

+117
-12
lines changed

composeApp/src/commonMain/kotlin/diruptio/aquarium/ui/ContainerView.kt

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,15 +6,11 @@ import androidx.compose.foundation.layout.Row
66
import androidx.compose.foundation.layout.padding
77
import androidx.compose.material.icons.Icons
88
import androidx.compose.material.icons.filled.Edit
9-
import androidx.compose.material3.Button
109
import androidx.compose.material3.Icon
11-
import androidx.compose.material3.IconButton
1210
import androidx.compose.material3.Text
1311
import androidx.compose.runtime.*
1412
import androidx.compose.ui.Alignment
1513
import androidx.compose.ui.Modifier
16-
import androidx.compose.ui.input.pointer.PointerIcon
17-
import androidx.compose.ui.input.pointer.pointerHoverIcon
1814
import androidx.compose.ui.unit.dp
1915
import diruptio.aquarium.core.Platform
2016
import diruptio.aquarium.ui.component.*
@@ -79,7 +75,7 @@ fun ContainerView(platform: Platform,
7975
cell(horizontalArrangement = Arrangement.SpaceBetween) {
8076
Title("Status")
8177
if (container.getStatus().isOnline) {
82-
IconButton({ editing = true }, Modifier.pointerHoverIcon(PointerIcon.Hand)) {
78+
IconButton({ editing = true }) {
8379
Icon(imageVector = Icons.Filled.Edit, contentDescription = null)
8480
}
8581
}

composeApp/src/commonMain/kotlin/diruptio/aquarium/ui/FishDialog.kt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@ package diruptio.aquarium.ui
33
import androidx.compose.foundation.layout.Arrangement
44
import androidx.compose.foundation.layout.Row
55
import androidx.compose.foundation.layout.padding
6-
import androidx.compose.material3.Button
76
import androidx.compose.material3.MaterialTheme
87
import androidx.compose.material3.OutlinedTextField
98
import androidx.compose.material3.Text
@@ -12,6 +11,7 @@ import androidx.compose.ui.Modifier
1211
import androidx.compose.ui.text.input.PasswordVisualTransformation
1312
import androidx.compose.ui.unit.dp
1413
import diruptio.aquarium.core.Fish
14+
import diruptio.aquarium.ui.component.Button
1515
import diruptio.aquarium.ui.component.Dialog
1616
import kotlinx.coroutines.CoroutineScope
1717
import kotlinx.coroutines.launch

composeApp/src/commonMain/kotlin/diruptio/aquarium/ui/GroupView.kt

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -10,13 +10,13 @@ import androidx.compose.material3.*
1010
import androidx.compose.runtime.*
1111
import androidx.compose.ui.Alignment
1212
import androidx.compose.ui.Modifier
13-
import androidx.compose.ui.input.pointer.PointerIcon
14-
import androidx.compose.ui.input.pointer.pointerHoverIcon
1513
import androidx.compose.ui.text.input.KeyboardType
1614
import androidx.compose.ui.unit.dp
1715
import diruptio.aquarium.core.Platform
16+
import diruptio.aquarium.ui.component.Button
1817
import diruptio.aquarium.ui.component.CopyButton
1918
import diruptio.aquarium.ui.component.Headline
19+
import diruptio.aquarium.ui.component.IconButton
2020
import diruptio.aquarium.ui.component.Table
2121
import diruptio.aquarium.ui.component.Title
2222
import diruptio.verticallyspinningfish.Group
@@ -78,7 +78,7 @@ fun GroupView(
7878
cell(horizontalArrangement = Arrangement.SpaceBetween) {
7979
Title("Minimum Instance Count")
8080
if (!editing) {
81-
IconButton({ editing = true }, Modifier.pointerHoverIcon(PointerIcon.Hand)) {
81+
IconButton({ editing = true }) {
8282
Icon(imageVector = Icons.Filled.Edit, contentDescription = null)
8383
}
8484
}
@@ -132,7 +132,7 @@ fun GroupView(
132132
cell(horizontalArrangement = Arrangement.SpaceBetween) {
133133
Title("Minimum Port")
134134
if (!editing) {
135-
IconButton({ editing = true }, Modifier.pointerHoverIcon(PointerIcon.Hand)) {
135+
IconButton({ editing = true }) {
136136
Icon(imageVector = Icons.Filled.Edit, contentDescription = null)
137137
}
138138
}
@@ -172,7 +172,7 @@ fun GroupView(
172172
cell(horizontalArrangement = Arrangement.SpaceBetween) {
173173
Title("Delete on Stop")
174174
if (!editing) {
175-
IconButton({ editing = true }, Modifier.pointerHoverIcon(PointerIcon.Hand)) {
175+
IconButton({ editing = true }) {
176176
Icon(imageVector = Icons.Filled.Edit, contentDescription = null)
177177
}
178178
}
@@ -208,7 +208,7 @@ fun GroupView(
208208
cell(horizontalArrangement = Arrangement.SpaceBetween) {
209209
Title("Tags")
210210
if (!editing) {
211-
IconButton({ editing = true }, Modifier.pointerHoverIcon(PointerIcon.Hand)) {
211+
IconButton({ editing = true }) {
212212
Icon(imageVector = Icons.Filled.Edit, contentDescription = null)
213213
}
214214
}
Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
package diruptio.aquarium.ui.component
2+
3+
import androidx.compose.foundation.BorderStroke
4+
import androidx.compose.foundation.interaction.MutableInteractionSource
5+
import androidx.compose.foundation.layout.PaddingValues
6+
import androidx.compose.foundation.layout.RowScope
7+
import androidx.compose.material3.ButtonColors
8+
import androidx.compose.material3.ButtonDefaults
9+
import androidx.compose.material3.ButtonElevation
10+
import androidx.compose.runtime.Composable
11+
import androidx.compose.runtime.remember
12+
import androidx.compose.ui.Modifier
13+
import androidx.compose.ui.graphics.Shape
14+
import androidx.compose.ui.input.pointer.PointerIcon
15+
import androidx.compose.ui.input.pointer.pointerHoverIcon
16+
import androidx.compose.material3.Button as MaterialButton
17+
18+
/**
19+
* A Button component that wraps Material3 Button with a hand cursor on hover when enabled.
20+
*
21+
* @param onClick The callback to be invoked when the button is clicked
22+
* @param modifier The modifier to be applied to the button
23+
* @param enabled Controls the enabled state of the button
24+
* @param shape The shape of the button
25+
* @param colors The colors of the button
26+
* @param elevation The elevation of the button
27+
* @param border The border of the button
28+
* @param contentPadding The padding of the content
29+
* @param interactionSource The interaction source for the button
30+
* @param content The content of the button
31+
*/
32+
@Composable
33+
fun Button(
34+
onClick: () -> Unit,
35+
modifier: Modifier = Modifier,
36+
enabled: Boolean = true,
37+
shape: Shape = ButtonDefaults.shape,
38+
colors: ButtonColors = ButtonDefaults.buttonColors(),
39+
elevation: ButtonElevation? = ButtonDefaults.buttonElevation(),
40+
border: BorderStroke? = null,
41+
contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
42+
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
43+
content: @Composable RowScope.() -> Unit
44+
) {
45+
val buttonModifier = if (enabled) {
46+
modifier.pointerHoverIcon(PointerIcon.Hand)
47+
} else {
48+
modifier
49+
}
50+
51+
MaterialButton(
52+
onClick = onClick,
53+
modifier = buttonModifier,
54+
enabled = enabled,
55+
shape = shape,
56+
colors = colors,
57+
elevation = elevation,
58+
border = border,
59+
contentPadding = contentPadding,
60+
interactionSource = interactionSource,
61+
content = content
62+
)
63+
}
Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
package diruptio.aquarium.ui.component
2+
3+
import androidx.compose.foundation.interaction.MutableInteractionSource
4+
import androidx.compose.material3.IconButtonColors
5+
import androidx.compose.material3.IconButtonDefaults
6+
import androidx.compose.runtime.Composable
7+
import androidx.compose.runtime.remember
8+
import androidx.compose.ui.Modifier
9+
import androidx.compose.ui.input.pointer.PointerIcon
10+
import androidx.compose.ui.input.pointer.pointerHoverIcon
11+
import androidx.compose.material3.IconButton as MaterialIconButton
12+
13+
/**
14+
* An IconButton component that wraps Material3 IconButton with a hand cursor on hover when enabled.
15+
*
16+
* @param onClick The callback to be invoked when the button is clicked
17+
* @param modifier The modifier to be applied to the button
18+
* @param enabled Controls the enabled state of the button
19+
* @param colors The colors of the button
20+
* @param interactionSource The interaction source for the button
21+
* @param content The content of the button (typically an Icon)
22+
*/
23+
@Composable
24+
fun IconButton(
25+
onClick: () -> Unit,
26+
modifier: Modifier = Modifier,
27+
enabled: Boolean = true,
28+
colors: IconButtonColors = IconButtonDefaults.iconButtonColors(),
29+
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
30+
content: @Composable () -> Unit
31+
) {
32+
val buttonModifier = if (enabled) {
33+
modifier.pointerHoverIcon(PointerIcon.Hand)
34+
} else {
35+
modifier
36+
}
37+
38+
MaterialIconButton(
39+
onClick = onClick,
40+
modifier = buttonModifier,
41+
enabled = enabled,
42+
colors = colors,
43+
interactionSource = interactionSource,
44+
content = content
45+
)
46+
}

0 commit comments

Comments
 (0)