From b145a689ff9a0ef2c1e9bfbdb7018777e54d45c9 Mon Sep 17 00:00:00 2001 From: Marcus Date: Sun, 8 Sep 2024 23:58:22 -0700 Subject: [PATCH] Chore: Replace classnames dep with built-in helper --- package.json | 1 - pnpm-lock.yaml | 3 --- src/components/baseComponents/AffixesSelect.jsx | 5 ++--- .../baseComponents/ExtrasMultiselect.jsx | 5 ++--- src/components/baseComponents/Label.jsx | 5 ++--- src/components/sections/buffs/Buffs.jsx | 5 ++--- src/components/sections/controls/Controls.jsx | 5 ++--- .../sections/results/table/ResultTable.jsx | 15 +++++---------- .../results/table/ResultTableHeaderRow.jsx | 14 ++++++-------- 9 files changed, 21 insertions(+), 37 deletions(-) diff --git a/package.json b/package.json index bb0ecff14..494a50ab2 100644 --- a/package.json +++ b/package.json @@ -60,7 +60,6 @@ "@mui/material": "^5.16.7", "@reduxjs/toolkit": "^2.2.7", "axios": "^1.7.7", - "classnames": "^2.5.1", "comlink": "^4.4.1", "i18next": "^23.14.0", "js-yaml": "^4.1.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index d92051a9d..3560926e1 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -41,9 +41,6 @@ dependencies: axios: specifier: ^1.7.7 version: 1.7.7 - classnames: - specifier: ^2.5.1 - version: 2.5.1 comlink: specifier: ^4.4.1 version: 4.4.1 diff --git a/src/components/baseComponents/AffixesSelect.jsx b/src/components/baseComponents/AffixesSelect.jsx index 26c0a8363..851dfacbf 100644 --- a/src/components/baseComponents/AffixesSelect.jsx +++ b/src/components/baseComponents/AffixesSelect.jsx @@ -2,7 +2,6 @@ import { CreateItem, Item } from '@discretize/gw2-ui-new'; import CheckIcon from '@mui/icons-material/Check'; import { Box, Chip, Divider, TextField, Typography } from '@mui/material'; import Autocomplete from '@mui/material/Autocomplete'; -import classNames from 'classnames'; import React from 'react'; import { useTranslation } from 'react-i18next'; import { makeStyles } from 'tss-react/mui'; @@ -45,7 +44,7 @@ const useStyles = makeStyles()((theme) => ({ })); const AffixesSelect = ({ name, multiple, onChange, value: affixes }) => { - const { classes } = useStyles(); + const { classes, cx } = useStyles(); const { t } = useTranslation(); @@ -81,7 +80,7 @@ const AffixesSelect = ({ name, multiple, onChange, value: affixes }) => { renderOption={({ className, ...prop }, option) => (
  • {multiple && ( diff --git a/src/components/baseComponents/ExtrasMultiselect.jsx b/src/components/baseComponents/ExtrasMultiselect.jsx index 2b83ff062..10bac5695 100644 --- a/src/components/baseComponents/ExtrasMultiselect.jsx +++ b/src/components/baseComponents/ExtrasMultiselect.jsx @@ -3,7 +3,6 @@ import { Item } from '@discretize/gw2-ui-new'; import CheckIcon from '@mui/icons-material/Check'; import { Box, Chip, Divider, ListItemText, TextField, Typography } from '@mui/material'; import Autocomplete from '@mui/material/Autocomplete'; -import classNames from 'classnames'; import { useTranslation } from 'react-i18next'; import React from 'react'; import { useDispatch, useSelector } from 'react-redux'; @@ -37,7 +36,7 @@ const useStyles = makeStyles()((theme) => ({ })); const ExtrasSelect = ({ type, label, modifierData, modifierDataById: data }) => { - const { classes } = useStyles(); + const { classes, cx } = useStyles(); const dispatch = useDispatch(); const { t } = useTranslation(); // const { language } = useI18next(); @@ -82,7 +81,7 @@ const ExtrasSelect = ({ type, label, modifierData, modifierDataById: data }) => ); }} renderOption={({ className, ...prop }, id) => ( -
  • +
  • {currentIds.includes(id) && } diff --git a/src/components/baseComponents/Label.jsx b/src/components/baseComponents/Label.jsx index 98fbcd520..b00938d1b 100644 --- a/src/components/baseComponents/Label.jsx +++ b/src/components/baseComponents/Label.jsx @@ -1,4 +1,3 @@ -import classNames from 'classnames'; import { makeStyles } from 'tss-react/mui'; const useStyles = makeStyles()((theme) => ({ @@ -18,8 +17,8 @@ const useStyles = makeStyles()((theme) => ({ })); function Label({ className, children }) { - const { classes } = useStyles(); - return {children}; + const { classes, cx } = useStyles(); + return {children}; } export default Label; diff --git a/src/components/sections/buffs/Buffs.jsx b/src/components/sections/buffs/Buffs.jsx index ed5a6ad2a..07d230ae2 100644 --- a/src/components/sections/buffs/Buffs.jsx +++ b/src/components/sections/buffs/Buffs.jsx @@ -1,7 +1,6 @@ import { Boon, CommonEffect, Condition, Skill, Trait } from '@discretize/gw2-ui-new'; import { firstUppercase } from '@discretize/react-discretize-components'; import { Box, FormControl, FormGroup, FormLabel, Grid, Typography } from '@mui/material'; -import classNames from 'classnames'; import { useTranslation } from 'react-i18next'; import { useDispatch, useSelector } from 'react-redux'; import { makeStyles } from 'tss-react/mui'; @@ -31,7 +30,7 @@ const useStyles = makeStyles()((theme) => ({ })); const Buffs = () => { - const { classes } = useStyles(); + const { classes, cx } = useStyles(); const dispatch = useDispatch(); const { t } = useTranslation(); @@ -83,7 +82,7 @@ const Buffs = () => { { // i18next-extract-mark-context-next-line {{buffText}} diff --git a/src/components/sections/controls/Controls.jsx b/src/components/sections/controls/Controls.jsx index 2419d9370..7c5097f9a 100644 --- a/src/components/sections/controls/Controls.jsx +++ b/src/components/sections/controls/Controls.jsx @@ -5,7 +5,6 @@ import EqualizerRoundedIcon from '@mui/icons-material/EqualizerRounded'; import ErrorIcon from '@mui/icons-material/Error'; import HourglassEmptyIcon from '@mui/icons-material/HourglassEmpty'; import { Box, Button, Chip, Typography } from '@mui/material'; -import classNames from 'classnames'; import React from 'react'; import { Trans, useTranslation } from 'react-i18next'; import { useDispatch, useSelector, useStore } from 'react-redux'; @@ -43,7 +42,7 @@ const useStyles = makeStyles()((theme) => ({ })); const ControlsBox = () => { - const { classes } = useStyles(); + const { classes, cx } = useStyles(); const dispatch = useDispatch(); const { t } = useTranslation(); const store = useStore(); @@ -141,7 +140,7 @@ const ControlsBox = () => { onClick={onStopCalculate} disabled={status !== RUNNING} > - + Stop diff --git a/src/components/sections/results/table/ResultTable.jsx b/src/components/sections/results/table/ResultTable.jsx index cae2c25dc..4f3d62891 100644 --- a/src/components/sections/results/table/ResultTable.jsx +++ b/src/components/sections/results/table/ResultTable.jsx @@ -4,7 +4,6 @@ import Table from '@mui/material/Table'; import TableBody from '@mui/material/TableBody'; import TableContainer from '@mui/material/TableContainer'; import TableHead from '@mui/material/TableHead'; -import classNames from 'classnames'; import React from 'react'; import { useTranslation } from 'react-i18next'; import { useSelector } from 'react-redux'; @@ -76,7 +75,7 @@ const mode = (array) => { const emptyArray = []; const StickyHeadTable = () => { - const { classes } = useStyles(); + const { classes, cx } = useStyles(); const { t } = useTranslation(); const selectedCharacter = useSelector(getSelectedCharacter); @@ -165,15 +164,13 @@ const StickyHeadTable = () => { <> {
    { { const { t } = useTranslation(); - const emptyCell = ( - - ); + const emptyCell = ; const padCellArray = (minLength, array) => { const resultArray = array.length < minLength @@ -61,7 +59,7 @@ const ResultTableHeaderRow = ({ maxSlotsLength, Slots[weaponType].map((slot) => ( @@ -73,7 +71,7 @@ const ResultTableHeaderRow = ({ 2, Object.keys(infusions).map((type) => ( @@ -88,7 +86,7 @@ const ResultTableHeaderRow = ({ .filter((type) => displayExtras[type]) .map((type) => ( @@ -99,7 +97,7 @@ const ResultTableHeaderRow = ({ {displayAttributes.map((attribute) => (