pds.ls
atmosphere explorer
pds.ls
tool
typescript
atproto
move log validation icon
handle.invalid
+20
-16
src/views/logs.tsx
+20
-16
src/views/logs.tsx
···
6
6
} from "@atcute/did-plc";
7
7
import { useLocation } from "@solidjs/router";
8
8
import { createEffect, createResource, createSignal, For, onCleanup, Show } from "solid-js";
9
+
import Tooltip from "../components/tooltip.jsx";
9
10
import { localDateFromTimestamp } from "../utils/date.js";
10
11
import { createOperationHistory, DiffEntry, groupBy } from "../utils/plc-logs.js";
11
12
import PlcValidateWorker from "../workers/plc-validate.ts?worker";
···
261
262
return (
262
263
<div class="flex w-full flex-col gap-3 wrap-anywhere">
263
264
<div class="flex flex-col gap-2">
264
-
<div class="flex items-center gap-1.5 text-sm">
265
+
<div class="flex items-center gap-1.5 text-sm font-medium text-neutral-700 dark:text-neutral-300">
265
266
<div class="iconify lucide--filter" />
266
-
<p class="font-medium">Filter by type</p>
267
+
<p>Filter by type</p>
268
+
<div class="mr-1.5 ml-auto">
269
+
<Show when={validLog() === true}>
270
+
<Tooltip text="Valid log">
271
+
<span class="iconify lucide--check text-green-600 dark:text-green-400"></span>
272
+
</Tooltip>
273
+
</Show>
274
+
<Show when={validLog() === false}>
275
+
<Tooltip text="Validation failed">
276
+
<span class="iconify lucide--x text-red-500 dark:text-red-400"></span>
277
+
</Tooltip>
278
+
</Show>
279
+
<Show when={validLog() === undefined}>
280
+
<Tooltip text="Validating...">
281
+
<span class="iconify lucide--loader-circle animate-spin"></span>
282
+
</Tooltip>
283
+
</Show>
284
+
</div>
267
285
</div>
268
286
<div class="flex flex-wrap gap-1">
269
287
<FilterButton event="handle" label="Alias" />
···
271
289
<FilterButton event="verification_method" label="Verification" />
272
290
<FilterButton event="rotation_key" label="Rotation Key" />
273
291
</div>
274
-
</div>
275
-
<div class="flex items-center gap-1.5 text-sm font-medium">
276
-
<Show when={validLog() === true}>
277
-
<span class="iconify lucide--check text-green-600 dark:text-green-400"></span>
278
-
<span>Valid log</span>
279
-
</Show>
280
-
<Show when={validLog() === false}>
281
-
<span class="iconify lucide--x text-red-500 dark:text-red-400"></span>
282
-
<span>Log validation failed</span>
283
-
</Show>
284
-
<Show when={validLog() === undefined}>
285
-
<span class="iconify lucide--loader-circle animate-spin"></span>
286
-
<span>Validating log...</span>
287
-
</Show>
288
292
</div>
289
293
<div class="flex flex-col gap-3">
290
294
<For each={plcOps()}>