Browse Source

refactor: added enum NostrKind, remove EventLimitControl

master
limina1 8 months ago
parent
commit
ea3ba8240c
  1. 73
      src/lib/components/EventKindFilter.svelte
  2. 52
      src/lib/components/EventLimitControl.svelte
  3. 3
      src/lib/navigator/EventNetwork/Legend.svelte
  4. 16
      src/lib/types.ts

73
src/lib/components/EventKindFilter.svelte

@ -1,8 +1,9 @@
<script lang="ts"> <script lang="ts">
import { visualizationConfig } from '$lib/stores/visualizationConfig'; import { visualizationConfig, enabledEventKinds } from '$lib/stores/visualizationConfig';
import { Button, Badge } from 'flowbite-svelte'; import { Button, Badge } from 'flowbite-svelte';
import { CloseCircleOutline } from 'flowbite-svelte-icons'; import { CloseCircleOutline } from 'flowbite-svelte-icons';
import type { EventCounts } from "$lib/types"; import type { EventCounts } from "$lib/types";
import { NostrKind } from '$lib/types';
let { let {
onReload = () => {}, onReload = () => {},
@ -15,9 +16,8 @@
let newKind = $state(''); let newKind = $state('');
let showAddInput = $state(false); let showAddInput = $state(false);
let inputError = $state(''); let inputError = $state('');
function validateKind(value: string | number): number | null { function validateKind(value: string | number): number | null {
// Convert to string for consistent handling
const strValue = String(value); const strValue = String(value);
if (!strValue || strValue.trim() === '') { if (!strValue || strValue.trim() === '') {
inputError = ''; inputError = '';
@ -32,31 +32,24 @@
inputError = 'Must be positive'; inputError = 'Must be positive';
return null; return null;
} }
if ($visualizationConfig.allowedKinds.includes(kind)) { if ($visualizationConfig.eventConfigs.some(ec => ec.kind === kind)) {
inputError = 'Already added'; inputError = 'Already added';
return null; return null;
} }
inputError = ''; inputError = '';
return kind; return kind;
} }
function handleAddKind() { function handleAddKind() {
console.log('[EventKindFilter] handleAddKind called with:', newKind);
const kind = validateKind(newKind); const kind = validateKind(newKind);
console.log('[EventKindFilter] Validation result:', kind);
if (kind !== null) { if (kind !== null) {
console.log('[EventKindFilter] Before adding, allowedKinds:', $visualizationConfig.allowedKinds); visualizationConfig.addEventKind(kind);
visualizationConfig.addKind(kind);
// Force a small delay to ensure store update propagates
setTimeout(() => {
console.log('[EventKindFilter] After adding, allowedKinds:', $visualizationConfig.allowedKinds);
}, 10);
newKind = ''; newKind = '';
showAddInput = false; showAddInput = false;
inputError = ''; inputError = '';
} }
} }
function handleKeydown(e: KeyboardEvent) { function handleKeydown(e: KeyboardEvent) {
if (e.key === 'Enter') { if (e.key === 'Enter') {
handleAddKind(); handleAddKind();
@ -66,23 +59,22 @@
inputError = ''; inputError = '';
} }
} }
function removeKind(kind: number) { function removeKind(kind: number) {
visualizationConfig.removeKind(kind); visualizationConfig.removeEventKind(kind);
} }
function toggleKind(kind: number) { function toggleKind(kind: number) {
visualizationConfig.toggleKind(kind); visualizationConfig.toggleKind(kind);
} }
// Get kind name for display
function getKindName(kind: number): string { function getKindName(kind: number): string {
switch (kind) { switch (kind) {
case 30040: return 'Publication Index'; case NostrKind.PublicationIndex: return 'Publication Index';
case 30041: return 'Publication Content'; case NostrKind.PublicationContent: return 'Publication Content';
case 30818: return 'Wiki'; case NostrKind.Wiki: return 'Wiki';
case 1: return 'Text Note'; case NostrKind.TextNote: return 'Text Note';
case 0: return 'Metadata'; case NostrKind.UserMetadata: return 'Metadata';
default: return `Kind ${kind}`; default: return `Kind ${kind}`;
} }
} }
@ -90,30 +82,30 @@
<div class="space-y-3"> <div class="space-y-3">
<div class="flex flex-wrap gap-2 items-center"> <div class="flex flex-wrap gap-2 items-center">
{#each $visualizationConfig.allowedKinds as kind} {#each $visualizationConfig.eventConfigs as ec}
{@const isDisabled = $visualizationConfig.disabledKinds.includes(kind)} {@const isEnabled = ec.enabled !== false}
{@const isLoaded = (eventCounts[kind] || 0) > 0} {@const isLoaded = (eventCounts[ec.kind] || 0) > 0}
{@const borderColor = isLoaded ? 'border-green-500' : 'border-red-500'} {@const borderColor = isLoaded ? 'border-green-500' : 'border-red-500'}
<button <button
class="badge-container {isDisabled ? 'disabled' : ''} {isLoaded ? 'loaded' : 'not-loaded'}" class="badge-container {isEnabled ? '' : 'disabled'} {isLoaded ? 'loaded' : 'not-loaded'}"
onclick={() => toggleKind(kind)} onclick={() => toggleKind(ec.kind)}
title={isDisabled ? `Click to enable ${getKindName(kind)}` : `Click to disable ${getKindName(kind)}`} title={isEnabled ? `Click to disable ${getKindName(ec.kind)}` : `Click to enable ${getKindName(ec.kind)}`}
> >
<Badge <Badge
color="dark" color="dark"
class="flex items-center gap-1 px-2 py-1 {isDisabled ? 'opacity-40' : ''} border-2 {borderColor}" class="flex items-center gap-1 px-2 py-1 {isEnabled ? '' : 'opacity-40'} border-2 {borderColor}"
> >
<span class="text-xs">{kind}</span> <span class="text-xs">{ec.kind}</span>
{#if isLoaded} {#if isLoaded}
<span class="text-xs text-gray-400">({eventCounts[kind]})</span> <span class="text-xs text-gray-400">({eventCounts[ec.kind]})</span>
{/if} {/if}
<button <button
onclick={(e) => { onclick={(e) => {
e.stopPropagation(); e.stopPropagation();
removeKind(kind); removeKind(ec.kind);
}} }}
class="ml-1 text-red-500 hover:text-red-700 transition-colors" class="ml-1 text-red-500 hover:text-red-700 transition-colors"
title="Remove {getKindName(kind)}" title="Remove {getKindName(ec.kind)}"
> >
<CloseCircleOutline class="w-3 h-3" /> <CloseCircleOutline class="w-3 h-3" />
</button> </button>
@ -192,17 +184,6 @@
<span>Red border = Not loaded (click Reload to fetch)</span> <span>Red border = Not loaded (click Reload to fetch)</span>
</p> </p>
</div> </div>
<label class="flex items-center gap-2 text-xs">
<input
type="checkbox"
checked={$visualizationConfig.allowFreeEvents}
onchange={() => visualizationConfig.toggleFreeEvents()}
class="rounded dark:bg-gray-700 dark:border-gray-600"
/>
<span>Allow free events <span class="text-orange-500 font-normal">(not tested)</span></span>
<span class="text-gray-500 dark:text-gray-400">(not connected to 30040)</span>
</label>
</div> </div>
<style> <style>

52
src/lib/components/EventLimitControl.svelte

@ -1,52 +0,0 @@
<script lang="ts">
import { networkFetchLimit } from "$lib/state";
import { createEventDispatcher } from "svelte";
const dispatch = createEventDispatcher<{
update: { limit: number };
}>();
let inputValue = $networkFetchLimit;
function handleInput(event: Event) {
const input = event.target as HTMLInputElement;
const value = parseInt(input.value);
// Ensure value is between 1 and 50
if (value >= 1 && value <= 50) {
inputValue = value;
}
}
function handleUpdate() {
$networkFetchLimit = inputValue;
dispatch("update", { limit: inputValue });
}
function handleKeyDown(event: KeyboardEvent) {
if (event.key === "Enter") {
handleUpdate();
}
}
</script>
<div class="flex items-center gap-2 mb-4">
<label for="event-limit" class="leather bg-transparent text-sm font-medium"
>Number of root events:
</label>
<input
type="number"
id="event-limit"
min="1"
max="200"
class="w-20 bg-primary-0 dark:bg-primary-1000 border border-gray-300 dark:border-gray-700 rounded-md px-2 py-1 dark:text-white"
bind:value={inputValue}
on:input={handleInput}
on:keydown={handleKeyDown}
/>
<button
on:click={handleUpdate}
class="btn-leather px-3 py-1 bg-primary-0 dark:bg-primary-1000 border border-gray-400 dark:border-gray-600 rounded-md hover:bg-gray-100 dark:hover:bg-gray-800"
>
Update
</button>
</div>

3
src/lib/navigator/EventNetwork/Legend.svelte

@ -1,6 +1,7 @@
<script lang="ts"> <script lang="ts">
import { CaretDownOutline, CaretUpOutline } from "flowbite-svelte-icons"; import { CaretDownOutline, CaretUpOutline } from "flowbite-svelte-icons";
import { getEventKindColor, getEventKindName } from '$lib/utils/eventColors'; import { getEventKindColor, getEventKindName } from '$lib/utils/eventColors';
import type { EventCounts } from "$lib/types";
const TAG_LEGEND_COLUMNS = 3; // Number of columns for tag anchor table const TAG_LEGEND_COLUMNS = 3; // Number of columns for tag anchor table
let { let {
@ -31,7 +32,7 @@
starMode?: boolean; starMode?: boolean;
showTags?: boolean; showTags?: boolean;
tagAnchors?: any[]; tagAnchors?: any[];
eventCounts?: { [kind: number]: number }; eventCounts?: EventCounts;
disabledTags?: Set<string>; disabledTags?: Set<string>;
onTagToggle?: (tagId: string) => void; onTagToggle?: (tagId: string) => void;
autoDisabledTags?: boolean; autoDisabledTags?: boolean;

16
src/lib/types.ts

@ -15,3 +15,19 @@ export type TabType =
| "editor"; | "editor";
export type EventCounts = { [kind: number]: number }; export type EventCounts = { [kind: number]: number };
/**
* Enum of Nostr event kinds relevant to Alexandria.
*/
export enum NostrKind {
/** User metadata event (kind 0) */
UserMetadata = 0,
/** Text note event (kind 1) */
TextNote = 1,
/** Publication index event (kind 30040) */
PublicationIndex = 30040,
/** Publication content event (kind 30041) */
PublicationContent = 30041,
/** Wiki event (kind 30818) */
Wiki = 30818,
}

Loading…
Cancel
Save