Refactor: Introduce SquareButton and SquareElevatedButton components for consistent button styling

This commit adds two new composable functions, SquareButton and SquareElevatedButton, to standardize button styling across the application. The new components encapsulate the button shape and styling, promoting code reuse and cleaner UI implementation.

- Created SquareButton for standard button functionality with customizable onClick and content.
- Created SquareElevatedButton for elevated button functionality with similar customization options.
- Replaced instances of Button and ElevatedButton in various screens with the new SquareButton and SquareElevatedButton components for consistency and improved maintainability.

app/src/main/java/chat/revolt/composables/generic/SquareButton.kt

@@ -0,0 +1,51 @@
+package chat.revolt.composables.generic
+
+import androidx.compose.foundation.shape.CornerSize
+import androidx.compose.material3.Button
+import androidx.compose.material3.ElevatedButton
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+
+@Composable
+fun SquareButton(
+    onClick: () -> Unit,
+    modifier: Modifier = Modifier,
+    enabled: Boolean = true,
+    content: @Composable () -> Unit
+) {
+    Button(
+        onClick = onClick,
+        modifier = modifier,
+        enabled = enabled,
+        shape = MaterialTheme.shapes.small.copy(
+            topStart = CornerSize(8.dp),
+            topEnd = CornerSize(8.dp),
+            bottomStart = CornerSize(8.dp),
+            bottomEnd = CornerSize(8.dp)
+        )
+    ) {
+        content()
+    }
+}
+
+@Composable
+fun SquareElevatedButton(
+    onClick: () -> Unit,
+    modifier: Modifier = Modifier,
+    content: @Composable () -> Unit
+) {
+    ElevatedButton(
+        onClick = onClick,
+        modifier = modifier,
+        shape = MaterialTheme.shapes.small.copy(
+            topStart = CornerSize(8.dp),
+            topEnd = CornerSize(8.dp),
+            bottomStart = CornerSize(8.dp),
+            bottomEnd = CornerSize(8.dp)
+        )
+    ) {
+        content()
+    }
+}

app/src/main/java/chat/revolt/composables/screens/chat/drawer/ChannelSideDrawer.kt

@@ -36,7 +36,6 @@ import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.CornerSize
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material3.Button
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.ExperimentalMaterial3ExpressiveApi
 import androidx.compose.material3.FloatingActionButton
@@ -70,8 +69,8 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.text.style.TextOverflow
-import androidx.compose.ui.unit.dp
 import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import chat.revolt.R
 import chat.revolt.api.RevoltAPI
@@ -90,6 +89,7 @@ import chat.revolt.api.settings.SyncedSettings
 import chat.revolt.composables.generic.GroupIcon
 import chat.revolt.composables.generic.IconPlaceholder
 import chat.revolt.composables.generic.RemoteImage
+import chat.revolt.composables.generic.SquareButton
 import chat.revolt.composables.generic.UserAvatar
 import chat.revolt.composables.generic.presenceFromStatus
 import chat.revolt.composables.screens.chat.ChannelIcon
@@ -738,16 +738,10 @@ private fun ColumnScope.DirectMessagesChannelListRenderer(
                         textAlign = TextAlign.Center
                     )
                     Spacer(Modifier.height(16.dp))
-                    Button(
+                    SquareButton(
                         onClick = {
                             onDestinationChanged(ChatRouterDestination.Friends)
                         },
-                        shape = MaterialTheme.shapes.small.copy(
-                            topStart = CornerSize(8.dp),
-                            topEnd = CornerSize(8.dp),
-                            bottomStart = CornerSize(8.dp),
-                            bottomEnd = CornerSize(8.dp)
-                        )
                     ) {
                         Text(text = stringResource(R.string.new_conversation))
                     }

app/src/main/java/chat/revolt/screens/chooseplatform/ChoosePlatformScreen.kt

@@ -13,9 +13,7 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.safeDrawingPadding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.rememberScrollState
-import androidx.compose.foundation.shape.CornerSize
 import androidx.compose.foundation.verticalScroll
-import androidx.compose.material3.Button
 import androidx.compose.material3.Card
 import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
@@ -37,6 +35,7 @@ import androidx.navigation.NavController
 import chat.revolt.R
 import chat.revolt.api.ApplicationPlatform
 import chat.revolt.api.RevoltAPI
+import chat.revolt.composables.generic.SquareButton
 
 @Composable
 fun ChoosePlatformScreen(navController: NavController) {
@@ -191,7 +190,7 @@ fun ChoosePlatformScreen(navController: NavController) {
                 .fillMaxWidth()
                 .padding(vertical = 8.dp)
         )
-        Button(
+        SquareButton(
             onClick = {
                 if(apiUrlValue.value.isNotEmpty()){
                     when(apiUrlValue.value){
@@ -201,7 +200,7 @@ fun ChoosePlatformScreen(navController: NavController) {
                         ApplicationPlatform.REVOLT.baseUrl -> RevoltAPI.setPlatform(
                             ApplicationPlatform.REVOLT
                         )
-                        else -> return@Button
+                        else -> return@SquareButton
                     }
                 }
                 navController.navigate("login/greeting")
@@ -210,12 +209,6 @@ fun ChoosePlatformScreen(navController: NavController) {
                 .padding(top = 32.dp, bottom = 16.dp)
                 .fillMaxWidth()
                 .testTag("confirm_platform_button"),
-            shape = MaterialTheme.shapes.small.copy(
-                topStart = CornerSize(8.dp),
-                topEnd = CornerSize(8.dp),
-                bottomStart = CornerSize(8.dp),
-                bottomEnd = CornerSize(8.dp)
-            )
         ) {
             Text(text = stringResource(R.string.confirm))
         }

app/src/main/java/chat/revolt/screens/login/LoginGreetingScreen.kt

@@ -14,9 +14,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.safeDrawingPadding
-import androidx.compose.foundation.shape.CornerSize
-import androidx.compose.material3.Button
-import androidx.compose.material3.ElevatedButton
 import androidx.compose.material3.LocalContentColor
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
@@ -36,12 +33,14 @@ import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import androidx.compose.ui.tooling.preview.Preview
 import androidx.navigation.NavController
-import chat.revolt.R
 import androidx.navigation.compose.rememberNavController
+import chat.revolt.R
+import chat.revolt.composables.generic.SquareButton
+import chat.revolt.composables.generic.SquareElevatedButton
 
 @OptIn(ExperimentalFoundationApi::class)
 @Composable
@@ -129,34 +128,22 @@ fun LoginGreetingScreen(navController: NavController) {
 
             Spacer(modifier = Modifier.height(32.dp))
 
-            Button(
+            SquareButton(
                 onClick = { navController.navigate("login/login") },
                 modifier = Modifier
                     .fillMaxWidth()
                     .testTag("view_login_page_button"),
-                shape = MaterialTheme.shapes.small.copy(
-                    topStart = CornerSize(8.dp),
-                    topEnd = CornerSize(8.dp),
-                    bottomStart = CornerSize(8.dp),
-                    bottomEnd = CornerSize(8.dp)
-                )
             ) {
                 Text(text = stringResource(R.string.login))
             }
 
             Spacer(modifier = Modifier.height(5.dp))
 
-            ElevatedButton(
+            SquareElevatedButton(
                 onClick = { navController.navigate("register/details") },
                 modifier = Modifier
                     .fillMaxWidth()
                     .testTag("view_signup_page_button"),
-                shape = MaterialTheme.shapes.small.copy(
-                    topStart = CornerSize(8.dp),
-                    topEnd = CornerSize(8.dp),
-                    bottomStart = CornerSize(8.dp),
-                    bottomEnd = CornerSize(8.dp)
-                )
             ) {
                 Text(text = stringResource(R.string.signup))
             }

app/src/main/java/chat/revolt/screens/login/LoginScreen.kt

@@ -13,10 +13,8 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.imePadding
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.foundation.shape.CornerSize
 import androidx.compose.foundation.text.input.TextObfuscationMode
 import androidx.compose.foundation.text.input.rememberTextFieldState
-import androidx.compose.material3.Button
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.HorizontalDivider
 import androidx.compose.material3.Icon
@@ -58,6 +56,7 @@ import chat.revolt.api.routes.account.EmailPasswordAssessment
 import chat.revolt.api.routes.account.negotiateAuthentication
 import chat.revolt.api.routes.onboard.needsOnboarding
 import chat.revolt.composables.generic.FormTextField
+import chat.revolt.composables.generic.SquareButton
 import chat.revolt.composables.generic.Weblink
 import chat.revolt.persistence.KVStorage
 import chat.revolt.ui.theme.FragmentMono
@@ -337,19 +336,13 @@ fun LoginScreen(navController: NavController, viewModel: LoginViewModel = hiltVi
                 )
                 Spacer(modifier = Modifier.height(32.dp))
 
-                Button(
+                SquareButton(
                     onClick = {
                         viewModel.doLogin()
                     },
                     modifier = Modifier
                         .fillMaxWidth()
                         .testTag("confirm_platform_button"),
-                    shape = MaterialTheme.shapes.small.copy(
-                        topStart = CornerSize(8.dp),
-                        topEnd = CornerSize(8.dp),
-                        bottomStart = CornerSize(8.dp),
-                        bottomEnd = CornerSize(8.dp)
-                    )
                 ) {
                     Text(text = stringResource(R.string.login))
                 }

app/src/main/java/chat/revolt/screens/register/OnboardingScreen.kt

@@ -12,7 +12,6 @@ import androidx.compose.foundation.layout.imeNestedScroll
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.safeDrawingPadding
 import androidx.compose.foundation.layout.size
-import androidx.compose.material3.Button
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@@ -35,6 +34,7 @@ import chat.revolt.R
 import chat.revolt.api.routes.onboard.OnboardingCompletionBody
 import chat.revolt.api.routes.onboard.completeOnboarding
 import chat.revolt.composables.generic.FormTextField
+import chat.revolt.composables.generic.SquareButton
 import chat.revolt.persistence.KVStorage
 import kotlinx.coroutines.launch
 
@@ -168,7 +168,7 @@ fun OnboardingScreen(navController: NavController, onOnboardingComplete: () -> U
                     label = stringResource(R.string.onboarding_username)
                 )
                 Spacer(modifier = Modifier.height(32.dp))
-                Button(
+                SquareButton(
                     modifier = Modifier.fillMaxWidth(),
                     onClick = {
                         coroutineScope.launch {
@@ -176,12 +176,6 @@ fun OnboardingScreen(navController: NavController, onOnboardingComplete: () -> U
                         }
                     },
                     enabled = username.value.isNotBlank(),
-                    shape = MaterialTheme.shapes.small.copy(
-                        topStart = androidx.compose.foundation.shape.CornerSize(8.dp),
-                        topEnd = androidx.compose.foundation.shape.CornerSize(8.dp),
-                        bottomStart = androidx.compose.foundation.shape.CornerSize(8.dp),
-                        bottomEnd = androidx.compose.foundation.shape.CornerSize(8.dp)
-                    )
                 ) {
                     Text(text = stringResource(R.string.complete_registration))
                 }

app/src/main/java/chat/revolt/screens/register/RegisterDetailsScreen.kt

@@ -13,8 +13,6 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.imePadding
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.foundation.shape.CornerSize
-import androidx.compose.material3.Button
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.HorizontalDivider
 import androidx.compose.material3.Icon
@@ -52,6 +50,7 @@ import chat.revolt.api.routes.account.RegistrationBody
 import chat.revolt.api.routes.account.register
 import chat.revolt.api.routes.misc.getRootRoute
 import chat.revolt.composables.generic.FormTextField
+import chat.revolt.composables.generic.SquareButton
 import com.hcaptcha.sdk.HCaptcha
 import com.hcaptcha.sdk.HCaptchaConfig
 import com.hcaptcha.sdk.HCaptchaSize
@@ -240,7 +239,7 @@ fun RegisterDetailsScreen(
 
                 val context = LocalContext.current
 
-                Button(
+                SquareButton(
                     onClick = {
                         viewModel.initCaptcha(context) {
                             viewModel.doRegistration(navController)
@@ -249,12 +248,6 @@ fun RegisterDetailsScreen(
                     modifier = Modifier
                         .fillMaxWidth()
                         .testTag("setup_continue_button"),
-                    shape = MaterialTheme.shapes.small.copy(
-                        topStart = CornerSize(8.dp),
-                        topEnd = CornerSize(8.dp),
-                        bottomStart = CornerSize(8.dp),
-                        bottomEnd = CornerSize(8.dp)
-                    )
                 ) {
                     Text(text = stringResource(R.string.continue_))
                 }

app/src/main/java/chat/revolt/screens/register/RegisterVerifyScreen.kt

@@ -4,7 +4,6 @@ import android.content.Intent
 import androidx.activity.compose.rememberLauncherForActivityResult
 import androidx.activity.result.contract.ActivityResultContracts
 import androidx.compose.foundation.Image
-import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
@@ -13,9 +12,6 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.safeDrawingPadding
-import androidx.compose.foundation.shape.CornerSize
-import androidx.compose.material3.Button
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.HorizontalDivider
 import androidx.compose.material3.Icon
@@ -31,12 +27,13 @@ import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import androidx.compose.ui.tooling.preview.Preview
-import androidx.navigation.compose.rememberNavController
 import androidx.navigation.NavController
+import androidx.navigation.compose.rememberNavController
 import chat.revolt.R
+import chat.revolt.composables.generic.SquareButton
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
@@ -119,7 +116,7 @@ fun RegisterVerifyScreen(navController: NavController, email: String) {
 
             Spacer(modifier = Modifier.height(32.dp))
 
-            Button(
+            SquareButton(
                 modifier = Modifier
                     .fillMaxWidth(),
                 onClick = {
@@ -127,12 +124,6 @@ fun RegisterVerifyScreen(navController: NavController, email: String) {
                     intent.addCategory(Intent.CATEGORY_APP_EMAIL)
                     intentLauncher.launch(intent)
                 },
-                shape = MaterialTheme.shapes.small.copy(
-                    topStart = CornerSize(8.dp),
-                    topEnd = CornerSize(8.dp),
-                    bottomStart = CornerSize(8.dp),
-                    bottomEnd = CornerSize(8.dp)
-                )
             ) {
                 Text(text = stringResource(R.string.open_mail_app))
             }