From c7df031041fcd25b3edf8ed3d5cdeffe35e9eb1a Mon Sep 17 00:00:00 2001
From: Ivan <8611739+IRBorisov@users.noreply.github.com>
Date: Thu, 21 Nov 2024 00:26:04 +0300
Subject: [PATCH] R: Decouple setters from onChange events

---
 .../components/select/SelectMultiGrammeme.tsx |  6 ++--
 .../src/components/ui/DataTable/DataTable.tsx |  4 +--
 .../src/components/ui/DataTable/SelectAll.tsx |  6 ++--
 .../src/components/ui/DataTable/SelectRow.tsx |  6 ++--
 .../src/components/ui/DataTable/TableBody.tsx | 10 +++---
 .../components/ui/DataTable/TableHeader.tsx   |  6 ++--
 .../DlgCreateOperation/DlgCreateOperation.tsx | 16 ++++-----
 .../DlgCreateOperation/TabInputOperation.tsx  | 36 +++++++++----------
 .../TabSynthesisOperation.tsx                 | 18 +++++-----
 .../DlgEditOperation/DlgEditOperation.tsx     |  6 ++--
 .../dialogs/DlgEditOperation/TabOperation.tsx | 14 ++++----
 .../DlgEditReference/DlgEditReference.tsx     |  9 +++--
 .../DlgEditReference/TabEntityReference.tsx   | 14 ++++----
 .../TabSyntacticReference.tsx                 | 12 +++----
 .../DlgEditWordForms/DlgEditWordForms.tsx     |  2 +-
 .../src/pages/LibraryPage/LibraryPage.tsx     | 12 +++----
 .../src/pages/LibraryPage/ToolbarSearch.tsx   | 26 +++++++-------
 .../pages/LibraryPage/ViewSideLocation.tsx    | 22 ++++++------
 .../OssPage/EditorOssCard/EditorOssCard.tsx   |  2 +-
 .../pages/OssPage/EditorOssCard/FormOSS.tsx   |  2 +-
 .../OssPage/EditorOssGraph/EditorOssGraph.tsx |  2 +-
 .../pages/OssPage/EditorOssGraph/OssFlow.tsx  |  2 +-
 .../src/pages/OssPage/OssEditContext.tsx      |  2 +-
 .../EditorConstituenta/EditorConstituenta.tsx |  2 +-
 .../EditorConstituenta/FormConstituenta.tsx   |  8 ++---
 .../EditorRSExpression/EditorRSExpression.tsx | 20 +++++------
 .../EditorRSFormCard/EditorRSFormCard.tsx     |  2 +-
 .../EditorRSFormCard/FormRSForm.tsx           |  2 +-
 28 files changed, 138 insertions(+), 131 deletions(-)

diff --git a/rsconcept/frontend/src/components/select/SelectMultiGrammeme.tsx b/rsconcept/frontend/src/components/select/SelectMultiGrammeme.tsx
index fe8f89ca..6ed16afb 100644
--- a/rsconcept/frontend/src/components/select/SelectMultiGrammeme.tsx
+++ b/rsconcept/frontend/src/components/select/SelectMultiGrammeme.tsx
@@ -11,11 +11,11 @@ interface SelectMultiGrammemeProps
   extends Omit<SelectMultiProps<IGrammemeOption>, 'value' | 'onChange'>,
     CProps.Styling {
   value: IGrammemeOption[];
-  setValue: React.Dispatch<React.SetStateAction<IGrammemeOption[]>>;
+  onChangeValue: (newValue: IGrammemeOption[]) => void;
   placeholder?: string;
 }
 
-function SelectMultiGrammeme({ value, setValue, ...restProps }: SelectMultiGrammemeProps) {
+function SelectMultiGrammeme({ value, onChangeValue, ...restProps }: SelectMultiGrammemeProps) {
   const [options, setOptions] = useState<IGrammemeOption[]>([]);
 
   useEffect(() => {
@@ -29,7 +29,7 @@ function SelectMultiGrammeme({ value, setValue, ...restProps }: SelectMultiGramm
     <SelectMulti
       options={options}
       value={value}
-      onChange={newValue => setValue([...newValue].sort(compareGrammemeOptions))}
+      onChange={newValue => onChangeValue([...newValue].sort(compareGrammemeOptions))}
       {...restProps}
     />
   );
diff --git a/rsconcept/frontend/src/components/ui/DataTable/DataTable.tsx b/rsconcept/frontend/src/components/ui/DataTable/DataTable.tsx
index 186d1320..444ace30 100644
--- a/rsconcept/frontend/src/components/ui/DataTable/DataTable.tsx
+++ b/rsconcept/frontend/src/components/ui/DataTable/DataTable.tsx
@@ -157,7 +157,7 @@ function DataTable<TData extends RowData>({
             enableRowSelection={enableRowSelection}
             enableSorting={enableSorting}
             headPosition={headPosition}
-            setLastSelected={setLastSelected}
+            resetLastSelected={() => setLastSelected(undefined)}
           />
         ) : null}
 
@@ -168,7 +168,7 @@ function DataTable<TData extends RowData>({
           conditionalRowStyles={conditionalRowStyles}
           enableRowSelection={enableRowSelection}
           lastSelected={lastSelected}
-          setLastSelected={setLastSelected}
+          onChangeLastSelected={setLastSelected}
           onRowClicked={onRowClicked}
           onRowDoubleClicked={onRowDoubleClicked}
         />
diff --git a/rsconcept/frontend/src/components/ui/DataTable/SelectAll.tsx b/rsconcept/frontend/src/components/ui/DataTable/SelectAll.tsx
index c7da72bd..11ff2b21 100644
--- a/rsconcept/frontend/src/components/ui/DataTable/SelectAll.tsx
+++ b/rsconcept/frontend/src/components/ui/DataTable/SelectAll.tsx
@@ -4,12 +4,12 @@ import CheckboxTristate from '@/components/ui/CheckboxTristate';
 
 interface SelectAllProps<TData> {
   table: Table<TData>;
-  setLastSelected: React.Dispatch<React.SetStateAction<string | undefined>>;
+  resetLastSelected: () => void;
 }
 
-function SelectAll<TData>({ table, setLastSelected }: SelectAllProps<TData>) {
+function SelectAll<TData>({ table, resetLastSelected }: SelectAllProps<TData>) {
   function handleChange(value: boolean | null) {
-    setLastSelected(undefined);
+    resetLastSelected();
     table.toggleAllPageRowsSelected(value !== false);
   }
 
diff --git a/rsconcept/frontend/src/components/ui/DataTable/SelectRow.tsx b/rsconcept/frontend/src/components/ui/DataTable/SelectRow.tsx
index b0a673c2..57135c4f 100644
--- a/rsconcept/frontend/src/components/ui/DataTable/SelectRow.tsx
+++ b/rsconcept/frontend/src/components/ui/DataTable/SelectRow.tsx
@@ -4,12 +4,12 @@ import Checkbox from '@/components/ui/Checkbox';
 
 interface SelectRowProps<TData> {
   row: Row<TData>;
-  setLastSelected: React.Dispatch<React.SetStateAction<string | undefined>>;
+  onChangeLastSelected: (newValue: string | undefined) => void;
 }
 
-function SelectRow<TData>({ row, setLastSelected }: SelectRowProps<TData>) {
+function SelectRow<TData>({ row, onChangeLastSelected }: SelectRowProps<TData>) {
   function handleChange(value: boolean) {
-    setLastSelected(row.id);
+    onChangeLastSelected(row.id);
     row.toggleSelected(value);
   }
 
diff --git a/rsconcept/frontend/src/components/ui/DataTable/TableBody.tsx b/rsconcept/frontend/src/components/ui/DataTable/TableBody.tsx
index 0bb3ce55..8fa11dbf 100644
--- a/rsconcept/frontend/src/components/ui/DataTable/TableBody.tsx
+++ b/rsconcept/frontend/src/components/ui/DataTable/TableBody.tsx
@@ -14,7 +14,7 @@ interface TableBodyProps<TData> {
   conditionalRowStyles?: IConditionalStyle<TData>[];
 
   lastSelected: string | undefined;
-  setLastSelected: React.Dispatch<React.SetStateAction<string | undefined>>;
+  onChangeLastSelected: (newValue: string | undefined) => void;
 
   onRowClicked?: (rowData: TData, event: CProps.EventMouse) => void;
   onRowDoubleClicked?: (rowData: TData, event: CProps.EventMouse) => void;
@@ -27,7 +27,7 @@ function TableBody<TData>({
   enableRowSelection,
   conditionalRowStyles,
   lastSelected,
-  setLastSelected,
+  onChangeLastSelected,
   onRowClicked,
   onRowDoubleClicked
 }: TableBodyProps<TData>) {
@@ -49,9 +49,9 @@ function TableBody<TData>({
           newSelection[row.id] = !target.getIsSelected();
         });
         table.setRowSelection(prev => ({ ...prev, ...newSelection }));
-        setLastSelected(undefined);
+        onChangeLastSelected(undefined);
       } else {
-        setLastSelected(target.id);
+        onChangeLastSelected(target.id);
         target.toggleSelected(!target.getIsSelected());
       }
     }
@@ -83,7 +83,7 @@ function TableBody<TData>({
         >
           {enableRowSelection ? (
             <td key={`select-${row.id}`} className='pl-3 pr-1 align-middle border-y'>
-              <SelectRow row={row} setLastSelected={setLastSelected} />
+              <SelectRow row={row} onChangeLastSelected={onChangeLastSelected} />
             </td>
           ) : null}
           {row.getVisibleCells().map((cell: Cell<TData, unknown>) => (
diff --git a/rsconcept/frontend/src/components/ui/DataTable/TableHeader.tsx b/rsconcept/frontend/src/components/ui/DataTable/TableHeader.tsx
index 4995217d..0f8ad7c6 100644
--- a/rsconcept/frontend/src/components/ui/DataTable/TableHeader.tsx
+++ b/rsconcept/frontend/src/components/ui/DataTable/TableHeader.tsx
@@ -8,7 +8,7 @@ interface TableHeaderProps<TData> {
   headPosition?: string;
   enableRowSelection?: boolean;
   enableSorting?: boolean;
-  setLastSelected: React.Dispatch<React.SetStateAction<string | undefined>>;
+  resetLastSelected: () => void;
 }
 
 function TableHeader<TData>({
@@ -16,7 +16,7 @@ function TableHeader<TData>({
   headPosition,
   enableRowSelection,
   enableSorting,
-  setLastSelected
+  resetLastSelected
 }: TableHeaderProps<TData>) {
   return (
     <thead
@@ -30,7 +30,7 @@ function TableHeader<TData>({
         <tr key={headerGroup.id}>
           {enableRowSelection ? (
             <th className='pl-3 pr-1 align-middle'>
-              <SelectAll table={table} setLastSelected={setLastSelected} />
+              <SelectAll table={table} resetLastSelected={resetLastSelected} />
             </th>
           ) : null}
           {headerGroup.headers.map((header: Header<TData, unknown>) => (
diff --git a/rsconcept/frontend/src/dialogs/DlgCreateOperation/DlgCreateOperation.tsx b/rsconcept/frontend/src/dialogs/DlgCreateOperation/DlgCreateOperation.tsx
index 148c5aff..6bc6e600 100644
--- a/rsconcept/frontend/src/dialogs/DlgCreateOperation/DlgCreateOperation.tsx
+++ b/rsconcept/frontend/src/dialogs/DlgCreateOperation/DlgCreateOperation.tsx
@@ -103,15 +103,15 @@ function DlgCreateOperation({ hideWindow, oss, onCreate, initialInputs }: DlgCre
         <TabInputOperation
           oss={oss}
           alias={alias}
-          setAlias={setAlias}
+          onChangeAlias={setAlias}
           comment={comment}
-          setComment={setComment}
+          onChangeComment={setComment}
           title={title}
-          setTitle={setTitle}
+          onChangeTitle={setTitle}
           attachedID={attachedID}
-          setAttachedID={setAttachedID}
+          onChangeAttachedID={setAttachedID}
           createSchema={createSchema}
-          setCreateSchema={setCreateSchema}
+          onChangeCreateSchema={setCreateSchema}
         />
       </TabPanel>
     ),
@@ -124,11 +124,11 @@ function DlgCreateOperation({ hideWindow, oss, onCreate, initialInputs }: DlgCre
         <TabSynthesisOperation
           oss={oss}
           alias={alias}
-          setAlias={setAlias}
+          onChangeAlias={setAlias}
           comment={comment}
-          setComment={setComment}
+          onChangeComment={setComment}
           title={title}
-          setTitle={setTitle}
+          onChangeTitle={setTitle}
           inputs={inputs}
           setInputs={setInputs}
         />
diff --git a/rsconcept/frontend/src/dialogs/DlgCreateOperation/TabInputOperation.tsx b/rsconcept/frontend/src/dialogs/DlgCreateOperation/TabInputOperation.tsx
index f2288b8b..3447932f 100644
--- a/rsconcept/frontend/src/dialogs/DlgCreateOperation/TabInputOperation.tsx
+++ b/rsconcept/frontend/src/dialogs/DlgCreateOperation/TabInputOperation.tsx
@@ -18,29 +18,29 @@ import { sortItemsForOSS } from '@/models/ossAPI';
 interface TabInputOperationProps {
   oss: IOperationSchema;
   alias: string;
-  setAlias: React.Dispatch<React.SetStateAction<string>>;
+  onChangeAlias: (newValue: string) => void;
   title: string;
-  setTitle: React.Dispatch<React.SetStateAction<string>>;
+  onChangeTitle: (newValue: string) => void;
   comment: string;
-  setComment: React.Dispatch<React.SetStateAction<string>>;
+  onChangeComment: (newValue: string) => void;
   attachedID: LibraryItemID | undefined;
-  setAttachedID: React.Dispatch<React.SetStateAction<LibraryItemID | undefined>>;
+  onChangeAttachedID: (newValue: LibraryItemID | undefined) => void;
   createSchema: boolean;
-  setCreateSchema: React.Dispatch<React.SetStateAction<boolean>>;
+  onChangeCreateSchema: (newValue: boolean) => void;
 }
 
 function TabInputOperation({
   oss,
   alias,
-  setAlias,
+  onChangeAlias,
   title,
-  setTitle,
+  onChangeTitle,
   comment,
-  setComment,
+  onChangeComment,
   attachedID,
-  setAttachedID,
+  onChangeAttachedID,
   createSchema,
-  setCreateSchema
+  onChangeCreateSchema
 }: TabInputOperationProps) {
   const baseFilter = useCallback((item: ILibraryItem) => !oss.schemas.includes(item.id), [oss]);
   const library = useLibrary();
@@ -48,9 +48,9 @@ function TabInputOperation({
 
   useEffect(() => {
     if (createSchema) {
-      setAttachedID(undefined);
+      onChangeAttachedID(undefined);
     }
-  }, [createSchema, setAttachedID]);
+  }, [createSchema, onChangeAttachedID]);
 
   return (
     <AnimateFade className='cc-column'>
@@ -58,7 +58,7 @@ function TabInputOperation({
         id='operation_title'
         label='Полное название'
         value={title}
-        onChange={event => setTitle(event.target.value)}
+        onChange={event => onChangeTitle(event.target.value)}
         disabled={attachedID !== undefined}
       />
       <div className='flex gap-6'>
@@ -67,7 +67,7 @@ function TabInputOperation({
           label='Сокращение'
           className='w-[16rem]'
           value={alias}
-          onChange={event => setAlias(event.target.value)}
+          onChange={event => onChangeAlias(event.target.value)}
           disabled={attachedID !== undefined}
         />
 
@@ -77,7 +77,7 @@ function TabInputOperation({
           noResize
           rows={3}
           value={comment}
-          onChange={event => setComment(event.target.value)}
+          onChange={event => onChangeComment(event.target.value)}
           disabled={attachedID !== undefined}
         />
       </div>
@@ -90,13 +90,13 @@ function TabInputOperation({
             noHover
             noPadding
             icon={<IconReset size='1.25rem' className='icon-primary' />}
-            onClick={() => setAttachedID(undefined)}
+            onClick={() => onChangeAttachedID(undefined)}
             disabled={attachedID == undefined}
           />
         </div>
         <Checkbox
           value={createSchema}
-          setValue={setCreateSchema}
+          setValue={onChangeCreateSchema}
           label='Создать новую схему'
           titleHtml='Создать пустую схему для загрузки'
         />
@@ -106,7 +106,7 @@ function TabInputOperation({
           items={sortedItems}
           value={attachedID}
           itemType={LibraryItemType.RSFORM}
-          onSelectValue={setAttachedID}
+          onSelectValue={onChangeAttachedID}
           rows={8}
           baseFilter={baseFilter}
         />
diff --git a/rsconcept/frontend/src/dialogs/DlgCreateOperation/TabSynthesisOperation.tsx b/rsconcept/frontend/src/dialogs/DlgCreateOperation/TabSynthesisOperation.tsx
index a1e4ee67..09a9d727 100644
--- a/rsconcept/frontend/src/dialogs/DlgCreateOperation/TabSynthesisOperation.tsx
+++ b/rsconcept/frontend/src/dialogs/DlgCreateOperation/TabSynthesisOperation.tsx
@@ -10,11 +10,11 @@ import PickMultiOperation from '../../components/select/PickMultiOperation';
 interface TabSynthesisOperationProps {
   oss: IOperationSchema;
   alias: string;
-  setAlias: React.Dispatch<React.SetStateAction<string>>;
+  onChangeAlias: (newValue: string) => void;
   title: string;
-  setTitle: React.Dispatch<React.SetStateAction<string>>;
+  onChangeTitle: (newValue: string) => void;
   comment: string;
-  setComment: React.Dispatch<React.SetStateAction<string>>;
+  onChangeComment: (newValue: string) => void;
   inputs: OperationID[];
   setInputs: React.Dispatch<React.SetStateAction<OperationID[]>>;
 }
@@ -22,11 +22,11 @@ interface TabSynthesisOperationProps {
 function TabSynthesisOperation({
   oss,
   alias,
-  setAlias,
+  onChangeAlias,
   title,
-  setTitle,
+  onChangeTitle,
   comment,
-  setComment,
+  onChangeComment,
   inputs,
   setInputs
 }: TabSynthesisOperationProps) {
@@ -36,7 +36,7 @@ function TabSynthesisOperation({
         id='operation_title'
         label='Полное название'
         value={title}
-        onChange={event => setTitle(event.target.value)}
+        onChange={event => onChangeTitle(event.target.value)}
       />
       <div className='flex gap-6'>
         <TextInput
@@ -44,7 +44,7 @@ function TabSynthesisOperation({
           label='Сокращение'
           className='w-[16rem]'
           value={alias}
-          onChange={event => setAlias(event.target.value)}
+          onChange={event => onChangeAlias(event.target.value)}
         />
 
         <TextArea
@@ -53,7 +53,7 @@ function TabSynthesisOperation({
           noResize
           rows={3}
           value={comment}
-          onChange={event => setComment(event.target.value)}
+          onChange={event => onChangeComment(event.target.value)}
         />
       </div>
 
diff --git a/rsconcept/frontend/src/dialogs/DlgEditOperation/DlgEditOperation.tsx b/rsconcept/frontend/src/dialogs/DlgEditOperation/DlgEditOperation.tsx
index a3b6089b..83880d32 100644
--- a/rsconcept/frontend/src/dialogs/DlgEditOperation/DlgEditOperation.tsx
+++ b/rsconcept/frontend/src/dialogs/DlgEditOperation/DlgEditOperation.tsx
@@ -141,11 +141,11 @@ function DlgEditOperation({ hideWindow, oss, target, onSubmit }: DlgEditOperatio
       <TabPanel>
         <TabOperation
           alias={alias}
-          setAlias={setAlias}
+          onChangeAlias={setAlias}
           comment={comment}
-          setComment={setComment}
+          onChangeComment={setComment}
           title={title}
-          setTitle={setTitle}
+          onChangeTitle={setTitle}
         />
       </TabPanel>
     ),
diff --git a/rsconcept/frontend/src/dialogs/DlgEditOperation/TabOperation.tsx b/rsconcept/frontend/src/dialogs/DlgEditOperation/TabOperation.tsx
index c44d8241..93c8204c 100644
--- a/rsconcept/frontend/src/dialogs/DlgEditOperation/TabOperation.tsx
+++ b/rsconcept/frontend/src/dialogs/DlgEditOperation/TabOperation.tsx
@@ -4,21 +4,21 @@ import AnimateFade from '@/components/wrap/AnimateFade';
 
 interface TabOperationProps {
   alias: string;
-  setAlias: React.Dispatch<React.SetStateAction<string>>;
+  onChangeAlias: (newValue: string) => void;
   title: string;
-  setTitle: React.Dispatch<React.SetStateAction<string>>;
+  onChangeTitle: (newValue: string) => void;
   comment: string;
-  setComment: React.Dispatch<React.SetStateAction<string>>;
+  onChangeComment: (newValue: string) => void;
 }
 
-function TabOperation({ alias, setAlias, title, setTitle, comment, setComment }: TabOperationProps) {
+function TabOperation({ alias, onChangeAlias, title, onChangeTitle, comment, onChangeComment }: TabOperationProps) {
   return (
     <AnimateFade className='cc-column'>
       <TextInput
         id='operation_title'
         label='Полное название'
         value={title}
-        onChange={event => setTitle(event.target.value)}
+        onChange={event => onChangeTitle(event.target.value)}
       />
       <div className='flex gap-6'>
         <TextInput
@@ -26,7 +26,7 @@ function TabOperation({ alias, setAlias, title, setTitle, comment, setComment }:
           label='Сокращение'
           className='w-[16rem]'
           value={alias}
-          onChange={event => setAlias(event.target.value)}
+          onChange={event => onChangeAlias(event.target.value)}
         />
 
         <TextArea
@@ -35,7 +35,7 @@ function TabOperation({ alias, setAlias, title, setTitle, comment, setComment }:
           noResize
           rows={3}
           value={comment}
-          onChange={event => setComment(event.target.value)}
+          onChange={event => onChangeComment(event.target.value)}
         />
       </div>
     </AnimateFade>
diff --git a/rsconcept/frontend/src/dialogs/DlgEditReference/DlgEditReference.tsx b/rsconcept/frontend/src/dialogs/DlgEditReference/DlgEditReference.tsx
index 537ecca6..6e5b6214 100644
--- a/rsconcept/frontend/src/dialogs/DlgEditReference/DlgEditReference.tsx
+++ b/rsconcept/frontend/src/dialogs/DlgEditReference/DlgEditReference.tsx
@@ -45,7 +45,12 @@ function DlgEditReference({ hideWindow, schema, initial, onSave }: DlgEditRefere
   const entityPanel = useMemo(
     () => (
       <TabPanel>
-        <TabEntityReference initial={initial} schema={schema} setReference={setReference} setIsValid={setIsValid} />
+        <TabEntityReference
+          initial={initial}
+          schema={schema}
+          onChangeReference={setReference}
+          onChangeValid={setIsValid}
+        />
       </TabPanel>
     ),
     [initial, schema]
@@ -54,7 +59,7 @@ function DlgEditReference({ hideWindow, schema, initial, onSave }: DlgEditRefere
   const syntacticPanel = useMemo(
     () => (
       <TabPanel>
-        <TabSyntacticReference initial={initial} setReference={setReference} setIsValid={setIsValid} />
+        <TabSyntacticReference initial={initial} onChangeReference={setReference} onChangeValid={setIsValid} />
       </TabPanel>
     ),
     [initial]
diff --git a/rsconcept/frontend/src/dialogs/DlgEditReference/TabEntityReference.tsx b/rsconcept/frontend/src/dialogs/DlgEditReference/TabEntityReference.tsx
index 95b84a68..d5531c99 100644
--- a/rsconcept/frontend/src/dialogs/DlgEditReference/TabEntityReference.tsx
+++ b/rsconcept/frontend/src/dialogs/DlgEditReference/TabEntityReference.tsx
@@ -21,11 +21,11 @@ import { IReferenceInputState } from './DlgEditReference';
 interface TabEntityReferenceProps {
   initial: IReferenceInputState;
   schema: IRSForm;
-  setIsValid: React.Dispatch<React.SetStateAction<boolean>>;
-  setReference: React.Dispatch<React.SetStateAction<string>>;
+  onChangeValid: (newValue: boolean) => void;
+  onChangeReference: (newValue: string) => void;
 }
 
-function TabEntityReference({ initial, schema, setIsValid, setReference }: TabEntityReferenceProps) {
+function TabEntityReference({ initial, schema, onChangeValid, onChangeReference }: TabEntityReferenceProps) {
   const [selectedCst, setSelectedCst] = useState<IConstituenta | undefined>(undefined);
   const [alias, setAlias] = useState('');
   const [term, setTerm] = useState('');
@@ -43,9 +43,9 @@ function TabEntityReference({ initial, schema, setIsValid, setReference }: TabEn
 
   // Produce result
   useEffect(() => {
-    setIsValid(alias !== '' && selectedGrams.length > 0);
-    setReference(`@{${alias}|${selectedGrams.map(gram => gram.value).join(',')}}`);
-  }, [alias, selectedGrams, setIsValid, setReference]);
+    onChangeValid(alias !== '' && selectedGrams.length > 0);
+    onChangeReference(`@{${alias}|${selectedGrams.map(gram => gram.value).join(',')}}`);
+  }, [alias, selectedGrams, onChangeValid, onChangeReference]);
 
   // Update term when alias changes
   useEffect(() => {
@@ -105,7 +105,7 @@ function TabEntityReference({ initial, schema, setIsValid, setReference }: TabEn
           className='flex-grow'
           menuPlacement='top'
           value={selectedGrams}
-          setValue={setSelectedGrams}
+          onChangeValue={setSelectedGrams}
         />
       </div>
     </AnimateFade>
diff --git a/rsconcept/frontend/src/dialogs/DlgEditReference/TabSyntacticReference.tsx b/rsconcept/frontend/src/dialogs/DlgEditReference/TabSyntacticReference.tsx
index 0ecdcebc..5a2f6e47 100644
--- a/rsconcept/frontend/src/dialogs/DlgEditReference/TabSyntacticReference.tsx
+++ b/rsconcept/frontend/src/dialogs/DlgEditReference/TabSyntacticReference.tsx
@@ -11,11 +11,11 @@ import { IReferenceInputState } from './DlgEditReference';
 
 interface TabSyntacticReferenceProps {
   initial: IReferenceInputState;
-  setIsValid: React.Dispatch<React.SetStateAction<boolean>>;
-  setReference: React.Dispatch<React.SetStateAction<string>>;
+  onChangeValid: (newValue: boolean) => void;
+  onChangeReference: (newValue: string) => void;
 }
 
-function TabSyntacticReference({ initial, setIsValid, setReference }: TabSyntacticReferenceProps) {
+function TabSyntacticReference({ initial, onChangeValid, onChangeReference }: TabSyntacticReferenceProps) {
   const [nominal, setNominal] = useState('');
   const [offset, setOffset] = useState(1);
 
@@ -39,9 +39,9 @@ function TabSyntacticReference({ initial, setIsValid, setReference }: TabSyntact
   }, [initial]);
 
   useEffect(() => {
-    setIsValid(nominal !== '' && offset !== 0);
-    setReference(`@{${offset}|${nominal}}`);
-  }, [nominal, offset, setIsValid, setReference]);
+    onChangeValid(nominal !== '' && offset !== 0);
+    onChangeReference(`@{${offset}|${nominal}}`);
+  }, [nominal, offset, onChangeValid, onChangeReference]);
 
   return (
     <AnimateFade className='flex flex-col gap-2'>
diff --git a/rsconcept/frontend/src/dialogs/DlgEditWordForms/DlgEditWordForms.tsx b/rsconcept/frontend/src/dialogs/DlgEditWordForms/DlgEditWordForms.tsx
index 65913bc6..3dc222b9 100644
--- a/rsconcept/frontend/src/dialogs/DlgEditWordForms/DlgEditWordForms.tsx
+++ b/rsconcept/frontend/src/dialogs/DlgEditWordForms/DlgEditWordForms.tsx
@@ -170,7 +170,7 @@ function DlgEditWordForms({ hideWindow, target, onSave }: DlgEditWordFormsProps)
           placeholder='Выберите граммемы'
           className='min-w-[15rem] h-fit'
           value={inputGrams}
-          setValue={setInputGrams}
+          onChangeValue={setInputGrams}
         />
       </div>
 
diff --git a/rsconcept/frontend/src/pages/LibraryPage/LibraryPage.tsx b/rsconcept/frontend/src/pages/LibraryPage/LibraryPage.tsx
index 4afb0406..a08cb7d3 100644
--- a/rsconcept/frontend/src/pages/LibraryPage/LibraryPage.tsx
+++ b/rsconcept/frontend/src/pages/LibraryPage/LibraryPage.tsx
@@ -150,8 +150,8 @@ function LibraryPage() {
   const viewLocations = useMemo(
     () => (
       <ViewSideLocation
-        active={options.location}
-        setActive={options.setLocation}
+        activeLocation={options.location}
+        onChangeActiveLocation={options.setLocation}
         subfolders={subfolders}
         folderTree={library.folders}
         toggleFolderMode={toggleFolderMode}
@@ -200,11 +200,11 @@ function LibraryPage() {
         filtered={items.length}
         hasCustomFilter={hasCustomFilter}
         query={query}
-        setQuery={setQuery}
+        onChangeQuery={setQuery}
         path={path}
-        setPath={setPath}
+        onChangePath={setPath}
         head={head}
-        setHead={setHead}
+        onChangeHead={setHead}
         isVisible={isVisible}
         isOwned={isOwned}
         toggleOwned={toggleOwned}
@@ -212,7 +212,7 @@ function LibraryPage() {
         isEditor={isEditor}
         toggleEditor={toggleEditor}
         filterUser={filterUser}
-        setFilterUser={setFilterUser}
+        onChangeFilterUser={setFilterUser}
         resetFilter={resetFilter}
         folderMode={options.folderMode}
         toggleFolderMode={toggleFolderMode}
diff --git a/rsconcept/frontend/src/pages/LibraryPage/ToolbarSearch.tsx b/rsconcept/frontend/src/pages/LibraryPage/ToolbarSearch.tsx
index f6bb48aa..5f11c21b 100644
--- a/rsconcept/frontend/src/pages/LibraryPage/ToolbarSearch.tsx
+++ b/rsconcept/frontend/src/pages/LibraryPage/ToolbarSearch.tsx
@@ -36,11 +36,11 @@ interface ToolbarSearchProps {
   hasCustomFilter: boolean;
 
   query: string;
-  setQuery: React.Dispatch<React.SetStateAction<string>>;
+  onChangeQuery: (newValue: string) => void;
   path: string;
-  setPath: React.Dispatch<React.SetStateAction<string>>;
+  onChangePath: (newValue: string) => void;
   head: LocationHead | undefined;
-  setHead: React.Dispatch<React.SetStateAction<LocationHead | undefined>>;
+  onChangeHead: (newValue: LocationHead | undefined) => void;
 
   folderMode: boolean;
   toggleFolderMode: () => void;
@@ -52,7 +52,7 @@ interface ToolbarSearchProps {
   isEditor: boolean | undefined;
   toggleEditor: () => void;
   filterUser: UserID | undefined;
-  setFilterUser: React.Dispatch<React.SetStateAction<UserID | undefined>>;
+  onChangeFilterUser: (newValue: UserID | undefined) => void;
 
   resetFilter: () => void;
 }
@@ -63,11 +63,11 @@ function ToolbarSearch({
   hasCustomFilter,
 
   query,
-  setQuery,
+  onChangeQuery,
   path,
-  setPath,
+  onChangePath,
   head,
-  setHead,
+  onChangeHead,
 
   folderMode,
   toggleFolderMode,
@@ -79,7 +79,7 @@ function ToolbarSearch({
   isEditor,
   toggleEditor,
   filterUser,
-  setFilterUser,
+  onChangeFilterUser,
 
   resetFilter
 }: ToolbarSearchProps) {
@@ -95,9 +95,9 @@ function ToolbarSearch({
   const handleChange = useCallback(
     (newValue: LocationHead | undefined) => {
       headMenu.hide();
-      setHead(newValue);
+      onChangeHead(newValue);
     },
-    [headMenu, setHead]
+    [headMenu, onChangeHead]
   );
 
   const handleToggleFolder = useCallback(() => {
@@ -170,7 +170,7 @@ function ToolbarSearch({
                 className='min-w-[15rem] text-sm'
                 items={users}
                 value={filterUser}
-                onSelectValue={setFilterUser}
+                onSelectValue={onChangeFilterUser}
               />
             </motion.div>
           </Dropdown>
@@ -191,7 +191,7 @@ function ToolbarSearch({
           noBorder
           className={clsx('min-w-[7rem] sm:min-w-[10rem] max-w-[20rem]', folderMode && 'flex-grow')}
           value={query}
-          onChange={setQuery}
+          onChange={onChangeQuery}
         />
         {!folderMode ? (
           <div ref={headMenu.ref} className='flex items-center h-full py-1 select-none'>
@@ -250,7 +250,7 @@ function ToolbarSearch({
             noBorder
             className='w-[4.5rem] sm:w-[5rem] flex-grow'
             value={path}
-            onChange={setPath}
+            onChange={onChangePath}
           />
         ) : null}
       </div>
diff --git a/rsconcept/frontend/src/pages/LibraryPage/ViewSideLocation.tsx b/rsconcept/frontend/src/pages/LibraryPage/ViewSideLocation.tsx
index 91e53640..127fea25 100644
--- a/rsconcept/frontend/src/pages/LibraryPage/ViewSideLocation.tsx
+++ b/rsconcept/frontend/src/pages/LibraryPage/ViewSideLocation.tsx
@@ -22,8 +22,8 @@ import { information } from '@/utils/labels';
 interface ViewSideLocationProps {
   folderTree: FolderTree;
   subfolders: boolean;
-  active: string;
-  setActive: React.Dispatch<React.SetStateAction<string>>;
+  activeLocation: string;
+  onChangeActiveLocation: (newValue: string) => void;
   toggleFolderMode: () => void;
   toggleSubfolders: () => void;
   onRenameLocation: () => void;
@@ -31,9 +31,9 @@ interface ViewSideLocationProps {
 
 function ViewSideLocation({
   folderTree,
-  active,
+  activeLocation,
   subfolders,
-  setActive: setActive,
+  onChangeActiveLocation,
   toggleFolderMode,
   toggleSubfolders,
   onRenameLocation
@@ -44,16 +44,18 @@ function ViewSideLocation({
   const windowSize = useWindowSize();
 
   const canRename = useMemo(() => {
-    if (active.length <= 3 || !user) {
+    if (activeLocation.length <= 3 || !user) {
       return false;
     }
     if (user.is_staff) {
       return true;
     }
     const owned = items.filter(item => item.owner == user.id);
-    const located = owned.filter(item => item.location == active || item.location.startsWith(`${active}/`));
+    const located = owned.filter(
+      item => item.location == activeLocation || item.location.startsWith(`${activeLocation}/`)
+    );
     return located.length !== 0;
-  }, [active, user, items]);
+  }, [activeLocation, user, items]);
 
   const animations = useMemo(() => animateSideMinWidth(windowSize.isSmall ? '10rem' : '15rem'), [windowSize]);
   const maxHeight = useMemo(() => calculateHeight('4.5rem'), [calculateHeight]);
@@ -68,10 +70,10 @@ function ViewSideLocation({
           .then(() => toast.success(information.pathReady))
           .catch(console.error);
       } else {
-        setActive(target.getPath());
+        onChangeActiveLocation(target.getPath());
       }
     },
-    [setActive]
+    [onChangeActiveLocation]
   );
 
   return (
@@ -109,7 +111,7 @@ function ViewSideLocation({
         </div>
       </div>
       <SelectLocation
-        value={active}
+        value={activeLocation}
         folderTree={folderTree}
         prefix={prefixes.folders_list}
         onClick={handleClickFolder}
diff --git a/rsconcept/frontend/src/pages/OssPage/EditorOssCard/EditorOssCard.tsx b/rsconcept/frontend/src/pages/OssPage/EditorOssCard/EditorOssCard.tsx
index 4e6f8808..2ad6312b 100644
--- a/rsconcept/frontend/src/pages/OssPage/EditorOssCard/EditorOssCard.tsx
+++ b/rsconcept/frontend/src/pages/OssPage/EditorOssCard/EditorOssCard.tsx
@@ -15,7 +15,7 @@ import OssStats from './OssStats';
 
 interface EditorOssCardProps {
   isModified: boolean;
-  setIsModified: React.Dispatch<React.SetStateAction<boolean>>;
+  setIsModified: (newValue: boolean) => void;
   onDestroy: () => void;
 }
 
diff --git a/rsconcept/frontend/src/pages/OssPage/EditorOssCard/FormOSS.tsx b/rsconcept/frontend/src/pages/OssPage/EditorOssCard/FormOSS.tsx
index 5e69492b..8611988f 100644
--- a/rsconcept/frontend/src/pages/OssPage/EditorOssCard/FormOSS.tsx
+++ b/rsconcept/frontend/src/pages/OssPage/EditorOssCard/FormOSS.tsx
@@ -18,7 +18,7 @@ import { useOssEdit } from '../OssEditContext';
 interface FormOSSProps {
   id?: string;
   isModified: boolean;
-  setIsModified: React.Dispatch<React.SetStateAction<boolean>>;
+  setIsModified: (newValue: boolean) => void;
 }
 
 function FormOSS({ id, isModified, setIsModified }: FormOSSProps) {
diff --git a/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/EditorOssGraph.tsx b/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/EditorOssGraph.tsx
index 16f595be..48a7d5b9 100644
--- a/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/EditorOssGraph.tsx
+++ b/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/EditorOssGraph.tsx
@@ -6,7 +6,7 @@ import OssFlow from './OssFlow';
 
 interface EditorOssGraphProps {
   isModified: boolean;
-  setIsModified: React.Dispatch<React.SetStateAction<boolean>>;
+  setIsModified: (newValue: boolean) => void;
 }
 
 function EditorOssGraph({ isModified, setIsModified }: EditorOssGraphProps) {
diff --git a/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/OssFlow.tsx b/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/OssFlow.tsx
index b2982642..174fbcf4 100644
--- a/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/OssFlow.tsx
+++ b/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/OssFlow.tsx
@@ -34,7 +34,7 @@ import ToolbarOssGraph from './ToolbarOssGraph';
 
 interface OssFlowProps {
   isModified: boolean;
-  setIsModified: React.Dispatch<React.SetStateAction<boolean>>;
+  setIsModified: (newValue: boolean) => void;
 }
 
 function OssFlow({ isModified, setIsModified }: OssFlowProps) {
diff --git a/rsconcept/frontend/src/pages/OssPage/OssEditContext.tsx b/rsconcept/frontend/src/pages/OssPage/OssEditContext.tsx
index 3d82786c..9fabc98e 100644
--- a/rsconcept/frontend/src/pages/OssPage/OssEditContext.tsx
+++ b/rsconcept/frontend/src/pages/OssPage/OssEditContext.tsx
@@ -55,7 +55,7 @@ export interface IOssEditContext extends ILibraryItemEditor {
   isAttachedToOSS: boolean;
 
   showTooltip: boolean;
-  setShowTooltip: React.Dispatch<React.SetStateAction<boolean>>;
+  setShowTooltip: (newValue: boolean) => void;
 
   setOwner: (newOwner: UserID) => void;
   setAccessPolicy: (newPolicy: AccessPolicy) => void;
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/EditorConstituenta.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/EditorConstituenta.tsx
index 935b2d56..e513ade6 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/EditorConstituenta.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/EditorConstituenta.tsx
@@ -21,7 +21,7 @@ const SIDELIST_LAYOUT_THRESHOLD = 1000; // px
 interface EditorConstituentaProps {
   activeCst?: IConstituenta;
   isModified: boolean;
-  setIsModified: React.Dispatch<React.SetStateAction<boolean>>;
+  setIsModified: (newValue: boolean) => void;
   onOpenEdit: (cstID: ConstituentaID) => void;
 }
 
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/FormConstituenta.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/FormConstituenta.tsx
index 814d5df4..99075073 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/FormConstituenta.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/FormConstituenta.tsx
@@ -31,7 +31,7 @@ interface FormConstituentaProps {
 
   isModified: boolean;
   toggleReset: boolean;
-  setIsModified: React.Dispatch<React.SetStateAction<boolean>>;
+  setIsModified: (newValue: boolean) => void;
 
   onRename: () => void;
   onEditTerm: () => void;
@@ -225,9 +225,9 @@ function FormConstituenta({
                 activeCst={state}
                 disabled={disabled || state.is_inherited}
                 toggleReset={toggleReset}
-                onChange={newValue => setExpression(newValue)}
-                setTypification={setTypification}
-                setLocalParse={setLocalParse}
+                onChangeExpression={newValue => setExpression(newValue)}
+                onChangeTypification={setTypification}
+                onChangeLocalParse={setLocalParse}
                 onOpenEdit={onOpenEdit}
               />
             </AnimateFade>
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorRSExpression/EditorRSExpression.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorRSExpression/EditorRSExpression.tsx
index 8a29b223..476ca9a4 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorRSExpression/EditorRSExpression.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorRSExpression/EditorRSExpression.tsx
@@ -2,7 +2,7 @@
 
 import { ReactCodeMirrorRef } from '@uiw/react-codemirror';
 import { AnimatePresence } from 'framer-motion';
-import React, { useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';
+import { useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { toast } from 'react-toastify';
 
 import BadgeHelp from '@/components/info/BadgeHelp';
@@ -39,9 +39,9 @@ interface EditorRSExpressionProps {
   disabled?: boolean;
   toggleReset?: boolean;
 
-  setTypification: (typification: string) => void;
-  setLocalParse: React.Dispatch<React.SetStateAction<IExpressionParse | undefined>>;
-  onChange: (newValue: string) => void;
+  onChangeTypification: (typification: string) => void;
+  onChangeLocalParse: (typification: IExpressionParse | undefined) => void;
+  onChangeExpression: (newValue: string) => void;
   onOpenEdit?: (cstID: ConstituentaID) => void;
 }
 
@@ -50,9 +50,9 @@ function EditorRSExpression({
   disabled,
   value,
   toggleReset,
-  setTypification,
-  setLocalParse,
-  onChange,
+  onChangeTypification,
+  onChangeLocalParse,
+  onChangeExpression,
   onOpenEdit,
   ...restProps
 }: EditorRSExpressionProps) {
@@ -74,20 +74,20 @@ function EditorRSExpression({
   }, [activeCst, resetParse, toggleReset]);
 
   function handleChange(newValue: string) {
-    onChange(newValue);
+    onChangeExpression(newValue);
     setIsModified(newValue !== activeCst.definition_formal);
   }
 
   function handleCheckExpression(callback?: (parse: IExpressionParse) => void) {
     parser.checkConstituenta(value, activeCst, parse => {
-      setLocalParse(parse);
+      onChangeLocalParse(parse);
       if (parse.errors.length > 0) {
         onShowError(parse.errors[0], parse.prefixLen);
       } else {
         rsInput.current?.view?.focus();
       }
       setIsModified(false);
-      setTypification(
+      onChangeTypification(
         labelTypification({
           isValid: parse.parseResult,
           resultType: parse.typification,
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/EditorRSFormCard.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/EditorRSFormCard.tsx
index 4ebeae94..6176eacb 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/EditorRSFormCard.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/EditorRSFormCard.tsx
@@ -15,7 +15,7 @@ import ToolbarRSFormCard from './ToolbarRSFormCard';
 
 interface EditorRSFormCardProps {
   isModified: boolean;
-  setIsModified: React.Dispatch<React.SetStateAction<boolean>>;
+  setIsModified: (newValue: boolean) => void;
   onDestroy: () => void;
 }
 
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/FormRSForm.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/FormRSForm.tsx
index 98b4b3a8..8f0cc5db 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/FormRSForm.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/FormRSForm.tsx
@@ -18,7 +18,7 @@ import ToolbarVersioning from './ToolbarVersioning';
 interface FormRSFormProps {
   id?: string;
   isModified: boolean;
-  setIsModified: React.Dispatch<React.SetStateAction<boolean>>;
+  setIsModified: (newValue: boolean) => void;
 }
 
 function FormRSForm({ id, isModified, setIsModified }: FormRSFormProps) {