add app context

src/renderer/src/App.tsx

@@ -26,7 +26,7 @@ import useFrameCapture from './hooks/useFrameCapture';
 import useSegments from './hooks/useSegments';
 import useDirectoryAccess from './hooks/useDirectoryAccess';
 
-import { UserSettingsContext, SegColorsContext, UserSettingsContextType } from './contexts';
+import { UserSettingsContext, SegColorsContext, UserSettingsContextType, AppContext } from './contexts';
 
 import NoFileLoaded from './NoFileLoaded';
 import MediaSourcePlayer from './MediaSourcePlayer';
@@ -512,6 +512,10 @@ function App() {
     setStoreProjectInWorkingDir(newValue);
   }, [ensureAccessToSourceDir, getProjectFileSavePath, setStoreProjectInWorkingDir, storeProjectInWorkingDir]);
 
+  const appContext = useMemo(() => ({
+    setWorking,
+  }), [setWorking]);
+
   const userSettingsContext = useMemo<UserSettingsContextType>(() => ({
     ...allUserSettings, toggleCaptureFormat, changeOutDir, toggleKeyframeCut, toggleExportConfirmEnabled, toggleSimpleMode, toggleSafeOutputFileName, effectiveExportMode,
   }), [allUserSettings, changeOutDir, effectiveExportMode, toggleCaptureFormat, toggleExportConfirmEnabled, toggleKeyframeCut, toggleSafeOutputFileName, toggleSimpleMode]);
@@ -2512,6 +2516,7 @@ function App() {
 
   return (
     <>
+      <AppContext.Provider value={appContext}>
       <SegColorsContext.Provider value={segColorsContext}>
         <UserSettingsContext.Provider value={userSettingsContext}>
           <ThemeProvider value={theme}>
@@ -2827,6 +2832,7 @@ function App() {
           </ThemeProvider>
         </UserSettingsContext.Provider>
       </SegColorsContext.Provider>
+      </AppContext.Provider>
 
       <div id="swal2-container-wrapper" className={darkMode ? 'dark-theme' : undefined} style={baseColorStyle} />
     </>

src/renderer/src/contexts.ts

@@ -3,6 +3,7 @@ import Color from 'color';
 
 import useUserSettingsRoot from './hooks/useUserSettingsRoot';
 import { ExportMode, SegmentColorIndex } from './types';
+import type useLoading from './hooks/useLoading';
 
 
 export type UserSettingsContextType = ReturnType<typeof useUserSettingsRoot> & {
@@ -19,8 +20,15 @@ interface SegColorsContextType {
   getSegColor: (seg: SegmentColorIndex | undefined) => Color
 }
 
+interface AppContextType {
+  setWorking: ReturnType<typeof useLoading>['setWorking'],
+  working: ReturnType<typeof useLoading>['working'],
+}
+
+
 export const UserSettingsContext = React.createContext<UserSettingsContextType | undefined>(undefined);
 export const SegColorsContext = React.createContext<SegColorsContextType | undefined>(undefined);
+export const AppContext = React.createContext<AppContextType | undefined>(undefined);
 
 export const useSegColors = () => {
   const context = useContext(SegColorsContext);