Skip to content

Commit

Permalink
Prevent excessive api/tool_panels calls by keeping views in store
Browse files Browse the repository at this point in the history
Also remove extra api call added by mistake in galaxyproject#17021
  • Loading branch information
ahmedhamidawan committed Nov 16, 2023
1 parent 19b0ffd commit 82febc2
Show file tree
Hide file tree
Showing 2 changed files with 25 additions and 13 deletions.
17 changes: 5 additions & 12 deletions client/src/components/Panels/ToolPanel.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,10 @@
import { library } from "@fortawesome/fontawesome-svg-core";
import { faCaretDown } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
import axios from "axios";
import { storeToRefs } from "pinia";
import { computed, onMounted, ref, watch } from "vue";
import { getAppRoot } from "@/onload";
import { type PanelView, useToolStore } from "@/stores/toolStore";
import { useToolStore } from "@/stores/toolStore";
import localize from "@/utils/localization";
import { types_to_icons } from "./utilities";
Expand Down Expand Up @@ -35,21 +33,16 @@ const emit = defineEmits<{
}>();
const arePanelsFetched = ref(false);
const defaultPanelView = ref("");
const toolStore = useToolStore();
const { currentPanelView, isPanelPopulated } = storeToRefs(toolStore);
const { currentPanelView, defaultPanelView, isPanelPopulated, panelViews } = storeToRefs(toolStore);
const query = ref("");
const panelViews = ref<Record<string, PanelView> | null>(null);
const showAdvanced = ref(false);
onMounted(async () => {
await axios
.get(`${getAppRoot()}api/tool_panels`)
.then(async ({ data }) => {
const { default_panel_view, views } = data;
defaultPanelView.value = default_panel_view;
panelViews.value = views;
await toolStore
.fetchPanelViews()
.then(async () => {
await initializeTools();
})
.catch((error) => {
Expand Down
21 changes: 20 additions & 1 deletion client/src/stores/toolStore.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import Vue, { computed, Ref, ref } from "vue";
import { createWhooshQuery, filterTools, types_to_icons } from "@/components/Panels/utilities";
import { useUserLocalStorage } from "@/composables/userLocalStorage";
import { getAppRoot } from "@/onload/loadConfig";
import { rethrowSimple } from "@/utils/simple-error";

export interface Tool {
model_class: string;
Expand Down Expand Up @@ -73,9 +74,11 @@ export interface PanelView {

export const useToolStore = defineStore("toolStore", () => {
const currentPanelView: Ref<string> = useUserLocalStorage("tool-store-view", "");
const defaultPanelView: Ref<string> = ref("");
const toolsById = ref<Record<string, Tool>>({});
const toolResults = ref<Record<string, string[]>>({});
const panel = ref<Record<string, Record<string, Tool | ToolSection>>>({});
const panelViews = ref<Record<string, PanelView>>({});
const loading = ref(false);

const getToolForId = computed(() => {
Expand Down Expand Up @@ -177,6 +180,20 @@ export const useToolStore = defineStore("toolStore", () => {
}
}

async function fetchPanelViews() {
if (defaultPanelView.value && Object.keys(panelViews.value).length > 0) {
return;
}
try {
const { data } = await axios.get(`${getAppRoot()}api/tool_panels`);
const { default_panel_view, views } = data;
defaultPanelView.value = default_panel_view;
panelViews.value = views;
} catch (e) {
rethrowSimple(e);
}
}

// Used to initialize the ToolPanel with the default panel view for this site.
async function initCurrentPanelView(siteDefaultPanelView: string) {
if (!loading.value && !isPanelPopulated.value) {
Expand Down Expand Up @@ -209,7 +226,6 @@ export const useToolStore = defineStore("toolStore", () => {
}
loading.value = true;
try {
await axios.get(`${getAppRoot()}api/tool_panels/${panelView}`);
const { data } = await axios.get(`${getAppRoot()}api/tool_panels/${panelView}`);
currentPanelView.value = panelView;
savePanelView(panelView, data);
Expand Down Expand Up @@ -249,7 +265,9 @@ export const useToolStore = defineStore("toolStore", () => {
return {
toolsById,
panel,
panelViews,
currentPanelView,
defaultPanelView,
loading,
getToolForId,
getToolNameById,
Expand All @@ -259,6 +277,7 @@ export const useToolStore = defineStore("toolStore", () => {
sectionDatalist,
fetchToolForId,
fetchTools,
fetchPanelViews,
initCurrentPanelView,
setCurrentPanelView,
fetchPanel,
Expand Down

0 comments on commit 82febc2

Please sign in to comment.