refactor(ui): compact the auth error preview in the debug page
This commit is contained in:
parent
875c667313
commit
d9e4f99add
1 changed files with 45 additions and 37 deletions
|
|
@ -5,7 +5,7 @@ use oneclient_db::console::{ConsoleQueryResult, run_console_query};
|
|||
use oneclient_auth::preview_samples;
|
||||
use oneclient_net::status::{self, ServiceStatus};
|
||||
|
||||
use crate::components::{Button, Icon, IconType, TextInput, login_dialog, toggle};
|
||||
use crate::components::{Button, Dropdown, Icon, IconType, TextInput, login_dialog, toggle};
|
||||
use crate::hooks::use_dispatch;
|
||||
use crate::notifications::{
|
||||
ClusterUpdateItem, ClusterUpdateSummary, NotificationAction, NotificationActionKind,
|
||||
|
|
@ -587,50 +587,27 @@ struct AuthGuidancePreview;
|
|||
|
||||
impl Component for AuthGuidancePreview {
|
||||
fn render(&self) -> impl IntoElement {
|
||||
let selected = use_state(|| None::<Option<usize>>);
|
||||
let samples = preview_samples();
|
||||
// Index 0 is the no-error state; the rest line up with `samples`, so a
|
||||
// dropdown holds all ~16 cases in one row instead of six rows of
|
||||
// full-width buttons.
|
||||
let mut choice = use_state(|| 0usize);
|
||||
let mut open = use_state(|| false);
|
||||
|
||||
let mut controls = rect().vertical().width(Size::fill()).spacing(10.).child(
|
||||
label()
|
||||
.text("Each button opens the real Microsoft sign-in popup exactly as users see it, in the chosen error state.")
|
||||
.font_size(13.)
|
||||
.color(colors::fg_secondary()),
|
||||
);
|
||||
let mut options: Vec<String> = vec!["No error (in progress)".to_string()];
|
||||
options.extend(samples.iter().map(|s| s.label.to_string()));
|
||||
|
||||
let mut labels: Vec<(&'static str, Option<usize>)> = vec![("No error (in progress)", None)];
|
||||
labels.extend(samples.iter().enumerate().map(|(i, s)| (s.label, Some(i))));
|
||||
let index = (*choice.read()).min(options.len() - 1);
|
||||
let selected_label = options[index].clone();
|
||||
|
||||
for chunk in labels.chunks(3) {
|
||||
let mut row = rect().horizontal().width(Size::fill()).spacing(12.);
|
||||
for (text, target) in chunk.iter().copied() {
|
||||
let mut sel = selected;
|
||||
let mut button = Button::new()
|
||||
.secondary()
|
||||
.text(text)
|
||||
.on_press(move |_| sel.set(Some(target)));
|
||||
if text.contains("No error") {
|
||||
button = button.child(Icon::new(IconType::CheckCircle).size(16.));
|
||||
} else {
|
||||
button = button.child(Icon::new(IconType::AlertTriangle).size(16.));
|
||||
}
|
||||
row = row.child(rect().width(Size::flex(1.0)).child(button));
|
||||
}
|
||||
for _ in chunk.len()..3 {
|
||||
row = row.child(rect().width(Size::flex(1.0)));
|
||||
}
|
||||
controls = controls.child(row);
|
||||
}
|
||||
|
||||
let current = *selected.read();
|
||||
let popup = current.map(|choice| {
|
||||
let (error, guidance) = match choice {
|
||||
let popup = open().then(|| {
|
||||
let (error, guidance) = match index.checked_sub(1) {
|
||||
None => (None, None),
|
||||
Some(i) => {
|
||||
let s = &samples[i];
|
||||
(Some(s.message.clone()), s.guidance.clone())
|
||||
}
|
||||
};
|
||||
let mut sel = selected;
|
||||
login_dialog(
|
||||
"https://login.live.com/oauth20_authorize (preview)".to_string(),
|
||||
"ABCD-EFGH".to_string(),
|
||||
|
|
@ -639,11 +616,42 @@ impl Component for AuthGuidancePreview {
|
|||
None,
|
||||
error,
|
||||
guidance,
|
||||
move || sel.set(None),
|
||||
move || open.set(false),
|
||||
)
|
||||
});
|
||||
|
||||
controls.maybe_child(popup).into_element()
|
||||
rect()
|
||||
.vertical()
|
||||
.width(Size::fill())
|
||||
.spacing(10.)
|
||||
.child(
|
||||
label()
|
||||
.text("Opens the real Microsoft sign-in popup exactly as users see it, in the chosen error state.")
|
||||
.font_size(13.)
|
||||
.color(colors::fg_secondary()),
|
||||
)
|
||||
.child(
|
||||
rect()
|
||||
.horizontal()
|
||||
.width(Size::fill())
|
||||
.cross_align(Alignment::Center)
|
||||
.spacing(12.)
|
||||
.child(
|
||||
Dropdown::new(selected_label, options)
|
||||
.width(Size::px(300.))
|
||||
.height(Size::px(34.))
|
||||
.on_select(move |idx: usize| choice.set(idx)),
|
||||
)
|
||||
.child(
|
||||
Button::new()
|
||||
.primary()
|
||||
.child(Icon::new(IconType::Eye).size(16.))
|
||||
.text("Open preview")
|
||||
.on_press(move |_| open.set(true)),
|
||||
),
|
||||
)
|
||||
.maybe_child(popup)
|
||||
.into_element()
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue