import ErrorModal from "./index.vue";

let isShowingErrorModal = false;
let currentApp = null;

export const ErrorModalService = {
  show(responseData) {
    if (isShowingErrorModal && currentApp) {
      currentApp._instance.props.responseData = responseData;
      return;
    }

    isShowingErrorModal = true;

    const container = document.createElement("div");
    document.body.appendChild(container);

    const app = createApp({
      data() {
        return {
          data: responseData,
        };
      },
      render() {
        return h(ErrorModal, {
          responseData: this.data,
          onClose: () => {
            isShowingErrorModal = false;
            currentApp = null;

            app.unmount();
            document.body.removeChild(container);
          },
        });
      },
    });

    currentApp = app;
    app.mount(container);
  },
};