mirror of
https://github.com/IRBorisov/ConceptPortal.git
synced 2025-06-26 04:50:36 +03:00
R: Decouple setters from onChange events
Some checks are pending
Frontend CI / build (22.x) (push) Waiting to run
Some checks are pending
Frontend CI / build (22.x) (push) Waiting to run
This commit is contained in:
parent
1d1727c43f
commit
72634e80fa
|
@ -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}
|
||||
/>
|
||||
);
|
||||
|
|
|
@ -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}
|
||||
/>
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
|
||||
|
|
|
@ -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>) => (
|
||||
|
|
|
@ -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>) => (
|
||||
|
|
|
@ -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}
|
||||
/>
|
||||
|
|
|
@ -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}
|
||||
/>
|
||||
|
|
|
@ -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>
|
||||
|
||||
|
|
|
@ -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>
|
||||
),
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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]
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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'>
|
||||
|
|
|
@ -170,7 +170,7 @@ function DlgEditWordForms({ hideWindow, target, onSave }: DlgEditWordFormsProps)
|
|||
placeholder='Выберите граммемы'
|
||||
className='min-w-[15rem] h-fit'
|
||||
value={inputGrams}
|
||||
setValue={setInputGrams}
|
||||
onChangeValue={setInputGrams}
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -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}
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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}
|
||||
|
|
|
@ -15,7 +15,7 @@ import OssStats from './OssStats';
|
|||
|
||||
interface EditorOssCardProps {
|
||||
isModified: boolean;
|
||||
setIsModified: React.Dispatch<React.SetStateAction<boolean>>;
|
||||
setIsModified: (newValue: boolean) => void;
|
||||
onDestroy: () => void;
|
||||
}
|
||||
|
||||
|
|
|
@ -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) {
|
||||
|
|
|
@ -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) {
|
||||
|
|
|
@ -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) {
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -15,7 +15,7 @@ import ToolbarRSFormCard from './ToolbarRSFormCard';
|
|||
|
||||
interface EditorRSFormCardProps {
|
||||
isModified: boolean;
|
||||
setIsModified: React.Dispatch<React.SetStateAction<boolean>>;
|
||||
setIsModified: (newValue: boolean) => void;
|
||||
onDestroy: () => void;
|
||||
}
|
||||
|
||||
|
|
|
@ -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) {
|
||||
|
|
Loading…
Reference in New Issue
Block a user