Fix reactive nature of generic resource store
Some checks failed
/ golint (push) Failing after 10s

These changes are meant to make it possible for new events that come in
to immediately render in the components that depend on them.
This commit is contained in:
Eli Ribble 2026-05-21 23:09:11 +00:00
parent 74ef9a8b3a
commit cecb9ef0f0
No known key found for this signature in database
5 changed files with 92 additions and 59 deletions

View file

@ -23,10 +23,7 @@
</template>
<template #center>
<CommunicationColumnDetail
:loading="
storePublicReport.loading ||
storeResource.communication.loadingURI(selectedCommunication?.uri)
"
:loading="storePublicReport.loading || loadingSelectedCommunication"
:mapBounds="mapBounds || undefined"
:mapMarkers="mapMarkers"
:selectedCommunication="selectedCommunication"
@ -36,10 +33,7 @@
</template>
<template #right>
<CommunicationColumnAction
:isLoading="
storePublicReport.loading ||
storeResource.communication.loadingURI(selectedCommunication?.uri)
"
:isLoading="storePublicReport.loading || loadingSelectedCommunication"
@markInvalid="markInvalid"
@markPendingResponse="markPendingResponse"
@markPossibleIssue="markPossibleIssue"
@ -78,6 +72,7 @@ import ImageViewerModal from "@/components/ImageViewerModal.vue";
import ThreeColumn from "@/components/layout/ThreeColumn.vue";
import ToastNotification from "@/components/ToastNotification.vue";
import { useQueryParam } from "@/composable/use-query-param";
import { log } from "@/log";
import { SSEManager } from "@/SSEManager";
import { useStoreResource } from "@/store/resource";
import { useSessionStore } from "@/store/session";
@ -111,10 +106,13 @@ const currentImages = computed(() => {
}
return selectedReport.value?.images ?? [];
});
const loadingSelectedCommunication = computed<boolean>((): boolean => {
return !!selectedCommunication.value;
});
const mapBounds = computed<LngLatBounds | null>((): LngLatBounds | null => {
let bounds = new Bounds();
const loc = selectedReport.value?.location;
console.log("updating for loc", loc);
log.info("updating for loc", loc);
if (loc && loc.latitude != 0 && loc.longitude != 0) {
bounds.addLocation(loc);
}
@ -174,15 +172,16 @@ const mapMarkers = computed<Marker[]>((): Marker[] => {
}
return markers;
});
const selectedCommunication = computedAsync(
async (): Promise<Communication | undefined> => {
if (selectedId.value == undefined) {
return undefined;
}
const all = await storeResource.communication.byAll();
return all.find((c: Communication) => c.id == selectedId.value);
},
);
const selectedCommunication = computed((): Communication | undefined => {
log.info("get selectedCommunication", selectedId.value);
if (!selectedId.value) {
return undefined;
}
const all = Array.from(storeResource.communication.byURI.values());
const result = all.find((c: Communication) => c.id == selectedId.value);
log.info("selectedCommunication", selectedId.value, result);
return result;
});
const selectedReport = computedAsync(
async (): Promise<PublicReport | undefined> => {
if (
@ -195,14 +194,20 @@ const selectedReport = computedAsync(
return await storePublicReport.byURI(selectedCommunication.value.source);
},
);
const visibleCommunications = computedAsync(
async (): Promise<Communication[]> => {
const all = await storeResource.communication.byAll();
return all.filter((c: Communication) => {
return c.status == "new" || c.status == "opened";
});
},
);
const visibleCommunications = computed((): Communication[] | undefined => {
log.info("get visibleCommunications", storeResource.communication.byURI);
if (!storeResource.communication.byURI) {
return undefined;
}
const all: Communication[] = Array.from(
storeResource.communication.byURI.values(),
);
const result = all.filter((c: Communication) => {
return c.status == "new" || c.status == "opened";
});
log.info("visibleCommunications:", result);
return result;
});
const handleDeselect = (id: string) => {
selectedId.value = undefined;
};
@ -256,7 +261,7 @@ async function sendMessage(message: string) {
if (selectedCommunication.value == null) return;
if (selectedReport.value == null) return;
if (session.urls == null) return;
console.log("Sending message reporter:", message);
log.info("Sending message reporter:", message);
const payload = {
message: message,

View file

@ -28,7 +28,7 @@ import { Contact } from "@/type/api";
const storeResource = useStoreResource();
const contacts = computedAsync(() => {
return storeResource.contact.byAll();
return Array.from(storeResource.contact.byURI.values());
});
const selectedContact = ref<Contact | undefined>(undefined);
const handleSelectionChange = (selection: Contact | undefined) => {