Special Features

Dynamic Form State Management

Sitepins handles complex, nested data structures by assigning temporary unique IDs to every level of the object during editing.

• ID Assignment (plate-utils.ts): Every field and array item is wrapped in an { id, value } structure to ensure stable React keys and smooth re-renders.
• Data Reversion: Before committing to Git, the IDs are stripped out (revertToOriginal) to maintain a clean raw data format.

Schema Generation (CreateSchema)

Sitepins allows users to create visual editing schemas for their content files dynamically.

Ancestor Schema Discovery

When a file is loaded, the system searches for a schema in its current directory. If missing, it traverses up the folder hierarchy to find an inherited schema, ensuring a fallback editor experience for deeply nested content.

Schema Parsing Logic

The convertSchema utility analyze existing Markdown/JSON files and suggests an initial schema based on detected fields and data types, significantly reducing the manual setup time for new sites.

Monaco Code Editor Integration

For advanced users, Sitepins provides a full-featured code editor powered by Monaco (the engine behind VS Code).

• Multi-language Support: Automatic syntax highlighting for MDX, JSON, YAML, CSS, and more.
• Smart Shortcuts: Standard Git shortcuts like Cmd+S for commit and Cmd+R for resetting changes.
• Safe Navigation: PreventNavigation ensures users don’t accidentally lose unsaved changes when navigating away from the editor.
• Optimistic Commit: Files are updated directly via Git provider mutations, with immediate feedback in the code view.

AI-Powered Content Generation

Sitepins leverages AI to assist with content creation, providing:

• Intelligent Expansion: Expand short blurbs into full paragraphs.
• Context-Aware SEO: Generate titles and descriptions based on page content.
• Metadata Suggestions: Automatically suggest tags and categories for blog posts.