Use explicit async component wrapper/factory for CustomToolEditor code splitting (67d86e76) · Commits · NDIP / Galaxy

client/src/entry/analysis/router.js

+16 −2

Original line number	Diff line number	Diff line
		@@ -89,6 +89,7 @@ import ManageObjectStoreIndex from "@/components/ObjectStore/Instances/ManageInd
		import UpgradeObjectStoreInstance from "@/components/ObjectStore/Instances/UpgradeInstance.vue";
		import CreateUserObjectStore from "@/components/ObjectStore/Templates/CreateUserObjectStore.vue";
		import Sharing from "@/components/Sharing/SharingPage.vue";
		// import CustomToolEditor from "@/components/Tool/CustomToolEditor.vue";
		import HistoryStorageOverview from "@/components/User/DiskUsage/Visualizations/HistoryStorageOverview.vue";
		import UserDatasetPermissions from "@/components/User/UserDatasetPermissions.vue";
		import WorkflowPublished from "@/components/Workflow/Published/WorkflowPublished.vue";
		@@ -98,6 +99,19 @@ import WorkflowInvocationState from "@/components/WorkflowInvocationState/Workfl

		Vue.use(VueRouter);

		// Async component for CustomToolEditor to reduce bundle size
		const CustomToolEditor = () => ({
		component: import("@/components/Tool/CustomToolEditor.vue"),
		loading: {
		template: '<div class="text-center"><i class="fa fa-spinner fa-spin"></i> Loading Tool Editor...</div>'
		},
		error: {
		template: '<div class="alert alert-danger">Failed to load Tool Editor</div>'
		},
		delay: 200,
		timeout: 10000
		});

		// patches $router.push() to trigger an event and hide duplication warnings
		patchRouterPush(VueRouter);

		@@ -457,12 +471,12 @@ export function getRouter(Galaxy) {
		},
		{
		path: "/tools/editor",
		component: () => import("@/components/Tool/CustomToolEditor.vue"),
		component: CustomToolEditor,
		redirect: redirectAnon(),
		},
		{
		path: "/tools/editor/:toolUuid",
		component: () => import("@/components/Tool/CustomToolEditor.vue"),
		component: CustomToolEditor,
		redirect: redirectAnon(),
		props: true,
		},