FumeNodes/ox_lib
1
0
Fork 0
mirror of https://github.com/CommunityOx/ox_lib.git synced 2026-08-17 06:56:03 +01:00
Code Issues Packages Projects Releases Wiki Activity

refactor(web/menu): rename planet menu to radial menu

Browse Source
This commit is contained in:
Luke
2023-01-27 22:02:16 +01:00
parent a8abefa2d0
commit f5617abbb6
2 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
web/src/App.tsx
View File

@@ -12,7 +12,7 @@ import ListMenu from './features/menu/list';
import Dev from './features/dev'; import Dev from './features/dev';
import { isEnvBrowser } from './utils/misc'; import { isEnvBrowser } from './utils/misc';
import SkillCheck from './features/skillcheck'; import SkillCheck from './features/skillcheck';
import PlanetMenu from './features/menu/planet'; import RadialMenu from './features/menu/radial';
const App: React.FC = () => { const App: React.FC = () => {
useNuiEvent('setClipboard', (data: string) => { useNuiEvent('setClipboard', (data: string) => {
@@ -31,7 +31,7 @@ const App: React.FC = () => {
<AlertDialog /> <AlertDialog />
<ContextMenu /> <ContextMenu />
<ListMenu /> <ListMenu />
<PlanetMenu /> <RadialMenu />
<SkillCheck /> <SkillCheck />
{isEnvBrowser() && <Dev />} {isEnvBrowser() && <Dev />}
</> </>

12
web/src/features/menu/planet/index.tsx → web/src/features/menu/radial/index.tsx
View File

@@ -25,9 +25,10 @@ interface MenuItem {
debugData<{ items: MenuItem[]; sub?: boolean }>([ debugData<{ items: MenuItem[]; sub?: boolean }>([
{ {
action: 'openPlanetMenu', action: 'openRadialMenu',
data: { data: {
items: [ items: [
// TODO: Fix wheel being broken when there's only one item
{ icon: 'palette', label: 'Paint' }, { icon: 'palette', label: 'Paint' },
{ icon: 'warehouse', label: 'Garage' }, { icon: 'warehouse', label: 'Garage' },
{ icon: 'palette', label: 'Quite long text' }, { icon: 'palette', label: 'Quite long text' },
@@ -40,7 +41,6 @@ debugData<{ items: MenuItem[]; sub?: boolean }>([
}, },
]); ]);
// TODO: remove unused styling
const useStyles = createStyles((theme) => ({ const useStyles = createStyles((theme) => ({
wrapper: { wrapper: {
position: 'absolute', position: 'absolute',
@@ -82,16 +82,15 @@ const useStyles = createStyles((theme) => ({
const degToRad = (deg: number) => deg * (Math.PI / 180); const degToRad = (deg: number) => deg * (Math.PI / 180);
const PlanetMenu: React.FC = () => { const RadialMenu: React.FC = () => {
const { classes } = useStyles(); const { classes } = useStyles();
const [visible, setVisible] = useState(false); const [visible, setVisible] = useState(false);
const [menu, setMenu] = useState<{ items: MenuItem[]; sub?: boolean }>({ const [menu, setMenu] = useState<{ items: MenuItem[]; sub?: boolean }>({
items: [], items: [],
sub: false, sub: false,
}); });
const [currentItem, setCurrentItem] = useState({ label: '', visible: false });
useNuiEvent('openPlanetMenu', (data: { items: MenuItem[]; sub?: boolean }) => { useNuiEvent('openRadialMenu', (data: { items: MenuItem[]; sub?: boolean }) => {
setMenu(data); setMenu(data);
setVisible(true); setVisible(true);
}); });
@@ -141,6 +140,7 @@ const PlanetMenu: React.FC = () => {
); );
})} })}
<g transform="translate(175, 175)"> <g transform="translate(175, 175)">
{/*TODO: Fix background circle when there's 2 items*/}
<circle r={30} className={classes.centerCircle} /> <circle r={30} className={classes.centerCircle} />
</g> </g>
<FontAwesomeIcon <FontAwesomeIcon
@@ -158,4 +158,4 @@ const PlanetMenu: React.FC = () => {
); );
}; };
export default PlanetMenu; export default RadialMenu;