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

feat(web/context): images in metadata

Browse Source
This commit is contained in:
Luke
2022-06-11 11:49:25 +02:00
parent 186014f95e
commit a7e2dc0067
3 changed files with 30 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
web/src/features/menu/ContextMenu.tsx
View File

@@ -17,6 +17,7 @@ debugData<ContextMenuProps>([
{ {
title: "Example button", title: "Example button",
description: "Example button description", description: "Example button description",
image: "https://i.imgur.com/YAe7k17.jpeg",
metadata: [{ label: "Value 1", value: 300 }], metadata: [{ label: "Value 1", value: 300 }],
}, },
{ {

52
web/src/features/menu/Item.tsx
View File

@@ -8,6 +8,7 @@ import {
Text, Text,
Flex, Flex,
Spacer, Spacer,
Image,
} from "@chakra-ui/react"; } from "@chakra-ui/react";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { Option, ContextMenuProps } from "../../interfaces/context"; import { Option, ContextMenuProps } from "../../interfaces/context";
@@ -91,31 +92,34 @@ const Item: React.FC<{
maxW="2xs" maxW="2xs"
> >
<PopoverBody> <PopoverBody>
{Array.isArray(option[1].metadata) ? ( <>
option[1].metadata.map( {option[1].image && <Image src={option[1].image} />}
( {Array.isArray(option[1].metadata) ? (
metadata: string | { label: string; value: any }, option[1].metadata.map(
index: number (
) => ( metadata: string | { label: string; value: any },
<Text key={`context-metadata-${index}`}> index: number
{typeof metadata === "string" ) => (
? `${metadata}` <Text key={`context-metadata-${index}`}>
: `${metadata.label}: ${metadata.value}`} {typeof metadata === "string"
</Text> ? `${metadata}`
: `${metadata.label}: ${metadata.value}`}
</Text>
)
) )
) ) : (
) : ( <>
<> {typeof option[1].metadata === "object" &&
{typeof option[1].metadata === "object" && Object.entries(option[1].metadata).map(
Object.entries(option[1].metadata).map( (metadata: { [key: string]: any }, index) => (
(metadata: { [key: string]: any }, index) => ( <Text key={`context-metadata-${index}`}>
<Text key={`context-metadata-${index}`}> {metadata[0]}: {metadata[1]}
{metadata[0]}: {metadata[1]} </Text>
</Text> )
) )}
)} </>
</> )}
)} </>
</PopoverBody> </PopoverBody>
</PopoverContent> </PopoverContent>
)} )}

1
web/src/interfaces/context.ts
View File

@@ -3,6 +3,7 @@ export interface Option {
title?: string; title?: string;
description?: string; description?: string;
arrow?: boolean; arrow?: boolean;
image?: string;
metadata?: metadata?:
| string[] | string[]
| { [key: string]: any } | { [key: string]: any }