Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

use local heartbeat #63

Merged
merged 2 commits into from
Mar 6, 2024
Merged

use local heartbeat #63

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3d1ca28
use local heartbeat
jordan-rash Mar 6, 2024
5a4e4d1
i readz goodr
jordan-rash Mar 6, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
55 changes: 27 additions & 28 deletions natster-io/src/components/Avatar.vue
View file
Open in desktop
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 catalog has come online')
} else {
notificationStore().setNotification(
'Catalog Offline',
'Your catalog 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
Open in desktop
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
Open in desktop
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
Open in desktop
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
Loading