mirror of
https://github.com/CommunityOx/ox_lib.git
synced 2026-08-17 06:56:03 +01:00
feat(web/context): images in metadata
This commit is contained in:
@@ -17,6 +17,7 @@ debugData<ContextMenuProps>([
|
||||
{
|
||||
title: "Example button",
|
||||
description: "Example button description",
|
||||
image: "https://i.imgur.com/YAe7k17.jpeg",
|
||||
metadata: [{ label: "Value 1", value: 300 }],
|
||||
},
|
||||
{
|
||||
|
||||
@@ -8,6 +8,7 @@ import {
|
||||
Text,
|
||||
Flex,
|
||||
Spacer,
|
||||
Image,
|
||||
} from "@chakra-ui/react";
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
import { Option, ContextMenuProps } from "../../interfaces/context";
|
||||
@@ -91,31 +92,34 @@ const Item: React.FC<{
|
||||
maxW="2xs"
|
||||
>
|
||||
<PopoverBody>
|
||||
{Array.isArray(option[1].metadata) ? (
|
||||
option[1].metadata.map(
|
||||
(
|
||||
metadata: string | { label: string; value: any },
|
||||
index: number
|
||||
) => (
|
||||
<Text key={`context-metadata-${index}`}>
|
||||
{typeof metadata === "string"
|
||||
? `${metadata}`
|
||||
: `${metadata.label}: ${metadata.value}`}
|
||||
</Text>
|
||||
<>
|
||||
{option[1].image && <Image src={option[1].image} />}
|
||||
{Array.isArray(option[1].metadata) ? (
|
||||
option[1].metadata.map(
|
||||
(
|
||||
metadata: string | { label: string; value: any },
|
||||
index: number
|
||||
) => (
|
||||
<Text key={`context-metadata-${index}`}>
|
||||
{typeof metadata === "string"
|
||||
? `${metadata}`
|
||||
: `${metadata.label}: ${metadata.value}`}
|
||||
</Text>
|
||||
)
|
||||
)
|
||||
)
|
||||
) : (
|
||||
<>
|
||||
{typeof option[1].metadata === "object" &&
|
||||
Object.entries(option[1].metadata).map(
|
||||
(metadata: { [key: string]: any }, index) => (
|
||||
<Text key={`context-metadata-${index}`}>
|
||||
{metadata[0]}: {metadata[1]}
|
||||
</Text>
|
||||
)
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
) : (
|
||||
<>
|
||||
{typeof option[1].metadata === "object" &&
|
||||
Object.entries(option[1].metadata).map(
|
||||
(metadata: { [key: string]: any }, index) => (
|
||||
<Text key={`context-metadata-${index}`}>
|
||||
{metadata[0]}: {metadata[1]}
|
||||
</Text>
|
||||
)
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
</PopoverBody>
|
||||
</PopoverContent>
|
||||
)}
|
||||
|
||||
@@ -3,6 +3,7 @@ export interface Option {
|
||||
title?: string;
|
||||
description?: string;
|
||||
arrow?: boolean;
|
||||
image?: string;
|
||||
metadata?:
|
||||
| string[]
|
||||
| { [key: string]: any }
|
||||
|
||||
Reference in New Issue
Block a user