feat: mask session loading, fix profile loading centering

Signed-off-by: Infi <infi@infi.sh>
This commit is contained in:
Infi 2023-12-09 22:22:52 +01:00
parent 4524b23b3d
commit 9c189c49b4
2 changed files with 126 additions and 97 deletions

View File

@ -245,23 +245,33 @@ fun ProfileSettingsScreen(
} }
) )
val scrollState = rememberScrollState()
Column( Column(
modifier = Modifier modifier = Modifier
.fillMaxSize() .fillMaxSize()
.verticalScroll(rememberScrollState()) .then(
if (viewModel.isLoading) {
Modifier
} else {
Modifier.verticalScroll(scrollState)
}
),
verticalArrangement = if (viewModel.isLoading) {
Arrangement.Center
} else {
Arrangement.Top
},
horizontalAlignment = if (viewModel.isLoading) {
Alignment.CenterHorizontally
} else {
Alignment.Start
}
) { ) {
if (viewModel.isLoading) { if (viewModel.isLoading) {
Column( CircularProgressIndicator(
modifier = Modifier modifier = Modifier
.fillMaxSize(), .size(48.dp)
horizontalAlignment = Alignment.CenterHorizontally, )
verticalArrangement = Arrangement.Center
) {
CircularProgressIndicator(
modifier = Modifier
.size(48.dp)
)
}
} else { } else {
RevoltAPI.userCache[RevoltAPI.selfId]?.let { RevoltAPI.userCache[RevoltAPI.selfId]?.let {
RawUserOverview( RawUserOverview(

View File

@ -12,10 +12,11 @@ import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.safeDrawingPadding import androidx.compose.foundation.layout.safeDrawingPadding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.material3.AlertDialog import androidx.compose.material3.AlertDialog
import androidx.compose.material3.Button import androidx.compose.material3.Button
import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.CircularProgressIndicator
import androidx.compose.material3.FilledTonalButton import androidx.compose.material3.FilledTonalButton
import androidx.compose.material3.MaterialTheme import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text import androidx.compose.material3.Text
@ -49,6 +50,7 @@ import chat.revolt.components.settings.sessions.SessionItem
import kotlinx.coroutines.launch import kotlinx.coroutines.launch
class SessionSettingsScreenViewModel : ViewModel() { class SessionSettingsScreenViewModel : ViewModel() {
var isLoading by mutableStateOf(true)
val sessions = mutableStateListOf<Session>() val sessions = mutableStateListOf<Session>()
var currentSession by mutableStateOf<Session?>(null) var currentSession by mutableStateOf<Session?>(null)
var showLogoutOtherConfirmation by mutableStateOf(false) var showLogoutOtherConfirmation by mutableStateOf(false)
@ -61,6 +63,7 @@ class SessionSettingsScreenViewModel : ViewModel() {
"SessionSettingsScreen", "SessionSettingsScreen",
"Current session: $currentSession. Current session ID: ${RevoltAPI.sessionId}" "Current session: $currentSession. Current session ID: ${RevoltAPI.sessionId}"
) )
isLoading = false
} }
} }
@ -80,7 +83,7 @@ class SessionSettingsScreenViewModel : ViewModel() {
} }
} }
@OptIn(ExperimentalFoundationApi::class, ExperimentalMaterial3Api::class) @OptIn(ExperimentalFoundationApi::class)
@Composable @Composable
fun SessionSettingsScreen( fun SessionSettingsScreen(
navController: NavController, navController: NavController,
@ -135,106 +138,122 @@ fun SessionSettingsScreen(
} }
) )
LazyColumn { if (viewModel.isLoading) {
stickyHeader(key = "thisDevice") { Column(
Text( modifier = Modifier
text = stringResource(id = R.string.settings_sessions_this_device), .fillMaxSize(),
style = MaterialTheme.typography.labelLarge, horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
CircularProgressIndicator(
modifier = Modifier modifier = Modifier
.fillMaxWidth() .size(48.dp)
.background(MaterialTheme.colorScheme.background)
.padding(10.dp)
) )
} }
} else {
viewModel.currentSession?.let { LazyColumn {
item(key = it.id) { stickyHeader(key = "thisDevice") {
Spacer(Modifier.height(8.dp)) Text(
SessionItem( text = stringResource(id = R.string.settings_sessions_this_device),
session = it, style = MaterialTheme.typography.labelLarge,
currentSession = true,
onLogout = {},
modifier = Modifier.padding(horizontal = 8.dp)
)
}
} ?: run {
item(key = "noCurrentSession") {
UIMarkdown(
text = stringResource(id = R.string.settings_sessions_this_device_unavailable),
modifier = Modifier modifier = Modifier
.fillMaxWidth() .fillMaxWidth()
.background(MaterialTheme.colorScheme.background) .background(MaterialTheme.colorScheme.background)
.padding(10.dp) .padding(10.dp)
) )
} }
}
stickyHeader(key = "otherSessions") { viewModel.currentSession?.let {
Text( item(key = it.id) {
text = stringResource(id = R.string.settings_sessions_other_sessions), Spacer(Modifier.height(8.dp))
style = MaterialTheme.typography.labelLarge, SessionItem(
modifier = Modifier session = it,
.fillMaxWidth() currentSession = true,
.background(MaterialTheme.colorScheme.background) onLogout = {},
.padding(10.dp) modifier = Modifier.padding(horizontal = 8.dp)
)
}
item(key = "logoutOtherSessions") {
Row(
modifier = Modifier
.padding(8.dp)
.fillMaxWidth()
.clip(shape = MaterialTheme.shapes.medium)
.background(
color = MaterialTheme.colorScheme.surfaceColorAtElevation(6.dp)
) )
.padding(16.dp), }
verticalAlignment = Alignment.CenterVertically, } ?: run {
horizontalArrangement = Arrangement.SpaceBetween item(key = "noCurrentSession") {
) { UIMarkdown(
Column( text = stringResource(id = R.string.settings_sessions_this_device_unavailable),
modifier = Modifier
.fillMaxWidth()
.background(MaterialTheme.colorScheme.background)
.padding(10.dp)
)
}
}
stickyHeader(key = "otherSessions") {
Text(
text = stringResource(id = R.string.settings_sessions_other_sessions),
style = MaterialTheme.typography.labelLarge,
modifier = Modifier modifier = Modifier
.weight(1f) .fillMaxWidth()
.padding(end = 16.dp) .background(MaterialTheme.colorScheme.background)
) { .padding(10.dp)
Text( )
text = stringResource(R.string.settings_sessions_log_out_other), }
style = MaterialTheme.typography.labelLarge
)
Text( item(key = "logoutOtherSessions") {
text = stringResource( Row(
R.string.settings_sessions_log_out_other_description modifier = Modifier
), .padding(8.dp)
style = MaterialTheme.typography.bodySmall.copy( .fillMaxWidth()
fontWeight = FontWeight.Normal .clip(shape = MaterialTheme.shapes.medium)
.background(
color = MaterialTheme.colorScheme.surfaceColorAtElevation(6.dp)
) )
) .padding(16.dp),
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.SpaceBetween
) {
Column(
modifier = Modifier
.weight(1f)
.padding(end = 16.dp)
) {
Text(
text = stringResource(R.string.settings_sessions_log_out_other),
style = MaterialTheme.typography.labelLarge
)
Text(
text = stringResource(
R.string.settings_sessions_log_out_other_description
),
style = MaterialTheme.typography.bodySmall.copy(
fontWeight = FontWeight.Normal
)
)
}
FilledTonalButton(onClick = {
viewModel.showLogoutOtherConfirmation = true
}) {
Text(stringResource(R.string.logout))
}
} }
Spacer(Modifier.height(8.dp))
FilledTonalButton(onClick = { viewModel.showLogoutOtherConfirmation = true }) {
Text(stringResource(R.string.logout))
}
}
Spacer(Modifier.height(8.dp))
}
items(viewModel.sessions.size) {
val item = viewModel.sessions[it]
if (item.isCurrent()) {
return@items
} }
SessionItem( items(viewModel.sessions.size) {
session = item, val item = viewModel.sessions[it]
onLogout = { session ->
viewModel.logoutSession(session.id) if (item.isCurrent()) {
}, return@items
modifier = Modifier.padding(horizontal = 8.dp) }
)
Spacer(Modifier.height(16.dp)) SessionItem(
session = item,
onLogout = { session ->
viewModel.logoutSession(session.id)
},
modifier = Modifier.padding(horizontal = 8.dp)
)
Spacer(Modifier.height(16.dp))
}
} }
} }
} }