rahix/openflexure-microscope-server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix persistance in pinia store

Browse source
This commit is contained in:
Julian Stirling 2026-04-30 09:44:41 +01:00
parent 793441aadf
commit ebd67cd410
3 changed files with 114 additions and 102 deletions
Download patch file Download diff file Expand all files Collapse all files

2
webapp/src/components/tabContentComponents/aboutComponents/devTools.vue
View file

@ -31,7 +31,7 @@ export default {
methods: { methods: {
overrideAPIHost(event) { overrideAPIHost(event) {
if (this.reloadWhenOverridingOrigin) { if (!this.reloadWhenOverridingOrigin) {
this.origin = this.overrideOrigin; this.origin = this.overrideOrigin;
event.preventDefault(); event.preventDefault();
} }

8
webapp/src/stores/settings.js
View file

@ -99,7 +99,13 @@ export const useSettingsStore = defineStore(
{ {
// PiniaPluginPersistedState will now automatically persist ONLY these specific refs to localStorage // PiniaPluginPersistedState will now automatically persist ONLY these specific refs to localStorage
persist: { persist: {
paths: ["appTheme", "disableStream", "navigationStepSize", "navigationInvert"], pick: [
"appTheme",
"overrideOrigin",
"disableStream",
"navigationStepSize",
"navigationInvert",
],
}, },
}, },
); );

206
webapp/src/stores/wot.js
View file

@ -2,114 +2,120 @@ import { defineStore } from "pinia";
import { ref, computed } from "vue"; import { ref, computed } from "vue";
import axios from "axios"; import axios from "axios";
export const useWotStore = defineStore("wot", () => { export const useWotStore = defineStore(
// State "wot",
const thingDescriptions = ref({}); () => {
const servient = ref(null); // State
const helpers = ref(null); const thingDescriptions = ref({});
// Actions const servient = ref(null);
function addThingDescription(thingName, thingDescription) { const helpers = ref(null);
thingDescriptions.value[thingName] = thingDescription; // Actions
} function addThingDescription(thingName, thingDescription) {
thingDescriptions.value[thingName] = thingDescription;
function removeThingDescription(thingName) {
delete thingDescriptions.value[thingName];
}
function removeAllThingDescriptions() {
thingDescriptions.value = {};
}
async function fetchThingDescription(uri, name = null) {
// Fetch the thing description from the given URI and consume it
// NB this should only be called once, or we'll duplicate effort.
// Deduplication should be done elsewhere.
const response = await axios.get(uri);
const td = response.data;
const thingName = name || uri.replace(/\/$/, "").split("/").pop();
addThingDescription(thingName, td);
}
async function fetchThingDescriptions(uri) {
// Fetch thing descriptions from the given URI
const response = await axios.get(uri);
if (response.status !== 200) throw "Could not retrieve thing descriptions";
for (const k in response.data) {
let thingName = k.replace(/\/$/, "").replace(/^\//, "");
addThingDescription(thingName, response.data[k]);
} }
}
const thingList = computed(() => Object.keys(thingDescriptions.value)); function removeThingDescription(thingName) {
delete thingDescriptions.value[thingName];
}
const thingAvailable = computed(() => (thingName) => { function removeAllThingDescriptions() {
return thingName in thingDescriptions.value; thingDescriptions.value = {};
}); }
const thingAffordanceAvailable = computed(() => (thing, affordanceType, affordance) => { async function fetchThingDescription(uri, name = null) {
const td = thingDescriptions.value[thing]; // Fetch the thing description from the given URI and consume it
if (!td || !td[affordanceType]) return false; // NB this should only be called once, or we'll duplicate effort.
return affordance in td[affordanceType]; // Deduplication should be done elsewhere.
}); const response = await axios.get(uri);
const td = response.data;
const thingName = name || uri.replace(/\/$/, "").split("/").pop();
addThingDescription(thingName, td);
}
const thingFormUrl = computed( async function fetchThingDescriptions(uri) {
() => // Fetch thing descriptions from the given URI
(thing, affordanceType, affordance, op, allowUndefined = true) => { const response = await axios.get(uri);
// Find the URL for a particular operation if (response.status !== 200) throw "Could not retrieve thing descriptions";
const td = thingDescriptions.value[thing]; for (const k in response.data) {
if (!td) { let thingName = k.replace(/\/$/, "").replace(/^\//, "");
if (allowUndefined) return undefined; addThingDescription(thingName, response.data[k]);
throw `Could not find form for ${affordanceType} ${thing}/${affordance} with op ${op}`; }
} }
const affordances = td[affordanceType];
if (!affordances || !(affordance in affordances)) {
if (allowUndefined) return undefined;
throw `Could not find form for ${affordanceType} ${thing}/${affordance} with op ${op}`;
}
let href = findFormHref(affordances[affordance], op);
if (href === undefined) {
if (allowUndefined) return undefined;
throw `Could not find form for ${affordanceType} ${thing}/${affordance} with op ${op}`;
}
// If we've found an href, prepend the `base` URL if appropriate
if (href.startsWith("http")) return href;
if ("base" in td) {
let base = td.base;
if (href.startsWith("/")) href = href.slice(1);
if (!base.endsWith("/")) base += "/";
return base + href;
}
return href;
},
);
const thingPropertyUrl = computed(() => (thing, property, op, allowUndefined) => { const thingList = computed(() => Object.keys(thingDescriptions.value));
// Find the URL for a particular property
return thingFormUrl.value(thing, "properties", property, op, allowUndefined);
});
const thingActionUrl = computed(() => (thing, action, op, allowUndefined) => { const thingAvailable = computed(() => (thingName) => {
// Find the URL for a particular action return thingName in thingDescriptions.value;
return thingFormUrl.value(thing, "actions", action, op, allowUndefined); });
});
return { const thingAffordanceAvailable = computed(() => (thing, affordanceType, affordance) => {
thingDescriptions, const td = thingDescriptions.value[thing];
servient, if (!td || !td[affordanceType]) return false;
helpers, // State return affordance in td[affordanceType];
thingList, });
thingAvailable, // Helpers
thingFormUrl, const thingFormUrl = computed(
thingPropertyUrl, () =>
thingActionUrl, (thing, affordanceType, affordance, op, allowUndefined = true) => {
fetchThingDescription, // Find the URL for a particular operation
fetchThingDescriptions, // Actions const td = thingDescriptions.value[thing];
addThingDescription, if (!td) {
removeThingDescription, if (allowUndefined) return undefined;
removeAllThingDescriptions, throw `Could not find form for ${affordanceType} ${thing}/${affordance} with op ${op}`;
thingAffordanceAvailable, }
}; const affordances = td[affordanceType];
}); if (!affordances || !(affordance in affordances)) {
if (allowUndefined) return undefined;
throw `Could not find form for ${affordanceType} ${thing}/${affordance} with op ${op}`;
}
let href = findFormHref(affordances[affordance], op);
if (href === undefined) {
if (allowUndefined) return undefined;
throw `Could not find form for ${affordanceType} ${thing}/${affordance} with op ${op}`;
}
// If we've found an href, prepend the `base` URL if appropriate
if (href.startsWith("http")) return href;
if ("base" in td) {
let base = td.base;
if (href.startsWith("/")) href = href.slice(1);
if (!base.endsWith("/")) base += "/";
return base + href;
}
return href;
},
);
const thingPropertyUrl = computed(() => (thing, property, op, allowUndefined) => {
// Find the URL for a particular property
return thingFormUrl.value(thing, "properties", property, op, allowUndefined);
});
const thingActionUrl = computed(() => (thing, action, op, allowUndefined) => {
// Find the URL for a particular action
return thingFormUrl.value(thing, "actions", action, op, allowUndefined);
});
return {
thingDescriptions,
servient,
helpers, // State
thingList,
thingAvailable, // Helpers
thingFormUrl,
thingPropertyUrl,
thingActionUrl,
fetchThingDescription,
fetchThingDescriptions, // Actions
addThingDescription,
removeThingDescription,
removeAllThingDescriptions,
thingAffordanceAvailable,
};
},
{
persist: false,
},
);
export function findFormHref(affordance, op) { export function findFormHref(affordance, op) {
// Find the form in the affordance that matches the given operation type // Find the form in the affordance that matches the given operation type