refactor: minor cleanup

src/components/modals/main/settings/ChipSelect.jsx

@@ -9,7 +9,9 @@ import Chip from '@mui/material/Chip';
 
 function ChipSelect({ label, options, name }) {
   let start = (localStorage.getItem('apiCategories') || '').split(',');
-  if (start[0] === '') start = [];
+  if (start[0] === '') {
+    start = [];
+  }
 
   const [optionsSelected, setoptionsSelected] = useState(start);
 

src/components/modals/main/settings/Header.jsx

@@ -8,7 +8,7 @@ import Switch from './Switch';
 import SettingsItem from './SettingsItem';
 
 import { values } from 'modules/helpers/settings/modals';
-import Tooltip from '../../../helpers/tooltip/Tooltip';
+import Tooltip from 'components/helpers/tooltip/Tooltip';
 
 export default class Header extends PureComponent {
   render() {

src/components/modals/main/settings/ResetModal.jsx

@@ -2,7 +2,7 @@ import { memo } from 'react';
 import variables from 'modules/variables';
 import { MdClose, MdRestartAlt } from 'react-icons/md';
 import { setDefaultSettings } from 'modules/helpers/settings';
-import Tooltip from '../../../helpers/tooltip/Tooltip';
+import Tooltip from 'components/helpers/tooltip/Tooltip';
 
 function ResetModal({ modalClose }) {
   const reset = () => {

src/components/modals/main/settings/Text.jsx

@@ -54,6 +54,7 @@ export default class Text extends PureComponent {
             value={this.state.value}
             onChange={this.handleChange}
             varient="outlined"
+            className={this.props.customcss ? 'customcss' : ''}
             multiline
             spellCheck={false}
             minRows={4}

src/components/modals/main/settings/sections/Experimental.jsx

@@ -34,7 +34,7 @@ function ExperimentalSettings() {
           marks={values('experimental')}
           element=".other"
         />
-        <p>Send Event</p>
+        <p style={{ textAlign: 'left' }}>Send Event</p>
         <TextField
           label={'Type'}
           value={eventType}
@@ -51,14 +51,14 @@ function ExperimentalSettings() {
           varient="outlined"
           InputLabelProps={{ shrink: true }}
         />
-      </SettingsItem>
-      <SettingsItem
-        title={variables.getMessage('modals.main.settings.sections.experimental.developer')}
-        final={true}
-      >
-        <button className="uploadbg" onClick={() => EventBus.dispatch(eventType, eventName)}>
+                <button className="uploadbg" onClick={() => EventBus.dispatch(eventType, eventName)}>
           Send
         </button>
+      </SettingsItem>
+      <SettingsItem
+        title='Data'
+        final={true}
+      >
         <button
           className="reset"
           style={{ marginLeft: '0px' }}

src/components/modals/main/settings/sections/Message.jsx

@@ -78,7 +78,7 @@ export default class Message extends PureComponent {
         </SettingsItem>
         <div className="messagesContainer">
           {this.state.messages.map((_url, index) => (
-            <div className="messageMap">
+            <div className="messageMap" key={index}>
               <div className="flexGrow">
                 <div className="icon">
                   <MdOutlineTextsms />

src/components/modals/main/settings/sections/advanced/Advanced.jsx

@@ -130,7 +130,7 @@ export default class AdvancedSettings extends PureComponent {
             'modals.main.settings.sections.advanced.custom_css_subtitle',
           )}
         >
-          <Text name="customcss" textarea={true} category="other" />
+          <Text name="customcss" textarea={true} category="other" customcss={true} />
         </SettingsItem>
         <SettingsItem
           title={variables.getMessage('modals.main.settings.sections.experimental.title')}

src/components/modals/main/settings/sections/background/Custom.jsx

@@ -15,7 +15,7 @@ import { videoCheck } from 'modules/helpers/background/widget';
 
 import Checkbox from '../../Checkbox';
 import FileUpload from '../../FileUpload';
-import Tooltip from '../../../../../helpers/tooltip/Tooltip';
+import Tooltip from 'components/helpers/tooltip/Tooltip';
 
 import Modal from 'react-modal';
 

src/components/modals/main/settings/sections/background/CustomURLModal.jsx

@@ -1,7 +1,7 @@
 import variables from 'modules/variables';
 import { useState, memo } from 'react';
 import { MdAdd, MdClose } from 'react-icons/md';
-import Tooltip from '../../../../../helpers/tooltip/Tooltip';
+import Tooltip from 'components/helpers/tooltip/Tooltip';
 
 function CustomURLModal({ modalClose, modalCloseOnly }) {
   const [url, setURL] = useState();