Nv 1576 make default layout changes dependent

apps/api/src/app/change/e2e/promote-changes.e2e.ts

@@ -631,7 +631,7 @@ describe('Promote changes', () => {
           _organizationId: session.organization._id,
           enabled: false,
           _entityId: layoutId,
-          type: ChangeEntityTypeEnum.LAYOUT,
+          type: ChangeEntityTypeEnum.DEFAULT_LAYOUT,
         },
         '',
         {
@@ -641,7 +641,7 @@ describe('Promote changes', () => {
 
       expect(changes.length).to.eql(1);
       expect(changes[0]._entityId).to.eql(layoutId);
-      expect(changes[0].type).to.eql(ChangeEntityTypeEnum.LAYOUT);
+      expect(changes[0].type).to.eql(ChangeEntityTypeEnum.DEFAULT_LAYOUT);
       expect(changes[0].change).to.deep.include({ op: 'add', path: ['_id'], val: layoutId });
 
       await session.applyChanges({

apps/api/src/app/change/usecases/get-changes/get-changes.usecase.ts

@@ -62,6 +62,9 @@ export class GetChanges {
       if (change.type === ChangeEntityTypeEnum.LAYOUT) {
         item = await this.getTemplateDataForLayout(change._entityId, command.environmentId);
       }
+      if (change.type === ChangeEntityTypeEnum.DEFAULT_LAYOUT) {
+        item = await this.getTemplateDataForDefaultLayout(change._entityId, command.environmentId);
+      }
 
       list.push({
         ...change,
@@ -196,4 +199,22 @@ export class GetChanges {
       templateName: item.name,
     };
   }
+
+  private async getTemplateDataForDefaultLayout(
+    entityId: string,
+    environmentId: string
+  ): Promise<IViewEntity | Record<string, unknown>> {
+    const currentDefaultLayout = await this.getTemplateDataForLayout(entityId, environmentId);
+
+    const defaultLayout = await this.layoutRepository.findOne({
+      _environmentId: environmentId,
+      isDefault: true,
+      _id: { $ne: entityId },
+    });
+
+    return {
+      templateName: currentDefaultLayout?.templateName,
+      previousDefaultLayout: defaultLayout?.name,
+    };
+  }
 }

apps/api/src/app/change/usecases/promote-change-to-environment/promote-change-to-environment.usecase.ts

@@ -58,6 +58,7 @@ export class PromoteChangeToEnvironment {
         await this.promoteFeedChange.execute(typeCommand);
         break;
       case ChangeEntityTypeEnum.LAYOUT:
+      case ChangeEntityTypeEnum.DEFAULT_LAYOUT:
         await this.promoteLayoutChange.execute(typeCommand);
         break;
       default:

apps/api/src/app/change/usecases/promote-layout-change/promote-layout-change.use-case.ts

@@ -8,11 +8,16 @@ export class PromoteLayoutChange {
   constructor(private layoutRepository: LayoutRepository) {}
 
   async execute(command: PromoteTypeChangeCommand) {
-    const item = await this.layoutRepository.findOne({
+    let item: LayoutEntity | undefined = await this.layoutRepository.findOne({
       _environmentId: command.environmentId,
       _parentId: command.item._id,
     });
 
+    // For the scenario where the layout is deleted and an active default layout change was pending
+    if (!item) {
+      item = await this.layoutRepository.findDeletedByParentId(command.item._id, command.environmentId);
+    }
+
     const newItem = command.item as LayoutEntity;
 
     if (!item) {

apps/api/src/app/layouts/usecases/create-default-layout-change/create-default-layout-change.command.ts

@@ -0,0 +1,17 @@
+import { IsDefined, IsString, IsOptional } from 'class-validator';
+import { EnvironmentWithUserCommand } from '../../../shared/commands/project.command';
+import { LayoutId } from '../../types';
+
+export class CreateDefaultLayoutChangeCommand extends EnvironmentWithUserCommand {
+  @IsString()
+  @IsDefined()
+  layoutId: LayoutId;
+
+  @IsString()
+  @IsOptional()
+  changeId?: string;
+
+  @IsString()
+  @IsOptional()
+  parentChangeId?: string;
+}

apps/api/src/app/layouts/usecases/create-default-layout-change/create-default-layout-change.usecase.ts

@@ -0,0 +1,58 @@
+import { Injectable } from '@nestjs/common';
+import { ChangeRepository, LayoutEntity, LayoutRepository } from '@novu/dal';
+import { ChangeEntityTypeEnum } from '@novu/shared';
+import { CreateChange, CreateChangeCommand } from '../../../change/usecases';
+import { LayoutDto } from '../../dtos';
+import { FindDeletedLayoutCommand, FindDeletedLayoutUseCase } from '../find-deleted-layout';
+import { CreateDefaultLayoutChangeCommand } from './create-default-layout-change.command';
+
+type GetChangeId = {
+  environmentId: string;
+  layoutId: string;
+};
+
+@Injectable()
+export class CreateDefaultLayoutChangeUseCase {
+  constructor(
+    private createChange: CreateChange,
+    private findDeletedLayout: FindDeletedLayoutUseCase,
+    private layoutRepository: LayoutRepository,
+    private changeRepository: ChangeRepository
+  ) {}
+
+  async execute(command: CreateDefaultLayoutChangeCommand): Promise<void> {
+    let item: LayoutEntity | LayoutDto = await this.layoutRepository.findOne({
+      _id: command.layoutId,
+      _environmentId: command.environmentId,
+      _organizationId: command.organizationId,
+    });
+
+    const changeId = command.changeId || (await this.getChangeId(command));
+
+    if (!item) {
+      item = await this.findDeletedLayout.execute(FindDeletedLayoutCommand.create(command));
+    }
+
+    if (item) {
+      await this.createChange.execute(
+        CreateChangeCommand.create({
+          organizationId: command.organizationId,
+          environmentId: command.environmentId,
+          userId: command.userId,
+          type: ChangeEntityTypeEnum.DEFAULT_LAYOUT,
+          parentChangeId: command.parentChangeId,
+          changeId,
+          item,
+        })
+      );
+    }
+  }
+
+  private async getChangeId(command: GetChangeId) {
+    return await this.changeRepository.getChangeId(
+      command.environmentId,
+      ChangeEntityTypeEnum.DEFAULT_LAYOUT,
+      command.layoutId
+    );
+  }
+}

apps/api/src/app/layouts/usecases/create-layout/create-layout.use-case.ts

@@ -39,10 +39,10 @@ export class CreateLayoutUseCase {
         userId: dto._creatorId,
       });
       await this.setDefaultLayout.execute(setDefaultLayoutCommand);
+    } else {
+      await this.createChange(command, dto._id);
     }
 
-    await this.createChange(command, dto._id);
-
     return dto;
   }
 

apps/api/src/app/layouts/usecases/index.ts

@@ -1,3 +1,4 @@
+import { CreateDefaultLayoutChangeUseCase } from './create-default-layout-change/create-default-layout-change.usecase';
 import { CheckLayoutIsUsedUseCase } from './check-layout-is-used/check-layout-is-used.use-case';
 import { CreateLayoutUseCase } from './create-layout/create-layout.use-case';
 import { CreateLayoutChangeUseCase } from './create-layout-change/create-layout-change.use-case';
@@ -22,6 +23,7 @@ export * from './set-default-layout';
 export * from './update-layout';
 
 export const USE_CASES = [
+  CreateDefaultLayoutChangeUseCase,
   CheckLayoutIsUsedUseCase,
   CreateDefaultLayout,
   CreateLayoutChangeUseCase,

apps/api/src/app/layouts/usecases/set-default-layout/set-default-layout.use-case.ts

@@ -1,40 +1,53 @@
-import { LayoutEntity, LayoutRepository } from '@novu/dal';
 import { Injectable, Logger } from '@nestjs/common';
-
-import { SetDefaultLayoutCommand } from './set-default-layout.command';
-
-import { CreateLayoutChangeCommand, CreateLayoutChangeUseCase } from '../create-layout-change';
-import { GetLayoutCommand, GetLayoutUseCase } from '../get-layout';
+import { ChangeRepository, LayoutRepository } from '@novu/dal';
+import { ChangeEntityTypeEnum } from '@novu/shared';
 import { EnvironmentId, LayoutId, OrganizationId } from '../../types';
+import { CreateDefaultLayoutChangeCommand } from '../create-default-layout-change/create-default-layout-change.command';
+import { CreateDefaultLayoutChangeUseCase } from '../create-default-layout-change/create-default-layout-change.usecase';
+import { GetLayoutUseCase } from '../get-layout';
+import { SetDefaultLayoutCommand } from './set-default-layout.command';
 
 @Injectable()
 export class SetDefaultLayoutUseCase {
   constructor(
     private getLayout: GetLayoutUseCase,
-    private createLayoutChange: CreateLayoutChangeUseCase,
-    private layoutRepository: LayoutRepository
+    private createDefaultLayoutChange: CreateDefaultLayoutChangeUseCase,
+    private layoutRepository: LayoutRepository,
+    private changeRepository: ChangeRepository
   ) {}
 
   async execute(command: SetDefaultLayoutCommand) {
     const layout = await this.getLayout.execute(command);
 
     const existingDefaultLayoutId = await this.findExistingDefaultLayoutId(
-      layout._id,
+      layout._id as string,
       command.environmentId,
       command.organizationId
     );
 
     if (!existingDefaultLayoutId) {
+      await this.createDefaultChange(command);
+
       return;
     }
 
     try {
-      if (existingDefaultLayoutId) {
-        await this.setIsDefaultForLayout(existingDefaultLayoutId, command.environmentId, command.organizationId, false);
-        await this.createLayoutChangeForPreviousDefault(command, existingDefaultLayoutId);
-      }
+      await this.setIsDefaultForLayout(existingDefaultLayoutId, command.environmentId, command.organizationId, false);
+
+      const existingParentChangeId = await this.getParentChangeId(command.environmentId, existingDefaultLayoutId);
+      const previousDefaultLayoutChangeId = await this.changeRepository.getChangeId(
+        command.environmentId,
+        ChangeEntityTypeEnum.DEFAULT_LAYOUT,
+        existingDefaultLayoutId
+      );
+
+      await this.createLayoutChangeForPreviousDefault(command, existingDefaultLayoutId, previousDefaultLayoutChangeId);
 
-      await this.setIsDefaultForLayout(layout._id, command.environmentId, command.organizationId, true);
+      await this.setIsDefaultForLayout(layout._id as string, command.environmentId, command.organizationId, true);
+      await this.createDefaultChange({
+        ...command,
+        parentChangeId: existingParentChangeId || previousDefaultLayoutChangeId,
+      });
     } catch (error) {
       Logger.error(error);
       // TODO: Rollback through transactions
@@ -43,27 +56,10 @@ export class SetDefaultLayoutUseCase {
 
   private async createLayoutChangeForPreviousDefault(
     command: SetDefaultLayoutCommand,
-    layoutId: LayoutId
-  ): Promise<void> {
-    const createLayoutChangeCommand = CreateLayoutChangeCommand.create({
-      environmentId: command.environmentId,
-      layoutId,
-      organizationId: command.organizationId,
-      userId: command.userId,
-    });
-
-    await this.createLayoutChange.execute(createLayoutChangeCommand);
-  }
-
-  private mapToEntity(
-    domainEntity: SetDefaultLayoutCommand
-  ): Pick<LayoutEntity, '_id' | '_environmentId' | '_organizationId' | '_creatorId'> {
-    return {
-      _id: domainEntity.userId,
-      _environmentId: domainEntity.environmentId,
-      _organizationId: domainEntity.organizationId,
-      _creatorId: domainEntity.userId,
-    };
+    layoutId: LayoutId,
+    changeId: string
+  ) {
+    await this.createDefaultChange({ ...command, layoutId, changeId });
   }
 
   private async findExistingDefaultLayoutId(
@@ -93,4 +89,27 @@ export class SetDefaultLayoutUseCase {
   ): Promise<void> {
     await this.layoutRepository.updateIsDefault(layoutId, environmentId, organizationId, isDefault);
   }
+
+  private async createDefaultChange(command: CreateDefaultLayoutChangeCommand) {
+    const createLayoutChangeCommand = CreateDefaultLayoutChangeCommand.create({
+      environmentId: command.environmentId,
+      layoutId: command.layoutId,
+      organizationId: command.organizationId,
+      userId: command.userId,
+      changeId: command.changeId,
+      parentChangeId: command.parentChangeId,
+    });
+
+    await this.createDefaultLayoutChange.execute(createLayoutChangeCommand);
+  }
+
+  private async getParentChangeId(environmentId: string, layoutId: string) {
+    const parentChangeId = await this.changeRepository.getParentId(
+      environmentId,
+      ChangeEntityTypeEnum.DEFAULT_LAYOUT,
+      layoutId
+    );
+
+    return parentChangeId;
+  }
 }

apps/api/src/app/layouts/usecases/update-layout/update-layout.use-case.ts

@@ -48,10 +48,10 @@ export class UpdateLayoutUseCase {
         userId: dto._creatorId,
       });
       await this.setDefaultLayout.execute(setDefaultLayoutCommand);
+    } else {
+      await this.createChange(command);
     }
 
-    await this.createChange(command);
-
     return dto;
   }
 

apps/web/src/components/changes/ChangesTableLayout.tsx

@@ -53,7 +53,7 @@ export const ChangesTable = ({
     {
       accessor: 'change',
       Header: 'Change',
-      Cell: ({ type, templateName, messageType }: any) => (
+      Cell: ({ type, templateName, messageType, previousDefaultLayout }: any) => (
         <div data-test-id="change-type">
           {type === ChangeEntityTypeEnum.NOTIFICATION_TEMPLATE && (
             <Text color={colorScheme === 'dark' ? colors.B40 : colors.B70}>Template Change</Text>
@@ -70,6 +70,14 @@ export const ChangesTable = ({
           {type === ChangeEntityTypeEnum.LAYOUT && (
             <Text color={colorScheme === 'dark' ? colors.B40 : colors.B70}>Layout Change</Text>
           )}
+          {type === ChangeEntityTypeEnum.DEFAULT_LAYOUT && (
+            <Text color={colorScheme === 'dark' ? colors.B40 : colors.B70}>Default Layout Change</Text>
+          )}
+          {previousDefaultLayout && (
+            <Text data-test-id="previous-default-layout-content" rows={1} mt={5}>
+              Previous Default Layout: {previousDefaultLayout}
+            </Text>
+          )}
           <Text data-test-id="change-content" rows={1} mt={5}>
             {templateName}
             {messageType ? `, ${messageType}` : null}

libs/dal/src/repositories/change/change.repository.ts

@@ -67,4 +67,26 @@ export class ChangeRepository extends BaseRepository<EnforceEnvironmentQuery, Ch
 
     return { totalCount: totalItemsCount, data: this.mapEntities(items) };
   }
+
+  public async getParentId(
+    environmentId: string,
+    entityType: ChangeEntityTypeEnum,
+    entityId: string
+  ): Promise<string | null> {
+    const change = await this.findOne(
+      {
+        _environmentId: environmentId,
+        _entityId: entityId,
+        type: entityType,
+        enabled: false,
+        _parentId: { $exists: true },
+      },
+      '_parentId'
+    );
+    if (change?._parentId) {
+      return change._parentId;
+    }
+
+    return null;
+  }
 }

libs/dal/src/repositories/layout/layout.repository.ts

@@ -83,6 +83,19 @@ export class LayoutRepository extends BaseRepository<EnforceEnvironmentQuery, La
     return this.mapEntity(deletedLayout);
   }
 
+  async findDeletedByParentId(parentId: LayoutId, environmentId: EnvironmentId): Promise<LayoutEntity | undefined> {
+    const deletedLayout = await this.layout.findOneDeleted({
+      _parentId: this.convertStringToObjectId(parentId),
+      _environmentId: this.convertStringToObjectId(environmentId),
+    });
+
+    if (!deletedLayout?._id) {
+      return undefined;
+    }
+
+    return this.mapEntity(deletedLayout);
+  }
+
   async filterLayouts(
     query: EnforceEnvironmentQuery,
     pagination: { limit: number; skip: number; sortBy?: string; orderBy?: OrderDirectionEnum }

libs/shared/src/entities/change/change.interface.ts

@@ -2,6 +2,7 @@ export enum ChangeEntityTypeEnum {
   FEED = 'Feed',
   MESSAGE_TEMPLATE = 'MessageTemplate',
   LAYOUT = 'Layout',
+  DEFAULT_LAYOUT = 'DefaultLayout',
   NOTIFICATION_TEMPLATE = 'NotificationTemplate',
   NOTIFICATION_GROUP = 'NotificationGroup',
 }