mirror of
https://github.com/heygen-com/hyperframes.git
synced 2026-09-03 04:38:33 +00:00
Miguel ÁngelandMiguel Ángel
7bff49ecf0
* fix(studio): guard Zustand no-op setters and fix useConsoleErrorCapture memory leak - Guard setIsPlaying to skip set() when value unchanged (eliminates 60 notifications/sec during reverse playback) - Guard caption store selectGroup to bail before set() when group missing (prevents empty Zustand notifications) - Guard clearSelection to skip when already empty - Fix useConsoleErrorCapture: restore original console.error, remove error event listener, and delete __hfErrorCapture flag on cleanup * fix(studio): delete dead files and unused exports Remove 7 dead files (audioBeatDetection, keyframeSnapping, timelineInspector, DopesheetStrip, StaggerControls, TimelineLayerPanel, TimelineEditorNotice) and their test companions. Delete unused computeFitToChildrenSize export from propertyPanelHelpers. Fix re-export indirection: useDomEditCommits and studioMotionOps.test now import patch builders directly from manualEditsDomPatches instead of the re-export passthrough in manualEditsDom. * fix(studio): eliminate effect-chain state mirroring for lint findings, hover, and GSAP fetch Move lint findingsByElement sync from App.tsx into useLintModal where the value is produced, removing the mirroring useEffect. Consolidate 4 hover-clearing effects in useDomSelection into 2 (one unconditional on context change, one conditional combining caption mode, selection match, and disconnected element checks). Fold the GSAP retry effect into the fetch effect in useGsapTweenCache, scheduling a single retry via setTimeout when the initial fetch returns 0 animations. Eliminates 3 unnecessary render cycles from effect chains. * fix(studio): memoize renderQueue, toolbar, and canvas rect to prevent re-render cascade - Wrap renderQueue object in useMemo so StudioContext consumers don't re-render on every App render - Memoize timelineToolbar JSX so NLELayout memo isn't defeated - Move canvasRect getBoundingClientRect() from render-time IIFE to a useLayoutEffect-backed ref, eliminating layout thrashing - Track and clear setTimeout handles in refreshPreviewDocumentVersion to prevent stale timer accumulation on rapid calls and unmount * refactor(studio): consolidate GSAP shared primitives — defaults, iframe access, keyframe parsing Extract duplicated PROPERTY_DEFAULTS, IframeGsap interface, iframe accessors (getIframeGsap, queryIframeElement), percentage keyframe parsing, and toAbsoluteTime into a single gsapShared.ts module. Removes ~120 lines of copy-pasted logic across 8 hook files, reducing drift risk between the duplicate implementations. * fix(studio): remove dead store fields, dead file, duplicate helper, and unsafe assertions * refactor(studio): deduplicate selector helpers, rounding utils, percentage computation, and iframe access * fix(studio): split StudioContext into Shell + Playback to prevent cascade re-renders * refactor(studio): decompose useGsapScriptCommits into focused mutation hooks * refactor(studio): decompose useFileManager into focused file operation hooks Extract useFileTree (tree loading, refresh, derived assets/compositions) and useEditorSave (debounced save with history tracking) from the 508-LOC useFileManager. The parent hook composes both and retains file I/O, click-to-source, upload/import, and CRUD — preserving the same public interface so no consumers change. * refactor(studio): decompose useDomEditCommits into focused commit hooks Extract geometry (path offset, box size, rotation) and element lifecycle (delete, z-index reorder) into useDomGeometryCommits and useElementLifecycleOps. Parent keeps persistDomEditOperations as core and composes all sub-hooks — public interface unchanged. * refactor(studio): simplify useAppHotkeys with declarative command table * refactor(studio): simplify useAppHotkeys with declarative command table Replace 15 individual useRef callback refs with a single cbRef object. Extract keydown dispatch into pure dispatchModifierKey/dispatchPlainKey functions. Merge duplicate undo/redo logic into shared applyHistory. Extract cross-origin listener boilerplate into safeAddListener/safeRemoveListener. Hook body: 204 LOC (down from 445). Public API unchanged. * fix(studio): remove unused getDomEditTargetKey import * refactor(studio): decompose useDomEditSession into focused editing hooks Extract GSAP-aware geometry intercepts (move/resize/rotation) and animated property commit into useGsapAwareEditing, and selection wiring, GSAP cache management, preview sync, and selection handlers into useDomEditWiring. The parent remains a pure composition shell. * style(studio): fix formatting in 5 files * fix(studio): trim App.tsx to 598 lines (under 600 limit) --------- Co-authored-by: Miguel Ángel <miguel07alm@protonmail.com>
83 lines
2.4 KiB
TypeScript
83 lines
2.4 KiB
TypeScript
import type { GsapAnimation } from "@hyperframes/core/gsap-parser";
|
|
import type { DomEditSelection } from "../components/editor/domEditingTypes";
|
|
import { absoluteToPercentageForAnimation, findTweenAtTime } from "../utils/globalTimeCompiler";
|
|
import { PROPERTY_DEFAULTS, selectorFromSelection } from "./gsapShared";
|
|
import { roundToCenti } from "../utils/rounding";
|
|
|
|
type CommitFn = (
|
|
selection: DomEditSelection,
|
|
mutation: Record<string, unknown>,
|
|
options: {
|
|
label: string;
|
|
coalesceKey?: string;
|
|
softReload?: boolean;
|
|
skipReload?: boolean;
|
|
},
|
|
) => Promise<void>;
|
|
|
|
export async function commitKeyframeAtTimeImpl(
|
|
selection: DomEditSelection,
|
|
absoluteTime: number,
|
|
animations: GsapAnimation[],
|
|
properties: Record<string, number | string>,
|
|
commitMutation: CommitFn,
|
|
): Promise<void> {
|
|
const selector = selectorFromSelection(selection);
|
|
if (!selector) return;
|
|
|
|
const tween = findTweenAtTime(absoluteTime, animations, selector);
|
|
if (tween) {
|
|
const pct = absoluteToPercentageForAnimation(absoluteTime, tween);
|
|
if (pct === null) return;
|
|
|
|
const hasExplicitKeyframes = !!tween.keyframes && tween.keyframes.keyframes.length > 0;
|
|
if (!hasExplicitKeyframes) {
|
|
await commitMutation(
|
|
selection,
|
|
{ type: "convert-to-keyframes", animationId: tween.id },
|
|
{ label: "Convert to keyframes", skipReload: true },
|
|
);
|
|
}
|
|
|
|
const backfillDefaults: Record<string, number | string> = {};
|
|
for (const key of Object.keys(properties)) {
|
|
backfillDefaults[key] = PROPERTY_DEFAULTS[key] ?? 0;
|
|
}
|
|
|
|
await commitMutation(
|
|
selection,
|
|
{
|
|
type: "add-keyframe",
|
|
animationId: tween.id,
|
|
percentage: pct,
|
|
properties,
|
|
backfillDefaults,
|
|
},
|
|
{
|
|
label: `Add keyframe at ${roundToCenti(absoluteTime)}s`,
|
|
coalesceKey: `keyframe:${tween.id}:${pct}`,
|
|
softReload: true,
|
|
},
|
|
);
|
|
} else {
|
|
const defaultDuration = 0.5;
|
|
await commitMutation(
|
|
selection,
|
|
{
|
|
type: "add-with-keyframes" as const,
|
|
targetSelector: selector,
|
|
position: absoluteTime,
|
|
duration: defaultDuration,
|
|
keyframes: [
|
|
{ percentage: 0, properties },
|
|
{ percentage: 100, properties },
|
|
],
|
|
},
|
|
{
|
|
label: `New animation at ${roundToCenti(absoluteTime)}s`,
|
|
softReload: true,
|
|
},
|
|
);
|
|
}
|
|
}
|