fix: restore main content global track updates after refactor

src/components/MainContent.tsx

@@ -122,6 +122,9 @@ const MainContent: React.FC<MainContentProps> = ({
     editingRegionIds: mainContentGlobalTracks.editingRegionIds,
     findProjectRegionById: mainContentRegions.selection.findProjectRegionById,
   });
+  const deleteSelectedRegularRegions = mainContentRegions.deleteSelectedRegions;
+  const deleteSelectedGlobalRegions = mainContentGlobalTracks.deleteSelectedGlobalRegions;
+  const isGlobalRegionId = mainContentRegions.selection.isGlobalRegionId;
 
   const deleteSelectedTrackAutomationPoints = useCallback((): boolean => {
     if (!activeTrackAutomationTrackId || !activeTrackAutomationType || selectedTrackAutomationPointIds.length === 0) {
@@ -159,22 +162,22 @@ const MainContent: React.FC<MainContentProps> = ({
 
   useEffect(() => {
     regionDeleteManager.registerDeleteCallback(() => {
-      if (mainContentGlobalTracks.deleteSelectedGlobalRegions()) {
+      if (deleteSelectedGlobalRegions()) {
         return true;
       }
       if (deleteSelectedTrackAutomationPoints()) {
         return true;
       }
-      return mainContentRegions.deleteSelectedRegions();
+      return deleteSelectedRegularRegions();
     });
 
     return () => {
       regionDeleteManager.unregisterDeleteCallback();
     };
   }, [
+    deleteSelectedGlobalRegions,
+    deleteSelectedRegularRegions,
     deleteSelectedTrackAutomationPoints,
-    mainContentGlobalTracks,
-    mainContentRegions,
   ]);
 
   useEffect(() => {
@@ -192,12 +195,12 @@ const MainContent: React.FC<MainContentProps> = ({
 
       if (event.key === 'Backspace' || event.key === 'Delete') {
         const isInPianoRoll = document.querySelector('.piano-roll')?.contains(event.target as Node);
-        const hasSelectedGlobalRegions = selectedRegionIds.some(mainContentRegions.selection.isGlobalRegionId);
+        const hasSelectedGlobalRegions = selectedRegionIds.some(isGlobalRegionId);
 
         if (!isInPianoRoll && (!showPianoRoll || hasSelectedGlobalRegions)) {
-          const deleted = mainContentGlobalTracks.deleteSelectedGlobalRegions()
+          const deleted = deleteSelectedGlobalRegions()
             || deleteSelectedTrackAutomationPoints()
-            || mainContentRegions.deleteSelectedRegions();
+            || deleteSelectedRegularRegions();
           if (deleted) {
             event.preventDefault();
           }
@@ -208,9 +211,10 @@ const MainContent: React.FC<MainContentProps> = ({
     window.addEventListener('keydown', handleKeyDown);
     return () => window.removeEventListener('keydown', handleKeyDown);
   }, [
+    deleteSelectedGlobalRegions,
+    deleteSelectedRegularRegions,
     deleteSelectedTrackAutomationPoints,
-    mainContentGlobalTracks,
+    isGlobalRegionId,
-    mainContentRegions,
     selectedRegionIds,
     showPianoRoll,
   ]);

src/components/track/TrackGridItem.tsx

@@ -9,6 +9,7 @@ import type { RegionClickOptions, RegionPreviewContentStyle, RegionUI, ResizeAct
 import { REGION_CONSTANTS, DEBUG_MODE } from '../../constants';
 import { KGMainContentState } from '../../core/state/KGMainContentState';
 import { useProjectStore } from '../../stores/projectStore';
+import { isModifierKeyPressed } from '../../util/osUtil';
 
 interface RegionResizePreviewBaseline {
   regionId: string;
@@ -201,21 +202,26 @@ const TrackGridItem: React.FC<TrackGridItemProps> = ({
 
   // Track tool state for cursor feedback.
   useEffect(() => {
-    const syncCursorState = () => {
+    const syncCursorState = (event?: KeyboardEvent | MouseEvent) => {
+      const isPencilMode = KGMainContentState.instance().getActiveTool() === 'pencil';
+      const hasModifierPressed = event ? isModifierKeyPressed(event) : false;
+      setIsModifierPressed(isPencilMode || hasModifierPressed);
+    };
+    const syncCursorStateFromFocus = () => {
       setIsModifierPressed(KGMainContentState.instance().getActiveTool() === 'pencil');
     };
 
     // Add global event listeners
     window.addEventListener('keydown', syncCursorState);
     window.addEventListener('keyup', syncCursorState);
-    window.addEventListener('focus', syncCursorState);
+    window.addEventListener('focus', syncCursorStateFromFocus);
-    syncCursorState();
+    syncCursorStateFromFocus();
 
     // Cleanup listeners on unmount
     return () => {
       window.removeEventListener('keydown', syncCursorState);
       window.removeEventListener('keyup', syncCursorState);
-      window.removeEventListener('focus', syncCursorState);
+      window.removeEventListener('focus', syncCursorStateFromFocus);
     };
   }, []);
 

src/hooks/useMainContentGlobalTracks.ts

@@ -1,4 +1,4 @@
-import { useCallback, useMemo, useState } from 'react';
+import { useCallback, useState } from 'react';
 import type { KeySignature } from '../core/KGProject';
 import { KGCore } from '../core/KGCore';
 import { GlobalTrackType, KGGlobalTrack } from '../core/global-track';
@@ -88,37 +88,21 @@ export function useMainContentGlobalTracks({
   const [editingTempoText, setEditingTempoText] = useState('');
   const [editingChordRegionId, setEditingChordRegionId] = useState<string | null>(null);
 
-  const markerTrack = useMemo(
+  const markerTrack = globalTracks.find(track => track.getType() === GlobalTrackType.Marker) ?? null;
-    () => globalTracks.find(track => track.getType() === GlobalTrackType.Marker) ?? null,
+  const markerRegions = (markerTrack?.getRegions() ?? []).filter(
-    [globalTracks]
+    (region): region is KGMarkerRegion => region instanceof KGMarkerRegion
   );
-  const markerRegions = useMemo(
+  const signatureTrack = globalTracks.find(track => track.getType() === GlobalTrackType.Signature) ?? null;
-    () => (markerTrack?.getRegions() ?? []).filter((region): region is KGMarkerRegion => region instanceof KGMarkerRegion),
+  const signatureRegions = signatureTrack
-    [markerTrack]
+    ? getSortedKeySignatureRegions(signatureTrack, timeSignature.numerator)
-  );
+    : [];
-  const signatureTrack = useMemo(
+  const tempoTrack = globalTracks.find(track => track.getType() === GlobalTrackType.Tempo) ?? null;
-    () => globalTracks.find(track => track.getType() === GlobalTrackType.Signature) ?? null,
+  const tempoRegions = tempoTrack
-    [globalTracks]
+    ? getSortedTempoRegions(tempoTrack, timeSignature.numerator)
-  );
+    : [];
-  const signatureRegions = useMemo(
+  const chordTrack = globalTracks.find(track => track.getType() === GlobalTrackType.Chord) ?? null;
-    () => (signatureTrack ? getSortedKeySignatureRegions(signatureTrack, timeSignature.numerator) : []),
+  const chordRegions = (chordTrack?.getRegions() ?? []).filter(
-    [signatureTrack, timeSignature.numerator]
+    (region): region is KGChordRegion => region instanceof KGChordRegion
-  );
-  const tempoTrack = useMemo(
-    () => globalTracks.find(track => track.getType() === GlobalTrackType.Tempo) ?? null,
-    [globalTracks]
-  );
-  const tempoRegions = useMemo(
-    () => (tempoTrack ? getSortedTempoRegions(tempoTrack, timeSignature.numerator) : []),
-    [tempoTrack, timeSignature.numerator]
-  );
-  const chordTrack = useMemo(
-    () => globalTracks.find(track => track.getType() === GlobalTrackType.Chord) ?? null,
-    [globalTracks]
-  );
-  const chordRegions = useMemo(
-    () => (chordTrack?.getRegions() ?? []).filter((region): region is KGChordRegion => region instanceof KGChordRegion),
-    [chordTrack]
   );
 
   const beginEditingGlobalRegion = useCallback((regionId: string) => {
@@ -202,7 +186,6 @@ export function useMainContentGlobalTracks({
         return;
       }
 
-      selectGlobalRegion(createdRegion.getId(), DEFAULT_REGION_CLICK_OPTIONS);
       setEditingGlobalRegionId(createdRegion.getId());
       setEditingGlobalRegionText(createdRegion.getName());
     } catch (error) {
@@ -253,7 +236,6 @@ export function useMainContentGlobalTracks({
         return;
       }
 
-      selectGlobalRegion(createdRegion.getId(), DEFAULT_REGION_CLICK_OPTIONS);
       setEditingKeySignatureRegionId(createdRegion.getId());
     } catch (error) {
       console.error('Error creating key signature region:', error);
@@ -339,7 +321,6 @@ export function useMainContentGlobalTracks({
         return;
       }
 
-      selectGlobalRegion(createdRegion.getId(), DEFAULT_REGION_CLICK_OPTIONS);
       setEditingTempoRegionId(createdRegion.getId());
       setEditingTempoText(createdRegion.getBpm().toString());
     } catch (error) {
@@ -385,7 +366,6 @@ export function useMainContentGlobalTracks({
         return;
       }
 
-      selectGlobalRegion(createdRegion.getId(), DEFAULT_REGION_CLICK_OPTIONS);
       setEditingChordRegionId(createdRegion.getId());
     } catch (error) {
       console.error('Error creating chord region:', error);
@@ -416,7 +396,6 @@ export function useMainContentGlobalTracks({
         return null;
       }
 
-      selectGlobalRegion(createdRegion.getId(), DEFAULT_REGION_CLICK_OPTIONS);
       setEditingChordRegionId(createdRegion.getId());
       return createdRegion;
     } catch (error) {