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

feat(nui): Display an arrow if an item goes into a sub menu

Browse Source
This commit is contained in:
Luke
2022-03-26 09:55:05 +01:00
parent f346d2ad99
commit 331fb890c9
1 changed files with 30 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
web/src/components/ContextMenu.tsx
View File

@@ -8,7 +8,9 @@ import {
Portal, Portal,
PopoverContent, PopoverContent,
PopoverBody, PopoverBody,
Spacer,
} from "@chakra-ui/react"; } from "@chakra-ui/react";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { debugData } from "../utils/debugData"; import { debugData } from "../utils/debugData";
import { useState } from "react"; import { useState } from "react";
@@ -21,6 +23,7 @@ interface Options {
[key: string]: { [key: string]: {
description?: string; description?: string;
metadata?: string[] | { [key: string]: any }; metadata?: string[] | { [key: string]: any };
subMenu?: boolean;
}; };
} }
@@ -32,6 +35,7 @@ debugData<Props>([
options: { options: {
["Dinka Blista"]: { ["Dinka Blista"]: {
description: "Super cool vehicle", description: "Super cool vehicle",
subMenu: true,
metadata: { metadata: {
["Plate"]: "KLT 192", ["Plate"]: "KLT 192",
["Status"]: "In garage", ["Status"]: "In garage",
@@ -112,6 +116,8 @@ const ContextMenu: React.FC = () => {
key={`option-${index}`} key={`option-${index}`}
> >
{/* TODO: react-markdown (?) */} {/* TODO: react-markdown (?) */}
<Flex w="100%">
<Box>
<Box paddingBottom={1}> <Box paddingBottom={1}>
<Text w="100%" fontWeight="medium"> <Text w="100%" fontWeight="medium">
{option[0]} {option[0]}
@@ -122,6 +128,21 @@ const ContextMenu: React.FC = () => {
<Text>{option[1].description}</Text> <Text>{option[1].description}</Text>
</Box> </Box>
)} )}
</Box>
{option[1].subMenu && (
<>
<Spacer />
<Box
alignSelf="center"
justifySelf="center"
mr={4}
fontSize="xl"
>
<FontAwesomeIcon icon="chevron-right" />
</Box>
</>
)}
</Flex>
<Portal> <Portal>
<PopoverContent <PopoverContent
fontFamily="Poppins" fontFamily="Poppins"