Rename *GlobalState* to *SettingsAuth* (#1689)

src/App.tsx

@@ -22,7 +22,7 @@ import { getNormalisedCoordinates } from './lib/utils'
 import { useLoaderData, useNavigate } from 'react-router-dom'
 import { type IndexLoaderData } from 'lib/types'
 import { paths } from 'lib/paths'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { onboardingPaths } from 'routes/Onboarding/paths'
 import { CodeMenu } from 'components/CodeMenu'
 import { TextEditor } from 'components/TextEditor'
@@ -53,7 +53,7 @@ export function App() {
     streamDimensions: s.streamDimensions,
   }))
 
-  const { settings } = useGlobalStateContext()
+  const { settings } = useSettingsAuthContext()
   const { showDebugPanel, onboardingStatus, theme } = settings?.context || {}
   const { state, send } = useModelingContext()
 

src/Auth.tsx

@@ -1,9 +1,9 @@
 import Loading from './components/Loading'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 
 // Wrapper around protected routes, used in src/Router.tsx
 export const Auth = ({ children }: React.PropsWithChildren) => {
-  const { auth } = useGlobalStateContext()
+  const { auth } = useSettingsAuthContext()
   const isLoggingIn = auth?.state.matches('checkIfLoggedIn')
 
   return isLoggingIn ? (

src/Router.tsx

@@ -22,7 +22,7 @@ import {
 import { metadata } from 'tauri-plugin-fs-extra-api'
 import DownloadAppBanner from './components/DownloadAppBanner'
 import { WasmErrBanner } from './components/WasmErrBanner'
-import { GlobalStateProvider } from './components/GlobalStateProvider'
+import { SettingsAuthProvider } from './components/SettingsAuthProvider'
 import {
   SETTINGS_PERSIST_KEY,
   settingsMachine,
@@ -52,7 +52,7 @@ const addGlobalContextToElements = (
           ...route,
           element: (
             <CommandBarProvider>
-              <GlobalStateProvider>{route.element}</GlobalStateProvider>
+              <SettingsAuthProvider>{route.element}</SettingsAuthProvider>
             </CommandBarProvider>
           ),
         }

src/clientSideScene/ClientSideSceneComp.tsx

@@ -2,7 +2,7 @@ import { useRef, useEffect, useState } from 'react'
 import { useModelingContext } from 'hooks/useModelingContext'
 
 import { cameraMouseDragGuards } from 'lib/cameraControls'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { useStore } from 'useStore'
 import { DEBUG_SHOW_BOTH_SCENES, sceneInfra } from './sceneInfra'
 import { ReactCameraProperties } from './CameraControls'
@@ -35,7 +35,7 @@ export const ClientSideScene = ({
   cameraControls,
 }: {
   cameraControls: ReturnType<
-    typeof useGlobalStateContext
+    typeof useSettingsAuthContext
   >['settings']['context']['cameraControls']
 }) => {
   const canvasRef = useRef<HTMLDivElement>(null)

src/components/AppHeader.tsx

@@ -2,7 +2,7 @@ import { Toolbar } from '../Toolbar'
 import UserSidebarMenu from './UserSidebarMenu'
 import { type IndexLoaderData } from 'lib/types'
 import ProjectSidebarMenu from './ProjectSidebarMenu'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import styles from './AppHeader.module.css'
 import { NetworkHealthIndicator } from './NetworkHealthIndicator'
 import { useCommandsContext } from 'hooks/useCommandsContext'
@@ -25,7 +25,7 @@ export const AppHeader = ({
 }: AppHeaderProps) => {
   const platform = usePlatform()
   const { commandBarSend } = useCommandsContext()
-  const { auth } = useGlobalStateContext()
+  const { auth } = useSettingsAuthContext()
   const user = auth?.context?.user
 
   return (

src/components/CommandBar/CommandBarKclInput.tsx

@@ -2,7 +2,7 @@ import { Completion } from '@codemirror/autocomplete'
 import { EditorState, EditorView, useCodeMirror } from '@uiw/react-codemirror'
 import { CustomIcon } from 'components/CustomIcon'
 import { useCommandsContext } from 'hooks/useCommandsContext'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { CommandArgument, KclCommandValue } from 'lib/commandTypes'
 import { getSystemTheme } from 'lib/theme'
 import { useCalculateKclExpression } from 'lib/useCalculateKclExpression'
@@ -29,7 +29,7 @@ function CommandBarKclInput({
   const previouslySetValue = commandBarState.context.argumentsToSubmit[
     arg.name
   ] as KclCommandValue | undefined
-  const { settings } = useGlobalStateContext()
+  const { settings } = useSettingsAuthContext()
   const defaultValue = (arg.defaultValue as string) || ''
   const [value, setValue] = useState(
     previouslySetValue?.valueText || defaultValue || ''

src/components/ModelingMachineProvider.tsx

@@ -10,7 +10,7 @@ import {
 } from 'xstate'
 import { SetSelections, modelingMachine } from 'machines/modelingMachine'
 import { useSetupEngineManager } from 'hooks/useSetupEngineManager'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { isCursorInSketchCommandRange } from 'lang/util'
 import { engineCommandManager } from 'lang/std/engineConnection'
 import { kclManager, useKclContext } from 'lang/KclSingleton'
@@ -63,7 +63,7 @@ export const ModelingMachineProvider = ({
     settings: {
       context: { baseUnit },
     },
-  } = useGlobalStateContext()
+  } = useSettingsAuthContext()
   const { code } = useKclContext()
   const token = auth?.context?.token
   const streamRef = useRef<HTMLDivElement>(null)

src/components/NetworkHealthIndicator.test.tsx

@@ -1,6 +1,6 @@
 import { fireEvent, render, screen } from '@testing-library/react'
 import { BrowserRouter } from 'react-router-dom'
-import { GlobalStateProvider } from './GlobalStateProvider'
+import { SettingsAuthProvider } from './SettingsAuthProvider'
 import CommandBarProvider from './CommandBar/CommandBar'
 import {
   NETWORK_HEALTH_TEXT,
@@ -13,7 +13,7 @@ function TestWrap({ children }: { children: React.ReactNode }) {
   return (
     <BrowserRouter>
       <CommandBarProvider>
-        <GlobalStateProvider>{children}</GlobalStateProvider>
+        <SettingsAuthProvider>{children}</SettingsAuthProvider>
       </CommandBarProvider>
     </BrowserRouter>
   )

src/components/ProjectSidebarMenu.test.tsx

@@ -2,7 +2,7 @@ import { fireEvent, render, screen } from '@testing-library/react'
 import { BrowserRouter } from 'react-router-dom'
 import ProjectSidebarMenu from './ProjectSidebarMenu'
 import { type ProjectWithEntryPointMetadata } from 'lib/types'
-import { GlobalStateProvider } from './GlobalStateProvider'
+import { SettingsAuthProvider } from './SettingsAuthProvider'
 import { APP_NAME } from 'lib/constants'
 import { vi } from 'vitest'
 
@@ -41,9 +41,9 @@ describe('ProjectSidebarMenu tests', () => {
   test('Renders the project name', () => {
     render(
       <BrowserRouter>
-        <GlobalStateProvider>
+        <SettingsAuthProvider>
           <ProjectSidebarMenu project={projectWellFormed} />
-        </GlobalStateProvider>
+        </SettingsAuthProvider>
       </BrowserRouter>
     )
 
@@ -60,9 +60,9 @@ describe('ProjectSidebarMenu tests', () => {
   test('Renders app name if given no project', () => {
     render(
       <BrowserRouter>
-        <GlobalStateProvider>
+        <SettingsAuthProvider>
           <ProjectSidebarMenu />
-        </GlobalStateProvider>
+        </SettingsAuthProvider>
       </BrowserRouter>
     )
 
@@ -74,9 +74,9 @@ describe('ProjectSidebarMenu tests', () => {
   test('Renders as a link if set to do so', () => {
     render(
       <BrowserRouter>
-        <GlobalStateProvider>
+        <SettingsAuthProvider>
           <ProjectSidebarMenu project={projectWellFormed} renderAsLink={true} />
-        </GlobalStateProvider>
+        </SettingsAuthProvider>
       </BrowserRouter>
     )
 

src/components/SettingsAuthProvider.tsx

@@ -37,9 +37,9 @@ type GlobalContext = {
 let settingsStateRef: (typeof settingsMachine)['context'] | undefined
 export const getSettingsState = () => settingsStateRef
 
-export const GlobalStateContext = createContext({} as GlobalContext)
+export const SettingsAuthContext = createContext({} as GlobalContext)
 
-export const GlobalStateProvider = ({
+export const SettingsAuthProvider = ({
   children,
 }: {
   children: React.ReactNode
@@ -133,7 +133,7 @@ export const GlobalStateProvider = ({
   })
 
   return (
-    <GlobalStateContext.Provider
+    <SettingsAuthContext.Provider
       value={{
         auth: {
           state: authState,
@@ -148,11 +148,11 @@ export const GlobalStateProvider = ({
       }}
     >
       {children}
-    </GlobalStateContext.Provider>
+    </SettingsAuthContext.Provider>
   )
 }
 
-export default GlobalStateProvider
+export default SettingsAuthProvider
 
 export function logout() {
   localStorage.removeItem(TOKEN_PERSIST_KEY)

src/components/Stream.tsx

@@ -3,7 +3,7 @@ import { v4 as uuidv4 } from 'uuid'
 import { useStore } from '../useStore'
 import { getNormalisedCoordinates } from '../lib/utils'
 import Loading from './Loading'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { Models } from '@kittycad/lib'
 import { engineCommandManager } from '../lang/std/engineConnection'
 import { useModelingContext } from 'hooks/useModelingContext'
@@ -28,7 +28,7 @@ export const Stream = ({ className = '' }: { className?: string }) => {
     setDidDragInStream: s.setDidDragInStream,
     streamDimensions: s.streamDimensions,
   }))
-  const { settings } = useGlobalStateContext()
+  const { settings } = useSettingsAuthContext()
   const { state } = useModelingContext()
   const { isExecuting } = useKclContext()
   const { overallState } = useNetworkStatus()

src/components/TextEditor.tsx

@@ -9,7 +9,7 @@ import Server from '../editor/plugins/lsp/server'
 import Client from '../editor/plugins/lsp/client'
 import { TEST } from 'env'
 import { useCommandsContext } from 'hooks/useCommandsContext'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { useConvertToVariable } from 'hooks/useToolbarGuards'
 import { Themes } from 'lib/theme'
 import { useEffect, useMemo, useRef } from 'react'
@@ -108,7 +108,7 @@ export const TextEditor = ({
     state,
   } = useModelingContext()
 
-  const { settings, auth } = useGlobalStateContext()
+  const { settings, auth } = useSettingsAuthContext()
   const textWrapping = settings.context?.textWrapping ?? 'On'
   const { commandBarSend } = useCommandsContext()
   const {

src/components/UserSidebarMenu.test.tsx

@@ -7,7 +7,7 @@ import {
   createRoutesFromElements,
 } from 'react-router-dom'
 import { Models } from '@kittycad/lib'
-import { GlobalStateProvider } from './GlobalStateProvider'
+import { SettingsAuthProvider } from './SettingsAuthProvider'
 import CommandBarProvider from './CommandBar/CommandBar'
 
 type User = Models['User_type']
@@ -113,7 +113,7 @@ function TestWrap({ children }: { children: React.ReactNode }) {
         path="/file/:id"
         element={
           <CommandBarProvider>
-            <GlobalStateProvider>{children}</GlobalStateProvider>
+            <SettingsAuthProvider>{children}</SettingsAuthProvider>
           </CommandBarProvider>
         }
       />

src/components/UserSidebarMenu.tsx

@@ -6,7 +6,7 @@ import { useLocation, useNavigate } from 'react-router-dom'
 import { Fragment, useState } from 'react'
 import { paths } from 'lib/paths'
 import { Models } from '@kittycad/lib'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { useAbsoluteFilePath } from 'hooks/useAbsoluteFilePath'
 
 type User = Models['User_type']
@@ -17,7 +17,7 @@ const UserSidebarMenu = ({ user }: { user?: User }) => {
   const displayedName = getDisplayName(user)
   const [imageLoadFailed, setImageLoadFailed] = useState(false)
   const navigate = useNavigate()
-  const send = useGlobalStateContext()?.auth?.send
+  const send = useSettingsAuthContext()?.auth?.send
 
   // Fallback logic for displaying user's "name":
   // 1. user.name

src/hooks/useGlobalStateContext.ts

@@ -1,6 +0,0 @@
-import { GlobalStateContext } from 'components/GlobalStateProvider'
-import { useContext } from 'react'
-
-export const useGlobalStateContext = () => {
-  return useContext(GlobalStateContext)
-}

src/hooks/useSettingsAuthContext.ts

@@ -0,0 +1,6 @@
+import { SettingsAuthContext } from 'components/SettingsAuthProvider'
+import { useContext } from 'react'
+
+export const useSettingsAuthContext = () => {
+  return useContext(SettingsAuthContext)
+}

src/lang/wasm.ts

@@ -136,7 +136,7 @@ export const executor = async (
   return _programMemory
 }
 
-const getSettingsState = import('components/GlobalStateProvider').then(
+const getSettingsState = import('components/SettingsAuthProvider').then(
   (module) => module.getSettingsState
 )
 

src/routes/Home.tsx

@@ -29,7 +29,7 @@ import {
   getSortIcon,
 } from '../lib/sorting'
 import useStateMachineCommands from '../hooks/useStateMachineCommands'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { useCommandsContext } from 'hooks/useCommandsContext'
 import { DEFAULT_PROJECT_NAME } from 'machines/settingsMachine'
 import { sep } from '@tauri-apps/api/path'
@@ -50,7 +50,7 @@ const Home = () => {
       context: { defaultDirectory, defaultProjectName },
       send: sendToSettings,
     },
-  } = useGlobalStateContext()
+  } = useSettingsAuthContext()
 
   // Set the default directory if it's been updated
   // during the loading of the home page. This is wrapped

src/routes/Onboarding/Camera.tsx

@@ -2,7 +2,7 @@ import { OnboardingButtons, useDismiss, useNextClick } from '.'
 import { onboardingPaths } from 'routes/Onboarding/paths'
 import { useStore } from '../../useStore'
 import { SettingsSection } from 'routes/Settings'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import {
   CameraSystem,
   cameraMouseDragGuards,
@@ -22,7 +22,7 @@ export default function Units() {
         context: { cameraControls },
       },
     },
-  } = useGlobalStateContext()
+  } = useSettingsAuthContext()
 
   return (
     <div className="fixed inset-0 z-50 grid items-end justify-start px-4 pointer-events-none">

src/routes/Onboarding/Introduction.tsx

@@ -5,7 +5,7 @@ import {
   useNextClick,
 } from '.'
 import { onboardingPaths } from 'routes/Onboarding/paths'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { Themes, getSystemTheme } from 'lib/theme'
 import { bracket } from 'lib/exampleKcl'
 import {
@@ -31,7 +31,7 @@ function OnboardingWithNewFile() {
     settings: {
       context: { defaultDirectory },
     },
-  } = useGlobalStateContext()
+  } = useSettingsAuthContext()
 
   async function createAndOpenNewProject() {
     const projects = await getProjectsInDir(defaultDirectory)
@@ -111,7 +111,7 @@ export default function Introduction() {
         context: { theme },
       },
     },
-  } = useGlobalStateContext()
+  } = useSettingsAuthContext()
   const getLogoTheme = () =>
     theme === Themes.Light ||
     (theme === Themes.System && getSystemTheme() === Themes.Light)

src/routes/Onboarding/ParametricModeling.tsx

@@ -3,7 +3,7 @@ import { onboardingPaths } from 'routes/Onboarding/paths'
 import { useStore } from '../../useStore'
 import { useBackdropHighlight } from 'hooks/useBackdropHighlight'
 import { Themes, getSystemTheme } from 'lib/theme'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 
 export default function ParametricModeling() {
   const { buttonDownInStream } = useStore((s) => ({
@@ -13,7 +13,7 @@ export default function ParametricModeling() {
     settings: {
       context: { theme },
     },
-  } = useGlobalStateContext()
+  } = useSettingsAuthContext()
   const getImageTheme = () =>
     theme === Themes.Light ||
     (theme === Themes.System && getSystemTheme() === Themes.Light)

src/routes/Onboarding/Units.tsx

@@ -5,7 +5,7 @@ import { SettingsSection } from '../Settings'
 import { Toggle } from '../../components/Toggle/Toggle'
 import { useDismiss, useNextClick } from '.'
 import { onboardingPaths } from 'routes/Onboarding/paths'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { UnitSystem } from 'machines/settingsMachine'
 
 export default function Units() {
@@ -16,7 +16,7 @@ export default function Units() {
       send,
       context: { unitSystem, baseUnit },
     },
-  } = useGlobalStateContext()
+  } = useSettingsAuthContext()
 
   return (
     <div className="fixed grid place-content-center inset-0 bg-chalkboard-110/50 z-50">

src/routes/Onboarding/index.tsx

@@ -5,7 +5,7 @@ import Camera from './Camera'
 import Sketching from './Sketching'
 import { useCallback } from 'react'
 import makeUrlPathRelative from '../../lib/makeUrlPathRelative'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import Streaming from './Streaming'
 import CodeEditor from './CodeEditor'
 import ParametricModeling from './ParametricModeling'
@@ -80,7 +80,7 @@ export function useNextClick(newStatus: string) {
   const filePath = useAbsoluteFilePath()
   const {
     settings: { send },
-  } = useGlobalStateContext()
+  } = useSettingsAuthContext()
   const navigate = useNavigate()
 
   return useCallback(() => {
@@ -96,7 +96,7 @@ export function useDismiss() {
   const filePath = useAbsoluteFilePath()
   const {
     settings: { send },
-  } = useGlobalStateContext()
+  } = useSettingsAuthContext()
   const navigate = useNavigate()
 
   return useCallback(() => {

src/routes/Settings.tsx

@@ -13,7 +13,7 @@ import { useHotkeys } from 'react-hotkeys-hook'
 import { type IndexLoaderData } from 'lib/types'
 import { paths } from 'lib/paths'
 import { Themes } from '../lib/theme'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import {
   CameraSystem,
   cameraSystems,
@@ -55,7 +55,7 @@ export const Settings = () => {
         },
       },
     },
-  } = useGlobalStateContext()
+  } = useSettingsAuthContext()
 
   async function handleDirectorySelection() {
     const newDirectory = await open({

src/routes/SignIn.tsx

@@ -4,7 +4,7 @@ import { invoke } from '@tauri-apps/api/tauri'
 import { VITE_KC_SITE_BASE_URL, VITE_KC_API_BASE_URL } from '../env'
 import { Themes, getSystemTheme } from '../lib/theme'
 import { paths } from 'lib/paths'
-import { useGlobalStateContext } from 'hooks/useGlobalStateContext'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 import { APP_NAME } from 'lib/constants'
 
 const SignIn = () => {
@@ -20,7 +20,7 @@ const SignIn = () => {
         context: { theme },
       },
     },
-  } = useGlobalStateContext()
+  } = useSettingsAuthContext()
 
   const signInTauri = async () => {
     // We want to invoke our command to login via device auth.