feat: redesign webhook sheet
This commit is contained in:
infi
parent
b5d27ad43e
commit
c6f90f6bb2
|
|
@ -1,17 +1,22 @@
|
||||||
package chat.stoat.sheets
|
package chat.stoat.sheets
|
||||||
|
|
||||||
import android.widget.Toast
|
import androidx.compose.foundation.background
|
||||||
import androidx.compose.foundation.Image
|
|
||||||
import androidx.compose.foundation.layout.Arrangement
|
import androidx.compose.foundation.layout.Arrangement
|
||||||
|
import androidx.compose.foundation.layout.Box
|
||||||
import androidx.compose.foundation.layout.Column
|
import androidx.compose.foundation.layout.Column
|
||||||
import androidx.compose.foundation.layout.fillMaxWidth
|
import androidx.compose.foundation.layout.fillMaxWidth
|
||||||
import androidx.compose.foundation.layout.height
|
|
||||||
import androidx.compose.foundation.layout.padding
|
import androidx.compose.foundation.layout.padding
|
||||||
|
import androidx.compose.foundation.layout.size
|
||||||
|
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||||
import androidx.compose.material3.Button
|
import androidx.compose.material3.Button
|
||||||
|
import androidx.compose.material3.Icon
|
||||||
import androidx.compose.material3.MaterialTheme
|
import androidx.compose.material3.MaterialTheme
|
||||||
import androidx.compose.material3.Text
|
import androidx.compose.material3.Text
|
||||||
import androidx.compose.runtime.Composable
|
import androidx.compose.runtime.Composable
|
||||||
|
import androidx.compose.ui.Alignment
|
||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
|
import androidx.compose.ui.draw.clip
|
||||||
|
import androidx.compose.ui.draw.rotate
|
||||||
import androidx.compose.ui.platform.LocalContext
|
import androidx.compose.ui.platform.LocalContext
|
||||||
import androidx.compose.ui.res.painterResource
|
import androidx.compose.ui.res.painterResource
|
||||||
import androidx.compose.ui.res.stringResource
|
import androidx.compose.ui.res.stringResource
|
||||||
|
|
@ -19,6 +24,7 @@ import androidx.compose.ui.text.style.TextAlign
|
||||||
import androidx.compose.ui.tooling.preview.Preview
|
import androidx.compose.ui.tooling.preview.Preview
|
||||||
import androidx.compose.ui.unit.dp
|
import androidx.compose.ui.unit.dp
|
||||||
import chat.stoat.R
|
import chat.stoat.R
|
||||||
|
import chat.stoat.composables.chat.viewUrlInBrowser
|
||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
fun WebHookUserSheet(modifier: Modifier = Modifier) {
|
fun WebHookUserSheet(modifier: Modifier = Modifier) {
|
||||||
|
|
@ -26,13 +32,25 @@ fun WebHookUserSheet(modifier: Modifier = Modifier) {
|
||||||
|
|
||||||
Column(
|
Column(
|
||||||
verticalArrangement = Arrangement.spacedBy(16.dp),
|
verticalArrangement = Arrangement.spacedBy(16.dp),
|
||||||
modifier = modifier.padding(16.dp)
|
horizontalAlignment = Alignment.CenterHorizontally,
|
||||||
|
modifier = modifier.padding(16.dp).padding(top = 16.dp)
|
||||||
) {
|
) {
|
||||||
Image(
|
Box(
|
||||||
painter = painterResource(R.drawable.ux_webhooks),
|
modifier = Modifier
|
||||||
contentDescription = null,
|
.padding(bottom = 16.dp)
|
||||||
modifier = Modifier.fillMaxWidth().height(120.dp)
|
.size(96.dp)
|
||||||
)
|
.rotate(5f)
|
||||||
|
.clip(RoundedCornerShape(12.dp))
|
||||||
|
.background(MaterialTheme.colorScheme.primaryContainer),
|
||||||
|
contentAlignment = Alignment.Center
|
||||||
|
) {
|
||||||
|
Icon(
|
||||||
|
painter = painterResource(R.drawable.ic_webhook_24dp),
|
||||||
|
tint = MaterialTheme.colorScheme.onPrimaryContainer,
|
||||||
|
contentDescription = null,
|
||||||
|
modifier = Modifier.size(64.dp)
|
||||||
|
)
|
||||||
|
}
|
||||||
Text(
|
Text(
|
||||||
text = stringResource(R.string.user_info_sheet_webhook),
|
text = stringResource(R.string.user_info_sheet_webhook),
|
||||||
style = MaterialTheme.typography.titleMedium,
|
style = MaterialTheme.typography.titleMedium,
|
||||||
|
|
@ -47,11 +65,7 @@ fun WebHookUserSheet(modifier: Modifier = Modifier) {
|
||||||
)
|
)
|
||||||
Button(
|
Button(
|
||||||
onClick = {
|
onClick = {
|
||||||
Toast(context).apply {
|
viewUrlInBrowser(context, "https://support.stoat.chat/kb/server-management/integrations-and-bots/webhooks")
|
||||||
setText(context.getString(R.string.comingsoon_toast))
|
|
||||||
duration = Toast.LENGTH_SHORT
|
|
||||||
show()
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
modifier = Modifier
|
modifier = Modifier
|
||||||
.fillMaxWidth()
|
.fillMaxWidth()
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,10 @@
|
||||||
|
<vector xmlns:android="http://schemas.android.com/apk/res/android"
|
||||||
|
android:width="24dp"
|
||||||
|
android:height="24dp"
|
||||||
|
android:viewportWidth="960"
|
||||||
|
android:viewportHeight="960"
|
||||||
|
android:tint="?attr/colorControlNormal">
|
||||||
|
<path
|
||||||
|
android:fillColor="@android:color/white"
|
||||||
|
android:pathData="M280,840Q197,840 138.5,781.5Q80,723 80,640Q80,567 125.5,512.5Q171,458 240,444L240,527Q205,539 182.5,570Q160,601 160,640Q160,690 195,725Q230,760 280,760Q330,760 365,725Q400,690 400,640L400,600L635,600Q643,591 654.5,585.5Q666,580 680,580Q705,580 722.5,597.5Q740,615 740,640Q740,665 722.5,682.5Q705,700 680,700Q666,700 654.5,694.5Q643,689 635,680L476,680Q462,749 407.5,794.5Q353,840 280,840ZM680,840Q624,840 578.5,812.5Q533,785 507,740L614,740Q628,750 645,755Q662,760 680,760Q730,760 765,725Q800,690 800,640Q800,590 765,555Q730,520 680,520Q660,520 643,525.5Q626,531 611,542L489,339Q468,335 454,319Q440,303 440,280Q440,255 457.5,237.5Q475,220 500,220Q525,220 542.5,237.5Q560,255 560,280Q560,285 560,288.5Q560,292 558,297L645,443Q653,441 662,440.5Q671,440 680,440Q763,440 821.5,498.5Q880,557 880,640Q880,723 821.5,781.5Q763,840 680,840ZM280,700Q255,700 237.5,682.5Q220,665 220,640Q220,618 234,602Q248,586 268,581L362,425Q333,398 316.5,360.5Q300,323 300,280Q300,197 358.5,138.5Q417,80 500,80Q583,80 641.5,138.5Q700,197 700,280L620,280Q620,230 585,195Q550,160 500,160Q450,160 415,195Q380,230 380,280Q380,323 406,355.5Q432,388 472,397L337,622Q339,627 339.5,631Q340,635 340,640Q340,665 322.5,682.5Q305,700 280,700Z"/>
|
||||||
|
</vector>
|
||||||
|
|
@ -1,24 +0,0 @@
|
||||||
<vector xmlns:android="http://schemas.android.com/apk/res/android"
|
|
||||||
android:width="128dp"
|
|
||||||
android:height="56dp"
|
|
||||||
android:viewportWidth="128"
|
|
||||||
android:viewportHeight="56">
|
|
||||||
<path
|
|
||||||
android:pathData="M12.91,45.75C9.63,45.75 6.83,44.62 4.51,42.36C2.19,40.08 1.04,37.31 1.04,34.04C1.04,31.24 1.88,28.73 3.56,26.53C5.26,24.33 7.48,22.92 10.21,22.32C11.12,19.01 12.92,16.33 15.61,14.29C18.32,12.23 21.38,11.2 24.79,11.2C29,11.2 32.57,12.67 35.5,15.6C38.43,18.53 39.9,22.1 39.9,26.31C42.39,26.6 44.45,27.68 46.08,29.55C47.72,31.4 48.54,33.55 48.54,36.03C48.54,38.74 47.6,41.03 45.71,42.92C43.82,44.8 41.53,45.75 38.82,45.75H12.91Z"
|
|
||||||
android:fillColor="?attr/colorOnSurface"/>
|
|
||||||
<path
|
|
||||||
android:pathData="M57.04,30.89L57.57,28.62L71.18,31.77L66.39,24.09L68.37,22.85L75.27,33.91L64.21,40.82L62.97,38.83L70.66,34.04L57.04,30.89Z"
|
|
||||||
android:fillColor="?attr/colorOnSurfaceVariant"/>
|
|
||||||
<path
|
|
||||||
android:pathData="M9.93,6.62L18.03,3.97A2.84,2.84 116.89,0 1,21.62 5.79L24.27,13.89A2.84,2.84 116.89,0 1,22.45 17.48L14.34,20.13A2.84,2.84 116.89,0 1,10.76 18.31L8.11,10.21A2.84,2.84 116.89,0 1,9.93 6.62z"
|
|
||||||
android:fillColor="?attr/colorPrimaryContainer"/>
|
|
||||||
<path
|
|
||||||
android:pathData="M16.58,15.75C16.2,16.98 14.9,17.68 13.68,17.31C12.46,16.94 11.77,15.62 12.14,14.38C12.24,14.04 12.42,13.72 12.67,13.46C12.91,13.19 13.22,12.99 13.56,12.86L13.81,13.54C13.38,13.72 13.02,14.09 12.88,14.58C12.62,15.43 13.08,16.32 13.9,16.57C14.72,16.82 15.59,16.34 15.85,15.48C15.93,15.22 15.94,14.95 15.89,14.7L15.73,14.21L18.43,13.31L18.44,13.24C18.55,12.71 19.06,12.38 19.58,12.49C19.7,12.51 19.82,12.57 19.92,12.64C20.03,12.71 20.12,12.8 20.19,12.91C20.26,13.02 20.3,13.14 20.33,13.26C20.35,13.39 20.35,13.51 20.32,13.64C20.21,14.16 19.7,14.5 19.18,14.39C18.94,14.35 18.74,14.21 18.61,14.03L16.65,14.68C16.7,15.04 16.68,15.4 16.58,15.75ZM18.97,11.14C20.24,10.89 21.47,11.7 21.72,12.96C21.96,14.21 21.13,15.43 19.86,15.69C19.5,15.76 19.14,15.75 18.79,15.65C18.44,15.56 18.12,15.39 17.85,15.16L18.33,14.61C18.52,14.77 18.74,14.87 18.97,14.93C19.21,14.99 19.45,15 19.69,14.95C20.57,14.77 21.13,13.95 20.97,13.11C20.8,12.27 19.96,11.72 19.09,11.9C18.82,11.95 18.58,12.07 18.38,12.23L18.04,12.57L16.03,10.67L15.93,10.71C15.68,10.78 15.42,10.75 15.19,10.63C14.96,10.51 14.8,10.3 14.72,10.06C14.57,9.55 14.88,9.01 15.39,8.87C15.91,8.73 16.45,9.01 16.6,9.52C16.66,9.73 16.64,9.96 16.56,10.15L18.03,11.55C18.3,11.35 18.62,11.21 18.97,11.14ZM13.95,11.32C13.09,10.34 13.18,8.87 14.14,8.03C15.11,7.19 16.58,7.31 17.44,8.29C17.94,8.85 18.12,9.6 17.99,10.29L17.27,10.13C17.35,9.68 17.22,9.19 16.88,8.8C16.3,8.13 15.3,8.05 14.66,8.61C14,9.17 13.96,10.17 14.54,10.84C14.78,11.12 15.09,11.29 15.42,11.36L15.64,11.4L14.94,14.3C14.97,14.32 14.99,14.34 15.02,14.38C15.4,14.74 15.42,15.35 15.05,15.73C14.69,16.12 14.08,16.12 13.69,15.75C13.3,15.38 13.28,14.77 13.65,14.38C13.81,14.22 14.01,14.13 14.22,14.11L14.74,11.92C14.45,11.78 14.17,11.58 13.95,11.32Z"
|
|
||||||
android:fillColor="?attr/colorOnPrimaryContainer"/>
|
|
||||||
<path
|
|
||||||
android:pathData="M88.97,53.78L89.11,48.7L84.16,49.44L84.22,46.9L89.17,46.16L89.37,38.55L84.42,39.29L84.48,36.75L89.43,36.01L89.56,30.94L92.04,30.57L91.9,35.64L99.32,34.53L99.45,29.46L101.93,29.08L101.79,34.16L106.73,33.42L106.67,35.96L101.73,36.7L101.53,44.31L106.47,43.57L106.41,46.11L101.47,46.85L101.33,51.92L98.86,52.29L98.99,47.22L91.58,48.33L91.44,53.41L88.97,53.78ZM91.84,38.18L91.64,45.79L99.06,44.68L99.25,37.07L91.84,38.18Z"
|
|
||||||
android:fillColor="?attr/colorOnSurface"/>
|
|
||||||
<path
|
|
||||||
android:pathData="M125.16,9.98L109.85,8.39C108.8,8.28 107.85,9.05 107.74,10.1L105.94,27.33L110.17,23.9L123.57,25.29C124.63,25.4 125.57,24.64 125.68,23.58L126.88,12.1C126.93,11.59 126.78,11.08 126.46,10.68C126.14,10.29 125.67,10.03 125.16,9.98ZM114.85,20.52L111.88,16.82L113.36,15.61L115.13,17.81L120.55,13.37L121.75,14.86L114.85,20.52Z"
|
|
||||||
android:fillColor="?attr/colorTertiary"/>
|
|
||||||
</vector>
|
|
||||||
Loading…
Reference in New Issue