- Increase logo size (48x48 desktop, 56x56 mobile) for better visibility - Add logo as favicon - Add logo to mobile header - Move user menu to navigation bars (sidebar on desktop, bottom bar on mobile) - Fix desktop chat layout - container structure prevents voice controls cutoff - Fix mobile bottom bar - use icon-only ActionIcons instead of truncated text buttons - Hide Create Node/New Conversation buttons on mobile to save header space - Make fixed header and voice controls work properly with containers 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
25 lines
638 B
TypeScript
25 lines
638 B
TypeScript
/**
|
|
* useAppMachine Hook
|
|
*
|
|
* Provides access to the app-level state machine from any component.
|
|
* Must be used within an AppStateMachineProvider.
|
|
*/
|
|
|
|
import { createContext, useContext } from 'react';
|
|
import type { ActorRefFrom } from 'xstate';
|
|
import { appMachine } from '@/lib/app-machine';
|
|
|
|
type AppMachineActor = ActorRefFrom<typeof appMachine>;
|
|
|
|
export const AppMachineContext = createContext<AppMachineActor | null>(null);
|
|
|
|
export function useAppMachine() {
|
|
const actor = useContext(AppMachineContext);
|
|
|
|
if (!actor) {
|
|
throw new Error('useAppMachine must be used within AppStateMachineProvider');
|
|
}
|
|
|
|
return actor;
|
|
}
|