retool-migration

Ports Retool app exports into SvelteKit pages in the moderator app.

7.2k|734|Updated Oct 11, 2022
One-click install
npx skills add https://github.com/civitai/civitai --skill retool-migration
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: retool-migration
Source: https://github.com/civitai/civitai/tree/main/.claude/skills/retool-migration
Command: npx skills add https://github.com/civitai/civitai --skill retool-migration

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires pg, transit-js, and includes scripts (resource) components.

What problem does it solve?

Migrating internal moderation tools off Retool requires decoding transit-js encoded app exports, inventorying dozens of queries and widgets, and rebuilding equivalent functionality in a SvelteKit app without losing hidden workflows encoded in dropdown presets, tab panes, and role gates.

Core Features & Use Cases

  • Export Decoding: extract.mjs decodes the transit-js appState blob into a readable inventory of every query, SQL body, widget option set, tab layout, and data binding.
  • Guided Porting Workflow: SKILL.md walks through classifying every query (port, equivalent, plumbing, superseded, blocked), mapping Retool resources to Kysely datasources, building the page with shadcn and Tailwind, and registering it in grant-based navigation.
  • Read-Only Database Scoping: retool-db.mjs inspects the moderator Postgres database (tables, schemas, row counts) while refusing all writes.
  • Use Case: Given a Retool JSON export of a moderation tool like User Lookup, generate the full query inventory, classify all 170 queries, and build the replacement page under apps/moderator with verification reviews.

Quick Start

Ask the AI to port the attached Retool export into a new page in the moderator app using the retool-migration skill.

Frequently Asked Questions about retool-migration

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I migrate a Retool app to a custom web app?

Decode the Retool export with extract.mjs to inventory every query and widget, classify each query as port, equivalent, plumbing, superseded, or blocked, then rebuild the functionality as a SvelteKit page using Kysely for data access and form actions for mutations.

How do I decode a Retool export JSON file?

Retool exports are not plain JSON: page.data.appState is a transit-js encoded string. Run node extract.mjs <export.json> to decode it into a readable inventory of queries, SQL bodies, component types, tab layouts, and data bindings.

Why do Retool migrations miss functionality that users relied on?

Workflows are often encoded in widget option sets, Function queries, tab panes, and visibility gates rather than in SQL. Dropdown presets and hidden panes appear in no query list, so the inventory's option sets and layout sections must be reviewed alongside the queries.

Can I query the Retool Postgres database directly during migration?

Yes, retool-db.mjs runs read-only queries against the moderator database using MODERATOR_DATABASE_URL from a local .env file. It supports --tables, --describe, and arbitrary SELECT statements, and refuses all write operations before connecting.

What are the limitations of porting from a Retool export?

Exports are stale the moment they are taken and omit event handlers and frame-level widgets, so click behavior and persistent toolbars cannot be recovered from the file alone. Screenshots or access to the live Retool app are needed to close those gaps.