Skip to content

Add illustration upload to pending plot editor + agent skill docs #188

@realproject7

Description

@realproject7

Feature

Add the "Add illustrations in the plot" checkbox and upload area to the pending plot editor (Edit tab for unpublished plots), and update agent docs so AI agents can guide users.

⚠️ Critical: Content is immutable after publish

Once published, the plot content (including any markdown image references) is stored on IPFS and verified by an on-chain keccak256 hash. It cannot be edited. This makes the implementation safety-critical.

Implementation

1. Add illustration upload UI to pending plot Edit tab

Below the character count line, add:

  • Checkbox: "Add illustrations in the plot"
  • When checked, show upload area (drag-and-drop, WebP/JPEG, max 500KB)
  • After upload, show the copyable markdown reference:
    ![Scene description](https://ipfs.filebase.io/ipfs/QmXxxx)
    
  • Support multiple uploads (each gets its own copyable reference)
  • User manually inserts the markdown into their plot content

2. Pre-publish validation (IMPORTANT)

Before allowing publish, validate any image references in the content:

  • Scan content for ![...](...) markdown patterns
  • Verify each URL starts with https://ipfs.filebase.io/ipfs/ (valid IPFS gateway URL)
  • Warn if any image reference has malformed markdown (missing brackets, etc.)
  • Show a confirmation dialog: "This plot contains X illustration(s). Please verify they appear correctly in Preview before publishing."

3. Preview must render images accurately

Ensure the Preview tab renders ![alt](url) images the same way plotlink.xyz does:

  • plotlink.xyz uses a custom sanitizer allowing img with src, alt, title
  • plotlink-ows currently uses the default rehype-sanitize schema (allows img with src but not alt)
  • Fix: Add a custom sanitizer schema matching plotlink.xyz:
    const sanitizeSchema = {
      ...defaultSchema,
      attributes: { ...defaultSchema.attributes, img: ["src", "alt", "title"] },
    };

4. Update agent skill docs

Update ~/.plotlink-ows/CLAUDE.md (generated on startup) to include:

  • How to upload illustrations via /api/publish/upload-plot-image
  • How to guide users to insert ![alt](url) in their plots
  • Remind users to always verify images in Preview before publishing
  • Note: content is immutable after publish — image references cannot be removed or changed

The AI agent should:

  • Suggest illustrations at appropriate scenes
  • Help upload and insert the markdown correctly
  • Always remind the user to check Preview before publishing

Depends on

  • plotlink#1192 (endpoint must work)

Acceptance Criteria

  • Illustration checkbox + upload area in pending plot Edit tab
  • Copyable markdown reference shown after upload
  • Multiple image uploads supported
  • Pre-publish validation warns about image references and malformed markdown
  • Preview tab renders images with matching sanitizer config as plotlink.xyz
  • Confirmation dialog before publishing content with illustrations
  • CLAUDE.md updated with illustration workflow + immutability warning
  • Published plots with image markdown render correctly on plotlink.xyz (end-to-end verified)

Refs: #184, #186, plotlink#1186, plotlink#1192

Metadata

Metadata

Assignees

No one assigned

    Labels

    agent/T3Assigned to T3 builder agentenhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions