UI Context Providers

Directory: ui/src/context/

Three React context providers managing different aspects of state.

GroupContext

File: context/GroupContext.jsx

Manages all group-related state using useReducer.

State Shape

{
    isOpen: false,           // Group UI open
    groupData: null,         // Current group info
    dashboard: null,         // Dashboard data
    members: [],             // Group members
    tasks: [],               // Active tasks
    cooldowns: {},           // Active cooldowns
    pendingInvite: null,     // Incoming invite
    joinRequests: [],        // Pending join requests
    instructions: [],        // Active instructions
    reputation: null,        // XP/level data
    notifications: [],       // In-UI toast notifications
    gpsData: [],             // GPS/blip data
    history: [],             // Activity history
    alliances: [],           // Alliance list
    turfs: [],               // Territory list
    mail: [],                // Mailbox messages
    vehicles: [],            // Garage vehicles
    spawns: [],              // Spawn points
}

Actions

Action	Description
OPEN	Open group UI with data
CLOSE	Close group UI
GROUP_SYNC	Full group state update
GROUP_DISBANDED	Group disbanded
INVITE_RECEIVED	Invite received
INVITE_ACCEPTED / INVITE_DENIED	Invite response
TASK_CREATED / TASK_ACTIVATED / TASK_COMPLETED / TASK_FAILED	Task lifecycle
REP_SYNC / LEVEL_UP	Reputation updates
ADD_NOTIFICATION / REMOVE_NOTIFICATION	Toast notifications
COOLDOWN_SET / COOLDOWN_RESULT	Cooldown events

TabletContext

File: context/TabletContext.jsx

Manages tablet settings and open/close state.

State Shape

{
    isOpen: false,
    theme: 'dark',
    wallpaper: null,
    accentColor: '#00ff88',
    secondaryColor: '#00d4ff',
    textColor: '#c8d8e8',
    backgroundColor: '#060a0f',
    fontFamily: "'Inter', sans-serif",
    fontSize: 13,
    uiScale: 100,
    borderRadius: 12,
    // ... all settings
}

Provides

• All setting values
• themeColors — derived from base theme + custom colors
• updateSetting(key, value) — single update
• updateSettings({...}) — batch update
• resetSettings() — reset to defaults
• openTablet() / closeTablet() / toggleTablet()

DB Sync

• Loads from localStorage on init (instant)
• Loads from DB async on mount (overrides if different)
• Saves to both localStorage and DB on every change

AppContext

File: context/AppContext.jsx

Manages app registration and window lifecycle.

State Shape

{
    registeredApps: {},      // { appId: appDefinition }
    windows: [],             // Array of window objects
    focusedWindowId: null,
    zIndexCounter: 100,
}

Window Object

{
    id: 'app_1234567890_abc123',
    appId: 'calculator',
    title: 'Calculator',
    iconComponent: CalculatorIcon,
    color: '#3498db',
    x: 80, y: 40,
    width: 320, height: 480,
    minWidth: 280, minHeight: 400,
    isMaximized: false,
    isMinimized: false,
    isFocused: true,
    zIndex: 101,
    component: CalculatorApp,
    props: {},
}

Actions

Action	Description
REGISTER_APP	Register app in registry
UNREGISTER_APP	Remove app from registry
OPEN_APP	Create new window (or focus if singleton)
CLOSE_WINDOW	Remove window
FOCUS_WINDOW	Bring window to front
MINIMIZE_WINDOW	Minimize window
MAXIMIZE_WINDOW	Toggle maximize
MOVE_WINDOW	Update window position
RESIZE_WINDOW	Update window size
UPDATE_WINDOW_PROPS	Update window component props
MINIMIZE_ALL	Minimize all windows