From 13624320e5dc3ae9db2c6ce057f205ed6740b7f4 Mon Sep 17 00:00:00 2001
From: Maxime Vincent <git@maximevincent.com>
Date: Fri, 9 Jun 2023 00:35:24 -0400
Subject: [PATCH] Change badge component from Badge to Box (#459)

* Change badge component from Badge to Box

This allows to customize the shape. I also changed the color of the text to OnTertiary to avoid contrast issues.

* Fix formatting

* refactor: create TextBadge component

* Modify attributes for TextBadge

Add default values and add padding values

* gradle kotlin formatting

* Add section in settings to edit TextBadge corner radius

* kotlin formatting

* Revert "kotlin formatting"

This reverts commit 1425c7dc8fc79b0bc476ffaaa7139d82db19f1d5.

* Revert "Add section in settings to edit TextBadge corner radius"

This reverts commit f9222a21d4d72b00fe333577cf5bb991041e2907.
---
 .../jerboa/ui/components/common/TextBadge.kt  | 42 +++++++++++++++++++
 .../ui/components/person/PersonProfileLink.kt | 13 +-----
 2 files changed, 44 insertions(+), 11 deletions(-)
 create mode 100644 app/src/main/java/com/jerboa/ui/components/common/TextBadge.kt

diff --git a/app/src/main/java/com/jerboa/ui/components/common/TextBadge.kt b/app/src/main/java/com/jerboa/ui/components/common/TextBadge.kt
new file mode 100644
index 000000000..f3199a2bc
--- /dev/null
+++ b/app/src/main/java/com/jerboa/ui/components/common/TextBadge.kt
@@ -0,0 +1,42 @@
+package com.jerboa.ui.components.common
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.dp
+
+@Composable
+fun TextBadge(
+    text: String,
+    verticalTextPadding: Float = 0f,
+    horizontalTextPadding: Float = 6f,
+    textColor: Color = MaterialTheme.colorScheme.onTertiary,
+    textStyle: TextStyle,
+    containerColor: Color = MaterialTheme.colorScheme.tertiary,
+    containerRadius: Float = 4f,
+) {
+    Box(
+        modifier = Modifier
+            .clip(RoundedCornerShape(containerRadius.dp))
+            .background(containerColor),
+    ) {
+        Text(
+            text = text,
+            style = textStyle,
+            overflow = TextOverflow.Clip,
+            maxLines = 1,
+            color = textColor,
+            modifier = Modifier
+                .padding(horizontalTextPadding.dp, verticalTextPadding.dp),
+        )
+    }
+}
diff --git a/app/src/main/java/com/jerboa/ui/components/person/PersonProfileLink.kt b/app/src/main/java/com/jerboa/ui/components/person/PersonProfileLink.kt
index 571be6a33..9f3c46887 100644
--- a/app/src/main/java/com/jerboa/ui/components/person/PersonProfileLink.kt
+++ b/app/src/main/java/com/jerboa/ui/components/person/PersonProfileLink.kt
@@ -7,7 +7,6 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Row
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.outlined.*
-import androidx.compose.material3.Badge
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
@@ -22,6 +21,7 @@ import com.jerboa.datatypes.PersonSafe
 import com.jerboa.datatypes.samplePersonSafe
 import com.jerboa.personNameShown
 import com.jerboa.ui.components.common.CircularIcon
+import com.jerboa.ui.components.common.TextBadge
 import com.jerboa.ui.theme.SMALL_PADDING
 
 @Composable
@@ -34,16 +34,7 @@ fun PersonName(
     val style = MaterialTheme.typography.bodyMedium
 
     if (isPostCreator) {
-        Badge(
-            containerColor = MaterialTheme.colorScheme.tertiary,
-        ) {
-            Text(
-                text = name,
-                style = style,
-                overflow = TextOverflow.Clip,
-                maxLines = 1,
-            )
-        }
+        TextBadge(text = name, textStyle = style)
     } else {
         Text(
             text = name,