logos-storage/ethcc-demo
1
0
Fork 0
mirror of https://github.com/logos-storage/ethcc-demo.git synced 2026-01-02 21:23:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

Event updates

Browse Source 
- deduplicate events (for some reason contract event subscription callbacks are firing more than once
- order events by timestamp
- prettify event names
- give each event a unique id so they can be deleted one-by-one
This commit is contained in:
Eric 2024-07-06 12:42:24 +03:00
parent 17def5f4d3
commit b3bb759ba8
No known key found for this signature in database
3 changed files with 56 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/NotificationCentre.vue
View File

@ -45,6 +45,11 @@ const buttonClass = computed(() => {
hover: showNotifCentre.value
}
})
const eventsOrdered = computed(() => {
return Object.entries(events.value).sort(([eventIdA, eventA], [eventIdB, eventB]) => {
return eventB.timestamp - eventA.timestamp
})
})
</script>
<template>
@ -83,22 +88,25 @@ const buttonClass = computed(() => {
</a>
</div>
<div class="overflow-y-auto">
<div v-if="events.length === 0" class="pt-6 pb-4 text-gray-900 dark:text-white">
<div
v-if="!events.value || Object.keys(events.value).length === 0"
class="pt-6 pb-4 text-gray-900 dark:text-white"
>
No events
</div>
<div class="flow-root">
<ul role="list" class="text-left divide-y divide-gray-200 dark:divide-gray-700">
<li
v-for="(
{ event, blockNumber, requestId, slotIdx, state, timestamp, moderated }, idx
) in events"
:key="idx"
class="py-3 pr-2 pl-4 pb-3 text-gray-900 dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700"
[eventId, { event, blockNumber, requestId, slotIdx, state, timestamp, moderated }],
idx
) in eventsOrdered"
:key="eventId"
class="cursor-pointer py-3 pr-2 pl-4 pb-3 text-gray-900 dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700"
@click="dismissAndRedirect(requestId)"
>
<div class="flex items-center">
<div class="flex-shrink-0">
<!-- <span class="w-8 h-8 rounded-full" alt="Neil image" /> -->
<CodexImage
:cid="request(requestId).request.content.cid"
:moderated="moderated"
@ -107,10 +115,10 @@ const buttonClass = computed(() => {
/>
</div>
<div class="flex-1 min-w-0 ms-4">
<p class="text-md font-semibold">
<p class="text-md">
<ShortenValue :value="requestId"></ShortenValue>
</p>
<p class="text-sm font-medium text-gray-900 truncate dark:text-white">
<p class="text-sm text-gray-900 truncate dark:text-white">
{{ event }}
</p>
<div
@ -123,7 +131,7 @@ const buttonClass = computed(() => {
<div class="text-sm text-gray-500 truncate dark:text-gray-400">
<RelativeTime :timestamp="new Date(timestamp * 1000)"></RelativeTime>
</div>
<div class="pl-2 cursor-pointer" @click="emit('clearEvent', idx)">
<div class="pl-2 cursor-pointer" @click.stop="emit('clearEvent', eventId)">
<svg
class="w-5 h-5 text-gray-300 hover:text-gray-400 dark:text-gray-600 dark:hover:text-gray-400"
aria-hidden="true"

44
src/stores/events.js
View File

@ -20,29 +20,49 @@ export const useEventsStore = defineStore(
SlotFilled,
SlotFreed
} = marketplace.filters
const events = ref([]) // {event: 'SlotFreed',blockNumber,requestId,slotIdx,state: 'Free'}
const events = ref({}) // {event: 'SlotFreed',blockNumber,requestId,slotIdx,state: 'Free'}
const id = (event, blockNumber, requestId, slotIdx) => {
return `${event}_${blockNumber}_${requestId}_${slotIdx}`
}
function add({ event, blockNumber, requestId, slotIdx, state, timestamp, moderated }) {
events.value.push({ event, blockNumber, requestId, slotIdx, state, timestamp, moderated })
let eventId = id(event, blockNumber, requestId, slotIdx)
events.value[eventId] = {
event,
blockNumber,
requestId,
slotIdx,
state,
timestamp,
moderated
}
}
function clearEvents() {
events.value = []
events.value = {}
}
function clearEvent(idx) {
events.value = events.value.filter((_, index) => index !== idx)
function clearEvent(eventId) {
delete events.value[eventId]
// events.value = events.value.filter((_, index) => index !== idx)
}
function updateModerated(requestId, moderated) {
events.value = events.value.map((event) => {
if (event) {
if (event.requestId === requestId) {
event.moderated = moderated
}
return event
for ([eventId, { reqId }] in Object.entries(events.value)) {
if (reqId === requestId) {
events.value[eventId].moderated = moderated
break
}
})
}
// events.value = events.value.map((event) => {
// if (event) {
// if (event.requestId === requestId) {
// event.moderated = moderated
// }
// return event
// }
// })
}
async function listenForNewEvents() {

13
src/utils/events.js
View File

@ -1,10 +1,11 @@
export const StorageEvent = {
StorageRequested: 'StorageRequested', // storage was requested
RequestFulfilled: 'RequestFulfilled', // request has started (all slots filled)
RequestCancelled: 'RequestCancelled', // request was cancelled when not all slots were filled by the expiry
RequestFailed: 'RequestFailed', // the request has failed (too many slots freed)
SlotFilled: 'SlotFilled', // slot was filled by provider (providing proof and collateral)
SlotFreed: 'SlotFreed' // slot freed after provider missed too many proofs
StorageRequested: 'Storage requested', // storage was requested
RequestFulfilled: 'Request fulfilled (started)', // request has started (all slots filled)
RequestCancelled: 'Request cancelled', // request was cancelled when not all slots were filled by the expiry
RequestFailed: 'Request failed', // the request has failed (too many slots freed)
SlotFilled: 'Slot filled', // slot was filled by provider (providing proof and collateral)
SlotFreed: 'Slot freed', // slot freed after provider missed too many proofs
RequestFinished: 'Request finished'
}
export function toSlotState(idx) {