import { Button, VerticalBox , HorizontalBox, TabWidget, ListView, StandardListView, StandardTableView, CheckBox} from "std-widgets.slint";
import {SelectableTableView} from "selectable_tree_view.slint";
import {LeftSidePanel} from "left_side_panel.slint";
import {CurrentTab, TypeOfOpenedItem} from "common.slint";
import {MainListModel} from "common.slint";
import {SettingsList} from "settings_list.slint";
import {GuiState} from "gui_state.slint";

export component MainList {
    in-out property <[MainListModel]> empty_folder_model: [
        {checked: false, selected_row: false, header_row: true, val: ["kropkarz", "/Xd1", "24.10.2023"]} ,
        {checked: false, selected_row: false, header_row: false, val: ["witasphere", "/Xd1/Imagerren2", "25.11.1991"]} ,
        {checked: false, selected_row: false, header_row: false, val: ["witasphere", "/Xd1/Imagerren2", "25.11.1991"]} ,
        {checked: true, selected_row: false, header_row: false, val: ["lokkaler", "/Xd1/Vide2", "01.23.1911"]}
    ];
    in-out property <[MainListModel]> empty_files_model;
    in-out property <[MainListModel]> similar_images_model;
    callback changed_current_tab();
    callback released_key(string);
    
    empty_folders := SelectableTableView {
        visible: GuiState.active_tab == CurrentTab.EmptyFolders;
        min-width: 200px;
        height: parent.height;
        columns: ["Selection", "Folder Name", "Path", "Modification Date"];
        column-sizes: [35px, 100px, 350px, 150px];
        values <=> empty-folder-model;
        parentPathIdx: 2;
        fileNameIdx: 1;
    }

    empty_files := SelectableTableView {
        visible: GuiState.active_tab == CurrentTab.EmptyFiles;
        min-width: 200px;
        height: parent.height;
        columns: ["Selection", "File Name", "Path", "Modification Date"];
        column-sizes: [35px, 100px, 350px, 150px];
        values <=> empty-files-model;
        parentPathIdx: 2;
        fileNameIdx: 1;
    }

    similar_images := SelectableTableView {
        visible: GuiState.active_tab == CurrentTab.SimilarImages;
        min-width: 200px;
        height: parent.height;
        columns: ["Selection", "Similarity", "Size", "Dimensions", "File Name", "Path", "Modification Date"];
        column-sizes: [35px, 80px, 80px, 80px, 100px, 350px, 150px];
        values <=> similar-images-model;
        parentPathIdx: 5;
        fileNameIdx: 4;
    }

    settings_list := SettingsList {
        visible: GuiState.active_tab == CurrentTab.Settings;
    }

    focus_item := FocusScope {
        width: 0px; // Hack to not steal first click from other components - https://github.com/slint-ui/slint/issues/3503
        // Hack not works https://github.com/slint-ui/slint/issues/3503#issuecomment-1817809834 because disables key-released event

        key-released(event) => {
            if (!self.visible || !self.has-focus) {
                return accept;
            }
            if (GuiState.active_tab == CurrentTab.EmptyFiles) {
                empty_files.released_key(event);
            } else if (GuiState.active_tab == CurrentTab.EmptyFolders) {
                empty-folders.released_key(event);
            } else if (GuiState.active_tab == CurrentTab.SimilarImages) {
                similar-images.released_key(event);
            } else {
                debug("Non handled key in main_lists.slint");
            }
            accept
        }
    }
    changed_current_tab() => {
        empty_folders.deselect_selected_item();
        empty_files.deselect_selected_item();
        similar_images.deselect_selected_item();
    }
}