gui-settings-ui

Guides building Warp GUI settings pages with correct widget filtering and search behavior.

64.7k|5.5k|Updated Jul 8, 2021
One-click install
npx skills add https://github.com/warpdotdev/warp --skill gui-settings-ui
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: gui-settings-ui
Source: https://github.com/warpdotdev/warp/tree/main/.agents/skills/gui-settings-ui
Command: npx skills add https://github.com/warpdotdev/warp --skill gui-settings-ui

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Settings pages in the Warp GUI desktop app are often written by pattern-matching neighboring code, which repeatedly produces two bugs: page headings that vanish during search filtering, and unfilterable mega-widgets that match every query. This Skill encodes the correct model for PageType, SettingsWidget, search_terms, and widget gating so new settings pages behave correctly under settings search.

Core Features & Use Cases

  • Page structure guidance: Explains the PageType variants (Uncategorized, Categorized, Monolith) and where page titles versus section headings must live so headings survive search filtering.
  • Widget gating rules: Distinguishes build-time if gating for static feature flags from should_render for runtime-changing conditions like auth state or user toggles.
  • Search term scoping: Shows how to split mega-widgets into one widget per setting row with scoped search_terms, preserving deeplink widget ids.
  • Use Case: When adding a new settings page to app/src/settings_view, follow this Skill to pick the right PageType variant, place the title in the page-title slot, and verify filtering with the unit-test harness in mod_tests.rs.

Quick Start

Use the gui-settings-ui skill to add a new settings page to the Warp client with correct title placement, widget gating, and per-widget search terms.

Frequently Asked Questions about gui-settings-ui

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

FAQPage Schema
How do I add a settings page to the Warp GUI client?

Create a PageType in app/src/settings_view choosing Uncategorized, Categorized, or Monolith based on page shape, pass the page title through the PageType title slot, and implement one SettingsWidget per setting row with scoped search_terms.

Why does my settings page heading disappear when searching?

The heading was rendered inside a widget instead of the PageType title slot, so filtering removes it along with non-matching rows. On Uncategorized and Categorized pages, move the title to PageType::new_uncategorized(widgets, Some("Title")).

Should I use should_render or an if statement to hide a settings widget?

Use a build-time if for conditions fixed for the process, such as feature flags, cfg! features, or platform checks. Use should_render for values that can change at runtime, like auth state or user-toggleable settings, since it is re-evaluated every filter pass.

Why does settings search show every row for a specific query?

One widget is rendering many unrelated settings with a single mega search_terms blob, and the widget is the smallest filter unit. Split it into one widget per setting row, each with search_terms scoped to just that row.

How do I test settings search filtering in Warp?

Use the harness in app/src/settings_view/mod_tests.rs with StubWidget and visible_widget_count to assert a unique term yields one visible widget, run via cargo nextest run -p warp settings_view, then manually verify the title survives filtering in the real Settings UI.