[frontend] Added bulk dialog and language support

opencti-platform/opencti-front/lang/front/de.json

@@ -2674,5 +2674,10 @@
   "Strategic": "Strategisch",
   "Link created": "Link erstellt",
   "Public dashboard": "Öffentliches Dashboard",
-  "Unless specific groups are selected, user will be created with default groups only.": "Wenn keine spezifischen Gruppen ausgewählt werden, wird der Benutzer nur mit den Standardgruppen erstellt."
+  "Unless specific groups are selected, user will be created with default groups only.": "Wenn keine spezifischen Gruppen ausgewählt werden, wird der Benutzer nur mit den Standardgruppen erstellt.",
+  "Multiple Values Entered Edit with the TT button": "Mehrere eingegebene Werte Bearbeiten Sie mit der TT-Taste",
+  "Bulk Observable Creation": "Massenbeobachtbare Erstellung",
+  "Observables listed must be of the same type.": "Die aufgeführten Observablen müssen vom gleichen Typ sein.",
+  "One Observable per line.": "Ein Observable pro Zeile.",
+  "Bulk Content": "Masseninhalte"
 }

opencti-platform/opencti-front/lang/front/en.json

@@ -2674,5 +2674,10 @@
   "Operational": "Operational",
   "Strategic": "Strategic",
   "Link created": "Link created",
-  "Public dashboard": "Public dashboard"
+  "Public dashboard": "Public dashboard",
+  "Multiple Values Entered Edit with the TT button": "Multiple Values Entered Edit with the TT button",
+  "Bulk Observable Creation": "Bulk Observable Creation",
+  "Observables listed must be of the same type.": "Observables listed must be of the same type.",
+  "One Observable per line.": "One Observable per line.",
+  "Bulk Content": "Bulk Content"
 }

opencti-platform/opencti-front/lang/front/es.json

@@ -2674,5 +2674,10 @@
   "Strategic": "Estratégico",
   "Link created": "Enlace creado",
   "Public dashboard": "Cuadro de mandos público",
-  "Unless specific groups are selected, user will be created with default groups only.": "A menos que se seleccionen grupos específicos, el usuario se creará sólo con los grupos por defecto."
+  "Unless specific groups are selected, user will be created with default groups only.": "A menos que se seleccionen grupos específicos, el usuario se creará sólo con los grupos por defecto.",
+  "Multiple Values Entered Edit with the TT button": "Múltiples valores ingresados ​​Editar con el botón TT",
+  "Bulk Observable Creation": "Creación observable masiva",
+  "Observables listed must be of the same type.": "Los observables enumerados deben ser del mismo tipo.",
+  "One Observable per line.": "Un Observable por línea.",
+  "Bulk Content": "Contenido masivo"
 }

opencti-platform/opencti-front/lang/front/fr.json

@@ -2674,5 +2674,11 @@
   "Strategic": "Stratégique",
   "Link created": "Lien créé",
   "Public dashboard": "Tableau de bord public",
-  "Unless specific groups are selected, user will be created with default groups only.": "À moins que des groupes spécifiques ne soient sélectionnés, l'utilisateur sera créé avec les groupes par défaut uniquement."
+  "Unless specific groups are selected, user will be created with default groups only.": "À moins que des groupes spécifiques ne soient sélectionnés, l'utilisateur sera créé avec les groupes par défaut uniquement.",
+  "Multiple Values Entered Edit with the TT button": "Plusieurs valeurs saisies Modifier avec le bouton TT",
+  "Bulk Observable Creation": "Création observable en masse",
+  "Observables listed must be of the same type.": "Les observables répertoriés doivent être du même type.",
+  "One Observable per line.": "Un observable par ligne.",
+  "Bulk Content": "Contenu en vrac"
+
 }

opencti-platform/opencti-front/lang/front/ja.json

@@ -2674,5 +2674,10 @@
   "Strategic": "戦略的",
   "Link created": "リンク作成",
   "Public dashboard": "公開ダッシュボード",
-  "Unless specific groups are selected, user will be created with default groups only.": "特定のグループを選択しない限り、ユーザーはデフォルトのグループのみで作成されます。"
+  "Unless specific groups are selected, user will be created with default groups only.": "特定のグループを選択しない限り、ユーザーはデフォルトのグループのみで作成されます。",
+  "Multiple Values Entered Edit with the TT button": "複数の値を入力 TT ボタンで編集",
+  "Bulk Observable Creation": "監視可能な一括作成",
+  "Observables listed must be of the same type.": "リストされる Observable は同じタイプである必要があります。",
+  "One Observable per line.": "1 行に 1 つの Observable。",
+  "Bulk Content": "バルクコンテンツ"
 }

opencti-platform/opencti-front/lang/front/zh.json

@@ -2674,5 +2674,10 @@
   "Strategic": "战略",
   "Link created": "创建的链接",
   "Public dashboard": "公共仪表板",
-  "Unless specific groups are selected, user will be created with default groups only.": "除非选择了特定组，否则创建的用户将只包含默认组。"
+  "Unless specific groups are selected, user will be created with default groups only.": "除非选择了特定组，否则创建的用户将只包含默认组。",
+  "Multiple Values Entered Edit with the TT button": "输入多个值 使用 TT 按钮进行编辑",
+  "Bulk Observable Creation": "批量可观察创建",
+  "Observables listed must be of the same type.": "列出的可观察量必须属于同一类型。",
+  "One Observable per line.": "每行一个 Observable。",
+  "Bulk Content": "批量内容"
 }

opencti-platform/opencti-front/src/private/components/observations/stix_cyber_observables/StixCyberObservableCreation.jsx

@@ -11,12 +11,14 @@ import * as Yup from 'yup';
 import { graphql } from 'react-relay';
 import DialogTitle from '@mui/material/DialogTitle';
 import DialogContent from '@mui/material/DialogContent';
+import DialogActions from '@mui/material/DialogActions';
 import Tooltip from '@mui/material/Tooltip';
 import Dialog from '@mui/material/Dialog';
 import List from '@mui/material/List';
 import ListItemText from '@mui/material/ListItemText';
 import makeStyles from '@mui/styles/makeStyles';
 import { ListItemButton } from '@mui/material';
+import * as PropTypes from 'prop-types';
 import { commitMutation, handleErrorInForm, QueryRenderer } from '../../../../relay/environment';
 import TextField from '../../../../components/TextField';
 import SwitchField from '../../../../components/SwitchField';
@@ -226,9 +228,16 @@ const StixCyberObservableCreation = ({
   const handleOpen = () => setStatus({ open: true, type: status.type });
   const localHandleClose = () => setStatus({ open: false, type: type ?? null });
   const selectType = (selected) => setStatus({ open: status.open, type: selected });
+  const bulkAddMsg = t_i18n('Multiple Values Entered Edit with the TT button');
 
   const onSubmit = (values, { setSubmitting, setErrors, resetForm }) => {
     let adaptedValues = values;
+
+    // Bulk Add Modal was used
+    if (adaptedValues.value && adaptedValues.bulk_value_field && adaptedValues.value === bulkAddMsg) {
+      adaptedValues.value = adaptedValues.bulk_value_field;
+    }
+
     // Potential dicts
     if (
       adaptedValues.hashes_MD5
@@ -331,7 +340,7 @@ const StixCyberObservableCreation = ({
       });
     };
 
-    const valueList = values?.value?.split('\n') || values?.value;
+    const valueList = (values != null && values?.value?.split('\n')) || values?.value;
     if (valueList) {
     // loop and commit
       for (const value of valueList) {
@@ -389,6 +398,85 @@ const StixCyberObservableCreation = ({
     );
   };
 
+  function BulkAddModal(props) {
+    const [openBulkModal, setOpenBulkModal] = React.useState(false);
+    const handleOpenBulkModal = () => {
+      setOpenBulkModal(true);
+    };
+    const handleCloseBulkModal = () => {
+      setOpenBulkModal(false);
+      const bulk_value_field = document.getElementById('bulk_value_field');
+      const generic_value_field = document.getElementById('generic_value_field');
+      if (bulk_value_field != null && bulk_value_field.value != null && bulk_value_field.value.length > 0) {
+        props.setValue('value', bulkAddMsg);
+        generic_value_field.disabled = true;
+      } else {
+        props.setValue('value', '');
+        generic_value_field.disabled = false;
+      }
+    };
+    const localHandleCancelClearBulkModal = () => {
+      setOpenBulkModal(false);
+      const generic_value_field = document.getElementById('generic_value_field');
+      generic_value_field.disabled = false;
+      props.setValue('value', '');
+      props.setValue('bulk_value_field', '');
+    };
+    return (
+      <React.Fragment>
+        <IconButton
+          onClick={handleOpenBulkModal}
+          size="large"
+          color="primary" style={{ float: 'right' }}
+        >
+          <TextFieldsOutlined />
+        </IconButton>
+        <Dialog
+          PaperProps={{ elevation: 3 }}
+          open={openBulkModal}
+          onClose={handleCloseBulkModal}
+          fullWidth={true}
+        >
+          <DialogTitle>{t_i18n('Bulk Observable Creation')}</DialogTitle>
+          <DialogContent style={{ marginTop: 0, paddingTop: 0 }}>
+            <Typography id="add-bulk-observable-instructions" variant="subtitle1" component="subtitle1" style={{ whiteSpace: 'pre-line' }}>
+              <div style={{ border: '2px solid #FFA500', paddingLeft: 10 }}>
+                {t_i18n('Observables listed must be of the same type.')}
+                <br/>
+                {t_i18n('One Observable per line.')}
+              </div>
+            </Typography>
+            <Typography style={{ float: 'left', marginTop: 10 }}>
+              {t_i18n('Bulk Content')}
+            </Typography>
+            <Field
+              component={TextField}
+              id="bulk_value_field"
+              variant="standard"
+              key="bulk_value_field"
+              name="bulk_value_field"
+              fullWidth={true}
+              multiline={true}
+              rows="5"
+            />
+            <DialogActions>
+              <Button onClick={localHandleCancelClearBulkModal}>
+                {t_i18n('Cancel')}
+              </Button>
+              <Button color="secondary" onClick={handleCloseBulkModal}>
+                {t_i18n('Continue')}
+              </Button>
+            </DialogActions>
+          </DialogContent>
+        </Dialog>
+      </React.Fragment>
+    );
+  }
+
+  BulkAddModal.propTypes = {
+    setValue: PropTypes.func,
+  };
+
   const renderForm = () => {
     return (
       <QueryRenderer
@@ -420,8 +508,6 @@ const StixCyberObservableCreation = ({
               ),
             )(props.schemaAttributeNames.edges);
             for (const attribute of attributes) {
-              // eslint-disable-next-line no-console
-              console.log(`attribute ===> ${JSON.stringify(attribute, null, 4)}`);
               if (isVocabularyField(status.type, attribute.value)) {
                 initialValues[attribute.value] = null;
               } else if (includes(attribute.value, dateAttributes)) {
@@ -586,28 +672,27 @@ const StixCyberObservableCreation = ({
                         }
                         if (attribute.value === 'value') {
                           return (
-                            <>
+                            <div key={attribute.value}>
                               <Typography style={{ float: 'left', marginTop: 20 }}>
                                 {attribute.value}
                               </Typography>
                               <Tooltip title="Copy/paste text content">
-                                <IconButton
-                                  size="large"
-                                  color="primary" style={{ float: 'right' }}
-                                >
-                                  <TextFieldsOutlined />
-                                </IconButton>
+                                <BulkAddModal
+                                  setValue={(field_name, new_value) => setFieldValue(field_name, new_value)}
+                                />
                               </Tooltip>
                               <Field
+                                id="generic_value_field"
+                                disabled={false}
                                 component={TextField}
                                 variant="standard"
                                 key={attribute.value}
                                 name={attribute.value}
                                 fullWidth={true}
                                 multiline={true}
-                                rows="3"
+                                rows="1"
                               />
-                            </>
+                            </div>
                           );
                         }
                         return (