<script>
import { BuilderPanel } from '../../components';
import SourceExtended from '../SourceExtended';
import DynamicField from './DynamicField/DynamicField.vue';

export default {
    name: 'EssentialsDynamicPanel',

    extends: BuilderPanel,

    events: {
        prepareFields({ origin: { node } }, fields) {
            if (!node) {
                return;
            }

            for (const field of fields) {
                if (!field.source) {
                    continue;
                }

                field.buttons = field.buttons || [];

                // filter out other dynamic buttons
                field.buttons = field.buttons.filter((btn) => btn.action !== 'pickSource');
                field.buttons = field.buttons.filter((btn) => btn.action !== 'essentialsPickSource');

                // replace with essentials dynamic button
                field.buttons = field.buttons.concat([
                    {
                        label: this.$t('Dynamic'),
                        action: 'essentialsPickSource',
                        show: () => true, // show always
                    },
                ]);

                if (SourceExtended.getProp(node, field.name)) {
                    field.component = DynamicField;
                }
            }
        },
    },
};
</script>
