use ratatui::{
    prelude::*,
    style::{Color, Style},
    widgets::*,
    Frame,
};

use crate::app::App;

/// Renders the user interface.
pub fn render(app: &mut App, frame: &mut Frame) {
    let chunks = Layout::default()
        .direction(Direction::Vertical)
        .margin(2)
        .constraints(
            [
                Constraint::Length(1),
                Constraint::Length(3),
                Constraint::Min(1),
            ]
            .as_ref(),
        )
        .split(frame.size());

    let text: Vec<Line> = vec![Line::from(vec![
        "Press ".into(),
        "Esc".bold(),
        " or ".into(),
        "Ctrl+C".bold(),
        " to quit, and ".into(),
        "Enter".bold(),
        " to submit your query.".into(),
    ])];
    let help_message = Paragraph::new(text);
    frame.render_widget(help_message, chunks[0]);

    let width = chunks[0].width.max(3) - 3;

    let scroll = app.input.visual_scroll(width as usize);
    let input = Paragraph::new(app.input.value())
        .style(Style::default().fg(Color::Yellow))
        .scroll((0, scroll as u16))
        .block(
            Block::default()
                .borders(Borders::ALL)
                .title("Search (Anime)"),
        );
    frame.render_widget(input, chunks[1]);

    let raw_results = &*app.list.items;
    let mut results: Vec<String> = Vec::new();
    for i in raw_results {
        results.push(format!("{}\n{}", i.title, i.releaseDate));
    }

    let list = List::new(results)
        .block(Block::bordered().title("Search Results"))
        .style(Style::default().fg(Color::White))
        .highlight_style(Style::default().add_modifier(Modifier::ITALIC))
        .highlight_symbol("┃ ")
        .repeat_highlight_symbol(true)
        .direction(ListDirection::TopToBottom);

    frame.render_stateful_widget(list, chunks[2], &mut app.list.state);
}