import { Palette } from "@selenite";
import { VTextInput } from "@selenite";
import { VButton, VText, VDatePicker } from "@selenite";
import { AppActions } from "../Actions.slint"; 
import { Modal } from "@selenite";
import { VTimePicker } from "@selenite";
import { ComboBox } from "std-widgets.slint";
import { AppModels } from "../Models.slint";

export component AddEventModal inherits Modal {
	public function open() {
		root.show();
	}

	VerticalLayout {
		padding: 16px;
		spacing: 8px;
		sourceInput := ComboBox {
			model: AppModels.available-sources-strings;
		}
		titleInput := VTextInput {
			label: "title";
		}
		VText { text: "on"; vertical-alignment: bottom;}
		dateInput := VDatePicker {
			enabled: true;
		}
		HorizontalLayout {
			spacing: 4px;
			VText { text: "between"; vertical-alignment: bottom; }
			startTimeInput := VTimePicker {  }
			VText { text: "and"; vertical-alignment: bottom; }
			endTimeInput := VTimePicker {  }
		}
		VButton {
			text: "Create";
			clicked => { 
				AppActions.create-event({
					source-id: AppModels.get-source-id-from-name(sourceInput.current-value),
					title: titleInput.text,
					date: dateInput.date, 
					starts-at: startTimeInput.time,
					ends-at: endTimeInput.time
				});
				root.close();
			}
		}
	 }
}