import {computed} from "vue";
import {WordpressData} from "../interfaces";

const structure = {
    menuTitle: 0,
    capability: 1,
    slug: 2,
    pageTitle: 3,
    classes: 4,
    hookName: 5,
    iconUrl: 6
}

// NÃO FUNCIONA MUITO BEM - GUARDAR PARA REGISTRO
export function useWordpressMenu(apiData: WordpressData) {
    // Fix: unusual menu item indexes if used by other plugins. Ex: 12.345 (floating points) - Saw in All-in-one WP Migration plugin.
    const raw = computed(() => {
        let orderedItems: string[] = []
        Object.keys(apiData.menu)
            .sort((a: string, b: string) => parseFloat(a) - parseFloat(b))
            .forEach((orderedKey: string) => {
                orderedItems.push(apiData.menu[parseFloat(orderedKey)])
            })

        // Remove badges (contagem de itens após os títulos) dos nomes dos menus
        return orderedItems.map(item => {
            const newItem = [...item]
            newItem[structure.menuTitle] = newItem[structure.menuTitle].replace(/<.*>/, '')
            return newItem
        })
    })

    // Menu Items
    const all = computed(() => raw.value.map(
        (item: string[]): string => item[structure.slug]
    ))
    // const hidden = ref<string[]>(apiData.selected)
    // const visible = computed(() => {
    //     return all.value.filter(x => !hidden.value.includes(x))
    // })

    return {structure, raw, all} //, hidden, visible}
}