-
Notifications
You must be signed in to change notification settings - Fork 482
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
shared worker tests, datatable refac + monitors
- Loading branch information
Showing
42 changed files
with
925 additions
and
308 deletions.
There are no files selected for viewing
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
155 changes: 155 additions & 0 deletions
155
apps/gui/src/lib/components/blocks/table/monitors-config.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,155 @@ | ||
| import countryCodeToFlagEmoji from 'country-code-to-flag-emoji' | ||
| import { relaySpeedGroupResolver, SpeedGroupBars, SpeedGroupColors, SpeedGroups } from '$lib/stores/checks.js'; | ||
| import { makeSoftwareReadable } from '$lib/synonyms/software.js'; | ||
|
|
||
| type Resolver = (input: any) => any | ||
|
|
||
| class SpeedGroupResolver { | ||
| private resolver: Resolver = () => SpeedGroups.Mid; | ||
| private unsubscribe: () => void; | ||
|
|
||
| constructor() { | ||
| this.unsubscribe = relaySpeedGroupResolver.subscribe((fn: Resolver) => { | ||
| this.resolver = fn; | ||
| }); | ||
| } | ||
|
|
||
| resolve(input: number): SpeedGroups { | ||
| return this.resolver(input); | ||
| } | ||
|
|
||
| dispose() { | ||
| this.unsubscribe(); | ||
| } | ||
| } | ||
|
|
||
| const speedGroupResolver = new SpeedGroupResolver(); | ||
|
|
||
|
|
||
| export type NameFormatter = Record<string, string>; | ||
|
|
||
| export type Formatters = Record<string, Formatter>; | ||
|
|
||
| export type DataKeys = string[]; | ||
|
|
||
| export type Formatter = { | ||
| (value: any): string; | ||
| } | ||
|
|
||
| export const normalizeKeys = (keys: DataKeys | string) => { | ||
| if(typeof keys === 'string') | ||
| return keys.toLowerCase() | ||
| if(typeof keys === 'object') | ||
| return keys.map(k => k.toLowerCase()) | ||
| } | ||
|
|
||
| export const columnsDisable: DataKeys = ['asname'] | ||
| export const filtersDisable: DataKeys = ['as', 'asname'] | ||
|
|
||
| export const columnsShow: DataKeys = ['pubkey', 'name', 'geohash', 'lastSeen', 'checks', 'relays', 'reportingOnline'] | ||
| export const filtersShow: DataKeys = ['pubkey', 'name', 'geohash', 'lastSeen', 'checks', 'relays', 'reportingOnline'] | ||
|
|
||
| export const humanReadableNames: NameFormatter = { | ||
| // networks: 'Network', | ||
| // supportedNips: 'NIPs', | ||
| // software: 'Software', | ||
| // relay: 'Relay', | ||
| // rttNormalized: 'Speed', | ||
| // geocode: 'Country', | ||
| // paymentRequired: 'Payment', | ||
| // authRequired: 'Auth', | ||
| // isp: 'ISP' | ||
| }; | ||
|
|
||
| export const formatters: Formatters = {} | ||
|
|
||
| export const tableFormatters: Formatters = { | ||
| // relay: (relay) => { | ||
| // return truncateWithEllipsis(relay, 44); | ||
| // }, | ||
| // geocode: (code) => { | ||
| // if(!code) return '🌐'; | ||
| // return countryCodeToFlagEmoji(code); | ||
| // }, | ||
| // rttNormalized: (value) => { | ||
| // const isNumber = !isNaN(Number(value)); | ||
| // if(!isNumber) return '-'; | ||
| // const group: SpeedGroups = speedGroupResolver.resolve(value); | ||
| // return `<span class="text-xs" style="font-family: 'monospace';color:${SpeedGroupColors[group]};">${SpeedGroupBars[group]}</span>`; | ||
| // }, | ||
| // supportedNips: (nips) => { | ||
| // let output = ''; | ||
| // for(const nip of nips) { | ||
| // output += `<span class="p-1 mr-1 inline text-xs">${nip}</span>`; | ||
| // } | ||
| // return output; | ||
| // }, | ||
| // paymentRequired: (r) => { | ||
| // const text = r? 'yes': 'no' | ||
| // const style = r? '': 'text-opacity-50' | ||
| // return `<span class="p-1 inline-block mr-1 uppercase text-xs bold text-${style}">${text}</span>` | ||
| // }, | ||
| // authRequired: (r) => { | ||
| // const text = r? 'yes': 'no' | ||
| // const style = r? '': 'text-opacity-50' | ||
| // return `<span class="p-1 inline-block mr-1 uppercase text-xs bold text-${style}">${text}</span>` | ||
| // }, | ||
| // software: (software) => { | ||
| // if(typeof software !== 'string') return '-'; | ||
| // software = makeSoftwareReadable(software); | ||
| // return truncateWithEllipsis(software, 33); | ||
| // }, | ||
| } | ||
|
|
||
| export const filterFormatters: Formatters = { | ||
| // geocode: (code) => { | ||
| // if(!code) return '🌐'; | ||
| // return countryCodeToFlagEmoji(code); | ||
| // }, | ||
| // supportedNips: (nip) => { | ||
| // return formatNip(nip) | ||
| // }, | ||
| // paymentRequired: (r) => { | ||
| // const text = r? 'yes': 'no' | ||
| // const style = r? '': 'text-opacity-50' | ||
| // return `<span class="p-1 inline-block mr-1 uppercase text-xs bold text-${style}">${text}</span>` | ||
| // }, | ||
| // authRequired: (r) => { | ||
| // const text = r? 'yes': 'no' | ||
| // const style = r? '': 'text-opacity-50' | ||
| // return `<span class="p-1 inline-block mr-1 uppercase text-xs bold text-${style}">${text}</span>` | ||
| // }, | ||
| // software: (software) => { | ||
| // if(typeof software !== 'string') return '-'; | ||
| // return makeSoftwareReadable(software); | ||
| // } | ||
| } | ||
|
|
||
|
|
||
| function formatNip(number: number | string): string { | ||
| if (typeof number === 'string') { | ||
| number = parseInt(number); | ||
| } | ||
| if (number > 0 || number <= 9) { | ||
| number = number.toString().padStart(2, '0') | ||
| } | ||
| return `NIP-${number}`; | ||
| } | ||
|
|
||
| function truncateWithEllipsis(text: string, maxLength: number): string { | ||
| if (text.length > maxLength) { | ||
| return text.slice(0, maxLength) + '...'; | ||
| } | ||
| return text; | ||
| } | ||
|
|
||
| export default { | ||
| humanReadableNames, | ||
| formatters, | ||
| tableFormatters, | ||
| filterFormatters, | ||
| columnsDisable, | ||
| filtersDisable, | ||
| columnsShow, | ||
| filtersShow | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
68 changes: 68 additions & 0 deletions
68
apps/gui/src/lib/components/partials/MonitorDataRow.svelte
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,68 @@ | ||
| <script lang="ts"> | ||
| import { type Monitor } from '@nostrwatch/nip66/models'; | ||
| import { monitorChecksCount } from '$lib/stores/monitors.js'; | ||
| import Badge from '$lib/components/ui/badge/Badge.svelte'; | ||
| import { PFP } from '$lib/utils/pfp.js'; | ||
| import Time from "svelte-time"; | ||
| export let monitor: Monitor; | ||
| $: photo = monitor?.profile?.photo || monitor?.profile?.picture; | ||
| $: checksCount = $monitorChecksCount?.[monitor.pubkey] | ||
| $: lastActive = monitor?.lastActive | ||
| $: relays = monitor?.relays | ||
| $: checks = monitor?.checks | ||
| </script> | ||
|
|
||
| <section class="mb-10"> | ||
| <div class="flex items-center text-gray-300"> | ||
| <div class="flex-shrink-0"> | ||
| {#if monitor?.profile?.photo} | ||
| <span class="rounded-full overflow-hidden"> | ||
| <img src={photo} alt={photo} class="w-20 h-24" /> | ||
| </span> | ||
| {:else} | ||
| <span class="rounded-full overflow-hidden"> | ||
| <img src={PFP.generate(monitor.pubkey)} alt={photo} class="w-20 h-20" /> | ||
| </span> | ||
| {/if} | ||
| </div> | ||
| <div class="ml-4"> | ||
| <div class="flex items-center mb-1"> | ||
| <span class="font-bold opacity-90 text-white"> | ||
| {#if monitor?.profile?.name} | ||
| {monitor.profile.name} | ||
| {:else} | ||
| <span class="text-sm">{monitor.pubkey.slice(0, 21)}...</span> | ||
| {/if} | ||
| </span> | ||
| {#if monitor?.profile?.nip05} | ||
| <span class="ml-2 text-gray-400 text-sm font-bold">{monitor.profile.nip05}</span> | ||
| {/if} | ||
| {#if lastActive} | ||
| <span class="ml-2 text-gray-600 text-sm font-bold">last active <Time relative timestamp={lastActive * 1000} /></span> | ||
| {/if} | ||
| </div> | ||
| <div class="mb-1"> | ||
| {#if checksCount} | ||
| <span class="text-sm">reporting <Badge size="default" variant="secondary">{checksCount}</Badge> relays online</span> | ||
| {/if} | ||
| </div> | ||
| <div class="mb-1"> | ||
| <span class="text-sm">checks</span> | ||
| {#if checks} | ||
| {#each checks as check} | ||
| <Badge size="small" variant="secondary" class="ml-2">{check}</Badge> | ||
| {/each} | ||
| {/if} | ||
| </div> | ||
| <div class="text-sm text-gray-600"> | ||
| {#if monitor?.profile?.lud16} | ||
| {monitor.profile.lud16} | ||
| {/if} | ||
| {#if relays?.length} | ||
| Publishes to {relays.length} relays {relays.join(', ')} | ||
| {/if} | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> |
Oops, something went wrong.