import { reactive } from 'vue';

const state = reactive({
  toast: null,
  modal: null,
  sidebarOpen: false
});

let toastTimer;

function notify(title, message = '', tone = 'success') {
  state.toast = { title, message, tone };
  clearTimeout(toastTimer);
  toastTimer = setTimeout(() => {
    state.toast = null;
  }, 3200);
}

function openModal(component, props = {}) {
  state.modal = { component, props };
}

function closeModal() {
  state.modal = null;
}

export const uiStore = {
  state,
  notify,
  openModal,
  closeModal
};
