aethex-studio/store/app-store.ts

141 lines
4.5 KiB
TypeScript

import { create } from 'zustand';
interface ConsoleMessage {
id: string;
platform: 'roblox' | 'web' | 'mobile' | 'desktop' | 'system';
message: string;
timestamp: Date;
type: 'log' | 'warn' | 'error';
}
interface NexusSyncEvent {
id: string;
timestamp: Date;
source: string;
target: string;
variable: string;
value: any;
latency?: number;
type: 'sync' | 'ack' | 'conflict' | 'resolved';
}
interface SyncState {
variable: string;
roblox: any;
web: any;
mobile: any;
desktop: any;
status: 'synced' | 'syncing' | 'conflict';
}
interface AppStore {
// Console
consoleMessages: ConsoleMessage[];
addConsoleMessage: (message: Omit<ConsoleMessage, 'id' | 'timestamp'>) => void;
clearConsole: () => void;
// Nexus Sync
syncEvents: NexusSyncEvent[];
syncStates: SyncState[];
addSyncEvent: (event: Omit<NexusSyncEvent, 'id' | 'timestamp'>) => void;
updateSyncState: (state: SyncState) => void;
// UI State
leftSidebarOpen: boolean;
rightSidebarOpen: boolean;
bottomPanelOpen: boolean;
bottomPanelTab: 'console' | 'terminal' | 'nexus' | 'deploy';
editorTab: 'editor' | 'preview' | 'nexus-monitor';
toggleLeftSidebar: () => void;
toggleRightSidebar: () => void;
toggleBottomPanel: () => void;
setBottomPanelTab: (tab: 'console' | 'terminal' | 'nexus' | 'deploy') => void;
setEditorTab: (tab: 'editor' | 'preview' | 'nexus-monitor') => void;
// Modals
newProjectModalOpen: boolean;
deployModalOpen: boolean;
settingsModalOpen: boolean;
commandPaletteOpen: boolean;
setNewProjectModalOpen: (open: boolean) => void;
setDeployModalOpen: (open: boolean) => void;
setSettingsModalOpen: (open: boolean) => void;
setCommandPaletteOpen: (open: boolean) => void;
}
export const useAppStore = create<AppStore>((set, get) => ({
// Console
consoleMessages: [
{ id: '1', platform: 'system', message: 'AeThex Studio initialized', timestamp: new Date(), type: 'log' },
{ id: '2', platform: 'roblox', message: 'Connected to Roblox Studio', timestamp: new Date(), type: 'log' },
{ id: '3', platform: 'web', message: 'Web server started on port 3000', timestamp: new Date(), type: 'log' },
],
addConsoleMessage: (message) => {
const newMessage: ConsoleMessage = {
...message,
id: Math.random().toString(36).substr(2, 9),
timestamp: new Date(),
};
set({ consoleMessages: [...get().consoleMessages, newMessage] });
},
clearConsole: () => set({ consoleMessages: [] }),
// Nexus Sync
syncEvents: [],
syncStates: [
{ variable: 'playerX', roblox: 120, web: 120, mobile: 120, desktop: 120, status: 'synced' },
{ variable: 'playerY', roblox: 85, web: 85, mobile: 85, desktop: 85, status: 'synced' },
{ variable: 'health', roblox: 100, web: 98, mobile: 100, desktop: 100, status: 'syncing' },
{ variable: 'inventory', roblox: '[...]', web: '[...]', mobile: '[...]', desktop: '[...]', status: 'synced' },
{ variable: 'score', roblox: 1250, web: 1250, mobile: 1250, desktop: 1250, status: 'synced' },
],
addSyncEvent: (event) => {
const newEvent: NexusSyncEvent = {
...event,
id: Math.random().toString(36).substr(2, 9),
timestamp: new Date(),
};
set({ syncEvents: [newEvent, ...get().syncEvents].slice(0, 100) });
},
updateSyncState: (state) => {
const { syncStates } = get();
const index = syncStates.findIndex(s => s.variable === state.variable);
if (index >= 0) {
const newStates = [...syncStates];
newStates[index] = state;
set({ syncStates: newStates });
} else {
set({ syncStates: [...syncStates, state] });
}
},
// UI State
leftSidebarOpen: true,
rightSidebarOpen: true,
bottomPanelOpen: true,
bottomPanelTab: 'console',
editorTab: 'editor',
toggleLeftSidebar: () => set({ leftSidebarOpen: !get().leftSidebarOpen }),
toggleRightSidebar: () => set({ rightSidebarOpen: !get().rightSidebarOpen }),
toggleBottomPanel: () => set({ bottomPanelOpen: !get().bottomPanelOpen }),
setBottomPanelTab: (tab) => set({ bottomPanelTab: tab }),
setEditorTab: (tab) => set({ editorTab: tab }),
// Modals
newProjectModalOpen: false,
deployModalOpen: false,
settingsModalOpen: false,
commandPaletteOpen: false,
setNewProjectModalOpen: (open) => set({ newProjectModalOpen: open }),
setDeployModalOpen: (open) => set({ deployModalOpen: open }),
setSettingsModalOpen: (open) => set({ settingsModalOpen: open }),
setCommandPaletteOpen: (open) => set({ commandPaletteOpen: open }),
}));