11import { AnimatePresence } from "framer-motion"
2- import React , { ReactElement , useCallback , useEffect , useRef , useState } from "react"
2+ import { SnackbarProvider } from "notistack"
3+ import { useCallback , useEffect , useRef , useState } from "react"
34import MainHUD from "@/components/MainHUD"
45import Scene from "@/components/Scene.tsx"
5- import ConnectToMultiplayerModal from "@/modals/aether/ConnectToMultiplayerModal"
6- import ServerHostingModal from "@/modals/aether/ServerHostingModal"
7- import ChooseMultiplayerModeModal from "@/modals/configuring/ChooseMultiplayerModeModal"
8- import ChooseSingleplayerModeModal from "@/modals/configuring/ChooseSingleplayerModeModal"
9- import ConfigMotorModal from "@/modals/configuring/ConfigMotorModal"
10- import DrivetrainModal from "@/modals/configuring/DrivetrainModal"
11- import PracticeSettingsModal from "@/modals/configuring/PracticeSettingsModal"
12- import RoboRIOModal from "@/modals/configuring/RoboRIOModal"
13- import RCConfigCANGroupModal from "@/modals/configuring/rio-config/RCConfigCANGroupModal.tsx"
14- import RCConfigEncoderModal from "@/modals/configuring/rio-config/RCConfigEncoderModal"
15- import RCConfigPWMGroupModal from "@/modals/configuring/rio-config/RCConfigPWMGroupModal.tsx"
16- import RCCreateDeviceModal from "@/modals/configuring/rio-config/RCCreateDeviceModal"
17- import SettingsModal from "@/modals/configuring/SettingsModal"
18- import DeleteAllThemesModal from "@/modals/configuring/theme-editor/DeleteAllThemesModal"
19- import DeleteThemeModal from "@/modals/configuring/theme-editor/DeleteThemeModal"
20- import NewThemeModal from "@/modals/configuring/theme-editor/NewThemeModal"
21- import ThemeEditorModal from "@/modals/configuring/theme-editor/ThemeEditorModal"
22- import DownloadAssetsModal from "@/modals/DownloadAssetsModal"
23- import ExitSynthesisModal from "@/modals/ExitSynthesisModal"
24- import MainMenuModal from "@/modals/MainMenuModal"
25- import MatchResultsModal from "@/modals/MatchResultsModal"
26- import ImportLocalMirabufModal from "@/modals/mirabuf/ImportLocalMirabufModal.tsx"
27- import MatchModeModal from "@/modals/spawning/MatchModeModal"
28- import UpdateAvailableModal from "@/modals/UpdateAvailableModal"
29- import ViewModal from "@/modals/ViewModal"
30- import ScoreboardPanel from "@/panels/information/ScoreboardPanel"
31- import PokerPanel from "@/panels/PokerPanel.tsx"
32- import RobotSwitchPanel from "@/panels/RobotSwitchPanel"
33- import SpawnLocationsPanel from "@/panels/SpawnLocationPanel"
34- import DriverStationPanel from "@/panels/simulation/DriverStationPanel"
356import World from "@/systems/World.ts"
36- import { useModalManager } from "@/ui/helpers/UseModalManager.tsx"
37- import { usePanelManager } from "@/ui/helpers/UsePanelManager.tsx"
38- import { useTheme } from "@/ui/helpers/UseThemeHelpers.tsx"
39- import { ModalControlProvider } from "@/ui/ModalContext"
40- import { PanelControlProvider } from "@/ui/PanelContext"
41- import ImportMirabufPanel from "@/ui/panels/mirabuf/ImportMirabufPanel.tsx"
42- import { ToastContainer , ToastProvider } from "@/ui/ToastContext"
43- import {
44- TOOLTIP_DURATION ,
45- TooltipControl ,
46- TooltipControlProvider ,
47- TooltipType ,
48- useTooltipManager ,
49- } from "@/ui/TooltipContext"
7+ import { UIRenderer } from "@/ui/UIRenderer.tsx"
508import PreferencesSystem from "./systems/preferences/PreferencesSystem.ts"
519import AnalyticsConsent from "./ui/components/AnalyticsConsent.tsx"
5210import ContextMenu from "./ui/components/ContextMenu.tsx"
53- import DragModeIndicator from "./ui/components/DragModeIndicator.tsx"
5411import GlobalUIComponent from "./ui/components/GlobalUIComponent.tsx"
5512import ProgressNotifications from "./ui/components/ProgressNotification.tsx"
5613import SceneOverlay from "./ui/components/SceneOverlay.tsx"
57- import Skybox from "./ui/components/Skybox.tsx"
58- import TouchControls from "./ui/components/TouchControls.tsx"
5914import WPILibConnectionStatus from "./ui/components/WPILibConnectionStatus.tsx"
60- import APSManagementModal from "./ui/modals/APSManagementModal.tsx"
61- import AssignNewSchemeModal from "./ui/modals/configuring/theme-editor/AssignNewSchemeModal.tsx"
62- import NewInputSchemeModal from "./ui/modals/configuring/theme-editor/NewInputSchemeModal.tsx"
63- import ConfigurePanel from "./ui/panels/configuring/assembly-config/ConfigurePanel.tsx"
64- import CameraSelectionPanel from "./ui/panels/configuring/CameraSelectionPanel.tsx"
65- import ChooseInputSchemePanel from "./ui/panels/configuring/ChooseInputSchemePanel.tsx"
66- import InitialConfigPanel from "./ui/panels/configuring/initial-config/InitialConfigPanel.tsx"
67- import MatchModeConfigPanel from "./ui/panels/configuring/MatchModeConfigPanel.tsx"
68- import DebugPanel from "./ui/panels/DebugPanel.tsx"
69- import DeveloperToolPanel from "./ui/panels/DeveloperToolPanel.tsx"
70- import GraphicsSettings from "./ui/panels/GraphicsSettingsPanel.tsx"
71- import AutoTestPanel from "./ui/panels/simulation/AutoTestPanel.tsx"
72- import WiringPanel from "./ui/panels/simulation/WiringPanel.tsx"
73- import WSViewPanel from "./ui/panels/WSViewPanel.tsx"
74-
75- const Synthesis : React . FC = ( ) => {
76- const { openModal, closeModal, getActiveModalElement, registerModal, activeModalId } =
77- useModalManager ( initialModals )
78- const { openPanel, closePanel, closeAllPanels, getActivePanelElements } = usePanelManager ( initialPanels )
79- const { showTooltip } = useTooltipManager ( )
15+ import MainMenuModal from "./ui/modals/MainMenuModal.tsx"
16+ import { StateProvider } from "./ui/StateProvider.tsx"
17+ import { ThemeProvider } from "./ui/ThemeProvider.tsx"
18+ import { UIProvider } from "./ui/UIProvider.tsx"
19+ import { globalOpenModal } from "./ui/components/GlobalUIControls.ts"
20+ import DragModeIndicator from "./ui/components/DragModeIndicator.tsx"
8021
22+ function Synthesis ( ) {
8123 const [ consentPopupDisable , setConsentPopupDisable ] = useState < boolean > ( true )
8224
83- const { currentTheme, applyTheme, defaultTheme } = useTheme ( )
84-
85- useEffect ( ( ) => {
86- applyTheme ( currentTheme )
87- } , [ currentTheme , applyTheme ] )
88-
89- const panelElements = getActivePanelElements ( )
90- const modalElement = getActiveModalElement ( )
91-
9225 const mainLoopHandle = useRef ( 0 )
93- registerModal ( "main-menu" , {
94- id : "main-menu" ,
95- component : (
96- < MainMenuModal
97- key = "main-menu"
98- modalId = "main-menu"
99- startSingleplayerCallback = { ( ) => {
100- World . initWorld ( )
101-
102- if ( ! PreferencesSystem . getGlobalPreference ( "ReportAnalytics" ) && ! import . meta. env . DEV ) {
103- setConsentPopupDisable ( false )
104- }
105-
106- const mainLoop = ( ) => {
107- mainLoopHandle . current = requestAnimationFrame ( mainLoop )
108- World . updateWorld ( )
109- }
110- mainLoop ( )
111-
112- World . sceneRenderer . updateSkyboxColors ( defaultTheme )
113- } }
114- />
115- ) ,
116- } )
11726
11827 useEffect ( ( ) => {
11928 const urlParams = new URLSearchParams ( document . location . search )
@@ -122,25 +31,29 @@ const Synthesis: React.FC = () => {
12231 window . close ( )
12332 return
12433 }
125- openModal ( "main-menu" )
34+ const startSingleplayerCallback = ( ) => {
35+ World . initWorld ( )
36+
37+ if ( ! PreferencesSystem . getGlobalPreference ( "ReportAnalytics" ) && ! import . meta. env . DEV ) {
38+ setConsentPopupDisable ( false )
39+ }
40+
41+ const mainLoop = ( ) => {
42+ mainLoopHandle . current = requestAnimationFrame ( mainLoop )
43+ World . updateWorld ( )
44+ }
45+
46+ mainLoop ( )
47+ }
48+ globalOpenModal ( MainMenuModal , { startSingleplayerCallback } )
12649 // Cleanup
12750 return ( ) => {
12851 // TODO: Teardown literally everything
12952 cancelAnimationFrame ( mainLoopHandle . current )
13053 World . destroyWorld ( )
13154 // World.SceneRenderer.RemoveAllSceneObjects();
13255 }
133- } , [ openModal ] )
134-
135- useEffect ( ( ) => {
136- let scoreboardExists = false
137- panelElements . forEach ( x => {
138- if ( x . key == "scoreboard" ) scoreboardExists = true
139- } )
140- if ( PreferencesSystem . getGlobalPreference ( "RenderScoreboard" ) && ! scoreboardExists ) {
141- openPanel ( "scoreboard" )
142- }
143- } )
56+ } , [ ] )
14457
14558 const onConsent = useCallback ( ( ) => {
14659 setConsentPopupDisable ( true )
@@ -154,109 +67,29 @@ const Synthesis: React.FC = () => {
15467
15568 return (
15669 < AnimatePresence key = { "animate-presence" } >
157- < Skybox key = { "skybox" } />
158- < TooltipControlProvider
159- key = { "tooltip-control-provider" }
160- showTooltip = { ( type : TooltipType , controls ?: TooltipControl [ ] , duration : number = TOOLTIP_DURATION ) => {
161- showTooltip ( type , controls , duration )
162- } }
163- >
164- < ModalControlProvider
165- key = { "modal-control-provider" }
166- openModal = { ( modalId : string ) => {
167- closeAllPanels ( )
168- openModal ( modalId )
169- } }
170- closeModal = { closeModal }
171- activeModalId = { activeModalId }
172- >
173- < PanelControlProvider
174- key = { "panel-control-provider" }
175- openPanel = { openPanel }
176- closePanel = { ( id : string ) => {
177- closePanel ( id )
178- } }
179- closeAllPanels = { closeAllPanels }
180- >
181- < ToastProvider key = "toast-provider" >
70+ < ThemeProvider >
71+ < SnackbarProvider maxSnack = { 5 } anchorOrigin = { { horizontal : "right" , vertical : "bottom" } } >
72+ < StateProvider >
73+ < UIProvider >
18274 < GlobalUIComponent />
18375 < Scene useStats = { import . meta. env . DEV } key = "scene-in-toast-provider" />
18476 < SceneOverlay />
185- < TouchControls />
18677 < ContextMenu />
18778 < MainHUD key = { "main-hud" } />
188- { panelElements . length > 0 && panelElements }
189- { modalElement && (
190- < div className = "absolute w-full h-full left-0 top-0" key = { "modal-element" } >
191- { modalElement }
192- </ div >
193- ) }
79+ < UIRenderer />
19480 < ProgressNotifications key = { "progress-notifications" } />
195- < ToastContainer key = { "toast-container" } />
19681 < WPILibConnectionStatus />
19782 < DragModeIndicator />
19883
199- { ! consentPopupDisable ? (
84+ { ! consentPopupDisable && (
20085 < AnalyticsConsent onClose = { onDisableConsent } onConsent = { onConsent } />
201- ) : (
202- < > </ >
20386 ) }
204- </ ToastProvider >
205- </ PanelControlProvider >
206- </ ModalControlProvider >
207- </ TooltipControlProvider >
87+ </ UIProvider >
88+ </ StateProvider >
89+ </ SnackbarProvider >
90+ </ ThemeProvider >
20891 </ AnimatePresence >
20992 )
21093}
21194
212- const initialModals = [
213- < SettingsModal key = "settings" modalId = "settings" /> ,
214- < ViewModal key = "view" modalId = "view" /> ,
215- < DownloadAssetsModal key = "download-assets" modalId = "download-assets" /> ,
216- < RoboRIOModal key = "roborio" modalId = "roborio" /> ,
217- < DrivetrainModal key = "drivetrain" modalId = "drivetrain" /> ,
218- < ThemeEditorModal key = "theme-editor" modalId = "theme-editor" /> ,
219- < ExitSynthesisModal key = "exit-synthesis" modalId = "exit-synthesis" /> ,
220- < MatchResultsModal key = "match-results" modalId = "match-results" /> ,
221- < UpdateAvailableModal key = "update-available" modalId = "update-available" /> ,
222- < ConnectToMultiplayerModal key = "connect-to-multiplayer" modalId = "connect-to-multiplayer" /> ,
223- < ServerHostingModal key = "server-hosting" modalId = "server-hosting" /> ,
224- < ChooseMultiplayerModeModal key = "multiplayer-mode" modalId = "multiplayer-mode" /> ,
225- < ChooseSingleplayerModeModal key = "singleplayer-mode" modalId = "singleplayer-mode" /> ,
226- < PracticeSettingsModal key = "practice-settings" modalId = "practice-settings" /> ,
227- < DeleteThemeModal key = "delete-theme" modalId = "delete-theme" /> ,
228- < NewInputSchemeModal key = "new-scheme" modalId = "new-scheme" /> ,
229- < AssignNewSchemeModal key = "assign-new-scheme" modalId = "assign-new-scheme" /> ,
230- < DeleteAllThemesModal key = "delete-all-themes" modalId = "delete-all-themes" /> ,
231- < NewThemeModal key = "new-theme" modalId = "new-theme" /> ,
232- < RCCreateDeviceModal key = "create-device" modalId = "create-device" /> ,
233- < RCConfigPWMGroupModal key = "config-pwm" modalId = "config-pwm" /> ,
234- < RCConfigCANGroupModal key = "config-can" modalId = "config-can" /> ,
235- < RCConfigEncoderModal key = "config-encoder" modalId = "config-encoder" /> ,
236- < MatchModeModal key = "match-mode" modalId = "match-mode" /> ,
237- < ConfigMotorModal key = "config-motor" modalId = "config-motor" /> ,
238- < ImportLocalMirabufModal key = "import-local-mirabuf" modalId = "import-local-mirabuf" /> ,
239- < APSManagementModal key = "aps-management" modalId = "aps-management" /> ,
240- ]
241-
242- const initialPanels : ReactElement [ ] = [
243- < RobotSwitchPanel key = "multibot" panelId = "multibot" openLocation = "right" sidePadding = { 8 } /> ,
244- < DriverStationPanel key = "driver-station" panelId = "driver-station" /> ,
245- < SpawnLocationsPanel key = "spawn-locations" panelId = "spawn-locations" /> ,
246- < ScoreboardPanel key = "scoreboard" panelId = "scoreboard" openLocation = "top" sidePadding = { 8 } /> ,
247- < ImportMirabufPanel key = "import-mirabuf" panelId = "import-mirabuf" /> ,
248- < MatchModeConfigPanel key = "match-mode-config" panelId = "match-mode-config" /> ,
249- < PokerPanel key = "poker" panelId = "poker" /> ,
250- < ChooseInputSchemePanel key = "choose-scheme" panelId = "choose-scheme" /> ,
251- < WSViewPanel key = "ws-view" panelId = "ws-view" /> ,
252- < DebugPanel key = "debug" panelId = "debug" /> ,
253- < ConfigurePanel key = "configure" panelId = "configure" /> ,
254- < DeveloperToolPanel key = "developer" panelId = "developer" /> ,
255- < WiringPanel key = "wiring" panelId = "wiring" /> ,
256- < CameraSelectionPanel key = "camera-select" panelId = "camera-select" /> ,
257- < InitialConfigPanel key = "initial-config" panelId = "initial-config" /> ,
258- < AutoTestPanel key = "auto-test" panelId = "auto-test" /> ,
259- < GraphicsSettings key = "graphics-settings" panelId = "graphics-settings" sidePadding = { 8 } /> ,
260- ]
261-
26295export default Synthesis
0 commit comments