Agent skill

Reactive Sqlite UI

by fastrepl in fastrepl/anarlog

Build SQLite-backed reactive UI in apps/desktop using stable patterns for reads, selection, forms, writes, and loading states.

MITAuto-check passedDatabases

Install Reactive Sqlite UI

skills CLI
$ npx skills add fastrepl/anarlog --skill reactive-sqlite-ui -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install fastrepl/anarlog reactive-sqlite-ui --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/fastrepl/anarlog.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/reactive-sqlite-ui .claude/skills/reactive-sqlite-ui && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
reactive-sqlite-ui
GitHub stars
9.4k
Token cost
~699 tokens
SKILL.md length
347 words
Files
1
Skills in repo
32
Repo updated
First seen
Licence
MIT

At a glance

Build SQLite-backed reactive UI in apps/desktop using stable patterns for reads, selection, forms, writes, and loading states.

  • Works in 6 steps: Screen Boundary Query → Selection Is UI State → Detail Pane From Snapshot → …
  • Reviewing screens built on useDrizzleLiveQuery and SQLite mutations
  • SKILL.md covers Goal, Patterns, Anti-Patterns and Review Check
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Reactive Sqlite UI is an agent skill from fastrepl/anarlog. Build SQLite-backed reactive UI in apps/desktop using stable patterns for reads, selection, forms, writes, and loading states. Use when implementing or reviewing screens built on useDrizzleLiveQuery and SQLite mutations.

Its SKILL.md is about 700 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Databases. It works with SQLite. The repository describes itself as: Open source Granola AI Alternative. The licence is MIT.

When your agent uses it

  • Reviewing screens built on useDrizzleLiveQuery and SQLite mutations

Example prompts

  • “/reactive-sqlite-ui”

Workflow steps

6 steps, taken from the step headings in SKILL.md.

  1. Screen Boundary Query
  2. Selection Is UI State
  3. Detail Pane From Snapshot
  4. Forms Own Draft State
  5. Writes Flow One Way
  6. Loading States Are Scoped

What it can do on your machine

Read from SKILL.md and the folder at commit 259a04e. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are typescript).

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Reactive Sqlite UI loads about 699 tokens when it runs. Until then it costs about 61 tokens; SKILL.md has 347 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~61
When it runs · the whole SKILL.md, loaded when a task matches
~699

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from fastrepl/anarlog at commit 259a04e, republished under its MIT licence (© fastrepl). 347 words, ~699 tokens.

Download SKILL.mdSave it as .claude/skills/reactive-sqlite-ui/SKILL.md (or your agent's skills folder).
name
reactive-sqlite-ui
description
Build SQLite-backed reactive UI in `apps/desktop` using stable patterns for reads, selection, forms, writes, and loading states. Use when implementing or reviewing screens built on `useDrizzleLiveQuery` and SQLite mutations.
metadata.internal
true

Goal

Use SQLite live queries as the screen data source without duplicating subscriptions, fighting the reactivity model, or making selection and form state unstable.

Patterns

1. Screen Boundary Query
  • Subscribe once per resource domain at the screen boundary.
  • Pass derived data downward.
  • Open another live query only when the child truly needs different data.
ts
const items = useItems();
const selectedItem = items.find((item) => item.id === selectedId) ?? null;
2. Selection Is UI State
  • Keep selection in tab/zustand/local UI state as an id or index.
  • Do not model selection as a second live query.
  • Resolve the selected item from the already-loaded collection when possible.
3. Detail Pane From Snapshot
  • Pass the selected object into detail components.
  • Key detail forms by entity id only when you want local state reset on entity switch.
  • Preserve visible data across normal selection changes.

This is the main anti-flicker pattern.

4. Forms Own Draft State
  • Reactive query data is the source for persisted state.
  • The form owns draft state while editing.
  • Reset form state when the entity changes, not on every reactive payload.
5. Writes Flow One Way
  • Reads: useDrizzleLiveQuery(db.select()...)
  • Imperative reads: helper/query outside the render path
  • Writes: db.insert, db.update, db.delete inside useMutation
  • Let SQLite change notifications update subscribed UI

Do not add manual invalidation unless the write affects data outside the subscribed query graph.

6. Loading States Are Scoped
  • Show loading UI for initial screen load.
  • Do not blank the detail pane for ordinary selection changes.
  • Prefer preserving previous data until the next snapshot when query args change frequently.

Anti-Patterns

  • Parent list query plus child selected-row query for the same table
  • Child components that take id and immediately subscribe again
  • Resetting detail data to undefined during normal selection changes
  • Form resets tied to every incoming reactive payload
  • Mixing imperative local cache invalidation with SQLite live-query updates

Review Check

  • Is there more than one live query for the same resource on the same screen?
  • Can the detail view render from the parent snapshot?
  • Does entity change reset the form, while ordinary reactive updates do not?
  • Is loading UI limited to initial load or truly missing data?
  • Are writes relying on the live-query loop instead of manual sync?

© fastrepl, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in .agents/skills/reactive-sqlite-ui of fastrepl/anarlog.

Open the folder on GitHubat commit 259a04e

Compare with similar skills

Reactive Sqlite UI next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Reactive Sqlite UI compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Reactive Sqlite UI this skillfastrepl/anarlog9.4k—~699Automated safety check: PassMIT
Iptvnator Sqlite DB Worker4gray/iptvnator7.3k—~824Automated safety check: PassMIT
Analyze Nsys Profilemlc-ai/pith-train355—~1.9kAutomated safety check: PassApache-2.0
Composer Forensicsdxos/dxos525—~3.1kAutomated safety check: PassCustom licence
MakemigrationsdeusXmachina-dev/memorylane121—~973Automated safety check: PassGPL-3.0
Toonbutttons/dora109—~9.4kAutomated safety check: PassMIT

Similar skills

  • A skill your agent uses when changing Electron SQLite IPC, database-worker operations, request-scoped progress or cancellation, worker packaging, or runtime verification of non-EPG database work.

    7.3k GitHub stars~824 tokensUpdated yesterday
    DatabasesAuto-check passed
  • Analyze Nsys Profile

    mlc-ai/pith-train

    Query a captured PithTrain Nsight Systems profile to measure compute/communication overlap, locate exposed comm by DualPipeV stage, and inspect per-rank stream behavior.

    355 GitHub stars~1.9k tokensUpdated 3 days ago
    DatabasesAuto-check passed
  • Forensically inspect and repair Composer browser profiles — offline (Chrome OPFS / SQLite extract) or live via /recovery.html debug port.

    525 GitHub stars~3.1k tokensUpdated today
    DatabasesAuto-check passed
  • Makemigrations

    deusXmachina-dev/memorylane

    Create SQLite migrations for MemoryLane storage schema changes.

    121 GitHub stars~973 tokensUpdated yesterday
    DatabasesAuto-check passed
  • Toon

    butttons/dora

    Token-Oriented Object Notation is a compact, human-readable encoding of the JSON data model that minimizes tokens and makes structure easy for models to follow.

    109 GitHub stars~9.4k tokensUpdated 7 mo ago
    DatabasesAuto-check passed
  • Cellar Browser

    MRL-00/cellar

    Open Cellar's workspace, connect read-only from an explicitly selected current project, find SQLite files in this chat, and browse saved database connections with reviewed row editing.

    148 GitHub stars~1.1k tokensUpdated 2 days ago
    DatabasesAuto-check passed

More from fastrepl/anarlog

All 32 skills in this repo
  • But

    fastrepl/anarlog

    Use only in the Anarlog repository when the active checkout branch is exactly gitbutler/workspace.

    9.4k GitHub stars~5.8k tokensUpdated today
    Auto-check passed
  • Create PRs

    fastrepl/anarlog

    Use only in the Anarlog repository when the active checkout branch is exactly gitbutler/workspace.

    9.4k GitHub stars~1.2k tokensUpdated today
    Auto-check passed
  • Fix Ready PRs

    fastrepl/anarlog

    Inspect every open non-draft PR for CI failures and unresolved Cursor Bugbot findings, then fix them on the existing PR branches.

    9.4k GitHub stars~1.4k tokensUpdated today
    Auto-check passed
  • No Use Effect

    fastrepl/anarlog

    Avoid direct React useEffect usage when writing or reviewing React components and hooks.

    9.4k GitHub stars~825 tokensUpdated today
    Auto-check passed
  • QA Critical UX

    fastrepl/anarlog

    QA Anarlog's critical Pro user journey on a signed staging candidate — onboarding, responsive launch, microphone and system-audio capture, automated summaries, and cloud sync.

    9.4k GitHub stars~1.4k tokensUpdated today
    Auto-check passed
  • Sqlite Schema Design

    fastrepl/anarlog

    Design or review schemas for crates/cloudsync using SQLite Sync constraints, not generic SQLite advice.

    9.4k GitHub stars~1.9k tokensUpdated today
    Auto-check passed

Works with

Categories

Questions about Reactive Sqlite UI

What does Reactive Sqlite UI do?

Build SQLite-backed reactive UI in apps/desktop using stable patterns for reads, selection, forms, writes, and loading states. Reactive Sqlite UI is an agent skill from fastrepl/anarlog. Build SQLite-backed reactive UI in apps/desktop using stable patterns for reads, selection, forms, writes, and loading states.

When should I use Reactive Sqlite UI?

Reactive Sqlite UI fits situations like: reviewing screens built on useDrizzleLiveQuery and SQLite mutations.

How do I install Reactive Sqlite UI in Claude Code?

Run `npx skills add fastrepl/anarlog --skill reactive-sqlite-ui -a claude-code`. Or copy the skill folder (.agents/skills/reactive-sqlite-ui in fastrepl/anarlog) into .claude/skills/reactive-sqlite-ui in your project. Claude Code loads it when a task matches its description.

How do I install Reactive Sqlite UI in Codex?

Run `npx skills add fastrepl/anarlog --skill reactive-sqlite-ui -a codex`. Or copy the skill folder (.agents/skills/reactive-sqlite-ui in fastrepl/anarlog) into .agents/skills/reactive-sqlite-ui in your project. Codex loads it when a task matches its description.

Can I use Reactive Sqlite UI in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add fastrepl/anarlog --skill reactive-sqlite-ui -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/reactive-sqlite-ui, .gemini/skills/reactive-sqlite-ui, .github/skills/reactive-sqlite-ui and .opencode/skills/reactive-sqlite-ui in your project.

What does Reactive Sqlite UI need to run?

SKILL.md names no scripts, command-line tools or credentials: Reactive Sqlite UI is instructions for the agent only.

Does Reactive Sqlite UI access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Reactive Sqlite UI safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Reactive Sqlite UI use?

Reactive Sqlite UI is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Reactive Sqlite UI use?

About 699 tokens (SKILL.md is roughly 2.8k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Reactive Sqlite UI?

Skills that share tags, products or a category with Reactive Sqlite UI: Iptvnator Sqlite DB Worker (4gray/iptvnator, 7.3k stars), Analyze Nsys Profile (mlc-ai/pith-train, 355 stars), Composer Forensics (dxos/dxos, 525 stars) and Makemigrations (deusXmachina-dev/memorylane, 121 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Reactive Sqlite UI?

fastrepl (a GitHub organization) maintains it in fastrepl/anarlog, which has 9,445 GitHub stars. The repository holds 32 skills in this directory. The repository was last updated on October 7, 2026.

Source: fastrepl/anarlog on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.