use crate::{Button, EditStartParameter, EditStartParameterMessage, McaiField, SharedWorkflow};
use css_in_rust_next::Style;
use mcai_models::{ParameterType, Workflow, WorkflowDefinition};
use std::ops::{Deref, DerefMut, Not};
use yew::{html, Callback, Component, Context, Html, Properties};
use yew_feather::{edit::Edit, plus::Plus};

#[derive(PartialEq, Properties)]
pub struct WorkflowPanelProperties {
  pub workflow: SharedWorkflow,
  pub height: String,
  pub width: String,
  pub step_id: Option<u32>,
  pub event: Option<Callback<WorkflowPanelEvent>>,
}

pub enum WorkflowPanelEvent {
  SetStepIconEvent(u32),
  SetStepNameEvent(u32),
}

pub enum ModalStatus {
  Hidden,
  New,
  Edit(usize),
}

pub enum WorkflowPanelMessage {
  UpdateField,
  IconClick,
  StepNameClick,
  AddStartParameter,
  AppendStartParameter(EditStartParameterMessage),
  EditStartParameter(usize),
}

pub struct WorkflowPanel {
  style: Style,
  start_parameter_modal: ModalStatus,
}

impl Component for WorkflowPanel {
  type Message = WorkflowPanelMessage;
  type Properties = WorkflowPanelProperties;

  fn create(_ctx: &Context<Self>) -> Self {
    let style = Style::create("Component", include_str!("panel.css")).unwrap();
    Self {
      style,
      start_parameter_modal: ModalStatus::Hidden,
    }
  }

  fn update(&mut self, ctx: &Context<Self>, msg: Self::Message) -> bool {
    match msg {
      WorkflowPanelMessage::UpdateField => true,
      WorkflowPanelMessage::IconClick => {
        if let Some(callback) = ctx.props().event.as_ref() {
          if let Some(step_id) = ctx.props().step_id {
            callback.emit(WorkflowPanelEvent::SetStepIconEvent(step_id));
            return true;
          }
        }
        false
      }
      WorkflowPanelMessage::StepNameClick => {
        if let Some(callback) = ctx.props().event.as_ref() {
          if let Some(step_id) = ctx.props().step_id {
            callback.emit(WorkflowPanelEvent::SetStepNameEvent(step_id));
            return true;
          }
        }
        false
      }
      WorkflowPanelMessage::AddStartParameter => {
        self.start_parameter_modal = ModalStatus::New;
        true
      }
      WorkflowPanelMessage::AppendStartParameter(edit_start_message) => {
        match edit_start_message {
          EditStartParameterMessage::Submit(start_parameter) => {
            if let Workflow::Definition(workflow_definition) =
              ctx.props().workflow.lock().unwrap().deref_mut()
            {
              if let ModalStatus::Edit(index) = self.start_parameter_modal {
                if let Some(parameter) = workflow_definition
                  .get_mut_start_parameters()
                  .get_mut(index)
                {
                  *parameter = start_parameter;
                }
              } else {
                workflow_definition
                  .get_mut_start_parameters()
                  .push(start_parameter);
              }

              self.start_parameter_modal = ModalStatus::Hidden;
            } else {
              return false;
            }
          }
          EditStartParameterMessage::Cancel => {
            self.start_parameter_modal = ModalStatus::Hidden;
          }
          EditStartParameterMessage::Delete => {
            if let ModalStatus::Edit(index) = self.start_parameter_modal {
              if let Workflow::Definition(workflow_definition) =
                ctx.props().workflow.lock().unwrap().deref_mut()
              {
                workflow_definition.get_mut_start_parameters().remove(index);
              }
            }
          }
        }
        true
      }
      WorkflowPanelMessage::EditStartParameter(index) => {
        self.start_parameter_modal = ModalStatus::Edit(index);
        true
      }
    }
  }

  fn view(&self, ctx: &Context<Self>) -> Html {
    let style = format!(
      "height: {}; width: {};",
      ctx.props().height,
      ctx.props().width,
    );

    let modal_edit_start_parameter = match self.start_parameter_modal {
      ModalStatus::Hidden => html!(),
      ModalStatus::New => {
        html!(<EditStartParameter event={ctx.link().callback(WorkflowPanelMessage::AppendStartParameter)} />)
      }
      ModalStatus::Edit(index) => {
        let start_parameter = if let Workflow::Definition(workflow_definition) =
          ctx.props().workflow.lock().unwrap().deref()
        {
          workflow_definition
            .get_start_parameters()
            .get(index)
            .cloned()
        } else {
          None
        };

        html!(
          <EditStartParameter event={ctx.link().callback(WorkflowPanelMessage::AppendStartParameter)} start_parameter={start_parameter} />
        )
      }
    };

    let is_definition = ctx.props().workflow.lock().unwrap().is_definition();

    let start_parameters: Html = ctx.props().workflow.lock().unwrap()
      .get_start_parameters()
      .iter()
      .enumerate()
      .map(|(index, start_parameter)| {
        let edit_button = is_definition.then(|| html!(
          <span class="edit_start_parameter">
            <button onclick={ctx.link().callback(move |_| WorkflowPanelMessage::EditStartParameter(index))}>
              <Edit />
            </button>
          </span>
        )).unwrap_or_default();

        html!(
          <div class="start_parameter">
            <label>
              {&start_parameter.label}
            </label>
            {edit_button}
          </div>
        )
      })
      .collect();

    let add_start_parameter = is_definition
      .then(|| {
        html!(
          <div class="actions">
            <Button
              label="Add start parameter"
              icon={html!(<Plus />)}
              onclick={ctx.link().callback(|_| WorkflowPanelMessage::AddStartParameter)}
              />
          </div>
        )
      })
      .unwrap_or_default();

    let edit_start_parameter = html!(
      <>
        <div>
          <label class="sub_title">
            {"Start parameters"}
          </label>
        </div>
        {start_parameters}
        {add_start_parameter}
      </>
    );

    let step_information = ctx
      .props()
      .step_id
      .map(|step_id| {
        let workflow = ctx
          .props()
          .workflow
          .lock()
          .unwrap();

        let jobs: Vec<Html> = workflow
          .jobs()
          .map(|jobs|
            jobs
              .iter()
              .filter(|job| job.step_id == step_id)
              .map(|job| {
                let parameters: Html = job.parameters
                    .iter()
                    .map(|parameter| {
                      html!(
                        <div class="field parameter">
                          <label>
                            {&parameter.id.content}
                          </label>
                          <McaiField
                            kind={parameter.kind.clone()}
                            step_id={Some(step_id)}
                            field_name={parameter.id.content.clone()}
                            workflow={ctx.props().workflow.clone()}
                            event={ctx.link().callback(|_| WorkflowPanelMessage::UpdateField)}
                            />
                        </div>
                      )
                    }).collect();

                let progression = job.get_last_progression();

                let classes = format!("job {}", job.status.first().map(|job_status| job_status.state.clone()).unwrap_or_default());

                html!(
                  <div class={classes}>
                    <div class="field">
                      <label>{"Title"}</label>
                      <span>
                        {&job.name}
                      </span>
                    </div>
                    <div class="field status">
                      <label>{"Status"}</label>
                      <span>
                        {job.status.first().map(|job_status| html!({&job_status.state})).unwrap_or_default()}
                      </span>
                    </div>
                    <div class="field">
                      <label>{"Last Worker Instance ID"}</label>
                      <span>
                        {job.last_worker_instance_id.clone().unwrap_or_default()}
                      </span>
                    </div>
                    <div class="field">
                      <label>{"Progression"}</label>
                      <span>
                        {progression.map(|progression| progression.progression).unwrap_or_default()}
                      </span>
                    </div>
                    <div>
                      <label style="font-weight: bold;">{"Parameters"}</label>
                      <span>
                        {parameters}
                      </span>
                    </div>
                  </div>
                )
              })
              .collect()
          )
          .unwrap_or_default();

        let jobs = jobs
          .is_empty()
          .not()
          .then(||
            html!(
              <div class="jobs">
                <label>{"Jobs"}</label>
                <div class="inner">
                  {jobs}
                </div>
              </div>
            )
          )
          .unwrap_or_default();

        workflow
          .steps()
          .iter()
          .find(|step| step.id == step_id)
          .map(|step| {
            let parameters: Html = step.parameters
              .iter()
              .map(|parameter| {
                log::warn!("{:?}", parameter.kind);
                html!(
                  <div class="field parameter">
                    <label>
                      {&parameter.id.content}
                    </label>
                    <McaiField
                      kind={parameter.kind.clone()}
                      step_id={Some(step_id)}
                      field_name={parameter.id.content.clone()}
                      workflow={ctx.props().workflow.clone()}
                      event={ctx.link().callback(|_| WorkflowPanelMessage::UpdateField)}
                      />
                  </div>
                )
              }).collect();

            let step_name = ParameterType::String {default: None, value: Some(step.name.clone()), required: true };
            let step_icon = ParameterType::String {default: None, value: Some(step.icon.to_string()), required: false };

            html! {
              <div class="step">
                <div class="title">
                  {format!("Step {}", step.label)}
                </div>
                <div class="content">
                  <div class="field">
                    <label>{"Name"}</label>
                    <McaiField
                      kind={step_name}
                      step_id={step.id}
                      field_name="name"
                      workflow={ctx.props().workflow.clone()}
                      event={ctx.link().callback(|_| WorkflowPanelMessage::UpdateField)}
                      />
                  </div>
                  <div class="field">
                    <label>{"Icon"}</label>
                    <McaiField
                      kind={step_icon}
                      step_id={step.id}
                      field_name="icon"
                      is_icon=true
                      workflow={ctx.props().workflow.clone()}
                      event={ctx.link().callback(|_| WorkflowPanelMessage::UpdateField)}
                      />
                  </div>
                  <div>
                    <label style="font-weight: bold;">{"Parameters"}</label>
                    <span>
                      {parameters}
                    </span>
                  </div>
                  {jobs}
                </div>
              </div>
            }
          })
          .unwrap_or_default()
      })
      .unwrap_or_else(|| {
        let reference = ctx
          .props()
          .workflow
          .lock()
          .unwrap()
          .reference()
          .map(|reference| html!(
            <div class="field">
              <label>
                {"Reference"}
              </label>
              <span>
                {reference}
              </span>
            </div>
          ))
          .unwrap_or_default();

        let workflow = ctx.props().workflow.lock().unwrap();
        let identifier = workflow.identifier();
        let version = workflow.version();

        let schema_version = match workflow.deref() {
          Workflow::Definition(WorkflowDefinition::Version1_8(_)) => "1.8".to_string(),
          Workflow::Definition(WorkflowDefinition::Version1_9(_)) => "1.9".to_string(),
          Workflow::Definition(WorkflowDefinition::Version1_10(_)) => "1.10".to_string(),
          Workflow::Instance(workflow_instance) => workflow_instance.schema_version.clone()
        };

        html!(
          <>
            <div class="title">
              <label>{format!("Workflow {}", identifier)}</label>
            </div>
            <div class="content">
              <div class="field">
                <label>
                  {"Version"}
                </label>
                <span>
                  {version}
                </span>
              </div>
              <div class="field">
                <label>
                  {"Schema version"}
                </label>
                <span>
                  {schema_version}
                </span>
              </div>
              {edit_start_parameter}
              {reference}
            </div>
          </>
        )
      });

    html!(
      <span class={self.style.clone()} style={style}>
        {step_information}
        {modal_edit_start_parameter}
      </span>
    )
  }
}