Modernize webhook wrappers, remove backbone dependency (31d0f63b) · Commits · NDIP / Galaxy

client/src/components/Common/Webhook.vue

+22 −11

Original line number	Diff line number	Diff line
		<script setup lang="ts">
		import { appendScriptStyle } from "@/utils/utils";
		import { loadWebhooks, pickWebhook } from "@/utils/webhooks";
		import { onMounted, ref } from "vue";

		import Webhooks from "@/utils/webhooks";

		interface Props {
		type: string;
		toolId?: string;
		toolVersion?: string;
		}

		const props = withDefaults(defineProps<Props>(), {
		toolId: undefined,
		toolId: "",
		toolVersion: "",
		});

		const webhook = ref(null);
		const container = ref<HTMLElement \| null>(null);
		const webhookId = ref<string \| null>(null);

		onMounted(() => {
		new Webhooks.WebhookView({
		webhook,
		type: props.type,
		toolId: props.toolId,
		});
		onMounted(async () => {
		if (container.value) {
		container.value.setAttribute("tool_id", props.toolId);
		container.value.setAttribute("tool_version", props.toolVersion);
		}

		const webhooks = await loadWebhooks();
		if (webhooks.length > 0) {
		const model = pickWebhook(webhooks);
		webhookId.value = model.id;
		appendScriptStyle(model);
		}
		});
		</script>

		<template>
		<div id="webhook-view" ref="webhook" />
		<div ref="container">
		<div v-if="webhookId" :id="webhookId"></div>
		</div>
		</template>

client/src/components/Workflow/Run/WorkflowRunSuccess.vue

+11 −14

Original line number	Diff line number	Diff line
		<script setup lang="ts">
		import { onMounted } from "vue";
		import { computed, onMounted } from "vue";

		import type { WorkflowInvocation } from "@/api/invocations";
		import Webhooks from "@/utils/webhooks";
		import { startWatchingHistory } from "@/watch/watchHistoryProvided";

		import Webhook from "@/components/Common/Webhook.vue";
		import GridInvocation from "@/components/Grid/GridInvocation.vue";
		import WorkflowInvocationState from "@/components/WorkflowInvocationState/WorkflowInvocationState.vue";

		@@ -14,20 +14,17 @@ const props = defineProps<{
		}>();

		onMounted(() => {
		new Webhooks.WebhookView({
		type: "workflow",
		toolId: null,
		toolVersion: null,
		});
		startWatchingHistory();
		});

		const targetHistories = props.invocations.reduce((histories, invocation) => {
		const targetHistories = computed(() =>
		props.invocations.reduce((histories, invocation) => {
		if (invocation.history_id && !histories.includes(invocation.history_id)) {
		histories.push(invocation.history_id);
		}
		return histories;
		}, [] as string[]);
		}, [] as string[])
		);
		</script>

		<template>
		@@ -46,6 +43,6 @@ const targetHistories = props.invocations.reduce((histories, invocation) => {
		:invocation-id="props.invocations[0].id"
		is-full-page
		success />
		<div id="webhook-view"></div>
		<Webhook type="workflow" />
		</div>
		</template>

client/src/onload/globalInits/onloadWebhooks.js

+8 −12

Original line number	Diff line number	Diff line
		import Utils from "utils/utils";
		import Webhooks from "utils/webhooks";
		import { appendScriptStyle } from "utils/utils";
		import { loadWebhooks } from "utils/webhooks";

		export function onloadWebhooks(Galaxy) {
		export async function onloadWebhooks(Galaxy) {
		if (Galaxy.config.enable_webhooks) {
		Webhooks.load({
		type: "onload",
		callback: function (webhooks) {
		const webhooks = await loadWebhooks("onload");
		webhooks.forEach((webhook) => {
		if (webhook.activate && webhook.script) {
		Utils.appendScriptStyle(webhook);
		appendScriptStyle(webhook);
		}
		});
		},
		});
		}
		}

client/src/utils/webhooks.js

+8 −56

Original line number	Diff line number	Diff line
		import axios from "axios";
		import Backbone from "backbone";
		import { getAppRoot } from "onload/loadConfig";
		import { appendScriptStyle } from "utils/utils";

		import { rethrowSimple } from "@/utils/simple-error";

		let webhookData = undefined;

		async function getWebHookData() {
		async function getWebhookData() {
		if (webhookData === undefined) {
		try {
		const { data } = await axios.get(`${getAppRoot()}api/webhooks`);
		@@ -19,57 +17,16 @@ async function getWebHookData() {
		return webhookData;
		}

		const WebhookView = Backbone.View.extend({
		el: "#webhook-view",

		initialize: function (options) {
		const toolId = options.toolId \|\| "";
		const toolVersion = options.toolVersion \|\| "";

		this.$el.attr("tool_id", toolId);
		this.$el.attr("tool_version", toolVersion);

		getWebHookData().then((data) => {
		const filteredData = filterData(data, options);
		if (filteredData.length > 0) {
		this.render(weightedRandomPick(filteredData));
		}
		});
		},

		render: function (model) {
		this.$el.html(`<div id="${model.id}"></div>`);
		appendScriptStyle(model);
		return this;
		},
		});

		function filterData(data, options) {
		let filteredData = data;
		if (options.type) {
		filteredData = filterType(data, options.type);
		}
		return filteredData;
		}

		const load = (options) => {
		getWebHookData().then((data) => {
		options.callback(filterData(data, options));
		});
		};

		function filterType(data, type) {
		return data.filter((item) => {
		const itype = item.type;
		if (itype) {
		return itype.indexOf(type) !== -1;
		export async function loadWebhooks(type) {
		const webhooks = await getWebhookData();
		if (type) {
		return webhooks.filter((item) => item.type && item.type.indexOf(type) !== -1);
		} else {
		return false;
		return webhooks;
		}
		});
		}

		function weightedRandomPick(data) {
		export function pickWebhook(data) {
		const weights = data.map((d) => d.weight);
		const sum = weights.reduce((a, b) => a + b);

		@@ -87,8 +44,3 @@ function weightedRandomPick(data) {

		return data.at(table[Math.floor(Math.random() * table.length)]);
		}

		export default {
		WebhookView: WebhookView,
		load: load,
		};

Admin message