Align approvals and documents with native shell
This commit is contained in:
ZacharyZhang-NY committed
1 parent
6809df15de
commit
b3d5bcdde5
3 files changed
+419
-134
No files matched your search
@@ -7,82 +7,147 @@ impl AppRoot {
|
||||
.selected_document_id
|
||||
.as_ref()
|
||||
.and_then(|id| self.snapshot.documents.iter().find(|item| &item.id == id));
|
||||
let document_title = selected
|
||||
.map(|item| item.title.clone())
|
||||
.unwrap_or_else(|| "Select a document".to_string());
|
||||
let document_content = selected
|
||||
.map(|item| item.content.clone())
|
||||
.unwrap_or_else(|| "No document selected.".to_string());
|
||||
|
||||
div()
|
||||
.flex()
|
||||
.gap_4()
|
||||
.flex_col()
|
||||
.gap_6()
|
||||
.child(
|
||||
div()
|
||||
.id("documents-list")
|
||||
.w(px(340.0))
|
||||
.p_4()
|
||||
.gap_2()
|
||||
.border_1()
|
||||
.rounded_md()
|
||||
.border_color(theme::panel_border())
|
||||
.bg(theme::panel())
|
||||
.overflow_scroll()
|
||||
.child(div().text_lg().child("Document center"))
|
||||
.children(self.snapshot.documents.iter().map(|item| {
|
||||
.flex()
|
||||
.justify_between()
|
||||
.items_start()
|
||||
.child(
|
||||
div()
|
||||
.child(
|
||||
div()
|
||||
.text_2xl()
|
||||
.text_color(theme::text_primary())
|
||||
.child("Document Center"),
|
||||
)
|
||||
.child(
|
||||
div()
|
||||
.mt(px(6.0))
|
||||
.text_sm()
|
||||
.text_color(theme::text_muted())
|
||||
.child(format!("{} items", self.snapshot.documents.len())),
|
||||
),
|
||||
)
|
||||
.child(primary_button("Save draft", cx, |this, cx| {
|
||||
this.create_document(cx)
|
||||
})),
|
||||
)
|
||||
.child(div().h(px(1.0)).bg(theme::panel_border()))
|
||||
.when(self.snapshot.documents.is_empty(), |container| {
|
||||
container.child(
|
||||
div()
|
||||
.py_8()
|
||||
.text_base()
|
||||
.text_color(theme::text_muted())
|
||||
.child("No documents have been created yet."),
|
||||
)
|
||||
})
|
||||
.when(!self.snapshot.documents.is_empty(), |container| {
|
||||
container.child(div().id("documents-list").children(
|
||||
self.snapshot.documents.iter().map(|item| {
|
||||
let active =
|
||||
self.state.selected_document_id.as_deref() == Some(item.id.as_str());
|
||||
let document_id = item.id.clone();
|
||||
div()
|
||||
.id(SharedString::from(format!("document-{}", item.id)))
|
||||
.px_3()
|
||||
.py_2()
|
||||
.rounded_md()
|
||||
.flex()
|
||||
.justify_between()
|
||||
.items_center()
|
||||
.px_6()
|
||||
.py_5()
|
||||
.border_b_1()
|
||||
.border_color(theme::panel_border())
|
||||
.cursor_pointer()
|
||||
.bg(if active {
|
||||
theme::selection_fill()
|
||||
} else {
|
||||
theme::panel()
|
||||
theme::window_bg()
|
||||
})
|
||||
.hover(|style| style.bg(theme::panel_hover()))
|
||||
.on_click(cx.listener(move |this, _, _, cx| {
|
||||
this.state.selected_document_id = Some(document_id.clone());
|
||||
cx.notify();
|
||||
}))
|
||||
.child(format!("{} · {}", item.status, item.title))
|
||||
})),
|
||||
)
|
||||
.child(
|
||||
div()
|
||||
.flex_1()
|
||||
.child(
|
||||
div()
|
||||
.text_base()
|
||||
.text_color(theme::text_primary())
|
||||
.truncate()
|
||||
.child(item.title.clone()),
|
||||
)
|
||||
.child(
|
||||
div()
|
||||
.mt(px(8.0))
|
||||
.text_sm()
|
||||
.text_color(theme::text_muted())
|
||||
.child(format!(
|
||||
"{} · v{} · {}",
|
||||
item.document_type.replace('_', " "),
|
||||
item.version,
|
||||
short_date(item.updated_at.as_str())
|
||||
)),
|
||||
),
|
||||
)
|
||||
.child(document_status(item.status.as_str()))
|
||||
}),
|
||||
))
|
||||
})
|
||||
.child(div().h(px(1.0)).bg(theme::panel_border()))
|
||||
.child(
|
||||
div()
|
||||
.flex_1()
|
||||
.p_4()
|
||||
.gap_3()
|
||||
.border_1()
|
||||
.rounded_md()
|
||||
.border_color(theme::panel_border())
|
||||
.bg(theme::panel())
|
||||
.child(div().text_lg().child("Quick draft"))
|
||||
.gap_4()
|
||||
.child(
|
||||
div().text_lg().text_color(theme::text_primary()).child(
|
||||
selected
|
||||
.map(|item| item.title.clone())
|
||||
.unwrap_or_else(|| "Quick draft".to_string()),
|
||||
),
|
||||
)
|
||||
.child(self.document_title_input.clone())
|
||||
.child(self.document_body_input.clone())
|
||||
.child(primary_button("Save draft", cx, |this, cx| {
|
||||
this.create_document(cx)
|
||||
}))
|
||||
.child(div().h(px(1.0)).bg(theme::panel_inset_border()))
|
||||
.child(
|
||||
div()
|
||||
.text_sm()
|
||||
.text_color(theme::text_muted())
|
||||
.child(document_title),
|
||||
)
|
||||
.child(
|
||||
div()
|
||||
.min_h(px(200.0))
|
||||
.p_3()
|
||||
.border_1()
|
||||
.border_color(theme::panel_inset_border())
|
||||
.rounded_md()
|
||||
.bg(theme::panel_inset())
|
||||
.child(document_content),
|
||||
),
|
||||
.when_some(selected, |container, item| {
|
||||
container.child(
|
||||
div()
|
||||
.p_4()
|
||||
.rounded_lg()
|
||||
.border_1()
|
||||
.border_color(theme::panel_inset_border())
|
||||
.bg(theme::panel_inset())
|
||||
.child(item.content.clone()),
|
||||
)
|
||||
}),
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
fn document_status(status: &str) -> impl IntoElement {
|
||||
div()
|
||||
.flex()
|
||||
.items_center()
|
||||
.gap_2()
|
||||
.child(
|
||||
div()
|
||||
.w(px(8.0))
|
||||
.h(px(8.0))
|
||||
.rounded_full()
|
||||
.bg(theme::badge_dark()),
|
||||
)
|
||||
.child(
|
||||
div()
|
||||
.text_xs()
|
||||
.text_color(theme::text_secondary())
|
||||
.child(status.to_uppercase()),
|
||||
)
|
||||
}
|
||||
|
||||
fn short_date(value: &str) -> &str {
|
||||
value.get(..10).unwrap_or(value)
|
||||
}
|
||||
Reference in new issue
Block a user