Design system contents

Patterns

Save and recover

Make pending work, confirmed persistence, and blocked edits visibly different.

On this page

Task sequence

  • Apply the edit locally and update the local cache.
  • Queue the lesson PATCH with its revision.
  • Wait for the response before advancing the confirmed revision.
  • Show Saving changes while queued or file operations remain.
  • If a write conflicts or fails, block dependent writes and preserve the unsaved content.
  • Copy the local work and reload before resuming after a conflict.

Data and persistence boundary

The builder’s per-lesson queue prevents overlapping writes from advancing revisions out of order. The explicit Save action waits for queues before structural work. Course-settings SaveButton has a separate parent-owned success timestamp.

Failure and recovery

The source warns on page departure while pending, busy, or blocked. The conflict specimen is an injected local 409 response. It proves the visible recovery branch, not production concurrency or database correctness.

Source references

Source references
FileResponsibility
src/app/make-class/[classId]/video-lessons/page.tsxQueue, revision, recovery, and departure warning
src/components/SaveButton.tsxExplicit save feedback

Interface examples

Native TeachKit interfaces with fictional course, account, and learner records. Service responses and media are isolated demonstrations; no customer data or live changes. Captured at 2× resolution or higher. Select an image to inspect it full size.

Builder Status · Component detail · Light · Desktop · Saving · 3504 × 402 px
Save · Component detail · Light · Desktop · 2280 × 504 px

Source audit: 2026-10-22 · Revision 903bbf05ca9d · Documentation v2.0.0