From 08c2510a8001d178343a4998adcd1f3cf47e07ef Mon Sep 17 00:00:00 2001 From: arpitnath Date: Thu, 17 Aug 2023 11:16:25 +0530 Subject: [PATCH] save for demo--1 --- frontend/src/Editor/EditorFunc.jsx | 48 +++++++++++++++---- .../src/Editor/Inspector/EventManager.jsx | 6 ++- frontend/src/_stores/utils.js | 2 +- server/src/controllers/apps.controller.v2.ts | 4 +- server/src/services/components.service.ts | 8 ++++ server/src/services/events_handler.service.ts | 20 ++++++++ 6 files changed, 74 insertions(+), 14 deletions(-) diff --git a/frontend/src/Editor/EditorFunc.jsx b/frontend/src/Editor/EditorFunc.jsx index 80679fb6bf..4ed5391399 100644 --- a/frontend/src/Editor/EditorFunc.jsx +++ b/frontend/src/Editor/EditorFunc.jsx @@ -104,7 +104,7 @@ const EditorComponent = (props) => { const dataQueries = useDataQueries(); - const { isMaintenanceOn, appId, app, currentUser, currentVersionId, appDefinitionDiff, appDiffOptions } = + const { isMaintenanceOn, appId, app, currentUser, currentVersionId, appDefinitionDiff, appDiffOptions, events } = useAppInfo(); const [currentPageId, setCurrentPageId] = useState(null); @@ -255,9 +255,6 @@ const EditorComponent = (props) => { }); }; - // 1. When we receive an undoable action – we can always undo but cannot redo anymore. - // 2. Whenever you perform an undo – you can always redo and keep doing undo as long as we have a patch for it. - // 3. Whenever you redo – you can always undo and keep doing redo as long as we have a patch for it. const initComponentVersioning = () => { const currentVersion = { [currentPageId]: -1, @@ -607,13 +604,17 @@ const EditorComponent = (props) => { //!-------- - const buildComponentMetaDefinition = (components = {}) => { + const buildComponentMetaDefinition = (components = {}, events = []) => { for (const componentId in components) { const currentComponentData = components[componentId]; + const componentEvents = events + .filter((event) => event.sourceId === componentId) + ?.map((event) => ({ ...event.event, id: event.id })); const componentMeta = componentTypes.find((comp) => currentComponentData.component.component === comp.component); const mergedDefinition = { ...componentMeta.definition, + events: componentEvents, properties: { ...componentMeta.definition.properties, ...currentComponentData?.component.definition.properties, @@ -644,6 +645,7 @@ const EditorComponent = (props) => { components[componentId] = mergedComponent; } + return components; }; @@ -653,8 +655,10 @@ const EditorComponent = (props) => { editingVersion['currentVersionId'] = editingVersion.id; _.unset(editingVersion, 'id'); + const eventsData = data?.events; + const pages = data.pages.reduce((acc, page) => { - const currentComponents = buildComponentMetaDefinition(_.cloneDeep(page?.components)); + const currentComponents = buildComponentMetaDefinition(_.cloneDeep(page?.components), eventsData); page.components = currentComponents; @@ -670,8 +674,6 @@ const EditorComponent = (props) => { pages: pages, }; - // const componentMeta = componentTypes.find((comp) => component.component === comp.component); - return appJSON; }; @@ -857,18 +859,44 @@ const EditorComponent = (props) => { const updateDiff = computeAppDiff(appDefinitionDiff, currentPageId, appDiffOptions); updateAppVersion(appId, props.editingVersion?.id, currentPageId, updateDiff, isUserSwitchedVersion) - .then(() => { + .then((data) => { const _editingVersion = { ...props.editingVersion, ...{ definition: appDefinition }, }; useAppVersionStore.getState().actions.updateEditingVersion(_editingVersion); + + if (updateDiff?.type === 'components' && updateDiff?.operation === 'delete') { + const appEvents = JSON.parse(JSON.stringify(events)); + + const updatedEvents = appEvents.filter((event) => { + return !updateDiff?.updateDiff.includes(event.sourceId); + }); + + updateState({ + events: updatedEvents, + }); + } + + if (updateDiff?.type === 'events') { + const appEvents = JSON.parse(JSON.stringify(events)); + + if (updateDiff?.operation === 'create') { + appEvents.push(data); + } + + updateState({ + events: appEvents, + }); + } + updateEditorState({ saveError: false, isSaving: false, }); }) - .catch(() => { + .catch((e) => { + console.log('--piku error', e); updateEditorState({ saveError: true, isSaving: false, diff --git a/frontend/src/Editor/Inspector/EventManager.jsx b/frontend/src/Editor/Inspector/EventManager.jsx index 449e5f70fa..18afbc1caf 100644 --- a/frontend/src/Editor/Inspector/EventManager.jsx +++ b/frontend/src/Editor/Inspector/EventManager.jsx @@ -210,14 +210,16 @@ export const EventManager = ({ function addHandler() { let newEvents = component.component.definition.events; + const eventIndex = newEvents.length; newEvents.push({ eventId: Object.keys(componentMeta.events)[0], actionId: 'show-alert', message: 'Hello world!', alertType: 'info', + eventIndex: eventIndex, }); setEvents(newEvents); - eventsChanged(newEvents, false, true); + eventsChanged(newEvents, null, false, true); } //following two are functions responsible for on change and value for the control specific actions @@ -771,7 +773,7 @@ export const EventManager = ({ const [removed] = result.splice(startIndex, 1); result.splice(endIndex, 0, removed); setEvents(result); - eventsChanged(result, true); + eventsChanged(result, null, true); }; const onDragEnd = ({ source, destination }) => { diff --git a/frontend/src/_stores/utils.js b/frontend/src/_stores/utils.js index a9e8b6c0f5..d5ba9c0451 100644 --- a/frontend/src/_stores/utils.js +++ b/frontend/src/_stores/utils.js @@ -53,7 +53,7 @@ const eventHandlerType = Object.freeze({ export const computeAppDiff = (appDiff, currentPageId, opts) => { const { updateDiff, type, operation } = updateFor(appDiff, currentPageId, opts); - console.log('----arpit [updateFor]', { updateDiff, type, operation }); + // console.log('----arpit [updateFor]', { updateDiff, type, operation }); return { updateDiff, type, operation }; }; diff --git a/server/src/controllers/apps.controller.v2.ts b/server/src/controllers/apps.controller.v2.ts index d3d49843a6..a7c187e0a0 100644 --- a/server/src/controllers/apps.controller.v2.ts +++ b/server/src/controllers/apps.controller.v2.ts @@ -345,6 +345,8 @@ export class AppsControllerV2 { throw new ForbiddenException('You do not have permissions to perform this action'); } - return await this.eventService.updateEvent(body, versionId); + console.log('-----arpit update events', { body }); + + // return await this.eventService.updateEvent(body, versionId); } } diff --git a/server/src/services/components.service.ts b/server/src/services/components.service.ts index 03019ce66b..5f8a31290f 100644 --- a/server/src/services/components.service.ts +++ b/server/src/services/components.service.ts @@ -6,9 +6,13 @@ import { Layout } from 'src/entities/layout.entity'; import { Page } from 'src/entities/page.entity'; import { dbTransactionWrap } from 'src/helpers/utils.helper'; +import { EventsService } from './events_handler.service'; + @Injectable() export class ComponentsService { constructor( + private eventHandlerService: EventsService, + @InjectRepository(Component) private componentsRepository: Repository ) {} @@ -109,6 +113,10 @@ export class ComponentsService { }; } + components.forEach((component) => { + this.eventHandlerService.cascadeDeleteEvents(component.id); + }); + await manager.delete(Component, componentIds); }); } diff --git a/server/src/services/events_handler.service.ts b/server/src/services/events_handler.service.ts index 1af6250dcb..49bb26ee6b 100644 --- a/server/src/services/events_handler.service.ts +++ b/server/src/services/events_handler.service.ts @@ -22,6 +22,26 @@ export class EventsService { }); } + async findAllEventsWithSourceId(sourceId: string): Promise { + return dbTransactionWrap(async (manager: EntityManager) => { + const allEvents = await manager.find(EventHandler, { + where: { sourceId }, + }); + return allEvents; + }); + } + + async cascadeDeleteEvents(sourceId: string) { + return dbTransactionWrap(async (manager: EntityManager) => { + const allEvents = await manager.find(EventHandler, { + where: { sourceId }, + }); + + await manager.remove(allEvents); + return allEvents; + }); + } + async createEvent(options, versionId) { if (Object.keys(options).length === 0) { return new BadRequestException('No event found');