<template>
</template>
<script setup>
    import { useMessage } from 'naive-ui'
    import { watch, defineProps, onUpdated, onMounted } from 'vue'

    const message = useMessage()
    const props = defineProps(['messages'])

    onMounted(() => {
        displayNewMessages(props.messages)
    })

    onUpdated(() => {
        displayNewMessages(props.messages)
    })

    function displayNewMessages(messages) {

        if (messages) {
            const stack = [messages];
            while (stack?.length > 0) {
                const currentObj = stack.pop();
                Object.keys(currentObj).forEach(key => {
                    console.log(`key: ${key}, value: ${currentObj[key]}`);

                    if (typeof currentObj[key] === 'object' && currentObj[key] !== null) {
                        stack.push(currentObj[key]);
                    }
                });
                }
        }
        
        /*
        if(temp?.errors) {
            for (let key in temp.errors){
                message.error(translateError(temp.errors[key]),{
                    closable: true
                })
                delete temp.errors[key]
            }
            if(isEmpty(temp.errors)) delete temp['errors']
        }
        if(!isEmpty(temp)) {
            message.error(JSON.stringify(temp),{
                closable: true
            })
        }*/
    }

    function translateError(errorMsg) {
        switch(errorMsg.split(":")[0]) {
            case 'E_INVALID_AUTH_PASSWORD':
                return "Falsches Passwort eingegeben."
            case 'E_INVALID_AUTH_UID':
                return "Benutzername nicht gefunden"
        }
        return errorMsg
    }

    function isEmpty(obj) {
        return Object.keys(obj).length === 0;
    }
</script>