feat: GIF quality and compression preset

[mvanhorn]

Summary

• Adds GIF quality / compression preset to the ExportSettingsMenu, picking up where @meiiie's draft (feat(export): add GIF compression preset #357) left off after she stepped back to reduce PR noise.
• Three presets: low (fast, small file), balanced (default - current behavior), high (slow, larger file).
• Wires through src/lib/exporter/types.ts for the typed preset, the ExportSettingsMenu UI, and VideoEditor's invocation path.
• Tests for the type narrowing and component behavior; existing exports continue to use balanced.

cc @meiiie - picking up your 2026-05-09 re-up invitation. Happy to adjust the preset boundaries or naming if you'd prefer different defaults.

Closes #336.

AI was used for assistance.

Summary by CodeRabbit

• New Features

  • GIF export now includes selectable quality presets: High, Balanced, and Small file. Users can optimize exports based on their desired quality or file size requirements.
  • GIF quality preferences are saved and restored across projects and sessions.

• Bug Fixes

  • Invalid or unavailable GIF quality settings now safely fall back to Balanced.

• Tests

  • Added test coverage for quality preset selection and GIF export configuration.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: e59ffb44-be48-423d-97b0-6ccf33509ac6

📥 Commits

Reviewing files that changed from the base of the PR and between 23fae67 and 64931d0.

📒 Files selected for processing (10)

• src/components/video-editor/ExportSettingsMenu.tsx
• src/components/video-editor/VideoEditor.tsx
• src/components/video-editor/editorPreferences.test.ts
• src/components/video-editor/editorPreferences.ts
• src/components/video-editor/exportStartSettings.test.ts
• src/components/video-editor/exportStartSettings.ts
• src/components/video-editor/projectPersistence.ts
• src/lib/exporter/gifExporter.test.ts
• src/lib/exporter/gifExporter.ts
• src/lib/exporter/types.ts

🚧 Files skipped from review as they are similar to previous changes (10)

• src/lib/exporter/gifExporter.test.ts
• src/components/video-editor/editorPreferences.test.ts
• src/lib/exporter/types.ts
• src/components/video-editor/projectPersistence.ts
• src/components/video-editor/exportStartSettings.ts
• src/components/video-editor/VideoEditor.tsx
• src/components/video-editor/editorPreferences.ts
• src/components/video-editor/exportStartSettings.test.ts
• src/lib/exporter/gifExporter.ts
• src/components/video-editor/ExportSettingsMenu.tsx

---

📝 Walkthrough

Walkthrough

This PR adds high, balanced, and small GIF quality presets. It integrates the presets with GIF encoding, editor state, project persistence, export settings, preferences, and the export settings menu.

Changes

GIF Quality Preset Feature

Layer / File(s)	Summary
Quality preset types and constants src/lib/exporter/types.ts, src/lib/exporter/index.ts, src/lib/exporter/types.test.ts	Defines GIF quality types, mappings, validation, and barrel exports. Tests verify valid values, invalid values, and quality mappings.
GIF encoder quality integration src/lib/exporter/gifExporter.ts, src/lib/exporter/gifExporter.test.ts	Adds preset-based encoder quality with balanced fallback. Tests verify preset behavior and output-size differences.
Editor state and preference persistence src/components/video-editor/projectPersistence.ts, src/components/video-editor/editorPreferences.ts, src/components/video-editor/editorPreferences.test.ts	Persists and validates gifQualityPreset. Invalid values default to balanced.
Export settings resolution src/components/video-editor/exportStartSettings.ts, src/components/video-editor/exportStartSettings.test.ts	Passes gifQualityPreset into GIF export configuration for standard and original-size exports.
VideoEditor state and export pipeline src/components/video-editor/VideoEditor.tsx	Tracks the preset through editor presets, project state, preferences, export settings, and GifExporter.
ExportSettingsMenu quality toggle src/components/video-editor/ExportSettingsMenu.tsx, src/components/video-editor/ExportSettingsMenu.test.tsx	Renders localized GIF quality options, highlights the active preset, and invokes the change callback. The test verifies the option labels.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Mergeability Score: ⚪ Minimal · up to 64931

This PR adds selectable GIF compression presets while retaining balanced behavior by default; no actionable merge-blocking risk remains beyond normal checks and review.

Sequence Diagram(s)

sequenceDiagram
  participant ExportSettingsMenu
  participant VideoEditor
  participant resolveExportStartSettings
  participant GifExporter

  ExportSettingsMenu->>VideoEditor: Select gifQualityPreset
  VideoEditor->>resolveExportStartSettings: Resolve GIF settings with preset
  resolveExportStartSettings-->>VideoEditor: Return gifConfig.qualityPreset
  VideoEditor->>GifExporter: Create exporter with qualityPreset
  GifExporter->>GifExporter: Resolve numeric encoder quality

Loading

Possibly related PRs

• webadderallorg/Recordly#567: Adds the export-settings resolution path extended here for GIF quality presets.
• webadderallorg/Recordly#391: Introduces related VideoEditor and editor preference state used by this change.
• webadderallorg/Recordly#630: Modifies related GIF exporter configuration in a separate feature.

🚥 Pre-merge checks | ✅ 3 | ❌ 2

❌ Failed checks (2 warnings)

Check name	Status	Explanation	Resolution
Description check	⚠️ Warning	The description explains the feature and related issue but omits most required template sections, including motivation, type, testing guide, screenshots, and checklist.	Add the required template sections and provide motivation, change type, testing steps, applicable screenshots or video, and checklist status.
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly summarizes the main change: adding GIF quality and compression presets.
Linked Issues check	✅ Passed	The implementation adds GIF quality presets, wires them through export settings and persistence, and supports the file-size trade-off requested in issue #336.
Out of Scope Changes check	✅ Passed	The changed production and test files are directly related to GIF quality presets and the export pipeline requested by issue #336.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}