import React from 'react';

import { automationScriptSelector } from '@/modules/feeds/Editor/redux/selectors';
import { setAction } from '@/modules/feeds/Editor/redux/slices';

import { FormRow } from '@/modules/@common/Form';
import { useAppDispatch, useAppSelector } from '@/modules/@common/store/hooks';
import { JSONEditor } from '@/mui/components';

type PropTypes = {
  disabled?: boolean;
};

function AutomationScript({ disabled = false }: PropTypes) {
  const dispatch = useAppDispatch();

  const automationScript = useAppSelector(automationScriptSelector);

  return (
    <FormRow fullWidth>
      <JSONEditor
        value={automationScript || ''}
        minRows={15}
        onChange={(json) => dispatch(setAction({ automationScript: json }))}
        disabled={disabled}
      />
    </FormRow>
  );
}

export default AutomationScript;
