From 507faf46890e973c84b6e51d3543afa8053da238 Mon Sep 17 00:00:00 2001 From: Ivan <8611739+IRBorisov@users.noreply.github.com> Date: Wed, 5 Feb 2025 01:27:52 +0300 Subject: [PATCH] R: Remove redundant useCallback --- .../components/select/SelectAccessPolicy.tsx | 17 ++++------ .../components/select/SelectGraphFilter.tsx | 13 +++---- .../select/SelectLocationContext.tsx | 16 ++++----- .../components/select/SelectLocationHead.tsx | 12 +++---- .../src/components/select/SelectMatchMode.tsx | 13 +++---- .../src/components/select/SelectWordForm.tsx | 10 ++---- .../select/ToolbarGraphSelection.tsx | 19 ++++------- .../src/pages/ManualsPage/TopicsDropdown.tsx | 12 +++---- .../EditorOssGraph/NodeContextMenu.tsx | 34 +++++++++---------- .../pages/OssPage/EditorOssGraph/OssFlow.tsx | 19 +++++------ .../RSFormPage/EditorTermGraph/TGFlow.tsx | 19 +++++------ .../EditorTermGraph/ToolbarFocusedCst.tsx | 6 ++-- 12 files changed, 72 insertions(+), 118 deletions(-) diff --git a/rsconcept/frontend/src/components/select/SelectAccessPolicy.tsx b/rsconcept/frontend/src/components/select/SelectAccessPolicy.tsx index 9f8e3a50..c81e4296 100644 --- a/rsconcept/frontend/src/components/select/SelectAccessPolicy.tsx +++ b/rsconcept/frontend/src/components/select/SelectAccessPolicy.tsx @@ -1,7 +1,5 @@ 'use client'; -import { useCallback } from 'react'; - import { PolicyIcon } from '@/components/DomainIcons'; import { CProps } from '@/components/props'; import Dropdown from '@/components/ui/Dropdown'; @@ -23,15 +21,12 @@ interface SelectAccessPolicyProps extends CProps.Styling { function SelectAccessPolicy({ value, disabled, stretchLeft, onChange, ...restProps }: SelectAccessPolicyProps) { const menu = useDropdown(); - const handleChange = useCallback( - (newValue: AccessPolicy) => { - menu.hide(); - if (newValue !== value) { - onChange(newValue); - } - }, - [menu, value, onChange] - ); + function handleChange(newValue: AccessPolicy) { + menu.hide(); + if (newValue !== value) { + onChange(newValue); + } + } return (
diff --git a/rsconcept/frontend/src/components/select/SelectGraphFilter.tsx b/rsconcept/frontend/src/components/select/SelectGraphFilter.tsx index 3d7e4d8f..fd2267be 100644 --- a/rsconcept/frontend/src/components/select/SelectGraphFilter.tsx +++ b/rsconcept/frontend/src/components/select/SelectGraphFilter.tsx @@ -1,7 +1,5 @@ 'use client'; -import { useCallback } from 'react'; - import { DependencyIcon } from '@/components/DomainIcons'; import { CProps } from '@/components/props'; import Dropdown from '@/components/ui/Dropdown'; @@ -23,13 +21,10 @@ function SelectGraphFilter({ value, dense, onChange, ...restProps }: SelectGraph const menu = useDropdown(); const size = useWindowSize(); - const handleChange = useCallback( - (newValue: DependencyMode) => { - menu.hide(); - onChange(newValue); - }, - [menu, onChange] - ); + function handleChange(newValue: DependencyMode) { + menu.hide(); + onChange(newValue); + } return (
diff --git a/rsconcept/frontend/src/components/select/SelectLocationContext.tsx b/rsconcept/frontend/src/components/select/SelectLocationContext.tsx index 662042ec..25d86576 100644 --- a/rsconcept/frontend/src/components/select/SelectLocationContext.tsx +++ b/rsconcept/frontend/src/components/select/SelectLocationContext.tsx @@ -1,7 +1,6 @@ 'use client'; import clsx from 'clsx'; -import { useCallback } from 'react'; import { IconFolderTree } from '@/components/Icons'; import { CProps } from '@/components/props'; @@ -28,15 +27,12 @@ function SelectLocationContext({ }: SelectLocationContextProps) { const menu = useDropdown(); - const handleClick = useCallback( - (event: CProps.EventMouse, newValue: string) => { - event.preventDefault(); - event.stopPropagation(); - menu.hide(); - onChange(newValue); - }, - [menu, onChange] - ); + function handleClick(event: CProps.EventMouse, newValue: string) { + event.preventDefault(); + event.stopPropagation(); + menu.hide(); + onChange(newValue); + } return (
diff --git a/rsconcept/frontend/src/components/select/SelectLocationHead.tsx b/rsconcept/frontend/src/components/select/SelectLocationHead.tsx index e5e86b4d..0aa796f9 100644 --- a/rsconcept/frontend/src/components/select/SelectLocationHead.tsx +++ b/rsconcept/frontend/src/components/select/SelectLocationHead.tsx @@ -1,7 +1,6 @@ 'use client'; import clsx from 'clsx'; -import { useCallback } from 'react'; import { LocationIcon } from '@/components/DomainIcons'; import { CProps } from '@/components/props'; @@ -22,13 +21,10 @@ interface SelectLocationHeadProps extends CProps.Styling { function SelectLocationHead({ value, excluded = [], onChange, className, ...restProps }: SelectLocationHeadProps) { const menu = useDropdown(); - const handleChange = useCallback( - (newValue: LocationHead) => { - menu.hide(); - onChange(newValue); - }, - [menu, onChange] - ); + function handleChange(newValue: LocationHead) { + menu.hide(); + onChange(newValue); + } return (
diff --git a/rsconcept/frontend/src/components/select/SelectMatchMode.tsx b/rsconcept/frontend/src/components/select/SelectMatchMode.tsx index 11fe79a3..cdecce64 100644 --- a/rsconcept/frontend/src/components/select/SelectMatchMode.tsx +++ b/rsconcept/frontend/src/components/select/SelectMatchMode.tsx @@ -1,7 +1,5 @@ 'use client'; -import { useCallback } from 'react'; - import { MatchModeIcon } from '@/components/DomainIcons'; import { CProps } from '@/components/props'; import Dropdown from '@/components/ui/Dropdown'; @@ -23,13 +21,10 @@ function SelectMatchMode({ value, dense, onChange, ...restProps }: SelectMatchMo const menu = useDropdown(); const size = useWindowSize(); - const handleChange = useCallback( - (newValue: CstMatchMode) => { - menu.hide(); - onChange(newValue); - }, - [menu, onChange] - ); + function handleChange(newValue: CstMatchMode) { + menu.hide(); + onChange(newValue); + } return (
diff --git a/rsconcept/frontend/src/components/select/SelectWordForm.tsx b/rsconcept/frontend/src/components/select/SelectWordForm.tsx index e7129968..6e0f79bb 100644 --- a/rsconcept/frontend/src/components/select/SelectWordForm.tsx +++ b/rsconcept/frontend/src/components/select/SelectWordForm.tsx @@ -1,7 +1,6 @@ 'use client'; import clsx from 'clsx'; -import { useCallback } from 'react'; import { CProps } from '@/components/props'; import WordformButton from '@/dialogs/DlgEditReference/WordformButton'; @@ -15,12 +14,9 @@ interface SelectWordFormProps extends CProps.Styling { } function SelectWordForm({ value, onChange, className, ...restProps }: SelectWordFormProps) { - const handleSelect = useCallback( - (grams: Grammeme[]) => { - onChange(SelectorGrammemes.filter(({ value }) => grams.includes(value as Grammeme))); - }, - [onChange] - ); + function handleSelect(grams: Grammeme[]) { + onChange(SelectorGrammemes.filter(({ value }) => grams.includes(value as Grammeme))); + } return (
diff --git a/rsconcept/frontend/src/components/select/ToolbarGraphSelection.tsx b/rsconcept/frontend/src/components/select/ToolbarGraphSelection.tsx index ca1c7707..e4ce8fe3 100644 --- a/rsconcept/frontend/src/components/select/ToolbarGraphSelection.tsx +++ b/rsconcept/frontend/src/components/select/ToolbarGraphSelection.tsx @@ -1,5 +1,4 @@ import clsx from 'clsx'; -import { useCallback } from 'react'; import { IconGraphCollapse, @@ -35,20 +34,14 @@ function ToolbarGraphSelection({ emptySelection, ...restProps }: ToolbarGraphSelectionProps) { - const handleSelectCore = useCallback(() => { + function handleSelectCore() { const core = [...graph.nodes.keys()].filter(isCore); onChange([...core, ...graph.expandInputs(core)]); - }, [onChange, graph, isCore]); + } - const handleSelectOwned = useCallback( - () => (isOwned ? onChange([...graph.nodes.keys()].filter(isOwned)) : undefined), - [onChange, graph, isOwned] - ); - - const handleInvertSelection = useCallback( - () => onChange([...graph.nodes.keys()].filter(item => !selected.includes(item))), - [onChange, selected, graph] - ); + function handleSelectOwned() { + if (isOwned) onChange([...graph.nodes.keys()].filter(isOwned)); + } return (
@@ -91,7 +84,7 @@ function ToolbarGraphSelection({ } - onClick={handleInvertSelection} + onClick={() => onChange([...graph.nodes.keys()].filter(item => !selected.includes(item)))} /> state.noNavigation); const treeHeight = useFitHeight('4rem + 2px'); - const handleSelectTopic = useCallback( - (topic: HelpTopic) => { - menu.hide(); - onChangeTopic(topic); - }, - [onChangeTopic, menu] - ); + function handleSelectTopic(topic: HelpTopic) { + menu.hide(); + onChangeTopic(topic); + } return (
{ + function handleHide() { setIsOpen(false); onHide(); - }, [onHide]); + } useClickedOutside(isOpen, ref, handleHide); useEffect(() => setIsOpen(true), []); - const handleOpenSchema = () => { + function handleOpenSchema() { controller.navigateOperationSchema(operation.id); - }; + } - const handleEditSchema = () => { + function handleEditSchema() { handleHide(); onEditSchema(operation.id); - }; + } - const handleEditOperation = () => { + function handleEditOperation() { handleHide(); onEditOperation(operation.id); - }; + } - const handleDeleteOperation = () => { + function handleDeleteOperation() { handleHide(); onDelete(operation.id); - }; + } - const handleCreateSchema = () => { + function handleCreateSchema() { handleHide(); onCreateInput(operation.id); - }; + } - const handleRunSynthesis = () => { + function handleRunSynthesis() { handleHide(); onExecuteOperation(operation.id); - }; + } - const handleRelocateConstituents = () => { + function handleRelocateConstituents() { handleHide(); onRelocateConstituents(operation.id); - }; + } return (
diff --git a/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/OssFlow.tsx b/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/OssFlow.tsx index 7669fdb4..922c74e5 100644 --- a/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/OssFlow.tsx +++ b/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/OssFlow.tsx @@ -1,7 +1,7 @@ 'use client'; import { toPng } from 'html-to-image'; -import { useCallback, useEffect, useState } from 'react'; +import { useEffect, useState } from 'react'; import { toast } from 'react-toastify'; import { Background, @@ -65,16 +65,13 @@ function OssFlow() { const [toggleReset, setToggleReset] = useState(false); const [menuProps, setMenuProps] = useState(undefined); - const onSelectionChange = useCallback( - ({ nodes }: { nodes: Node[] }) => { - const ids = nodes.map(node => Number(node.id)); - controller.setSelected(prev => [ - ...prev.filter(nodeID => ids.includes(nodeID)), - ...ids.filter(nodeID => !prev.includes(Number(nodeID))) - ]); - }, - [controller] - ); + function onSelectionChange({ nodes }: { nodes: Node[] }) { + const ids = nodes.map(node => Number(node.id)); + controller.setSelected(prev => [ + ...prev.filter(nodeID => ids.includes(nodeID)), + ...ids.filter(nodeID => !prev.includes(Number(nodeID))) + ]); + } useOnSelectionChange({ onChange: onSelectionChange diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/TGFlow.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/TGFlow.tsx index aee78c1c..cc2bd19d 100644 --- a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/TGFlow.tsx +++ b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/TGFlow.tsx @@ -79,17 +79,14 @@ function TGFlow() { const [needReset, setNeedReset] = useState(true); const [toggleResetView, setToggleResetView] = useState(false); - const onSelectionChange = useCallback( - ({ nodes }: { nodes: Node[] }) => { - const ids = nodes.map(node => Number(node.id)); - if (ids.length === 0) { - controller.setSelected([]); - } else { - controller.setSelected(prev => [...prev.filter(nodeID => !filteredGraph.hasNode(nodeID)), ...ids]); - } - }, - [controller, filteredGraph] - ); + function onSelectionChange({ nodes }: { nodes: Node[] }) { + const ids = nodes.map(node => Number(node.id)); + if (ids.length === 0) { + controller.setSelected([]); + } else { + controller.setSelected(prev => [...prev.filter(nodeID => !filteredGraph.hasNode(nodeID)), ...ids]); + } + } useOnSelectionChange({ onChange: onSelectionChange diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/ToolbarFocusedCst.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/ToolbarFocusedCst.tsx index 6a955cf7..a065bb7e 100644 --- a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/ToolbarFocusedCst.tsx +++ b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/ToolbarFocusedCst.tsx @@ -1,7 +1,5 @@ 'use client'; -import { useCallback } from 'react'; - import { IconGraphInputs, IconGraphOutputs, IconReset } from '@/components/Icons'; import MiniButton from '@/components/ui/MiniButton'; import { IConstituenta } from '@/models/rsform'; @@ -29,10 +27,10 @@ function ToolbarFocusedCst({ }: ToolbarFocusedCstProps) { const controller = useRSEdit(); - const resetSelection = useCallback(() => { + function resetSelection() { reset(); controller.setSelected([]); - }, [reset, controller]); + } return (