refactor(web): move all types into typings folder

This commit is contained in:
Luke
2023-02-15 13:00:09 +01:00
parent 5b4c6b8674
commit 829bec2592
42 changed files with 181 additions and 169 deletions

View File

@@ -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';

View File

@@ -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' &&

View File

@@ -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 {

View File

@@ -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: {

View File

@@ -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 });
});