mirror of
https://github.com/CommunityOx/ox_lib.git
synced 2026-08-17 23:16:03 +01:00
refactor(web): move all types into typings folder
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
import { useNuiEvent } from '../../../hooks/useNuiEvent';
|
||||
import { Box, Stack, Text, Flex } from '@mantine/core';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { ContextMenuProps } from '../../../interfaces/context';
|
||||
import { ContextMenuProps } from '../../../typings';
|
||||
import ContextButton from './components/ContextButton';
|
||||
import { fetchNui } from '../../../utils/fetchNui';
|
||||
import ReactMarkdown from 'react-markdown';
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { Button, Box, Group, Stack, Text, Progress, HoverCard, Image, createStyles } from '@mantine/core';
|
||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import ReactMarkdown from 'react-markdown';
|
||||
import { Option, ContextMenuProps } from '../../../../interfaces/context';
|
||||
import { Option, ContextMenuProps } from '../../../../typings';
|
||||
import { fetchNui } from '../../../../utils/fetchNui';
|
||||
|
||||
const openMenu = (id: string | undefined) => {
|
||||
@@ -90,17 +90,19 @@ const ContextButton: React.FC<{
|
||||
<HoverCard.Dropdown className={classes.dropdown}>
|
||||
{button.image && <Image src={button.image} />}
|
||||
{Array.isArray(button.metadata) ? (
|
||||
button.metadata.map((metadata: string | { label: string; value?: any; progress?: number }, index: number) => (
|
||||
<>
|
||||
<Text key={`context-metadata-${index}`}>
|
||||
{typeof metadata === 'string' ? `${metadata}` : `${metadata.label}: ${metadata?.value ?? ""}`}
|
||||
</Text>
|
||||
button.metadata.map(
|
||||
(metadata: string | { label: string; value?: any; progress?: number }, index: number) => (
|
||||
<>
|
||||
<Text key={`context-metadata-${index}`}>
|
||||
{typeof metadata === 'string' ? `${metadata}` : `${metadata.label}: ${metadata?.value ?? ''}`}
|
||||
</Text>
|
||||
|
||||
{typeof metadata === 'object' && metadata.progress !== undefined && (
|
||||
<Progress value={metadata.progress} size="sm" color={button.colorScheme || 'dark.3'} />
|
||||
)}
|
||||
</>
|
||||
))
|
||||
{typeof metadata === 'object' && metadata.progress !== undefined && (
|
||||
<Progress value={metadata.progress} size="sm" color={button.colorScheme || 'dark.3'} />
|
||||
)}
|
||||
</>
|
||||
)
|
||||
)
|
||||
) : (
|
||||
<>
|
||||
{typeof button.metadata === 'object' &&
|
||||
|
||||
@@ -2,7 +2,7 @@ import { Box, Group, Stack, Text, Progress } from '@mantine/core';
|
||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import React, { forwardRef } from 'react';
|
||||
import CustomCheckbox from './CustomCheckbox';
|
||||
import type { MenuItem } from './index';
|
||||
import type { MenuItem } from '../../../typings';
|
||||
import { createStyles } from '@mantine/core';
|
||||
|
||||
interface Props {
|
||||
|
||||
@@ -4,33 +4,10 @@ import { useNuiEvent } from '../../../hooks/useNuiEvent';
|
||||
import ListItem from './ListItem';
|
||||
import Header from './Header';
|
||||
import FocusTrap from 'focus-trap-react';
|
||||
import { IconProp } from '@fortawesome/fontawesome-svg-core';
|
||||
import { fetchNui } from '../../../utils/fetchNui';
|
||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import React from 'react';
|
||||
|
||||
type MenuPosition = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
|
||||
|
||||
export interface MenuItem {
|
||||
label: string;
|
||||
progress?: number;
|
||||
colorScheme?: string;
|
||||
checked?: boolean;
|
||||
values?: Array<string | { label: string; description: string }>;
|
||||
description?: string;
|
||||
icon?: IconProp;
|
||||
iconColor?: string;
|
||||
defaultIndex?: number;
|
||||
close?: boolean;
|
||||
}
|
||||
|
||||
export interface MenuSettings {
|
||||
position?: MenuPosition;
|
||||
title: string;
|
||||
canClose?: boolean;
|
||||
items: Array<MenuItem>;
|
||||
startItemIndex?: number;
|
||||
}
|
||||
import type { MenuPosition, MenuSettings } from '../../../typings';
|
||||
|
||||
const useStyles = createStyles((theme, params: { position?: MenuPosition; itemCount: number; selected: number }) => ({
|
||||
tooltip: {
|
||||
|
||||
@@ -1,15 +1,10 @@
|
||||
import { Box, createStyles } from '@mantine/core';
|
||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import { IconProp } from '@fortawesome/fontawesome-svg-core';
|
||||
import { useState } from 'react';
|
||||
import { useNuiEvent } from '../../../hooks/useNuiEvent';
|
||||
import { fetchNui } from '../../../utils/fetchNui';
|
||||
import ScaleFade from '../../../transitions/ScaleFade';
|
||||
|
||||
export interface MenuItem {
|
||||
icon: IconProp;
|
||||
label: string;
|
||||
}
|
||||
import type { RadialMenuItem } from '../../../typings';
|
||||
|
||||
const useStyles = createStyles((theme) => ({
|
||||
wrapper: {
|
||||
@@ -61,12 +56,12 @@ const degToRad = (deg: number) => deg * (Math.PI / 180);
|
||||
const RadialMenu: React.FC = () => {
|
||||
const { classes } = useStyles();
|
||||
const [visible, setVisible] = useState(false);
|
||||
const [menu, setMenu] = useState<{ items: MenuItem[]; sub?: boolean }>({
|
||||
const [menu, setMenu] = useState<{ items: RadialMenuItem[]; sub?: boolean }>({
|
||||
items: [],
|
||||
sub: false,
|
||||
});
|
||||
|
||||
useNuiEvent('openRadialMenu', async (data: { items: MenuItem[]; sub?: boolean } | false) => {
|
||||
useNuiEvent('openRadialMenu', async (data: { items: RadialMenuItem[]; sub?: boolean } | false) => {
|
||||
if (!data) return setVisible(false);
|
||||
if (visible) {
|
||||
setVisible(false);
|
||||
@@ -76,7 +71,7 @@ const RadialMenu: React.FC = () => {
|
||||
setVisible(true);
|
||||
});
|
||||
|
||||
useNuiEvent('refreshItems', (data: MenuItem[]) => {
|
||||
useNuiEvent('refreshItems', (data: RadialMenuItem[]) => {
|
||||
setMenu({ ...menu, items: data });
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user