Skip to content

refactor(editor): extract project dirty state#545

Merged
meiiie merged 2 commits into
mainfrom
refactor/editor-project-dirty-state-local
May 20, 2026
Merged

refactor(editor): extract project dirty state#545
meiiie merged 2 commits into
mainfrom
refactor/editor-project-dirty-state-local

Conversation

@meiiie
Copy link
Copy Markdown
Collaborator

@meiiie meiiie commented May 20, 2026

Description

Extracts the unsaved-project dirty-state comparison out of VideoEditor.tsx into a small pure module with focused coverage.

Motivation

This continues the editor architecture refactor by moving another self-contained state decision out of the god component. The slice is intentionally stacked on #544 because it builds on the editor history model branch and should be reviewed after that PR.

Type of Change

  • Refactor
  • Tests

Related Issue(s)

Stacked after #544.

Changes Made

  • Added src/components/video-editor/projectDirtyState.ts with hasUnsavedProjectChanges.
  • Added unit coverage for missing snapshots, no saved baseline, deeply equal snapshots, nested editor changes, and array length changes.
  • Updated VideoEditor.tsx to delegate hasUnsavedChanges to the extracted dirty-state model.

Scope Note

No UI behavior, persistence format, project save/load behavior, export behavior, native helper behavior, or runtime path is intentionally changed. This PR is a stacked draft PR based on refactor/editor-history-model-slice; it should not be merged before #544.

Testing Guide

Review only the diff against #544: projectDirtyState.ts, its test, and the small VideoEditor.tsx call-site replacement.

Checklist

  • One focused architecture slice
  • Behavior-preserving refactor
  • Unit coverage added for moved dirty-state logic
  • Typecheck passed
  • Scoped Biome completed
  • Branch diff excludes unrelated generated/local files

Local Checks

  • npm test -- src/components/video-editor/projectDirtyState.test.ts (5 tests passed)
  • npm test -- src/components/video-editor/projectDirtyState.test.ts src/components/video-editor/editorHistory.test.ts src/components/video-editor/types.test.ts (30 tests passed)
  • npx tsc --noEmit --pretty false (passed)
  • npx biome check --formatter-enabled=false --assist-enabled=false src/components/video-editor/VideoEditor.tsx src/components/video-editor/projectDirtyState.ts src/components/video-editor/projectDirtyState.test.ts (exit 0; existing unrelated VideoEditor.tsx exhaustive-deps warning remains)
  • git diff --check refactor/editor-history-model-slice...HEAD (passed)

Runtime/Repro Evidence

Not run. This PR moves pure project dirty-state comparison into a tested module; no Electron, preview rendering, export, or native runtime path changed.

Summary by CodeRabbit

  • Refactor

    • Consolidated unsaved-project change detection into a shared utility, replacing redundant inline deep-equality checks to centralize and simplify change detection logic.
  • Tests

    • Added comprehensive test coverage for the new detection logic, including cases for missing snapshots, deep-equality of complex structures, and detection of nested/editor-state changes.

Review Change Stack

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented May 20, 2026

📝 Walkthrough

Walkthrough

The PR extracts deep-equality logic from VideoEditor into a new projectDirtyState utility. hasUnsavedProjectChanges centralizes snapshot comparison with recursive equality for primitives, arrays, and objects. VideoEditor now imports and uses this utility, removing its local deep-equality helpers.

Changes

Project dirty-state utility extraction

Layer / File(s) Summary
Deep equality utility module and unsaved-change detection
src/components/video-editor/projectDirtyState.ts
New module exports hasUnsavedProjectChanges alongside recursive deep-equality helpers that compare primitives, arrays, and object keys/values.
Unit tests for dirty-state detection
src/components/video-editor/projectDirtyState.test.ts
Test suite validates null-snapshot handling, deep equality, and detection of nested structure mutations (zoom regions, autoCaptions array changes).
VideoEditor import/usage and helper removal
src/components/video-editor/VideoEditor.tsx
VideoEditor imports hasUnsavedProjectChanges, removes local deep-equality helpers, and updates the hasUnsavedChanges memo to call the new utility; also includes import reordering and small formatting refactors.
State application, history, and timeline callbacks
src/components/video-editor/VideoEditor.tsx
Refactors applyHistorySnapshot, timeline seeking handlers, and setSourceAudioTrackSettingsByClip formatting without behavioral changes.
Audio handlers, settings props, and playback formatting
src/components/video-editor/VideoEditor.tsx
Refactors audio add/delete/normalize handlers, SettingsPanel prop formatting, and VideoPlayback preview volume expression; logic unchanged.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

  • webadderallorg/Recordly#304: Touches VideoEditor snapshot/save logic; changes to saved-snapshot shape there may affect what the dirty-state utility compares.

Poem

🐰 I hopped through snapshots, sniffed each line,

Found deep-equal patterns, neat and fine.
Pulled the logic out to a tidy nest,
Tested the patch, gave VideoEditor rest.
🍃 Small hops, big clarity — now I'm blessed.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
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 (4 passed)
Check name Status Explanation
Title check ✅ Passed The title accurately describes the main change: extracting project dirty-state logic from VideoEditor.tsx into a new shared module, which is the primary objective of this refactoring PR.
Description check ✅ Passed The PR description provides all required template sections with substantial detail: clear description of the refactor, motivation, type of change, related issues, comprehensive changes made, scope notes, testing guide, and a detailed checklist with local check results.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch refactor/editor-project-dirty-state-local

Warning

Review ran into problems

🔥 Problems

Git: Failed to clone repository. Please run the @coderabbitai full review command to re-trigger a full review. If the issue persists, set path_filters to include or exclude specific files.


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

Comment @coderabbitai help to get the list of available commands and usage tips.

@meiiie meiiie marked this pull request as ready for review May 20, 2026 16:38
@meiiie meiiie changed the base branch from refactor/editor-history-model-slice to main May 20, 2026 16:47
…ct-dirty-state-local

# Conflicts:
#	src/components/video-editor/VideoEditor.tsx
Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)
src/components/video-editor/VideoEditor.tsx (1)

2293-2298: ⚠️ Potential issue | 🟠 Major | ⚡ Quick win

Avoid logging raw filesystem paths from recording sessions.

Line 2297 logs session?.webcamPath, which can expose user-identifying local paths in app logs. Prefer logging presence/absence instead of the full path.

🔧 Suggested fix
 			console.log("[VideoEditor] onRecordingSessionChanged received!", {
 				sessionVideoPath: session?.videoPath,
 				videoSourcePath: videoSourcePath,
 				match: session?.videoPath === videoSourcePath,
-				webcamPath: session?.webcamPath,
+				hasWebcamPath: Boolean(session?.webcamPath),
 			});
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/components/video-editor/VideoEditor.tsx` around lines 2293 - 2298, The
console.log in the onRecordingSessionChanged handler is currently emitting raw
filesystem paths (session?.webcamPath, session?.videoPath, videoSourcePath);
change the log to avoid exposing full paths by replacing those fields with safe
indicators (e.g., booleans like hasWebcam: Boolean(session?.webcamPath),
hasVideo: Boolean(session?.videoPath), isMatch: session?.videoPath ===
videoSourcePath) or masked values before calling console.log so only
presence/match info is recorded, keeping the existing message context.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Outside diff comments:
In `@src/components/video-editor/VideoEditor.tsx`:
- Around line 2293-2298: The console.log in the onRecordingSessionChanged
handler is currently emitting raw filesystem paths (session?.webcamPath,
session?.videoPath, videoSourcePath); change the log to avoid exposing full
paths by replacing those fields with safe indicators (e.g., booleans like
hasWebcam: Boolean(session?.webcamPath), hasVideo: Boolean(session?.videoPath),
isMatch: session?.videoPath === videoSourcePath) or masked values before calling
console.log so only presence/match info is recorded, keeping the existing
message context.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: e1095699-dcdc-4770-844f-c59c186c10ef

📥 Commits

Reviewing files that changed from the base of the PR and between 075db64 and 90cd0a1.

📒 Files selected for processing (1)
  • src/components/video-editor/VideoEditor.tsx

@meiiie meiiie merged commit c61de0e into main May 20, 2026
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant