Unverified Commit 98690d96 authored by Dannon Baker's avatar Dannon Baker
Browse files

Pinia plugin fixes when using component mounting utilities. This has

changed multiple times in descendant branches so this is a flattened,
cleaned up version for application against 24.0.
parent d2aea97a
Loading
Loading
Loading
Loading
+21 −7
Original line number Diff line number Diff line
@@ -4,8 +4,12 @@

import BootstrapVue from "bootstrap-vue";
import { iconPlugin, localizationPlugin, vueRxShortcutPlugin } from "components/plugins";
import { createPinia, getActivePinia, PiniaVuePlugin } from "pinia";
import Vue from "vue";

// Load Pinia
Vue.use(PiniaVuePlugin);

// Bootstrap components
Vue.use(BootstrapVue);

@@ -18,15 +22,25 @@ Vue.use(vueRxShortcutPlugin);
// font-awesome svg icon registration/loading
Vue.use(iconPlugin);

export const mountVueComponent = (ComponentDefinition) => {
function getOrCreatePinia() {
    // We sometimes use this utility mounting function in a context where there
    // is no existing vue application or pinia store (e.g. individual charts
    // displayed in an iframe).
    // To support both use cases, we will create a new pinia store and attach it
    // to the vue application that is created for the component if missing.
    return getActivePinia() || createPinia();
}

export function mountVueComponent(ComponentDefinition) {
    const component = Vue.extend(ComponentDefinition);
    return (propsData, el) => new component({ propsData, el });
    return function (propsData, el) {
        return new component({ propsData, el, pinia: getOrCreatePinia() });
    };
}

export const replaceChildrenWithComponent = (el, ComponentDefinition, propsData = {}) => {
export function replaceChildrenWithComponent(el, ComponentDefinition, propsData = {}) {
    const container = document.createElement("div");
    el.replaceChildren(container);
    const component = Vue.extend(ComponentDefinition);
    const mountFn = (propsData, el) => new component({ propsData, el });
    const mountFn = mountVueComponent(ComponentDefinition);
    return mountFn(propsData, container);
};
}