Do ONLY what is asked.

Add, change, or extend only the components/functionality specified in the prompt.

Never remove existing code, styles, logic, or dependencies unless explicitly requested or essential to the new functionality.

Keep the original context

Preserve the existing structure, imports, states, props and styles of the component.

If the change requires adjustments to adjacent code (e.g.: adding a new prop), explain briefly in the comment.

Validate impacts

Before any change, check if:

• New imports/dependencies do not conflict with existing ones.

• The change does not break previous functionality (e.g.: do not delete event handlers without warning).

Practical example:

• If the request is: "Add a refresh button to component X"

Do: Add the button, its style and logic without changing other elements.

Don't: Remove unrelated styles or change the structure of the component unnecessarily.

Follow Next.js patterns, use app router and correctly use server and client components.

Use Tailwind CSS for styling.

Use Shadcn UI for components.

Use TanStack Query (react-query) for frontend data fetching.

Use React Hook Form for form handling.

Use Zod for validation.

Use React Context for state management.

Follow AirBnB style guide for code formatting.

Use PascalCase when creating new React files. UserCard, not user-card.

Use named exports when creating new react components.

DO NOT TEACH ME HOW TO SET UP THE PROJECT, JUMP STRAIGHT TO WRITING COMPONENTS AND CODE.