atproto explorer pdsls.dev
atproto tool

move record validation icons

juli.ee 25837511 8ae7a400

verified
Changed files
+30 -31
src
components
views
+1 -30
src/components/navbar.tsx
···
export const [pds, setPDS] = createSignal<string>();
export const [cid, setCID] = createSignal<string>();
export const [isLabeler, setIsLabeler] = createSignal(false);
-
export const [validRecord, setValidRecord] = createSignal<boolean | undefined>(undefined);
-
export const [validSchema, setValidSchema] = createSignal<boolean | undefined>(undefined);
const swapIcons: Record<string, string> = {
"did:plc:vwzwgnygau7ed7b7wt5ux7y2": "lucide--microchip",
···
<Tooltip text="Record">
<span class="iconify lucide--file-json text-base"></span>
</Tooltip>
-
<div class="flex gap-1">
-
<span>{props.params.rkey}</span>
-
<Show when={validRecord()}>
-
<Tooltip text="Valid record">
-
<span class="iconify lucide--lock-keyhole"></span>
-
</Tooltip>
-
</Show>
-
<Show when={validRecord() === false}>
-
<Tooltip text="Invalid record">
-
<span class="iconify lucide--lock-keyhole-open text-red-500 dark:text-red-400"></span>
-
</Tooltip>
-
</Show>
-
<Show when={validRecord() === undefined}>
-
<Tooltip text="Validating">
-
<span class="iconify lucide--loader-circle animate-spin"></span>
-
</Tooltip>
-
</Show>
-
<Show when={validSchema()}>
-
<Tooltip text="Valid schema">
-
<span class="iconify lucide--file-check"></span>
-
</Tooltip>
-
</Show>
-
<Show when={validSchema() === false}>
-
<Tooltip text="Invalid schema">
-
<span class="iconify lucide--file-x text-red-500 dark:text-red-400"></span>
-
</Tooltip>
-
</Show>
-
</div>
</div>
</Show>
</div>
···
export const [pds, setPDS] = createSignal<string>();
export const [cid, setCID] = createSignal<string>();
export const [isLabeler, setIsLabeler] = createSignal(false);
const swapIcons: Record<string, string> = {
"did:plc:vwzwgnygau7ed7b7wt5ux7y2": "lucide--microchip",
···
<Tooltip text="Record">
<span class="iconify lucide--file-json text-base"></span>
</Tooltip>
+
<span>{props.params.rkey}</span>
</div>
</Show>
</div>
+29 -1
src/views/record.tsx
···
import { JSONValue } from "../components/json.jsx";
import { agent } from "../components/login.jsx";
import { Modal } from "../components/modal.jsx";
-
import { pds, setCID, setValidRecord, setValidSchema, validRecord } from "../components/navbar.jsx";
import Tooltip from "../components/tooltip.jsx";
import { setNotif } from "../layout.jsx";
import { didDocCache, resolvePDS } from "../utils/api.js";
···
const [externalLink, setExternalLink] = createSignal<
{ label: string; link: string; icon?: string } | undefined
>();
const did = params.repo;
let rpc: Client;
···
</A>
</div>
<div class="flex gap-1">
<Show when={agent() && agent()?.sub === record()?.uri.split("/")[2]}>
<RecordEditor create={false} record={record()?.value} refetch={refetch} />
<Tooltip text="Delete">
···
import { JSONValue } from "../components/json.jsx";
import { agent } from "../components/login.jsx";
import { Modal } from "../components/modal.jsx";
+
import { pds, setCID } from "../components/navbar.jsx";
import Tooltip from "../components/tooltip.jsx";
import { setNotif } from "../layout.jsx";
import { didDocCache, resolvePDS } from "../utils/api.js";
···
const [externalLink, setExternalLink] = createSignal<
{ label: string; link: string; icon?: string } | undefined
>();
+
const [validRecord, setValidRecord] = createSignal<boolean | undefined>(undefined);
+
const [validSchema, setValidSchema] = createSignal<boolean | undefined>(undefined);
const did = params.repo;
let rpc: Client;
···
</A>
</div>
<div class="flex gap-1">
+
<div class="mr-1 flex gap-3">
+
<Tooltip
+
text={
+
validRecord() === undefined ? "Validating"
+
: validRecord() === false ?
+
"Invalid record"
+
: "Valid record"
+
}
+
>
+
<span
+
classList={{
+
"iconify lucide--lock-keyhole": validRecord() === true,
+
"iconify lucide--lock-keyhole-open text-red-500 dark:text-red-400":
+
validRecord() === false,
+
"iconify lucide--loader-circle animate-spin": validRecord() === undefined,
+
}}
+
></span>
+
</Tooltip>
+
<Show when={validSchema() !== undefined}>
+
<Tooltip text={validSchema() ? "Valid schema" : "Invalid schema"}>
+
<span
+
class={`iconify ${validSchema() ? "lucide--file-check" : "lucide--file-x text-red-500 dark:text-red-400"}`}
+
></span>
+
</Tooltip>
+
</Show>
+
</div>
<Show when={agent() && agent()?.sub === record()?.uri.split("/")[2]}>
<RecordEditor create={false} record={record()?.value} refetch={refetch} />
<Tooltip text="Delete">