refine app foundation

This commit is contained in:
Georg Bauer
2026-07-24 12:36:48 +02:00
parent 579e1030b2
commit 62e7752ec7
6 changed files with 941 additions and 872 deletions

454
src/app/view.rs Normal file
View File

@@ -0,0 +1,454 @@
use super::{App, MODEL_CHOICES, Message, ModelChoice};
use crate::database::{ProjectWithSessions, Session};
use iced::theme::{Palette, palette};
use iced::widget::{
Space, Svg, button, checkbox, column, container, opaque, pick_list, row, scrollable, stack,
svg, text, text_input,
};
use iced::{Alignment, Color, Element, Length, Theme};
use std::path::Path;
const ICON_FOLDER: &[u8] = include_bytes!("../../assets/icons/folder.svg");
const ICON_FOLDER_PLUS: &[u8] = include_bytes!("../../assets/icons/folder-plus.svg");
const ICON_NEW_SESSION: &[u8] = include_bytes!("../../assets/icons/new-session.svg");
const ICON_CHAT: &[u8] = include_bytes!("../../assets/icons/chat.svg");
const ICON_SETTINGS: &[u8] = include_bytes!("../../assets/icons/settings.svg");
const ICON_TRASH: &[u8] = include_bytes!("../../assets/icons/trash.svg");
const ICON_MORE: &[u8] = include_bytes!("../../assets/icons/more.svg");
const ICON_PAPERCLIP: &[u8] = include_bytes!("../../assets/icons/paperclip.svg");
const ICON_SEND: &[u8] = include_bytes!("../../assets/icons/send.svg");
const ICON_MODEL: &[u8] = include_bytes!("../../assets/icons/model.svg");
const ICON_SPARK: &[u8] = include_bytes!("../../assets/icons/spark.svg");
impl App {
pub(crate) fn view(&self) -> Element<'_, Message> {
let mut shell = column![
row![self.sidebar(), self.detail()]
.width(Length::Fill)
.height(Length::Fill)
];
if let Some(error) = &self.error {
shell = shell.push(
container(text(error).style(iced::widget::text::danger))
.padding([8, 14])
.width(Length::Fill),
);
}
let content: Element<'_, Message> = shell.into();
let mut layers = vec![content];
if self.preferences_open {
layers.push(self.preferences_panel());
} else if let Some(path) = &self.pending_project_path {
layers.push(self.project_dialog(path));
}
stack(layers)
.width(Length::Fill)
.height(Length::Fill)
.into()
}
fn sidebar(&self) -> Element<'_, Message> {
let new_session_content = row![icon(ICON_NEW_SESSION, 17), text("New session").size(14),]
.spacing(9)
.align_y(Alignment::Center);
let new_session = if self.selected_project.is_some() {
button(new_session_content)
.width(Length::Fill)
.on_press(Message::CreateSession)
} else {
button(new_session_content).width(Length::Fill)
};
let preference_content = row![
icon(ICON_SETTINGS, 17),
text("Preferences").size(14),
Space::with_width(Length::Fill),
text("⌘,").size(12),
]
.spacing(9)
.align_y(Alignment::Center);
let preferences = if self.database.is_some() {
button(preference_content)
.width(Length::Fill)
.on_press(Message::OpenPreferences)
} else {
button(preference_content).width(Length::Fill)
};
let add_project_content = row![icon(ICON_FOLDER_PLUS, 17), text("Add project…").size(14),]
.spacing(9)
.align_y(Alignment::Center);
let add_project = if self.choosing_folder || self.database.is_none() {
button(add_project_content).width(Length::Fill)
} else {
button(add_project_content)
.width(Length::Fill)
.on_press(Message::ChooseProjectFolder)
};
let header = column![
row![
text("DS4Server").size(20),
Space::with_width(Length::Fill),
text("Local").size(12),
]
.align_y(Alignment::Center),
new_session.style(button::text),
]
.spacing(10);
let mut projects = column![
row![
text("PROJECTS").size(11),
Space::with_width(Length::Fill),
text("LOCAL").size(10),
],
add_project.style(button::text),
]
.spacing(10);
for item in &self.projects {
let project = &item.project;
let selected = self.selected_project == Some(project.id);
projects = projects.push(
row![
button(
row![icon(ICON_FOLDER, 17), text(&project.name).size(14)]
.spacing(9)
.align_y(Alignment::Center),
)
.width(Length::Fill)
.on_press(Message::SelectProject(project.id))
.style(button::text),
button(icon(ICON_TRASH, 15))
.on_press(Message::DeleteProject(project.id))
.style(button::text),
]
.spacing(4)
.align_y(Alignment::Center),
);
for session in &item.sessions {
let session_selected = selected && self.selected_session == Some(session.id);
projects = projects.push(
row![
Space::with_width(26),
button(
row![icon(ICON_CHAT, 15), text(&session.title).size(13)]
.spacing(8)
.align_y(Alignment::Center),
)
.width(Length::Fill)
.on_press(Message::SelectSession(project.id, session.id))
.style(if session_selected {
button::secondary
} else {
button::text
}),
button(icon(ICON_TRASH, 14))
.on_press(Message::DeleteSession(session.id))
.style(button::text),
]
.spacing(3)
.align_y(Alignment::Center),
);
}
}
container(
column![
header,
scrollable(projects).height(Length::Fill),
preferences.style(button::text),
]
.spacing(10),
)
.width(276)
.height(Length::Fill)
.padding(16)
.style(sidebar_style)
.into()
}
fn detail(&self) -> Element<'_, Message> {
let Some(item) = self.selected_project() else {
let open_project_content = row![icon(ICON_FOLDER_PLUS, 17), text("Open project…"),]
.spacing(8)
.align_y(Alignment::Center);
let open_project = if self.database.is_some() && !self.choosing_folder {
button(open_project_content)
.on_press(Message::ChooseProjectFolder)
.style(button::primary)
} else {
button(open_project_content)
};
return container(
column![
icon(ICON_SPARK, 36),
text("Start a local coding session").size(28),
text("Choose a project folder to create your first session.").size(14),
Space::with_height(10),
open_project,
]
.spacing(10)
.align_x(Alignment::Center),
)
.center_x(Length::Fill)
.center_y(Length::Fill)
.into();
};
let project = &item.project;
let selected_title = self
.selected_session(item)
.map(|session| session.title.as_str())
.unwrap_or(project.name.as_str());
let header = row![
icon(ICON_FOLDER, 19),
text(selected_title).size(18),
icon(ICON_MORE, 18),
Space::with_width(Length::Fill),
]
.spacing(10)
.align_y(Alignment::Center);
let body: Element<'_, Message> = if let Some(session) = self.selected_session(item) {
let conversation = column![
Space::with_height(Length::Fill),
column![
text(&session.title).size(26),
text("This session is ready for the agent runtime.").size(14),
]
.spacing(8),
Space::with_height(Length::Fill),
container(
column![
text("Ask DS4Server anything…"),
Space::with_height(28),
row![
icon(ICON_PAPERCLIP, 19),
Space::with_width(Length::Fill),
icon(ICON_MODEL, 16),
text(
ModelChoice::from_id(&self.preferences.selected_model)
.unwrap_or_default()
.to_string(),
)
.size(12),
button(icon(ICON_SEND, 18)),
]
.align_y(Alignment::Center),
]
.spacing(8),
)
.padding(16)
.width(Length::Fill)
.style(container::rounded_box),
]
.height(Length::Fill)
.spacing(8);
container(conversation)
.max_width(860)
.center_x(Length::Fill)
.height(Length::Fill)
.into()
} else {
container(
column![
text(if item.sessions.is_empty() {
"No sessions yet"
} else {
"Choose a session"
})
.size(24),
text("Create a session above or select one from the sidebar.").size(14),
]
.spacing(8)
.align_x(Alignment::Center),
)
.center_x(Length::Fill)
.center_y(Length::Fill)
.into()
};
container(column![header, body].spacing(24))
.width(Length::Fill)
.height(Length::Fill)
.padding(24)
.into()
}
fn preferences_panel(&self) -> Element<'_, Message> {
let dflash_toggle: Option<fn(bool) -> Message> = self
.preference_draft
.model
.supports_dflash()
.then_some(Message::PreferenceDflashChanged);
let dflash = checkbox(
"Enable DFlash for this model",
self.preference_draft.dflash_enabled,
)
.on_toggle_maybe(dflash_toggle);
let mut content = column![
row![
icon(ICON_SETTINGS, 22),
text("Preferences").size(24),
Space::with_width(Length::Fill),
text("⌘,").size(12),
]
.spacing(10)
.align_y(Alignment::Center),
Space::with_height(6),
text("MODEL").size(11),
pick_list(
&MODEL_CHOICES[..],
Some(self.preference_draft.model),
Message::PreferenceModelChanged,
)
.width(Length::Fill),
dflash,
text(if self.preference_draft.model.supports_dflash() {
"DFlash is downloaded and used only when enabled."
} else {
"DFlash is not available for the selected model."
})
.size(12),
Space::with_height(8),
text("INACTIVITY").size(11),
row![
text_input("10", &self.preference_draft.idle_timeout_minutes)
.on_input(Message::PreferenceTimeoutChanged)
.width(90)
.padding(9),
text("minutes before unloading the model").size(13),
]
.spacing(10)
.align_y(Alignment::Center),
text("Enter a whole number from 1 to 1440.").size(12),
]
.spacing(10);
if let Some(error) = &self.preference_error {
content = content.push(text(error).style(iced::widget::text::danger));
}
content = content.push(
row![
Space::with_width(Length::Fill),
button("Cancel")
.on_press(Message::DismissPanel)
.style(button::secondary),
button("Save")
.on_press(Message::SavePreferences)
.style(button::primary),
]
.spacing(8),
);
let panel = container(content)
.padding(24)
.width(520)
.style(container::rounded_box);
opaque(
container(panel)
.center_x(Length::Fill)
.center_y(Length::Fill)
.style(|_| {
container::Style::default().background(Color::from_rgba8(0, 0, 0, 0.68))
}),
)
}
fn project_dialog<'a>(&'a self, path: &'a Path) -> Element<'a, Message> {
let dialog = container(
column![
text("Add project").size(24),
text(path.display().to_string()).size(12),
text("Name").size(13),
text_input("Project name", &self.project_name_input)
.on_input(Message::ProjectNameChanged)
.on_submit(Message::ConfirmProject)
.padding(10),
row![
Space::with_width(Length::Fill),
button("Cancel")
.on_press(Message::CancelProject)
.style(button::secondary),
button("Add project")
.on_press(Message::ConfirmProject)
.style(button::primary),
]
.spacing(8),
]
.spacing(12),
)
.padding(22)
.width(440)
.style(container::rounded_box);
opaque(
container(dialog)
.center_x(Length::Fill)
.center_y(Length::Fill)
.style(|_| {
container::Style::default().background(Color::from_rgba8(0, 0, 0, 0.68))
}),
)
}
pub(super) fn selected_project(&self) -> Option<&ProjectWithSessions> {
self.projects
.iter()
.find(|item| Some(item.project.id) == self.selected_project)
}
fn selected_session<'a>(&self, project: &'a ProjectWithSessions) -> Option<&'a Session> {
project
.sessions
.iter()
.find(|session| Some(session.id) == self.selected_session)
}
}
pub(crate) fn app_theme() -> Theme {
let palette = Palette {
background: Color::from_rgb8(29, 29, 31),
text: Color::from_rgb8(235, 235, 235),
primary: Color::from_rgb8(85, 118, 255),
success: Color::from_rgb8(72, 176, 112),
danger: Color::from_rgb8(220, 80, 86),
};
Theme::custom_with_fn("DS4Server".into(), palette, |palette| {
let mut extended = palette::Extended::generate(palette);
extended.background.weak = palette::Pair::new(Color::from_rgb8(38, 38, 40), palette.text);
extended.background.strong = palette::Pair::new(Color::from_rgb8(58, 58, 61), palette.text);
extended.secondary.base = palette::Pair::new(Color::from_rgb8(47, 47, 50), palette.text);
extended.secondary.weak = palette::Pair::new(Color::from_rgb8(41, 41, 44), palette.text);
extended.secondary.strong = palette::Pair::new(Color::from_rgb8(57, 57, 60), palette.text);
extended
})
}
fn sidebar_style(_: &Theme) -> container::Style {
container::Style::default().background(Color::from_rgb8(23, 23, 25))
}
fn icon(data: &'static [u8], size: u16) -> Svg<'static> {
svg(svg::Handle::from_memory(data))
.width(size as f32)
.height(size as f32)
.style(|theme: &Theme, _| iced::widget::svg::Style {
color: Some(theme.palette().text),
})
}
#[cfg(test)]
mod tests {
use super::*;
#[test]
fn raised_surfaces_stay_dark() {
let theme = app_theme();
let palette = theme.extended_palette();
assert_eq!(palette.background.weak.color, Color::from_rgb8(38, 38, 40));
assert_eq!(palette.secondary.base.color, Color::from_rgb8(47, 47, 50));
}
}