Skip to main content
Both the Retry and Fix with AI do not consume any credits.

Retry

If you didn’t quite like what the AI generated, you can click the Retry button to have it try the same prompt again. Retrying a prompt does not consume any new credits.

Fix with AI

If you’re experiencing an issue with your design in Magic Patterns, you can use the Fix with AI feature. This tool helps resolve problems automatically and does not consume any credits.

/Debug Command

When you’re stuck in a situation where the AI isn’t following your instructions correctly, try using the /Debug command in the chat. It plugs in a well-crafted prompt template along with your description of the issue that helps guide the AI toward debugging the issue effectively.

Help! I Don’t See My Changes

What’s Happening

The AI very likely did make the change you asked for, but:
  • It’s not “hooked up” (e.g., created a new page but didn’t link a button to it)
  • It’s on a different page/route than you’re looking at
  • The element exists but isn’t visible (hidden, off-screen, or in a different state)

The Solution

Ask the AI to reflect on why you’re not seeing the changes:
Prompt
I asked you to [describe your change] but I don't see it on the screen. Can you reflect on what you changed and where it is? Did you create a new page or component that I need to navigate to?
The AI will usually explain:
  • “I created a new /settings route, but you need to click the gear icon to navigate there”
  • “I added the feature to the mobile view, but you’re looking at desktop”
  • “I created a modal, but it only shows when you click the ‘View Details’ button”

Prevention Tips

To avoid this issue in future prompts:
  1. Be explicit about where changes should appear:
    • Bad: “Add a settings page”
    • Good: “Add a /settings route and make the gear icon in the header link to it”
  2. Use Select Mode to reference specific elements:
    • Click the button that should trigger the change
    • Add it to chat
    • Then prompt: “When I click X, ensure that it actually goes to [XYZ].”
  3. Ask the AI to confirm:
    • Add to your prompt: “…and make sure it’s visible on [XYZ]“

Error Boundary Error

If Fix with AI isn’t appearing in your project, it’s likely because your app is wrapped in an ErrorBoundary. This prevents unhandled exceptions from surfacing, which means the system doesn’t recognize an error and won’t trigger Fix with AI. In frameworks like React, an ErrorBoundary catches errors and displays fallback UI. While useful for production, this behavior interferes with Fix with AI by suppressing errors. To allow Fix with AI to work correctly, remove or disable your error boundary by prompting the assistant to automatically make the change.
Removing Error Boundary Prompt
Do not use an error boundary at all
I