diff --git a/source/providers/NavProvider/effects.tsx b/source/providers/NavProvider/effects.tsx
new file mode 100644
index 0000000..7ccc1ae
--- /dev/null
+++ b/source/providers/NavProvider/effects.tsx
@@ -0,0 +1,65 @@
+import {useCallback} from 'react';
+import {NavigationState} from './state.js';
+
+export const useNavigationEffects = (
+	setState: React.Dispatch<React.SetStateAction<NavigationState>>,
+) => {
+	const navigateToHome = useCallback(() => {
+		setState(prev => ({
+			...prev,
+			currentView: 'home',
+		}));
+	}, [setState]);
+
+	const navigateToHelp = useCallback(() => {
+		setState(prev => ({
+			...prev,
+			currentView: 'help',
+		}));
+	}, [setState]);
+
+	const navigateToModels = useCallback(() => {
+		setState(prev => ({
+			...prev,
+			currentView: 'models',
+		}));
+	}, [setState]);
+
+	const navigateToApiConfig = useCallback(() => {
+		setState(prev => ({
+			...prev,
+			currentView: 'api-config',
+		}));
+	}, [setState]);
+
+	const navigateToConfig = useCallback(() => {
+		setState(prev => ({
+			...prev,
+			currentView: 'config',
+		}));
+	}, [setState]);
+
+	const navigateToChat = useCallback(() => {
+		setState(prev => ({
+			...prev,
+			currentView: 'chat',
+		}));
+	}, [setState]);
+
+	const navigateToInit = useCallback(() => {
+		setState(prev => ({
+			...prev,
+			currentView: 'init',
+		}));
+	}, [setState]);
+
+	return {
+		navigateToHome,
+		navigateToHelp,
+		navigateToModels,
+		navigateToApiConfig,
+		navigateToConfig,
+		navigateToChat,
+		navigateToInit,
+	};
+};
diff --git a/source/providers/NavProvider/index.tsx b/source/providers/NavProvider/index.tsx
new file mode 100644
index 0000000..9137c31
--- /dev/null
+++ b/source/providers/NavProvider/index.tsx
@@ -0,0 +1,42 @@
+import React, {createContext, useContext, useState} from 'react';
+import {useNavigationEffects} from './effects.js';
+import {NavigationState, initialNavigationState} from './state.js';
+
+interface NavigationContextType {
+	state: NavigationState;
+	navigateToHome: () => void;
+	navigateToHelp: () => void;
+	navigateToModels: () => void;
+	navigateToApiConfig: () => void;
+	navigateToConfig: () => void;
+	navigateToChat: () => void;
+	navigateToInit: () => void;
+}
+
+const NavigationContext = createContext<NavigationContextType | undefined>(
+	undefined,
+);
+
+export function NavigationProvider({children}: {children: React.ReactNode}) {
+	const [state, setState] = useState<NavigationState>(initialNavigationState);
+	const effects = useNavigationEffects(setState);
+
+	return (
+		<NavigationContext.Provider
+			value={{
+				state,
+				...effects,
+			}}
+		>
+			{children}
+		</NavigationContext.Provider>
+	);
+}
+
+export function useNavigation() {
+	const context = useContext(NavigationContext);
+	if (!context) {
+		throw new Error('useNavigation must be used within NavigationProvider');
+	}
+	return context;
+}
diff --git a/source/providers/NavProvider/state.tsx b/source/providers/NavProvider/state.tsx
new file mode 100644
index 0000000..8b4b9e6
--- /dev/null
+++ b/source/providers/NavProvider/state.tsx
@@ -0,0 +1,14 @@
+export type NavigationState = {
+	currentView:
+		| 'home'
+		| 'help'
+		| 'models'
+		| 'init'
+		| 'api-config'
+		| 'chat'
+		| 'config';
+};
+
+export const initialNavigationState: NavigationState = {
+	currentView: 'home',
+};