R: Remove redundant useCallback
Some checks are pending
Frontend CI / build (22.x) (push) Waiting to run

This commit is contained in:
Ivan 2025-02-05 01:27:52 +03:00
parent 0ad1e4f872
commit 507faf4689
12 changed files with 72 additions and 118 deletions

View File

@ -1,7 +1,5 @@
'use client'; 'use client';
import { useCallback } from 'react';
import { PolicyIcon } from '@/components/DomainIcons'; import { PolicyIcon } from '@/components/DomainIcons';
import { CProps } from '@/components/props'; import { CProps } from '@/components/props';
import Dropdown from '@/components/ui/Dropdown'; import Dropdown from '@/components/ui/Dropdown';
@ -23,15 +21,12 @@ interface SelectAccessPolicyProps extends CProps.Styling {
function SelectAccessPolicy({ value, disabled, stretchLeft, onChange, ...restProps }: SelectAccessPolicyProps) { function SelectAccessPolicy({ value, disabled, stretchLeft, onChange, ...restProps }: SelectAccessPolicyProps) {
const menu = useDropdown(); const menu = useDropdown();
const handleChange = useCallback( function handleChange(newValue: AccessPolicy) {
(newValue: AccessPolicy) => {
menu.hide(); menu.hide();
if (newValue !== value) { if (newValue !== value) {
onChange(newValue); onChange(newValue);
} }
}, }
[menu, value, onChange]
);
return ( return (
<div ref={menu.ref} {...restProps}> <div ref={menu.ref} {...restProps}>

View File

@ -1,7 +1,5 @@
'use client'; 'use client';
import { useCallback } from 'react';
import { DependencyIcon } from '@/components/DomainIcons'; import { DependencyIcon } from '@/components/DomainIcons';
import { CProps } from '@/components/props'; import { CProps } from '@/components/props';
import Dropdown from '@/components/ui/Dropdown'; import Dropdown from '@/components/ui/Dropdown';
@ -23,13 +21,10 @@ function SelectGraphFilter({ value, dense, onChange, ...restProps }: SelectGraph
const menu = useDropdown(); const menu = useDropdown();
const size = useWindowSize(); const size = useWindowSize();
const handleChange = useCallback( function handleChange(newValue: DependencyMode) {
(newValue: DependencyMode) => {
menu.hide(); menu.hide();
onChange(newValue); onChange(newValue);
}, }
[menu, onChange]
);
return ( return (
<div ref={menu.ref} {...restProps}> <div ref={menu.ref} {...restProps}>

View File

@ -1,7 +1,6 @@
'use client'; 'use client';
import clsx from 'clsx'; import clsx from 'clsx';
import { useCallback } from 'react';
import { IconFolderTree } from '@/components/Icons'; import { IconFolderTree } from '@/components/Icons';
import { CProps } from '@/components/props'; import { CProps } from '@/components/props';
@ -28,15 +27,12 @@ function SelectLocationContext({
}: SelectLocationContextProps) { }: SelectLocationContextProps) {
const menu = useDropdown(); const menu = useDropdown();
const handleClick = useCallback( function handleClick(event: CProps.EventMouse, newValue: string) {
(event: CProps.EventMouse, newValue: string) => {
event.preventDefault(); event.preventDefault();
event.stopPropagation(); event.stopPropagation();
menu.hide(); menu.hide();
onChange(newValue); onChange(newValue);
}, }
[menu, onChange]
);
return ( return (
<div ref={menu.ref} className='h-full text-right self-start mt-[-0.25rem] ml-[-1.5rem]'> <div ref={menu.ref} className='h-full text-right self-start mt-[-0.25rem] ml-[-1.5rem]'>

View File

@ -1,7 +1,6 @@
'use client'; 'use client';
import clsx from 'clsx'; import clsx from 'clsx';
import { useCallback } from 'react';
import { LocationIcon } from '@/components/DomainIcons'; import { LocationIcon } from '@/components/DomainIcons';
import { CProps } from '@/components/props'; import { CProps } from '@/components/props';
@ -22,13 +21,10 @@ interface SelectLocationHeadProps extends CProps.Styling {
function SelectLocationHead({ value, excluded = [], onChange, className, ...restProps }: SelectLocationHeadProps) { function SelectLocationHead({ value, excluded = [], onChange, className, ...restProps }: SelectLocationHeadProps) {
const menu = useDropdown(); const menu = useDropdown();
const handleChange = useCallback( function handleChange(newValue: LocationHead) {
(newValue: LocationHead) => {
menu.hide(); menu.hide();
onChange(newValue); onChange(newValue);
}, }
[menu, onChange]
);
return ( return (
<div ref={menu.ref} className={clsx('h-full text-right', className)} {...restProps}> <div ref={menu.ref} className={clsx('h-full text-right', className)} {...restProps}>

View File

@ -1,7 +1,5 @@
'use client'; 'use client';
import { useCallback } from 'react';
import { MatchModeIcon } from '@/components/DomainIcons'; import { MatchModeIcon } from '@/components/DomainIcons';
import { CProps } from '@/components/props'; import { CProps } from '@/components/props';
import Dropdown from '@/components/ui/Dropdown'; import Dropdown from '@/components/ui/Dropdown';
@ -23,13 +21,10 @@ function SelectMatchMode({ value, dense, onChange, ...restProps }: SelectMatchMo
const menu = useDropdown(); const menu = useDropdown();
const size = useWindowSize(); const size = useWindowSize();
const handleChange = useCallback( function handleChange(newValue: CstMatchMode) {
(newValue: CstMatchMode) => {
menu.hide(); menu.hide();
onChange(newValue); onChange(newValue);
}, }
[menu, onChange]
);
return ( return (
<div ref={menu.ref} {...restProps}> <div ref={menu.ref} {...restProps}>

View File

@ -1,7 +1,6 @@
'use client'; 'use client';
import clsx from 'clsx'; import clsx from 'clsx';
import { useCallback } from 'react';
import { CProps } from '@/components/props'; import { CProps } from '@/components/props';
import WordformButton from '@/dialogs/DlgEditReference/WordformButton'; import WordformButton from '@/dialogs/DlgEditReference/WordformButton';
@ -15,12 +14,9 @@ interface SelectWordFormProps extends CProps.Styling {
} }
function SelectWordForm({ value, onChange, className, ...restProps }: SelectWordFormProps) { function SelectWordForm({ value, onChange, className, ...restProps }: SelectWordFormProps) {
const handleSelect = useCallback( function handleSelect(grams: Grammeme[]) {
(grams: Grammeme[]) => {
onChange(SelectorGrammemes.filter(({ value }) => grams.includes(value as Grammeme))); onChange(SelectorGrammemes.filter(({ value }) => grams.includes(value as Grammeme)));
}, }
[onChange]
);
return ( return (
<div className={clsx('text-xs sm:text-sm', className)} {...restProps}> <div className={clsx('text-xs sm:text-sm', className)} {...restProps}>

View File

@ -1,5 +1,4 @@
import clsx from 'clsx'; import clsx from 'clsx';
import { useCallback } from 'react';
import { import {
IconGraphCollapse, IconGraphCollapse,
@ -35,20 +34,14 @@ function ToolbarGraphSelection({
emptySelection, emptySelection,
...restProps ...restProps
}: ToolbarGraphSelectionProps) { }: ToolbarGraphSelectionProps) {
const handleSelectCore = useCallback(() => { function handleSelectCore() {
const core = [...graph.nodes.keys()].filter(isCore); const core = [...graph.nodes.keys()].filter(isCore);
onChange([...core, ...graph.expandInputs(core)]); onChange([...core, ...graph.expandInputs(core)]);
}, [onChange, graph, isCore]); }
const handleSelectOwned = useCallback( function handleSelectOwned() {
() => (isOwned ? onChange([...graph.nodes.keys()].filter(isOwned)) : undefined), if (isOwned) onChange([...graph.nodes.keys()].filter(isOwned));
[onChange, graph, isOwned] }
);
const handleInvertSelection = useCallback(
() => onChange([...graph.nodes.keys()].filter(item => !selected.includes(item))),
[onChange, selected, graph]
);
return ( return (
<div className={clsx('cc-icons', className)} {...restProps}> <div className={clsx('cc-icons', className)} {...restProps}>
@ -91,7 +84,7 @@ function ToolbarGraphSelection({
<MiniButton <MiniButton
titleHtml='Инвертировать' titleHtml='Инвертировать'
icon={<IconGraphInverse size='1.25rem' className='icon-primary' />} icon={<IconGraphInverse size='1.25rem' className='icon-primary' />}
onClick={handleInvertSelection} onClick={() => onChange([...graph.nodes.keys()].filter(item => !selected.includes(item)))}
/> />
<MiniButton <MiniButton
titleHtml='Выделить ядро' titleHtml='Выделить ядро'

View File

@ -1,7 +1,6 @@
'use client'; 'use client';
import clsx from 'clsx'; import clsx from 'clsx';
import { useCallback } from 'react';
import { IconMenuFold, IconMenuUnfold } from '@/components/Icons'; import { IconMenuFold, IconMenuUnfold } from '@/components/Icons';
import Button from '@/components/ui/Button'; import Button from '@/components/ui/Button';
@ -22,13 +21,10 @@ function TopicsDropdown({ activeTopic, onChangeTopic }: TopicsDropdownProps) {
const noNavigation = useAppLayoutStore(state => state.noNavigation); const noNavigation = useAppLayoutStore(state => state.noNavigation);
const treeHeight = useFitHeight('4rem + 2px'); const treeHeight = useFitHeight('4rem + 2px');
const handleSelectTopic = useCallback( function handleSelectTopic(topic: HelpTopic) {
(topic: HelpTopic) => {
menu.hide(); menu.hide();
onChangeTopic(topic); onChangeTopic(topic);
}, }
[onChangeTopic, menu]
);
return ( return (
<div <div

View File

@ -1,6 +1,6 @@
'use client'; 'use client';
import { useCallback, useEffect, useRef, useState } from 'react'; import { useEffect, useRef, useState } from 'react';
import { useMutatingOss } from '@/backend/oss/useMutatingOss'; import { useMutatingOss } from '@/backend/oss/useMutatingOss';
import { import {
@ -75,48 +75,48 @@ function NodeContextMenu({
return true; return true;
})(); })();
const handleHide = useCallback(() => { function handleHide() {
setIsOpen(false); setIsOpen(false);
onHide(); onHide();
}, [onHide]); }
useClickedOutside(isOpen, ref, handleHide); useClickedOutside(isOpen, ref, handleHide);
useEffect(() => setIsOpen(true), []); useEffect(() => setIsOpen(true), []);
const handleOpenSchema = () => { function handleOpenSchema() {
controller.navigateOperationSchema(operation.id); controller.navigateOperationSchema(operation.id);
}; }
const handleEditSchema = () => { function handleEditSchema() {
handleHide(); handleHide();
onEditSchema(operation.id); onEditSchema(operation.id);
}; }
const handleEditOperation = () => { function handleEditOperation() {
handleHide(); handleHide();
onEditOperation(operation.id); onEditOperation(operation.id);
}; }
const handleDeleteOperation = () => { function handleDeleteOperation() {
handleHide(); handleHide();
onDelete(operation.id); onDelete(operation.id);
}; }
const handleCreateSchema = () => { function handleCreateSchema() {
handleHide(); handleHide();
onCreateInput(operation.id); onCreateInput(operation.id);
}; }
const handleRunSynthesis = () => { function handleRunSynthesis() {
handleHide(); handleHide();
onExecuteOperation(operation.id); onExecuteOperation(operation.id);
}; }
const handleRelocateConstituents = () => { function handleRelocateConstituents() {
handleHide(); handleHide();
onRelocateConstituents(operation.id); onRelocateConstituents(operation.id);
}; }
return ( return (
<div ref={ref} className='absolute select-none' style={{ top: cursorY, left: cursorX }}> <div ref={ref} className='absolute select-none' style={{ top: cursorY, left: cursorX }}>

View File

@ -1,7 +1,7 @@
'use client'; 'use client';
import { toPng } from 'html-to-image'; import { toPng } from 'html-to-image';
import { useCallback, useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { toast } from 'react-toastify'; import { toast } from 'react-toastify';
import { import {
Background, Background,
@ -65,16 +65,13 @@ function OssFlow() {
const [toggleReset, setToggleReset] = useState(false); const [toggleReset, setToggleReset] = useState(false);
const [menuProps, setMenuProps] = useState<ContextMenuData | undefined>(undefined); const [menuProps, setMenuProps] = useState<ContextMenuData | undefined>(undefined);
const onSelectionChange = useCallback( function onSelectionChange({ nodes }: { nodes: Node[] }) {
({ nodes }: { nodes: Node[] }) => {
const ids = nodes.map(node => Number(node.id)); const ids = nodes.map(node => Number(node.id));
controller.setSelected(prev => [ controller.setSelected(prev => [
...prev.filter(nodeID => ids.includes(nodeID)), ...prev.filter(nodeID => ids.includes(nodeID)),
...ids.filter(nodeID => !prev.includes(Number(nodeID))) ...ids.filter(nodeID => !prev.includes(Number(nodeID)))
]); ]);
}, }
[controller]
);
useOnSelectionChange({ useOnSelectionChange({
onChange: onSelectionChange onChange: onSelectionChange

View File

@ -79,17 +79,14 @@ function TGFlow() {
const [needReset, setNeedReset] = useState(true); const [needReset, setNeedReset] = useState(true);
const [toggleResetView, setToggleResetView] = useState(false); const [toggleResetView, setToggleResetView] = useState(false);
const onSelectionChange = useCallback( function onSelectionChange({ nodes }: { nodes: Node[] }) {
({ nodes }: { nodes: Node[] }) => {
const ids = nodes.map(node => Number(node.id)); const ids = nodes.map(node => Number(node.id));
if (ids.length === 0) { if (ids.length === 0) {
controller.setSelected([]); controller.setSelected([]);
} else { } else {
controller.setSelected(prev => [...prev.filter(nodeID => !filteredGraph.hasNode(nodeID)), ...ids]); controller.setSelected(prev => [...prev.filter(nodeID => !filteredGraph.hasNode(nodeID)), ...ids]);
} }
}, }
[controller, filteredGraph]
);
useOnSelectionChange({ useOnSelectionChange({
onChange: onSelectionChange onChange: onSelectionChange

View File

@ -1,7 +1,5 @@
'use client'; 'use client';
import { useCallback } from 'react';
import { IconGraphInputs, IconGraphOutputs, IconReset } from '@/components/Icons'; import { IconGraphInputs, IconGraphOutputs, IconReset } from '@/components/Icons';
import MiniButton from '@/components/ui/MiniButton'; import MiniButton from '@/components/ui/MiniButton';
import { IConstituenta } from '@/models/rsform'; import { IConstituenta } from '@/models/rsform';
@ -29,10 +27,10 @@ function ToolbarFocusedCst({
}: ToolbarFocusedCstProps) { }: ToolbarFocusedCstProps) {
const controller = useRSEdit(); const controller = useRSEdit();
const resetSelection = useCallback(() => { function resetSelection() {
reset(); reset();
controller.setSelected([]); controller.setSelected([]);
}, [reset, controller]); }
return ( return (
<div className='items-center cc-icons'> <div className='items-center cc-icons'>