feat: added clone definition button & controller (#2593)

apps/workflows-dashboard/src/domains/ui-definitions/ui-definitions.api.ts

@@ -1,4 +1,5 @@
 import {
+ CopyUIDefinitionDto,
  GetUIDefinitionByIdDto,
  IUIDefinition,
  UpdateUIDefinitionDto,
@@ -19,6 +20,10 @@ export const updateUIDefinition = async (dto: UpdateUIDefinitionDto) => {
  return result.data;
 };
 
+export const copyUIDefinition = async (dto: CopyUIDefinitionDto) => {
+ const result = await request.post(`/ui-definition/${dto.uiDefinitionId}/copy`);
+};
+
 export const fetchUIDefinition = async (dto: GetUIDefinitionByIdDto) => {
  const result = await request.get<IUIDefinition>(`/internal/ui-definition/${dto.uiDefinitionId}`);
 

apps/workflows-dashboard/src/domains/ui-definitions/ui-definitions.types.ts

@@ -21,6 +21,9 @@ export interface UpdateUIDefinitionDto {
  uiDefinition: IUIDefinition;
 }
 
+export interface CopyUIDefinitionDto {
+ uiDefinitionId: string;
+}
 export interface GetUIDefinitionByIdDto {
  uiDefinitionId: string;
 }

apps/workflows-dashboard/src/pages/UIDefinitions/components/UIDefinitionsTable/columns.tsx

@@ -1,5 +1,6 @@
 import { JSONViewButton } from '@/components/molecules/JSONViewButton';
 import { IUIDefinition } from '@/domains/ui-definitions';
+import { CloneUIDefinitionButton } from '@/pages/UIDefinitions/components/UIDefinitionsTable/components/CloneUIDefinitionButton';
 import { formatDate } from '@/utils/format-date';
 import { createColumnHelper } from '@tanstack/react-table';
 import { ArrowRightCircleIcon, Eye } from 'lucide-react';
@@ -62,6 +63,10 @@ export const uiDefinitionTableColumnns = [
  cell: info => formatDate(info.getValue<Date>()),
  header: () => 'Created At',
  }),
+ columnHelper.accessor('id', {
+ cell: info => <CloneUIDefinitionButton uiDefinitionId={info.getValue()} />,
+ header: () => '',
+ }),
  columnHelper.accessor('id', {
  cell: info => (
  <Link to={`/ui-definitions/${info.row.original.id}`}>

apps/workflows-dashboard/src/pages/UIDefinitions/components/UIDefinitionsTable/components/CloneUIDefinitionButton/CloneUIDefinitionButton.tsx

@@ -0,0 +1,19 @@
+import { Button } from '@/components/atoms/Button';
+import { useCloneUIDefinitionMutation } from '@/pages/UIDefinitions/hooks/useCloneUIDefinitionMutation';
+import { FunctionComponent } from 'react';
+
+interface ICLoneUIDefinitionButtonProps {
+ uiDefinitionId: string;
+}
+
+export const CloneUIDefinitionButton: FunctionComponent<ICLoneUIDefinitionButtonProps> = ({
+ uiDefinitionId,
+}) => {
+ const { mutate, isLoading } = useCloneUIDefinitionMutation();
+
+ return (
+ <Button onClick={() => mutate({ uiDefinitionId })} disabled={isLoading}>
+ Clone
+ </Button>
+ );
+};

apps/workflows-dashboard/src/pages/UIDefinitions/components/UIDefinitionsTable/components/CloneUIDefinitionButton/index.ts

@@ -0,0 +1 @@
+export * from './CloneUIDefinitionButton';

apps/workflows-dashboard/src/pages/UIDefinitions/hooks/useCloneUIDefinitionMutation/index.ts

@@ -0,0 +1 @@
+export * from './useCloneUIDefinitionMutation';

apps/workflows-dashboard/src/pages/UIDefinitions/hooks/useCloneUIDefinitionMutation/useCloneUIDefinitionMutation.tsx

@@ -0,0 +1,24 @@
+import {
+ copyUIDefinition,
+ CopyUIDefinitionDto,
+ uiDefinitionsQueryKeys,
+} from '@/domains/ui-definitions';
+import { queryClient } from '@/lib/react-query/query-client';
+import { useMutation } from '@tanstack/react-query';
+import { toast } from 'sonner';
+
+export const useCloneUIDefinitionMutation = () => {
+ return useMutation({
+ mutationFn: async (dto: CopyUIDefinitionDto) => copyUIDefinition(dto),
+ onSuccess: () => {
+ const { queryKey } = uiDefinitionsQueryKeys.list();
+
+ queryClient.invalidateQueries({ queryKey, exact: true });
+
+ toast.success('UI Definition cloned succesfully.');
+ },
+ onError: () => {
+ toast.error('Failed to clone ui definition.');
+ },
+ });
+};

services/workflows-service/src/ui-definition/dtos/ui-definition-where-unique-input.ts

@@ -0,0 +1,16 @@
+import { ApiProperty } from '@nestjs/swagger';
+import { Type } from '@sinclair/typebox';
+import { IsString } from 'class-validator';
+
+export class UIDefinitionWhereUniqueInput {
+ @ApiProperty({
+ required: true,
+ type: String,
+ })
+ @IsString()
+ id!: string;
+}
+
+export const UIDefinitionWhereUniqueInputSchema = Type.String({
+ description: "The workflow's id",
+});

services/workflows-service/src/ui-definition/ui-definition.controller.internal.ts

@@ -16,7 +16,7 @@ import * as swagger from '@nestjs/swagger';
 @swagger.ApiExcludeController()
 @common.Controller('internal/ui-definition')
 @Injectable()
-export class UiDefinitionController {
+export class UiDefinitionControllerInternal {
  constructor(
  protected readonly service: UiDefinitionService,
  protected readonly projectScopeService: ProjectScopeService,