Portal/rsconcept/frontend/src/pages/OssPage/OssEditContext.tsx

479 lines
15 KiB
TypeScript
Raw Normal View History

2024-06-07 20:17:03 +03:00
'use client';
import { AnimatePresence } from 'framer-motion';
import { createContext, useCallback, useContext, useLayoutEffect, useMemo, useState } from 'react';
import { toast } from 'react-toastify';
2024-07-24 18:11:28 +03:00
import { urls } from '@/app/urls';
2024-06-07 20:17:03 +03:00
import { useAccessMode } from '@/context/AccessModeContext';
import { useAuth } from '@/context/AuthContext';
import { useConceptOptions } from '@/context/ConceptOptionsContext';
import { useLibrary } from '@/context/LibraryContext';
2024-07-24 18:11:28 +03:00
import { useConceptNavigation } from '@/context/NavigationContext';
2024-06-07 20:17:03 +03:00
import { useOSS } from '@/context/OssContext';
2024-07-28 21:29:46 +03:00
import DlgChangeInputSchema from '@/dialogs/DlgChangeInputSchema';
2024-06-07 20:17:03 +03:00
import DlgChangeLocation from '@/dialogs/DlgChangeLocation';
2024-07-21 15:17:36 +03:00
import DlgCreateOperation from '@/dialogs/DlgCreateOperation';
import DlgDeleteOperation from '@/dialogs/DlgDeleteOperation';
2024-06-07 20:17:03 +03:00
import DlgEditEditors from '@/dialogs/DlgEditEditors';
2024-07-29 16:55:48 +03:00
import DlgEditOperation from '@/dialogs/DlgEditOperation';
2024-10-23 15:18:46 +03:00
import DlgRelocateConstituents from '@/dialogs/DlgRelocateConstituents';
import { AccessPolicy, ILibraryItemEditor, LibraryItemID } from '@/models/library';
2024-07-20 18:26:32 +03:00
import { Position2D } from '@/models/miscellaneous';
import { calculateInsertPosition } from '@/models/miscellaneousAPI';
2024-07-28 21:29:46 +03:00
import {
2024-10-23 15:18:46 +03:00
ICstRelocateData,
2024-07-28 21:29:46 +03:00
IOperationCreateData,
IOperationDeleteData,
2024-07-28 21:29:46 +03:00
IOperationPosition,
IOperationSchema,
IOperationSetInputData,
2024-07-29 22:30:24 +03:00
IOperationUpdateData,
OperationID,
OperationType
2024-07-28 21:29:46 +03:00
} from '@/models/oss';
2024-06-07 20:17:03 +03:00
import { UserID, UserLevel } from '@/models/user';
2024-08-02 11:17:27 +03:00
import { PARAMETER } from '@/utils/constants';
import { errors, information } from '@/utils/labels';
2024-06-07 20:17:03 +03:00
import { RSTabID } from '../RSFormPage/RSTabs';
2024-08-02 11:17:27 +03:00
export interface ICreateOperationPrompt {
2024-09-16 19:38:24 +03:00
defaultX: number;
defaultY: number;
2024-08-02 11:17:27 +03:00
inputs: OperationID[];
positions: IOperationPosition[];
callback: (newID: OperationID) => void;
}
export interface IOssEditContext extends ILibraryItemEditor {
2024-06-07 20:17:03 +03:00
schema?: IOperationSchema;
2024-07-23 23:03:58 +03:00
selected: OperationID[];
2024-06-07 20:17:03 +03:00
isMutable: boolean;
isProcessing: boolean;
isAttachedToOSS: boolean;
2024-06-07 20:17:03 +03:00
2024-07-26 00:33:22 +03:00
showTooltip: boolean;
setShowTooltip: React.Dispatch<React.SetStateAction<boolean>>;
2024-06-07 20:17:03 +03:00
setOwner: (newOwner: UserID) => void;
setAccessPolicy: (newPolicy: AccessPolicy) => void;
promptEditors: () => void;
promptLocation: () => void;
2024-07-23 23:03:58 +03:00
setSelected: React.Dispatch<React.SetStateAction<OperationID[]>>;
2024-06-07 20:17:03 +03:00
share: () => void;
2024-07-20 18:26:32 +03:00
2024-07-24 18:11:28 +03:00
openOperationSchema: (target: OperationID) => void;
2024-07-23 23:03:58 +03:00
savePositions: (positions: IOperationPosition[], callback?: () => void) => void;
2024-08-02 11:17:27 +03:00
promptCreateOperation: (props: ICreateOperationPrompt) => void;
canDelete: (target: OperationID) => boolean;
promptDeleteOperation: (target: OperationID, positions: IOperationPosition[]) => void;
createInput: (target: OperationID, positions: IOperationPosition[]) => void;
2024-07-28 21:29:46 +03:00
promptEditInput: (target: OperationID, positions: IOperationPosition[]) => void;
2024-07-29 16:55:48 +03:00
promptEditOperation: (target: OperationID, positions: IOperationPosition[]) => void;
executeOperation: (target: OperationID, positions: IOperationPosition[]) => void;
2024-10-23 15:18:46 +03:00
promptRelocateConstituents: (target: OperationID) => void;
2024-06-07 20:17:03 +03:00
}
const OssEditContext = createContext<IOssEditContext | null>(null);
export const useOssEdit = () => {
const context = useContext(OssEditContext);
if (context === null) {
throw new Error('useOssEdit has to be used within <OssEditState.Provider>');
}
return context;
};
interface OssEditStateProps {
2024-07-23 23:03:58 +03:00
selected: OperationID[];
setSelected: React.Dispatch<React.SetStateAction<OperationID[]>>;
2024-06-07 20:17:03 +03:00
}
2024-09-19 17:48:48 +03:00
export const OssEditState = ({ selected, setSelected, children }: React.PropsWithChildren<OssEditStateProps>) => {
2024-07-24 18:11:28 +03:00
const router = useConceptNavigation();
2024-06-07 20:17:03 +03:00
const { user } = useAuth();
const { adminMode } = useConceptOptions();
const { accessLevel, setAccessLevel } = useAccessMode();
const model = useOSS();
const library = useLibrary();
2024-06-07 20:17:03 +03:00
const isMutable = useMemo(
() => accessLevel > UserLevel.READER && !model.schema?.read_only,
[accessLevel, model.schema?.read_only]
);
2024-07-26 00:33:22 +03:00
const [showTooltip, setShowTooltip] = useState(true);
2024-06-07 20:17:03 +03:00
const [showEditEditors, setShowEditEditors] = useState(false);
const [showEditLocation, setShowEditLocation] = useState(false);
2024-07-28 21:29:46 +03:00
const [showEditInput, setShowEditInput] = useState(false);
2024-07-29 16:55:48 +03:00
const [showEditOperation, setShowEditOperation] = useState(false);
const [showDeleteOperation, setShowDeleteOperation] = useState(false);
2024-10-23 15:18:46 +03:00
const [showRelocateConstituents, setShowRelocateConstituents] = useState(false);
2024-06-07 20:17:03 +03:00
2024-07-20 18:26:32 +03:00
const [showCreateOperation, setShowCreateOperation] = useState(false);
const [insertPosition, setInsertPosition] = useState<Position2D>({ x: 0, y: 0 });
const [initialInputs, setInitialInputs] = useState<OperationID[]>([]);
2024-08-02 11:17:27 +03:00
const [createCallback, setCreateCallback] = useState<((newID: OperationID) => void) | undefined>(undefined);
2024-07-21 15:17:36 +03:00
const [positions, setPositions] = useState<IOperationPosition[]>([]);
2024-07-28 21:29:46 +03:00
const [targetOperationID, setTargetOperationID] = useState<OperationID | undefined>(undefined);
const targetOperation = useMemo(
() => (targetOperationID ? model.schema?.operationByID.get(targetOperationID) : undefined),
[model, targetOperationID]
);
2024-07-20 18:26:32 +03:00
2024-06-07 20:17:03 +03:00
useLayoutEffect(
() =>
setAccessLevel(prev => {
if (
prev === UserLevel.EDITOR &&
(model.isOwned || user?.is_staff || (user && model.schema?.editors.includes(user.id)))
) {
return UserLevel.EDITOR;
} else if (user?.is_staff && (prev === UserLevel.ADMIN || adminMode)) {
return UserLevel.ADMIN;
} else if (model.isOwned) {
return UserLevel.OWNER;
} else if (user?.id && model.schema?.editors.includes(user?.id)) {
return UserLevel.EDITOR;
} else {
return UserLevel.READER;
}
}),
[model.schema, setAccessLevel, model.isOwned, user, adminMode]
);
const handleSetLocation = useCallback(
(newLocation: string) => {
if (!model.schema) {
return;
}
model.setLocation(newLocation, () => toast.success(information.moveComplete));
},
[model]
);
const promptEditors = useCallback(() => {
setShowEditEditors(true);
}, []);
const promptLocation = useCallback(() => {
setShowEditLocation(true);
}, []);
const share = useCallback(() => {
const currentRef = window.location.href;
const url = currentRef.includes('?') ? currentRef + '&share' : currentRef + '?share';
navigator.clipboard
.writeText(url)
.then(() => toast.success(information.linkReady))
.catch(console.error);
}, []);
const setOwner = useCallback(
(newOwner: UserID) => {
model.setOwner(newOwner, () => toast.success(information.changesSaved));
},
[model]
);
const setAccessPolicy = useCallback(
(newPolicy: AccessPolicy) => {
model.setAccessPolicy(newPolicy, () => toast.success(information.changesSaved));
},
[model]
);
const setEditors = useCallback(
(newEditors: UserID[]) => {
model.setEditors(newEditors, () => toast.success(information.changesSaved));
},
[model]
);
2024-07-24 18:11:28 +03:00
const openOperationSchema = useCallback(
(target: OperationID) => {
const node = model.schema?.operationByID.get(target);
2024-08-06 14:38:10 +03:00
if (!node?.result) {
2024-07-24 18:11:28 +03:00
return;
}
router.push(urls.schema_props({ id: node.result, tab: RSTabID.CST_LIST }));
2024-07-24 18:11:28 +03:00
},
[router, model]
);
2024-07-23 23:03:58 +03:00
const savePositions = useCallback(
(positions: IOperationPosition[], callback?: () => void) => {
model.savePositions({ positions: positions }, () => {
positions.forEach(item => {
const operation = model.schema?.operationByID.get(item.id);
if (operation) {
operation.position_x = item.position_x;
operation.position_y = item.position_y;
}
});
toast.success(information.changesSaved);
if (callback) callback();
});
},
[model]
);
2024-09-16 19:38:24 +03:00
const promptCreateOperation = useCallback(
({ defaultX, defaultY, inputs, positions, callback }: ICreateOperationPrompt) => {
setInsertPosition({ x: defaultX, y: defaultY });
setInitialInputs(inputs);
setPositions(positions);
setCreateCallback(() => callback);
setShowCreateOperation(true);
},
[]
);
2024-07-20 18:26:32 +03:00
const handleCreateOperation = useCallback(
(data: IOperationCreateData) => {
const target = calculateInsertPosition(
model.schema!,
data.item_data.operation_type,
data.arguments!,
positions,
insertPosition
);
2024-07-29 16:55:48 +03:00
data.positions = positions;
2024-09-16 19:38:24 +03:00
data.item_data.position_x = target.x;
data.item_data.position_y = target.y;
2024-08-02 11:17:27 +03:00
model.createOperation(data, operation => {
toast.success(information.newOperation(operation.alias));
if (createCallback) {
setTimeout(() => createCallback(operation.id), PARAMETER.refreshTimeout);
}
});
2024-07-20 18:26:32 +03:00
},
2024-08-02 11:17:27 +03:00
[model, positions, insertPosition, createCallback]
2024-07-20 18:26:32 +03:00
);
2024-07-29 16:55:48 +03:00
const promptEditOperation = useCallback((target: OperationID, positions: IOperationPosition[]) => {
setPositions(positions);
setTargetOperationID(target);
setShowEditOperation(true);
}, []);
2024-07-29 22:30:24 +03:00
const handleEditOperation = useCallback(
(data: IOperationUpdateData) => {
data.positions = positions;
model.updateOperation(data, () => toast.success(information.changesSaved));
},
[model, positions]
);
2024-07-29 16:55:48 +03:00
const canDelete = useCallback(
(target: OperationID) => {
if (!model.schema) {
return false;
}
const operation = model.schema.operationByID.get(target);
if (!operation) {
return false;
}
if (operation.operation_type === OperationType.INPUT) {
return true;
}
return model.schema.graph.expandOutputs([target]).length === 0;
},
[model]
);
const promptDeleteOperation = useCallback(
2024-07-23 23:03:58 +03:00
(target: OperationID, positions: IOperationPosition[]) => {
setPositions(positions);
setTargetOperationID(target);
setShowDeleteOperation(true);
2024-07-23 23:03:58 +03:00
},
[model]
);
const deleteOperation = useCallback(
(keepConstituents: boolean, deleteSchema: boolean) => {
if (!targetOperationID) {
return;
}
const data: IOperationDeleteData = {
target: targetOperationID,
positions: positions,
keep_constituents: keepConstituents,
delete_schema: deleteSchema
};
model.deleteOperation(data, () => toast.success(information.operationDestroyed));
},
[model, targetOperationID, positions]
);
const createInput = useCallback(
(target: OperationID, positions: IOperationPosition[]) => {
const operation = model.schema?.operationByID.get(target);
if (!model.schema || !operation) {
return;
}
if (library.items.find(item => item.alias === operation.alias && item.location === model.schema!.location)) {
toast.error(errors.inputAlreadyExists);
return;
}
model.createInput({ target: target, positions: positions }, new_schema => {
toast.success(information.newLibraryItem);
router.push(urls.schema(new_schema.id));
});
},
[model, library.items, router]
);
2024-07-28 21:29:46 +03:00
const promptEditInput = useCallback((target: OperationID, positions: IOperationPosition[]) => {
setPositions(positions);
setTargetOperationID(target);
setShowEditInput(true);
}, []);
const setTargetInput = useCallback(
(newInput: LibraryItemID | undefined) => {
2024-07-28 21:29:46 +03:00
if (!targetOperationID) {
return;
}
const data: IOperationSetInputData = {
target: targetOperationID,
positions: positions,
input: newInput ?? null
};
model.setInput(data, () => toast.success(information.changesSaved));
},
[model, targetOperationID, positions]
);
const executeOperation = useCallback(
2024-07-29 22:30:24 +03:00
(target: OperationID, positions: IOperationPosition[]) => {
const data = {
target: target,
positions: positions
};
model.executeOperation(data, () => toast.success(information.operationExecuted));
},
[model]
);
2024-10-23 15:18:46 +03:00
const promptRelocateConstituents = useCallback(
(target: OperationID) => {
setTargetOperationID(target);
setShowRelocateConstituents(true);
},
[model]
);
const handleRelocateConstituents = useCallback(
(data: ICstRelocateData) => {
// TODO: implement backed call
console.log(data);
toast.success('В разработке');
},
[model]
);
2024-06-07 20:17:03 +03:00
return (
<OssEditContext.Provider
value={{
schema: model.schema,
2024-07-23 23:03:58 +03:00
selected,
2024-07-26 00:33:22 +03:00
showTooltip,
setShowTooltip,
2024-06-07 20:17:03 +03:00
isMutable,
isProcessing: model.processing,
isAttachedToOSS: false,
2024-06-07 20:17:03 +03:00
setOwner,
setAccessPolicy,
promptEditors,
promptLocation,
2024-07-20 18:26:32 +03:00
share,
2024-07-23 23:03:58 +03:00
setSelected,
2024-07-20 18:26:32 +03:00
2024-07-24 18:11:28 +03:00
openOperationSchema,
2024-07-23 23:03:58 +03:00
savePositions,
promptCreateOperation,
canDelete,
promptDeleteOperation,
2024-07-28 21:29:46 +03:00
createInput,
2024-07-29 16:55:48 +03:00
promptEditInput,
2024-07-29 22:30:24 +03:00
promptEditOperation,
2024-10-23 15:18:46 +03:00
executeOperation,
promptRelocateConstituents
2024-06-07 20:17:03 +03:00
}}
>
{model.schema ? (
<AnimatePresence>
{showEditEditors ? (
<DlgEditEditors
hideWindow={() => setShowEditEditors(false)}
editors={model.schema.editors}
setEditors={setEditors}
/>
) : null}
{showEditLocation ? (
<DlgChangeLocation
hideWindow={() => setShowEditLocation(false)}
initial={model.schema.location}
onChangeLocation={handleSetLocation}
/>
) : null}
2024-07-21 15:17:36 +03:00
{showCreateOperation ? (
<DlgCreateOperation
hideWindow={() => setShowCreateOperation(false)}
oss={model.schema}
onCreate={handleCreateOperation}
initialInputs={initialInputs}
2024-07-21 15:17:36 +03:00
/>
) : null}
2024-07-28 21:29:46 +03:00
{showEditInput ? (
<DlgChangeInputSchema
hideWindow={() => setShowEditInput(false)}
oss={model.schema}
target={targetOperation!}
onSubmit={setTargetInput}
/>
) : null}
2024-07-29 16:55:48 +03:00
{showEditOperation ? (
<DlgEditOperation
hideWindow={() => setShowEditOperation(false)}
oss={model.schema}
target={targetOperation!}
onSubmit={handleEditOperation}
/>
) : null}
{showDeleteOperation ? (
<DlgDeleteOperation
hideWindow={() => setShowDeleteOperation(false)}
target={targetOperation!}
onSubmit={deleteOperation}
/>
) : null}
2024-10-23 15:18:46 +03:00
{showRelocateConstituents ? (
<DlgRelocateConstituents
hideWindow={() => setShowRelocateConstituents(false)}
target={targetOperation!}
oss={model.schema}
onSubmit={handleRelocateConstituents}
/>
) : null}
)
2024-06-07 20:17:03 +03:00
</AnimatePresence>
) : null}
{children}
</OssEditContext.Provider>
);
};