[DOP-22355] add transform node

Author: Zabilsya

1

@@ -0,0 +1,31 @@
+pick ab16fdd [DOP-22354] add Transfer canvas
+s b5e2614 [DOP-22354] fix after review
+s 16b91c5 [DOP-22355] add transform node
+
+# Rebase ab4fdb0..16b91c5 onto ab4fdb0 (3 commands)
+#
+# Commands:
+# p, pick <commit> = use commit
+# r, reword <commit> = use commit, but edit the commit message
+# e, edit <commit> = use commit, but stop for amending
+# s, squash <commit> = use commit, but meld into previous commit
+# f, fixup [-C | -c] <commit> = like "squash" but keep only the previous
+#                    commit's log message, unless -C is used, in which case
+#                    keep only this commit's message; -c is same as -C but
+#                    opens the editor
+# x, exec <command> = run command (the rest of the line) using shell
+# b, break = stop here (continue rebase later with 'git rebase --continue')
+# d, drop <commit> = remove commit
+# l, label <label> = label current HEAD with a name
+# t, reset <label> = reset HEAD to a label
+# m, merge [-C <commit> | -c <commit>] <label> [# <oneline>]
+# .       create a merge commit using the original merge commit's
+# .       message (or the oneline, if no original merge commit was
+# .       specified); use -c <commit> to reword the commit message
+#
+# These lines can be re-ordered; they are executed from top to bottom.
+#
+# If you remove a line here THAT COMMIT WILL BE LOST.
+#
+# However, if you remove everything, the rebase will be aborted.
+#

src/features/transfer/MutateTransferForm/components/FilterRows/index.tsx

@@ -0,0 +1,5 @@
+import React, { memo } from 'react';
+
+export const FilterRows = memo(() => {
+  return <div>FilterRowsNode</div>;
+});

src/features/transfer/MutateTransferForm/components/FilterRowsNode/FilterRowsNode.tsx

@@ -0,0 +1,31 @@
+import React, { useMemo } from 'react';
+import { CanvasNode } from '@shared/ui';
+import { Handle, Position } from '@xyflow/react';
+import { FilterOutlined } from '@ant-design/icons';
+
+import { FilterRows } from '../FilterRows';
+import { TransferCanvasEdge } from '../TransferConnectionsCanvas';
+
+import { FilterRowsNodeProps } from './types';
+
+export const FilterRowsNode = ({}: FilterRowsNodeProps) => {
+  const icon = useMemo(() => {
+    return <FilterOutlined />;
+  }, []);
+
+  const children = useMemo(() => {
+    return (
+      <>
+        <Handle type="target" position={Position.Left} id={TransferCanvasEdge.FILTER_ROWS_TARGET} />
+        <FilterRows />
+        <Handle type="source" position={Position.Right} id={TransferCanvasEdge.FILTER_ROWS_SOURCE} />
+      </>
+    );
+  }, []);
+
+  return (
+    <CanvasNode title="Filter rows" icon={icon}>
+      {children}
+    </CanvasNode>
+  );
+};

src/features/transfer/MutateTransferForm/components/FilterRowsNode/index.ts

@@ -0,0 +1,2 @@
+export * from './FilterRowsNode';
+export * from './types';

src/features/transfer/MutateTransferForm/components/FilterRowsNode/types.ts

@@ -0,0 +1,8 @@
+import { Node, NodeProps } from '@xyflow/react';
+
+import { TransferCanvasTransformNodeType } from '../TransferConnectionsCanvas';
+
+export interface FilterRowsNodeData
+  extends Node<Record<string, unknown>, TransferCanvasTransformNodeType.FILTER_ROWS> {}
+
+export interface FilterRowsNodeProps extends NodeProps<FilterRowsNodeData> {}

src/features/transfer/MutateTransferForm/components/SourceParamsNode/SourceParamsNode.tsx

@@ -9,7 +9,6 @@ import { SourceParams } from '../SourceParams';
 import { TransferCanvasEdge } from '../TransferConnectionsCanvas';
 
 import { SourceParamsNodeProps } from './types';
-import classes from './styles.module.less';
 
 export const SourceParamsNode = ({ data }: SourceParamsNodeProps) => {
   const connectionType = Form.useWatch<ConnectionType>(['source_params', 'type']);
@@ -28,7 +27,7 @@ export const SourceParamsNode = ({ data }: SourceParamsNodeProps) => {
   }, [data.groupId, data.initialSourceConnectionType]);
 
   return (
-    <CanvasNode className={classes.root} title="Source" icon={icon}>
+    <CanvasNode title="Source" icon={icon}>
       {children}
     </CanvasNode>
   );

src/features/transfer/MutateTransferForm/components/SourceParamsNode/styles.module.less

@@ -1,8 +1,8 @@
 import { Node, NodeProps } from '@xyflow/react';
 
 import { SourceParamsProps } from '../SourceParams';
-import { TransferCanvasNode } from '../TransferConnectionsCanvas';
+import { TransferCanvasDefaultNodeType } from '../TransferConnectionsCanvas';
 
-export interface SourceParamsNodeData extends Node<SourceParamsProps, TransferCanvasNode.SOURCE> {}
+export interface SourceParamsNodeData extends Node<SourceParamsProps, TransferCanvasDefaultNodeType.SOURCE> {}
 
 export interface SourceParamsNodeProps extends NodeProps<SourceParamsNodeData> {}

src/features/transfer/MutateTransferForm/components/SourceParamsNode/types.ts

@@ -9,7 +9,6 @@ import { TargetParams } from '../TargetParams';
 import { TransferCanvasEdge } from '../TransferConnectionsCanvas';
 
 import { TargetParamsNodeProps } from './types';
-import classes from './styles.module.less';
 
 export const TargetParamsNode = ({ data }: TargetParamsNodeProps) => {
   const connectionType = Form.useWatch<ConnectionType>(['target_params', 'type']);
@@ -28,7 +27,7 @@ export const TargetParamsNode = ({ data }: TargetParamsNodeProps) => {
   }, [data.groupId, data.initialTargetConnectionType]);
 
   return (
-    <CanvasNode className={classes.root} title="Target" icon={icon}>
+    <CanvasNode title="Target" icon={icon}>
       {children}
     </CanvasNode>
   );