skills.rest
iblai
iblaiOFFICIAL
Explore all skills by this author →
Website𝕏@iblai_GitHub

iblai-agent-prompt

Display and manage system and suggested prompts in Next.js apps.

15|3|Updated Mar 27, 2026
Search Tags:#ui#sdk#agent#nextjs#prompts#iblai
One-click install
npx skills add https://github.com/iblai/vibe --skill iblai-agent-prompt
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: iblai-agent-prompt
Source: https://github.com/iblai/vibe/tree/main/skills/iblai-agent-prompt
Command: npx skills add https://github.com/iblai/vibe --skill iblai-agent-prompt

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill adds the agent Prompts tab to your Next.js app, enabling a centralized UI for managing system prompts (system, proactive, study, guided) and a dedicated section for suggested prompts, with edit/copy functionality and modal dialogs.

Core Features & Use Cases

  • Displays system prompts (system, proactive, study, guided) with edit/copy buttons and toggle switches, plus a suggested prompts section with add and edit modals.
  • Integrates with the AgentSettingsProvider and is designed as one tab within the broader agent-settings family.
  • Guides developers to follow ibl.ai branding and component usage, and to avoid custom styling overrides.

Quick Start

Mount the AgentPromptsTab in your Next.js app and verify the prompts UI renders as expected.

Frequently Asked Questions about iblai-agent-prompt

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

FAQPage Schema
How do I add a system prompts management UI to my Next.js dashboard?▼

You can add a system prompts management UI to your Next.js dashboard by mounting the AgentPromptsTab component, which renders system, proactive, study, and guided prompts with edit and copy capabilities.

What are the different types of system prompts I can configure for an AI agent?▼

The configurable system prompts include system, proactive, study, and guided categories, alongside a dedicated suggested prompts section manageable through edit and copy buttons plus modal-based add flows.

Can I customize the styling of the agent prompts tab in Next.js?▼

You should avoid custom styling overrides for the agent prompts tab. The component is designed to follow ibl.ai branding guidelines and uses the ibl.ai SDK components to maintain consistent prompt template rendering.

How do I manage suggested prompts using the ibl.ai SDK in a Next.js app?▼

You manage suggested prompts using the ibl.ai SDK by loading the AgentPromptsTab in your Next.js app, which provides a dedicated suggested prompts section equipped with add and edit modal dialogs for configuration.

Does the agent prompts tab require a specific provider wrapper in Next.js?▼

Yes, the agent prompts tab requires wrapping with the AgentSettingsProvider in your Next.js app. It functions as one tab within the broader agent-settings family to maintain consistent prompt templates.

Related Skills

Explore More Software Engineering Skills→
iblaiiblai
15

iblai-agent-api

Manage ibl.ai agent API keys within a Next.js app.

Official
Intermediate
awardsappawardsapp

building-settings-ui

Standardize Tambo Cloud settings sections across Agent and Settings tabs.

Official
Intermediate
ammosuammosu
24

brand-guidelines

Apply Anthropic brand colors, typography, and formatting to documents and UI assets.

Community
Basic
YOYOMAIIYOYOMAII
1

clerk-custom-ui

Implement custom authentication flows and style Clerk components in Next.js applications.

Community
Advanced