Prompts

UI Changes

Prompts for modifying the user interface

TL;DR: Describe what you want to see, AI updates the UI.

List Page Changes

Add Column

Add [column] column to [entity] list.

Example:

Add created_at column to tasks list.
Format as "Jan 15, 2025".

Add Clickable Column

Make [column] in [entity] list clickable.
Link to [destination].

Example:

Make client_name in invoices list clickable.
Link to client detail page.

Add Badge/Status Column

Show [field] as colored badge in [entity] list.
Colors: [value1] = [color1], [value2] = [color2], etc.

Example:

Show priority as colored badge in tasks list.
Colors: low = gray, medium = yellow, high = red.

Change Column Order

Reorder columns in [entity] list:
1. [column1]
2. [column2]
3. [column3]
...

Hide Column by Default

Hide [column] in [entity] list by default.
User can enable it from column visibility menu.

Filters

Add Filter

Add [field] filter to [entity] list.

Example:

Add status filter to tasks list.
Show count next to each option.

Add Date Range Filter

Add date range filter for [field] in [entity] list.
Presets: today, this week, this month, custom range.
Add search to [entity] list.
Search in: [field1], [field2], [field3].

Example:

Add search to products list.
Search in: name, sku, description.

Add Multiple Filters

Add filters to [entity] list:
- [field1]: [type]
- [field2]: [type]
- [field3]: [type]

Example:

Add filters to orders list:
- status: multi-select
- customer: search/select
- date_range: date picker
- total: range (min-max)

Detail Page Changes

Add Section

Add [section_name] section to [entity] detail page.
Show fields: [field1], [field2], [field3].

Example:

Add "Financial Info" section to clients detail page.
Show fields: annual_revenue, payment_terms, credit_limit.
Add [related_entity] list to [entity] detail page.
Show as embedded table.
Allow adding new [related_entity] from detail page.

Example:

Add contacts list to clients detail page.
Show as embedded table with name, email, phone.
Allow adding new contact directly from client page.

Add Tabs

Organize [entity] detail page into tabs:
- [Tab1]: [sections/content]
- [Tab2]: [sections/content]
- [Tab3]: [sections/content]

Example:

Organize project detail page into tabs:
- Overview: basic info, status, dates
- Tasks: related tasks list
- Files: related files list
- Activity: activity timeline

Change Header

Update [entity] detail page header.
Show: [field1] as title, [field2] as subtitle.
Add [field3] as badge.
Quick actions: [action1], [action2].

Example:

Update invoice detail page header.
Show: invoice_number as title, client_name as subtitle.
Add status as badge (colored).
Quick actions: Send, Mark as Paid, Download PDF.

Forms

Add Field to Form

Add [field] to [entity] create/edit form.
Input type: [type].
[Additional options]

Example:

Add notes field to task create/edit form.
Input type: textarea.
Placeholder: "Add any additional notes..."
Optional field.

Change Field Input Type

Change [field] input in [entity] form to [new_type].

Example:

Change description input in projects form to rich text editor.

Add Field Validation Message

Add custom validation message for [field] in [entity] form.
Message: "[custom message]"

Group Form Fields

Group fields in [entity] form:
- [Group1]: [field1], [field2]
- [Group2]: [field3], [field4]

Example:

Group fields in contact form:
- Personal: first_name, last_name, title
- Contact: email, phone, mobile
- Social: linkedin_url, twitter_handle

Add to Sidebar

Add [entity] to sidebar navigation.
Icon: [icon_name].
Position: after [existing_item].

Example:

Add Projects to sidebar navigation.
Icon: folder.
Position: after Clients.

Add Submenu

Add submenu under [parent] in sidebar:
- [item1]
- [item2]
- [item3]

Other UI Changes

Add Quick Actions

Add quick actions to [entity] list rows:
- [action1]: [icon]
- [action2]: [icon]
Move other actions to "..." menu.

Example:

Add quick actions to tasks list rows:
- Mark complete: check icon
- Edit: pencil icon
Move Delete and Duplicate to "..." menu.

Add Bulk Actions

Add bulk actions to [entity] list:
- [action1]
- [action2]

Example:

Add bulk actions to invoices list:
- Mark as Sent
- Mark as Paid
- Export Selected
- Delete Selected (admin only)

Add Empty State

Customize empty state for [entity] list.
Title: "[title]"
Description: "[description]"
Action button: "[button_text]"

Example:

Customize empty state for projects list.
Title: "No projects yet"
Description: "Create your first project to get started"
Action button: "Create Project"

On this page