Skip to content

Commit

Permalink
ANDROAPP-6112-Add-warning-color-style-in-Button-component (#236)
Browse files Browse the repository at this point in the history 
* feat: [ANDROAPP-6122] add warning style to Buttons

* feat: [ANDROAPP-6122] add button snapshot test

* test button snapshot

* test snapshot

---------

Co-authored-by: DESKTOP-M49RTHN\cthuc <[email protected]>
Co-authored-by: manu <[email protected]>
  • Loading branch information
@xavimolloy @DavidAparicioAlbaAsenjo @mmmateos
3 people authored May 13, 2024
1 parent 6ce7e9b commit 267c64f
Show file tree
Hide file tree
Showing 4 changed files with 378 additions and 15 deletions.
34 changes: 34 additions & 0 deletions common/src/commonMain/kotlin/org/hisp/dhis/common/screens/buttons/ButtonScreen.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -115,5 +115,39 @@ fun ButtonScreen() {
ButtonPreviewWithIcon("Label", ButtonStyle.TEXT, true, ColorStyle.ERROR)
ButtonPreviewWithIcon("Label", ButtonStyle.TEXT, false, ColorStyle.ERROR)
}
Spacer(Modifier.size(Spacing.Spacing18))

Title("Warning Buttons")
SubTitle("Filled")
RowComponentContainer() {
ButtonPreview("Label", ButtonStyle.FILLED, true, ColorStyle.WARNING)
ButtonPreview("Label", ButtonStyle.FILLED, false, ColorStyle.WARNING)
}
RowComponentContainer {
ButtonPreviewWithIcon("Label", ButtonStyle.FILLED, true, ColorStyle.WARNING)
ButtonPreviewWithIcon("Label", ButtonStyle.FILLED, false, ColorStyle.WARNING)
}

Spacer(Modifier.size(Spacing.Spacing18))
SubTitle("Outlined")
RowComponentContainer() {
ButtonPreview("Label", ButtonStyle.OUTLINED, true, ColorStyle.WARNING)
ButtonPreview("Label", ButtonStyle.OUTLINED, false, ColorStyle.WARNING)
}
RowComponentContainer() {
ButtonPreviewWithIcon("Label", ButtonStyle.OUTLINED, true, ColorStyle.WARNING)
ButtonPreviewWithIcon("Label", ButtonStyle.OUTLINED, false, ColorStyle.WARNING)
}
Spacer(Modifier.size(Spacing.Spacing18))

SubTitle("Text")
RowComponentContainer() {
ButtonPreview("Label", ButtonStyle.TEXT, true, ColorStyle.WARNING)
ButtonPreview("Label", ButtonStyle.TEXT, false, ColorStyle.WARNING)
}
RowComponentContainer() {
ButtonPreviewWithIcon("Label", ButtonStyle.TEXT, true, ColorStyle.WARNING)
ButtonPreviewWithIcon("Label", ButtonStyle.TEXT, false, ColorStyle.WARNING)
}
}
}
284 changes: 284 additions & 0 deletions ...tem/src/androidUnitTest/kotlin/org/hisp/dhis/mobile/ui/designsystem/ButtonSnapshotTest.kt
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,284 @@
package org.hisp.dhis.mobile.ui.designsystem

import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.size
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Add
import androidx.compose.material3.Icon
import androidx.compose.ui.Modifier
import org.hisp.dhis.mobile.ui.designsystem.component.Button
import org.hisp.dhis.mobile.ui.designsystem.component.ButtonStyle
import org.hisp.dhis.mobile.ui.designsystem.component.ColorStyle
import org.hisp.dhis.mobile.ui.designsystem.component.ColumnComponentContainer
import org.hisp.dhis.mobile.ui.designsystem.component.RowComponentContainer
import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle
import org.hisp.dhis.mobile.ui.designsystem.component.Title
import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing
import org.junit.Rule
import org.junit.Test

class ButtonSnapshotTest {

@get:Rule
val paparazzi = paparazzi()

@Test
fun launchButtonSnapshot() {
paparazzi.snapshot {
ColumnComponentContainer() {
Title("Buttons")
SubTitle("Filled")
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.FILLED, onClick = {})
Button(text = "Label", style = ButtonStyle.FILLED, enabled = false, onClick = {})
}
RowComponentContainer {
Button(text = "Label", style = ButtonStyle.FILLED, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
Button(text = "Label", style = ButtonStyle.FILLED, enabled = false, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
}

Spacer(Modifier.size(Spacing.Spacing18))
SubTitle("Outlined")
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.OUTLINED, onClick = {})
Button(text = "Label", style = ButtonStyle.OUTLINED, enabled = false, onClick = {})
}
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.OUTLINED, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
Button(text = "Label", style = ButtonStyle.OUTLINED, enabled = false, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
}
Spacer(Modifier.size(Spacing.Spacing18))

SubTitle("Text")
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.TEXT, enabled = true, onClick = {})
Button(text = "Label", style = ButtonStyle.TEXT, enabled = false, onClick = {})
}
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.TEXT, enabled = true, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
Button(text = "Label", style = ButtonStyle.TEXT, enabled = false, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
}
Spacer(Modifier.size(Spacing.Spacing18))

SubTitle("Elevated")
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.ELEVATED, enabled = true, onClick = {})
Button(text = "Label", style = ButtonStyle.ELEVATED, enabled = false, onClick = {})
}
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.ELEVATED, enabled = true, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
Button(text = "Label", style = ButtonStyle.ELEVATED, enabled = false, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
}
Spacer(Modifier.size(Spacing.Spacing18))

SubTitle("Tonal")
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.TONAL, enabled = true, onClick = {})
Button(text = "Label", style = ButtonStyle.TONAL, enabled = false, onClick = {})
}
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.TONAL, enabled = true, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
Button(text = "Label", style = ButtonStyle.TONAL, enabled = false, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
}
Spacer(Modifier.size(Spacing.Spacing18))

SubTitle("Keyboard")
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.KEYBOARDKEY, onClick = {})
Button(text = "Label", style = ButtonStyle.KEYBOARDKEY, enabled = false, onClick = {})
}
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.KEYBOARDKEY, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
Button(text = "Label", style = ButtonStyle.KEYBOARDKEY, enabled = false, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
}

Title("Error Buttons")
SubTitle("Filled")
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.FILLED, enabled = true, colorStyle = ColorStyle.ERROR, onClick = {})
Button(text = "Label", style = ButtonStyle.FILLED, enabled = false, colorStyle = ColorStyle.ERROR, onClick = {})
}
RowComponentContainer {
Button(text = "Label", style = ButtonStyle.FILLED, enabled = true, colorStyle = ColorStyle.ERROR, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
Button(text = "Label", style = ButtonStyle.FILLED, enabled = false, colorStyle = ColorStyle.ERROR, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
}

Spacer(Modifier.size(Spacing.Spacing18))
SubTitle("Outlined")
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.OUTLINED, enabled = true, colorStyle = ColorStyle.ERROR, onClick = {})
Button(text = "Label", style = ButtonStyle.OUTLINED, enabled = false, colorStyle = ColorStyle.ERROR, onClick = {})
}
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.OUTLINED, enabled = true, colorStyle = ColorStyle.ERROR, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
Button(text = "Label", style = ButtonStyle.OUTLINED, enabled = false, colorStyle = ColorStyle.ERROR, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
}
Spacer(Modifier.size(Spacing.Spacing18))

SubTitle("Text")
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.TEXT, enabled = true, colorStyle = ColorStyle.ERROR, onClick = {})
Button(text = "Label", style = ButtonStyle.TEXT, enabled = false, colorStyle = ColorStyle.ERROR, onClick = {})
}
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.TEXT, enabled = true, colorStyle = ColorStyle.ERROR, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
Button(text = "Label", style = ButtonStyle.TEXT, enabled = false, colorStyle = ColorStyle.ERROR, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
}
Spacer(Modifier.size(Spacing.Spacing18))

Title("Warning Buttons")
SubTitle("Filled")
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.FILLED, enabled = true, colorStyle = ColorStyle.WARNING, onClick = {})
Button(text = "Label", style = ButtonStyle.FILLED, enabled = false, colorStyle = ColorStyle.WARNING, onClick = {})
}
RowComponentContainer {
Button(text = "Label", style = ButtonStyle.FILLED, enabled = true, colorStyle = ColorStyle.WARNING, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
Button(text = "Label", style = ButtonStyle.FILLED, enabled = false, colorStyle = ColorStyle.WARNING, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
}

Spacer(Modifier.size(Spacing.Spacing18))
SubTitle("Outlined")
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.OUTLINED, enabled = true, colorStyle = ColorStyle.WARNING, onClick = {})
Button(text = "Label", style = ButtonStyle.OUTLINED, enabled = false, colorStyle = ColorStyle.WARNING, onClick = {})
}
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.OUTLINED, enabled = true, colorStyle = ColorStyle.WARNING, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
Button(text = "Label", style = ButtonStyle.OUTLINED, enabled = false, colorStyle = ColorStyle.WARNING, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
}
Spacer(Modifier.size(Spacing.Spacing18))

SubTitle("Text")
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.TEXT, enabled = true, colorStyle = ColorStyle.WARNING, onClick = {})
Button(text = "Label", style = ButtonStyle.TEXT, enabled = false, colorStyle = ColorStyle.WARNING, onClick = {})
}
RowComponentContainer() {
Button(text = "Label", style = ButtonStyle.TEXT, enabled = true, colorStyle = ColorStyle.WARNING, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
Button(text = "Label", style = ButtonStyle.TEXT, enabled = false, colorStyle = ColorStyle.WARNING, onClick = {}, icon = {
Icon(
imageVector = Icons.Filled.Add,
contentDescription = "Button",
)
})
}
}
}
}
}
Loading

0 comments on commit 267c64f

Please sign in to comment.