Skip to content

Commit

Permalink
use local heartbeat
Browse files Browse the repository at this point in the history
  • Loading branch information
@jordan-rash
jordan-rash committed Mar 6, 2024
1 parent 174212d commit 78e51c6
Show file tree
Hide file tree
Showing 4 changed files with 71 additions and 54 deletions.
55 changes: 27 additions & 28 deletions natster-io/src/components/Avatar.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,41 +5,29 @@
<MenuButton class="flex items-center no-underline focus:outline-none">
<span class="relative inline-block">
<img class="h-12 w-12 rounded-md" :src="userPhotoUrl" alt="" />
<span
:class="[
catalog_online ? 'bg-green-600 text-white' : 'bg-gray-200 text-black',
'absolute right-0 top-0 block h-4 w-4 -translate-y-1/2 translate-x-1/2 transform rounded-full text-center text-xs align-top text-black ring-1 ring-white'
]"
>
<span :class="[
getCatalogOnline ? 'bg-green-600 text-white' : 'bg-gray-200 text-black',
'absolute right-0 top-0 block h-4 w-4 -translate-y-1/2 translate-x-1/2 transform rounded-full text-center text-xs align-top text-black ring-1 ring-white'
]">
{{ pending_imports == 0 ? '' : pending_imports }}
</span>
</span>
</MenuButton>
</div>

<transition
enter-active-class="transition ease-out duration-100"
enter-from-class="transform opacity-0 scale-95"
enter-to-class="transform opacity-100 scale-100"
leave-active-class="transition ease-in duration-75"
leave-from-class="transform opacity-100 scale-100"
leave-to-class="transform opacity-0 scale-95"
>
<transition enter-active-class="transition ease-out duration-100" enter-from-class="transform opacity-0 scale-95"
enter-to-class="transform opacity-100 scale-100" leave-active-class="transition ease-in duration-75"
leave-from-class="transform opacity-100 scale-100" leave-to-class="transform opacity-0 scale-95">
<MenuItems
class="absolute right-0 z-10 mt-2 w-56 origin-top-right rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none bottom-full"
>
class="absolute right-0 z-10 mt-2 w-56 origin-top-right rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none bottom-full">
<div class="py-1">
<MenuItem v-slot="{ active }">
<button
type="submit"
@click.prevent="signout"
:class="[
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
'block w-full px-4 py-2 text-left text-sm'
]"
>
Sign out
</button>
<button type="submit" @click.prevent="signout" :class="[
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700',
'block w-full px-4 py-2 text-left text-sm'
]">
Sign out
</button>
</MenuItem>
</div>
</MenuItems>
Expand All @@ -58,14 +46,14 @@

<script setup lang="ts">
import { storeToRefs } from 'pinia'
import { computed } from 'vue'
import { computed, watch } from 'vue'
import { Float } from '@headlessui-float/vue'
import { Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/vue'
import { useAuth0 } from '@auth0/auth0-vue'
import { userStore } from '../stores/user'
import { notificationStore } from '../stores/notification'
const uStore = userStore()
const { catalog_online, pending_imports } = storeToRefs(uStore)
const { getCatalogOnline, pending_imports } = storeToRefs(uStore)
const { logout } = useAuth0()
Expand All @@ -87,6 +75,17 @@ const props = defineProps({
natster_account: String
})
watch(() => uStore.getCatalogOnline, (newVal) => {
if (newVal) {
notificationStore().setNotification('Catalog Online', 'Your has come online')
} else {
notificationStore().setNotification(
'Catalog Offline',
'Your has gone offline'
)
}
})
function copyAccountIdToClipboard() {
navigator.clipboard.writeText(props.natster_account)
notificationStore().setNotification('Copied!', 'Account ID copied to clipboard')
Expand Down
23 changes: 9 additions & 14 deletions natster-io/src/components/Catalogs.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,23 +3,17 @@
<ul v-if="catalogsInitialized" role="list" class="-mx-2 mt-2 space-y-1">
<li v-for="(catalog, i) in getImportedCatalogs" :key="i">
<div class="w-full">
<button
@click="cStore.setCatalogSelected(catalog)"
:disabled="!catalog.online"
:class="[
catalog.selected
? 'enabled:bg-gray-800 enabled:text-white '
: 'enabled:text-gray-400 enabled:hover:text-white enabled:hover:bg-gray-800',
'group w-full flex gap-x-3 rounded-md p-2 text-sm leading-6 font-semibold disabled:text-gray-500'
]"
>
<button @click="cStore.setCatalogSelected(catalog)" :disabled="!catalog.online" :class="[
catalog.selected
? 'enabled:bg-gray-800 enabled:text-white '
: 'enabled:text-gray-400 enabled:hover:text-white enabled:hover:bg-gray-800',
'group w-full flex gap-x-3 rounded-md p-2 text-sm leading-6 font-semibold disabled:text-gray-500'
]">
<span
class="relative inline-block flex h-6 w-6 shrink-0 items-center justify-center rounded-lg border border-gray-700 bg-gray-800 text-[0.625rem] font-medium text-gray-400"
>
class="relative inline-block flex h-6 w-6 shrink-0 items-center justify-center rounded-lg border border-gray-700 bg-gray-800 text-[0.625rem] font-medium text-gray-400">
<span
class="absolute right-0 top-0 block h-1.5 w-1.5 -translate-y-1/2 translate-x-1/2 transform rounded-full ring-1 ring-white"
:class="[catalog.online ? 'bg-green-500' : 'bg-gray-500']"
/>
:class="[catalog.online ? 'bg-green-500' : 'bg-gray-500']" />
<span class=""> {{ catalog.name.substring(0, 1).toUpperCase() }} </span>
</span>
<span class="truncate">{{ catalog.name }} </span>
Expand All @@ -46,6 +40,7 @@ watch(connection, () => {
cStore.getShares(true)
cStore.getLocalInbox()
cStore.subscribeToHeartbeats()
cStore.subscribeToLocalHeartbeats()
}
})
</script>
32 changes: 20 additions & 12 deletions natster-io/src/stores/catalog.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,18 @@ export const catalogStore = defineStore('catalog', {
console.log('subscription closed')
})()
},
subscribeToLocalHeartbeats() {
const nStore = natsStore()
const uStore = userStore()

const sub = nStore.connection.subscribe('natster.local-events.heartbeat')
; (async () => {
for await (const msg of sub) {
uStore.setLastSeenTS(new Date(Date.now()))
}
console.log('subscription closed')
})()
},
setOnlineAndCatalogRevision(inCat, rev) {
const nStore = notificationStore()
var d = new Date(0)
Expand Down Expand Up @@ -128,8 +140,10 @@ export const catalogStore = defineStore('catalog', {
.then((msg) => {
let m = JSONCodec().decode(msg.data)
if (m.code == 200) {
uStore.catalog_online = true
uStore.pending_imports = m.data.unimported_shares.length
uStore.setLastSeenTS(Date.now())
uStore.ping = !uStore.ping

uStore.setPendingInvites(m.data.unimported_shares.length)
m.data.unimported_shares.forEach((c, i) => {
if (c.to_account === uStore.getAccount) {
const catalog: Catalog = {
Expand All @@ -152,8 +166,6 @@ export const catalogStore = defineStore('catalog', {
})
},
async downloadFile(fileName, catalog, hash, mimeType) {
const fStore = fileStore()

let xkey = createCurve()
this.xkey_seed = new TextDecoder().decode(xkey.getSeed())
this.xkey_pub = xkey.getPublicKey()
Expand Down Expand Up @@ -231,7 +243,7 @@ export const catalogStore = defineStore('catalog', {
// HACK-- this branch prevents slow streams from being canceled early... i.e., while we are still transcoding
fStore.endStream()
timeout = null

sub.unsubscribe()
} else {
// TODO-- maintain a tolerance for max time we will wait for the next packet-- this can eventually replace the above HACK
Expand Down Expand Up @@ -291,28 +303,24 @@ export const catalogStore = defineStore('catalog', {
return state.shares_init && state.pending_init
},
getImportedCatalogs(state) {
const uStore = userStore()
state.catalogs.forEach(function(tCatalog) {
if (tCatalog.from == 'AC5V4OC2POUAX4W4H7CKN5TQ5AKVJJ4AJ7XZKNER6P6DHKBYGVGJHSNC') {
uStore.ping = !uStore.ping
tCatalog.pending_invite = false // synadiahub is never pending
return
}
state.pending_catalogs.forEach(function(tPending) {
if (tCatalog.name === tPending.name) {
tCatalog.pending_invite = true
}

})

// Toggles catalogs avaialability
if (!tCatalog.online && Date.now() - tCatalog.lastSeen < 1 * 60 * 1000) {
if (tCatalog.from == userStore().getAccount) {
userStore().setCatalogOnline(true)
}
tCatalog.online = true
notificationStore().setNotification('Catalog Online', tCatalog.name + ' has come online')
} else if (tCatalog.online && Date.now() - tCatalog.lastSeen > 1 * 60 * 1000) {
if (tCatalog.from == userStore().getAccount) {
userStore().setCatalogOnline(false)
}
tCatalog.online = false
notificationStore().setNotification(
'Catalog Offline',
Expand Down
15 changes: 15 additions & 0 deletions natster-io/src/stores/user.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,8 @@ export const userStore = defineStore('user', {
xkey_seed: '',
xkey_pub: '',
catalog_online: false,
last_seen_ts: new Date(0),
ping: false,
pending_imports: 0
}),
actions: {
Expand All @@ -31,9 +33,22 @@ export const userStore = defineStore('user', {
},
setCatalogOnline(online: boolean) {
this.catalog_online = online
},
setPendingInvites(pending) {
this.pending_imports = pending
},
setLastSeenTS(ts: Date) {
this.last_seen_ts = ts
}
},
getters: {
getLastSeen(state) {
return state.last_seen_ts
},
getCatalogOnline(state) {
state.ping
return (Date.now() - new Date(state.last_seen_ts).getTime() < (1 * 60 * 1000))
},
getJWT(state) {
return state.jwt !== '' ? state.jwt : localStorage.getItem('natster_jwt')
},
Expand Down

0 comments on commit 78e51c6

Please sign in to comment.