chore: move AddWhatCondModal to legacy

2025-11-25 15:55:28 +05:30
parent ad8df66ecd
commit 1f8a9cc41c
2 changed files with 6 additions and 6 deletions
--- a/legacy/src/AddWhatCondModal.tsx
+++ b/legacy/src/AddWhatCondModal.tsx
@@ -0,0 +1,133 @@
+import { WhereWhatPair } from "maxun-core";
+import { GenericModal } from "../../src/components/ui/GenericModal";
+import { modalStyle } from "../../src/components/recorder/AddWhereCondModal";
+import { Button, TextField, Typography } from "@mui/material";
+import React, { useRef } from "react";
+import { KeyValueForm } from "../../src/components/recorder/KeyValueForm";
+import { ClearButton } from "../../src/components/ui/buttons/ClearButton";
+import { useSocketStore } from "../../src/context/socket";
+
+interface AddWhatCondModalProps {
+  isOpen: boolean;
+  onClose: () => void;
+  pair: WhereWhatPair;
+  index: number;
+}
+
+export const AddWhatCondModal = ({ isOpen, onClose, pair, index }: AddWhatCondModalProps) => {
+  const [action, setAction] = React.useState<string>('');
+  const [objectIndex, setObjectIndex] = React.useState<number>(0);
+  const [args, setArgs] = React.useState<({ type: string, value: (string | number | object | unknown) })[]>([]);
+
+  const objectRefs = useRef<({ getObject: () => object } | unknown)[]>([]);
+
+  const { socket } = useSocketStore();
+
+  const handleSubmit = () => {
+    const argsArray: (string | number | object | unknown)[] = [];
+    args.map((arg, index) => {
+      switch (arg.type) {
+        case 'string':
+        case 'number':
+          argsArray[index] = arg.value;
+          break;
+        case 'object':
+          // @ts-ignore
+          argsArray[index] = objectRefs.current[arg.value].getObject();
+      }
+    })
+    setArgs([]);
+    onClose();
+    pair.what.push({
+      // @ts-ignore
+      action,
+      args: argsArray,
+    })
+    socket?.emit('updatePair', { index: index - 1, pair: pair });
+  }
+
+  return (
+    <GenericModal isOpen={isOpen} onClose={() => {
+      setArgs([]);
+      onClose();
+    }} modalStyle={modalStyle}>
+      <div>
+        <Typography sx={{ margin: '20px 0px' }}>Add what condition:</Typography>
+        <div style={{ margin: '8px' }}>
+          <Typography>Action:</Typography>
+          <TextField
+            size='small'
+            type="string"
+            onChange={(e) => setAction(e.target.value)}
+            value={action}
+            label='action'
+          />
+          <div>
+            <Typography>Add new argument of type:</Typography>
+            <Button onClick={() => setArgs([...args, { type: 'string', value: null }])}>string</Button>
+            <Button onClick={() => setArgs([...args, { type: 'number', value: null }])}>number</Button>
+            <Button onClick={() => {
+              setArgs([...args, { type: 'object', value: objectIndex }])
+              setObjectIndex(objectIndex + 1);
+            }}>object</Button>
+          </div>
+          <Typography>args:</Typography>
+          {args.map((arg, index) => {
+            // @ts-ignore
+            return (
+              <div style={{ border: 'solid 1px gray', padding: '10px', display: 'flex', flexDirection: 'row', alignItems: 'center' }}
+                key={`wrapper-for-${arg.type}-${index}`}>
+                <ClearButton handleClick={() => {
+                  args.splice(index, 1);
+                  setArgs([...args]);
+                }} />
+                <Typography sx={{ margin: '5px' }} key={`number-argument-${arg.type}-${index}`}>{index}: </Typography>
+                {arg.type === 'string' ?
+                  <TextField
+                    size='small'
+                    type="string"
+                    onChange={(e) => setArgs([
+                      ...args.slice(0, index),
+                      { type: arg.type, value: e.target.value },
+                      ...args.slice(index + 1)
+                    ])}
+                    value={args[index].value || ''}
+                    label="string"
+                    key={`arg-${arg.type}-${index}`}
+                  /> : arg.type === 'number' ?
+                    <TextField
+                      key={`arg-${arg.type}-${index}`}
+                      size='small'
+                      type="number"
+                      onChange={(e) => setArgs([
+                        ...args.slice(0, index),
+                        { type: arg.type, value: Number(e.target.value) },
+                        ...args.slice(index + 1)
+                      ])}
+                      value={args[index].value || ''}
+                      label="number"
+                    /> :
+                    <KeyValueForm ref={el =>
+                      //@ts-ignore
+                      objectRefs.current[arg.value] = el} key={`arg-${arg.type}-${index}`} />
+                }
+              </div>
+            )
+          })}
+          <Button
+            onClick={handleSubmit}
+            variant="outlined"
+            sx={{
+              display: "table-cell",
+              float: "right",
+              marginRight: "15px",
+              marginTop: "20px",
+            }}
+          >
+            {"Add Condition"}
+          </Button>
+        </div>
+      </div>
+    </GenericModal>
+  )
+}