1 files changed, 4 insertions, 42 deletions

diff --git a/modern/src/settings/CommandPage.js b/modern/src/settings/CommandPage.js
index 0b0f54b6..0cd440e1 100644
--- a/modern/src/settings/CommandPage.js
+++ b/modern/src/settings/CommandPage.js
@@ -1,13 +1,11 @@
-import React, { useEffect, useState } from 'react';
+import React, { useState } from 'react';
 import {
-  Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography, TextField, FormControlLabel, Checkbox,
+  Accordion, AccordionSummary, AccordionDetails, makeStyles, Typography, TextField,
 } from '@material-ui/core';
 import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
 import EditItemView from '../EditItemView';
 import { useTranslation } from '../LocalizationProvider';
-import SelectField from '../form/SelectField';
-import { prefixString } from '../common/stringUtils';
-import useCommandAttributes from '../attributes/useCommandAttributes';
+import BaseCommandView from './BaseCommandView';
 
 const useStyles = makeStyles(() => ({
   details: {
@@ -19,16 +17,7 @@ const CommandPage = () => {
   const classes = useStyles();
   const t = useTranslation();
 
-  const availableAttributes = useCommandAttributes(t);
-
   const [item, setItem] = useState();
-  const [attributes, setAttributes] = useState([]);
-
-  useEffect(() => {
-    if (item && item.type) {
-      setAttributes(availableAttributes[item.type] || []);
-    }
-  }, [availableAttributes, item]);
 
   const validate = () => item && item.type;
 
@@ -49,34 +38,7 @@ const CommandPage = () => {
               label={t('sharedDescription')}
               variant="filled"
             />
-            <SelectField
-              margin="normal"
-              value={item.type || 'custom'}
-              emptyValue={null}
-              onChange={(e) => setItem({ ...item, type: e.target.value, attributes: {} })}
-              endpoint="/api/commands/types"
-              keyGetter={(it) => it.type}
-              titleGetter={(it) => t(prefixString('command', it.type))}
-              label={t('sharedType')}
-              variant="filled"
-            />
-            {attributes.map((attribute) => (
-              <TextField
-                margin="normal"
-                value={item.attributes[attribute.key]}
-                onChange={(e) => {
-                  const updateItem = { ...item, attributes: { ...item.attributes } };
-                  updateItem.attributes[attribute.key] = e.target.value;
-                  setItem(updateItem);
-                }}
-                label={attribute.name}
-                variant="filled"
-              />
-            ))}
-            <FormControlLabel
-              control={<Checkbox checked={item.textChannel} onChange={(event) => setItem({ ...item, textChannel: event.target.checked })} />}
-              label={t('commandSendSms')}
-            />
+            <BaseCommandView item={item} setItem={setItem} />
           </AccordionDetails>
         </Accordion>
       )}