Skip to content

Commit 8e72603

Browse files
PepperLolaPepperLola
authored
UI Post-Refactor Revisions [AARD-2002] (#1268)
2 parents f03177a + 71454dc commit 8e72603

27 files changed

+442
-218
lines changed

‎fission/src/Synthesis.tsx‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { AnimatePresence } from "framer-motion"
22
import { SnackbarProvider } from "notistack"
3+
import Slide from "@mui/material/Slide"
34
import { useCallback, useEffect, useRef, useState } from "react"
45
import { globalAddToast } from "@/components/GlobalUIControls.ts"
56
import MainHUD from "@/components/MainHUD"
@@ -96,7 +97,11 @@ function Synthesis() {
9697
return (
9798
<AnimatePresence key={"animate-presence"}>
9899
<ThemeProvider>
99-
<SnackbarProvider maxSnack={5} anchorOrigin={{ horizontal: "right", vertical: "bottom" }}>
100+
<SnackbarProvider
101+
maxSnack={5}
102+
anchorOrigin={{ horizontal: "right", vertical: "bottom" }}
103+
TransitionComponent={Slide}
104+
>
100105
<StateProvider>
101106
<UIProvider>
102107
<GlobalUIComponent />

‎fission/src/systems/scene/SceneRenderer.ts‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -551,7 +551,7 @@ class SceneRenderer extends WorldSystem {
551551
)
552552

553553
// Use any associations to determine ContextData.
554-
let miraSupplierData: ContextData | undefined = undefined
554+
let miraSupplierData: ContextData | undefined
555555
if (res) {
556556
const assoc = World.physicsSystem.getBodyAssociation(res.data.mBodyID) as RigidNodeAssociate
557557
const sceneObject = assoc?.sceneObject
@@ -574,7 +574,9 @@ class SceneRenderer extends WorldSystem {
574574
miraSupplierData.items.push({
575575
name: "Add",
576576
func: () => {
577-
globalOpenPanel(ImportMirabufPanel, { configurationType: "ROBOTS" as ConfigurationType })
577+
globalOpenPanel(ImportMirabufPanel, {
578+
configurationType: "ROBOTS" as ConfigurationType,
579+
})
578580
},
579581
})
580582
}

‎fission/src/ui/ThemeProvider.tsx‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,33 @@ export const ThemeProvider: React.FC<ThemeProviderProps> = ({ children }) => {
4545
variant: "contained",
4646
},
4747
},
48+
MuiPopover: {
49+
defaultProps: {
50+
elevation: 8,
51+
},
52+
styleOverrides: {
53+
paper: {
54+
boxShadow: "0 4px 8px rgba(0,0,0,0.25), 0 2px 4px rgba(0,0,0,0.2)",
55+
},
56+
},
57+
},
58+
MuiPaper: {
59+
styleOverrides: {
60+
root: {
61+
boxShadow: "0 2px 6px rgba(0,0,0,0.24), 0 1px 3px rgba(0,0,0,0.18)",
62+
},
63+
},
64+
},
65+
MuiMenu: {
66+
defaultProps: {
67+
elevation: 8,
68+
},
69+
styleOverrides: {
70+
paper: {
71+
boxShadow: "0 4px 12px rgba(0,0,0,0.28), 0 2px 6px rgba(0,0,0,0.18)",
72+
},
73+
},
74+
},
4875
},
4976
})
5077

‎fission/src/ui/UIProvider.tsx‎

Lines changed: 43 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -102,6 +102,13 @@ export const UIProvider: React.FC<UIProviderProps> = ({ children }) => {
102102
props: Omit<PanelProps<P>, "type" | "configured" | "custom"> &
103103
Omit<UIScreenCallbacks<T>, "onBeforeAccept"> = DEFAULT_PANEL_PROPS
104104
) => {
105+
// Dupe check
106+
const isDuplicate = panels.some(p => p.content === content)
107+
if (isDuplicate) {
108+
const existing = panels.find(p => p.content === content)!
109+
setPanels(p => [...p.filter(x => x !== existing), existing])
110+
return existing.id
111+
}
105112
const id = uuidv4()
106113
const panel = {
107114
id,
@@ -128,7 +135,42 @@ export const UIProvider: React.FC<UIProviderProps> = ({ children }) => {
128135
panel.onCancel = new UICallback()
129136
if (props.onCancel) panel.onCancel.setUserDefinedFunc(props.onCancel)
130137

131-
setPanels([...panels, panel as Panel<any, any>])
138+
const contentName = (content as unknown as { name?: string })?.name ?? ""
139+
const mutuallyExclusive = ["ImportMirabufPanel", "ConfigurePanel", "InitialConfigPanel"]
140+
const nextPanels = panels
141+
if (mutuallyExclusive.includes(contentName)) {
142+
const existing = panels.find(p =>
143+
mutuallyExclusive.includes((p.content as unknown as { name?: string })?.name ?? "")
144+
)
145+
if (existing) {
146+
// If the existing panel is ConfigurePanel and a spawn/initial panel is being opened while editing,
147+
// warn the user and keep Configure open. Otherwise, replace existing with the new panel.
148+
const existingName = (existing.content as unknown as { name?: string })?.name ?? ""
149+
const isExistingConfigure = existingName === "ConfigurePanel"
150+
const isNewSpawnOrInit =
151+
contentName === "ImportMirabufPanel" || contentName === "InitialConfigPanel"
152+
if (isExistingConfigure && isNewSpawnOrInit) {
153+
// Only block if actively configuring an assembly (has selection or a mode set)
154+
const custom = (existing.props as unknown as { custom?: any })?.custom ?? {}
155+
const isActivelyConfiguring =
156+
Boolean(custom?.selectedAssembly) || custom?.configMode !== undefined
157+
if (isActivelyConfiguring) {
158+
// Show a warning toast about unsaved configuration
159+
enqueueSnackbar("You have unsaved configuration open. Close it before spawning.", {
160+
variant: "warning",
161+
action: snackbarAction,
162+
})
163+
setPanels(p => [...p.filter(x => x !== existing), existing])
164+
return existing.id
165+
}
166+
}
167+
// Replace existing with the new one
168+
setPanels(p => [...p.filter(x => x !== existing), panel as Panel<any, any>])
169+
return id
170+
}
171+
}
172+
173+
setPanels([...nextPanels, panel as Panel<any, any>])
132174
return id
133175
},
134176
[panels]

‎fission/src/ui/components/AnalyticsConsent.tsx‎

Lines changed: 22 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,13 +19,14 @@ const AnalyticsConsent: React.FC<AnalyticsConsentProps> = ({ onConsent, onClose
1919
position: "fixed",
2020
right: "0.5rem",
2121
bottom: "0.5rem",
22-
bgcolor: "background.default",
22+
bgcolor: "background.paper",
2323
padding: "1rem",
2424
borderRadius: "0.5rem",
2525
gap: "0.5rem",
26+
boxShadow: 6,
2627
}}
2728
>
28-
<Label size="sm">
29+
<Label size="sm" color="text.primary">
2930
Synthesis uses cookies to improve the performance and quality of our app. Do you consent to the usage of
3031
cookies for tracking analytics data?
3132
</Label>
@@ -47,7 +48,25 @@ const AnalyticsConsent: React.FC<AnalyticsConsentProps> = ({ onConsent, onClose
4748
}}
4849
>
4950
<Button onClick={() => onConsent()}>I consent</Button>
50-
<Button startIcon={<AiOutlineClose />} onClick={() => onClose()} color="secondary" />
51+
<Button
52+
onClick={() => onClose()}
53+
color="error"
54+
sx={{
55+
minWidth: 0,
56+
width: 36,
57+
height: 36,
58+
borderRadius: "50%",
59+
alignItems: "center",
60+
justifyContent: "center",
61+
display: "flex",
62+
p: 0,
63+
bgcolor: theme => theme.palette.action.hover,
64+
"&:hover": { bgcolor: theme => theme.palette.action.selected },
65+
color: theme => theme.palette.error.main,
66+
}}
67+
>
68+
<AiOutlineClose />
69+
</Button>
5170
</Box>
5271
</Box>
5372
)

‎fission/src/ui/components/ContextMenu.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -56,13 +56,14 @@ const ContextMenu: React.FC = () => {
5656
top: state.location[1],
5757
padding: "1rem",
5858
borderRadius: "0.5rem",
59-
bgcolor: "background.default",
59+
bgcolor: "background.paper",
60+
boxShadow: 6,
6061
}}
6162
// Why, why, why do I need to do this. This is absurd
6263
onPointerDown={e => e.stopPropagation()}
6364
>
6465
<Stack key="CONTEXT-HEADER" component="div" direction="column">
65-
<Label key="context-title" size="md">
66+
<Label key="context-title" size="md" color="text.primary">
6667
{state.data.title}
6768
</Label>
6869
<Divider />

‎fission/src/ui/components/DragModeIndicator.tsx‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,11 +30,14 @@ const DragModeIndicator: React.FC = () => {
3030
direction="row"
3131
onClick={handleClick}
3232
sx={{
33-
bgcolor: "background.default",
33+
bgcolor: "background.paper",
34+
boxShadow: 6,
3435
}}
3536
>
3637
<FaHandPaper className="self-center" />
37-
<Label size="sm">Drag Mode</Label>
38+
<Label size="sm" color="text.primary">
39+
Drag Mode
40+
</Label>
3841
</Stack>
3942
) : (
4043
<></>

0 commit comments

Comments
 (0)