sima-form-edit-mode

Implement edit mode for TypeScript/React entity forms with data binding and image management.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/RosenGray/sima --skill sima-form-edit-mode
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: sima-form-edit-mode
Source: https://github.com/RosenGray/sima/tree/main/.cursor/skills/sima-form-edit-mode
Command: npx skills add https://github.com/RosenGray/sima --skill sima-form-edit-mode

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides a structured approach to implementing a robust form edit mode in web applications, enabling consistent handling of create and edit flows, entity data, and image management.

Core Features & Use Cases

  • Mode-aware form rendering: switch between Create and Edit modes using a FormMode enum.
  • Data binding and defaults: populate form fields from the existing entity data with safe fallbacks.
  • Image management: support existing and new images with deletion flags and previews.
  • Reuse of validation and submission patterns: align with existing publish forms in the codebase.

Quick Start

Use this skill to guide implementing the edit functionality in an existing form component by wiring FormMode, entity data, and image handling.

Frequently Asked Questions about sima-form-edit-mode

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

FAQPage Schema
How do I implement edit mode in a React form component using TypeScript?

Implementing edit mode in a React form component requires a FormMode enum for state switching, defaultValue handling to bind existing entity data, and integrating publish and edit actions for submission.

What is the best way to handle data binding for entity forms in React?

Handling data binding for entity forms involves populating fields from existing entity data while applying safe fallback defaults to prevent runtime errors when optional fields are missing.

How do I manage existing and new images during form editing in a TypeScript app?

Managing images during form editing requires supporting existing and new image uploads by utilizing deletion flags and rendering image previews within the React form component.

Can I reuse validation and submission patterns from create forms for edit forms?

You can reuse validation and submission patterns from create forms by aligning the edit mode implementation with existing publish form behaviors to ensure consistent processing across both create and edit flows.

Does this approach require a FormMode enum to switch between create and edit states?

Yes, this approach requires a FormMode enum to explicitly switch between create and edit states, ensuring the form component renders the correct fields and triggers the appropriate publish or edit submission actions.

Why are my default values not showing when binding existing entity data in edit mode?

Default values fail to show in edit mode when the form lacks safe fallback handling for optional entity fields, which is necessary to properly populate inputs when existing data is missing or undefined.