diff --git a/web/src/containers/Admin/Chat/index.css b/web/src/containers/Admin/Chat/index.css
index 9dd9e1757b..5650de34ad 100644
--- a/web/src/containers/Admin/Chat/index.css
+++ b/web/src/containers/Admin/Chat/index.css
@@ -1,36 +1,36 @@
-.chat-tabs.ant-tabs {
+.admin-chat-feature-wrapper .chat-tabs.ant-tabs {
width: 100%;
}
-.banlist {
+.admin-chat-feature-wrapper .banlist {
max-width: 250px;
}
-.chat-header {
+.admin-chat-feature-wrapper .chat-header {
color: #ffffff;
font-size: 18px;
}
-.chat-header .small-text {
+.admin-chat-feature-wrapper .chat-header .small-text {
color: #ffffff;
font-size: 13px;
margin: 0 !important;
}
-.switch-label {
+.admin-chat-feature-wrapper .switch-label {
margin: 0px 5px;
font-weight: bold;
font-size: 14px;
color: #ffffff;
}
-.switch-wrapper {
+.admin-chat-feature-wrapper .switch-wrapper {
margin: 1rem 0rem 5rem 0rem;
}
-.switch-wrapper .ant-switch {
+.admin-chat-feature-wrapper .switch-wrapper .ant-switch {
background-color: #000000;
}
-.switch-label::after {
+.admin-chat-feature-wrapper .switch-label::after {
color: #808080;
}
-.switch-wrapper .label-inactive {
+.admin-chat-feature-wrapper .switch-wrapper .label-inactive {
color: #808080;
}
diff --git a/web/src/containers/Admin/Chat/index.js b/web/src/containers/Admin/Chat/index.js
index cb56fbf066..fe500d9015 100644
--- a/web/src/containers/Admin/Chat/index.js
+++ b/web/src/containers/Admin/Chat/index.js
@@ -266,7 +266,7 @@ class Chat extends Component {
isActive,
} = this.state;
return (
-
+
{!ready ? (
- {isActive ?
+ {isActive ? (
- : null
- }
+ ) : null}
)}
diff --git a/web/src/containers/Admin/General/FooterConfig.js b/web/src/containers/Admin/General/FooterConfig.js
index de375e497c..82650eef6f 100644
--- a/web/src/containers/Admin/General/FooterConfig.js
+++ b/web/src/containers/Admin/General/FooterConfig.js
@@ -1,5 +1,5 @@
import React, { Component } from 'react';
-import { Button, Modal } from 'antd';
+import { Modal } from 'antd';
import { PlusOutlined } from '@ant-design/icons';
import _isEqual from 'lodash/isEqual';
@@ -13,46 +13,56 @@ const link_sections = (
fields = {},
links = {},
addLink = () => {},
- addColumn = () => {},
handleRemoveHeader = () => {},
- handleRemoveLinks = () => {}
+ handleRemoveLinks = () => {},
+ isInitial = false
) => {
const sectionFields = {};
Object.keys(links)
- .filter((sectionKey) => typeof links[sectionKey] === 'object')
+ .filter((sectionKey) => {
+ let value = typeof links[sectionKey] === 'object';
+ if (!isInitial) {
+ value =
+ typeof links[sectionKey] === 'object' &&
+ typeof fields[sectionKey] === 'object';
+ }
+ return value;
+ })
.forEach((key) => {
let section = links[key];
let headerFields = {};
let contentFields = {};
- Object.keys(section.header).forEach((key) => {
- headerFields[key] = {
- type: 'input',
- label: key,
- placeholder: key,
- isClosable: true,
- closeCallback: () => handleRemoveHeader(key),
- };
- });
- Object.keys(section.content).forEach((key) => {
- contentFields[key] = {
- type: 'input',
- label: key,
- placeholder: key,
- isClosable: true,
- closeCallback: () => handleRemoveLinks(headerFields, key),
+ if (section.header) {
+ Object.keys(section.header).forEach((key) => {
+ headerFields[key] = {
+ type: 'input',
+ label: key,
+ placeholder: key,
+ isClosable: true,
+ closeCallback: () => handleRemoveHeader(key),
+ };
+ });
+ Object.keys(section.content).forEach((key) => {
+ contentFields[key] = {
+ type: 'input',
+ label: key,
+ placeholder: key,
+ isClosable: true,
+ closeCallback: () => handleRemoveLinks(headerFields, key),
+ };
+ });
+ sectionFields[key] = {
+ className: 'section-wrapper',
+ header: {
+ className: 'section-header',
+ fields: headerFields,
+ },
+ content: {
+ className: 'section-header',
+ fields: contentFields,
+ },
};
- });
- sectionFields[key] = {
- className: 'section-wrapper',
- header: {
- className: 'section-header',
- fields: headerFields,
- },
- content: {
- className: 'section-header',
- fields: contentFields,
- },
- };
+ }
});
// if (is_custom) {
const formFields = {
@@ -63,31 +73,20 @@ const link_sections = (
Object.keys(formFields).forEach((key) => {
const field = formFields[key];
count = count + (field.header ? 1 : 0);
- formFields[key] = {
- ...field,
- bottomLink: (
-
-
addLink(key)}>
-
-
- ),
- };
+ if (typeof field === 'object' && field.header) {
+ formFields[key] = {
+ ...field,
+ bottomLink: (
+
+
addLink(key)}>
+
+
+ ),
+ };
+ }
});
- formFields[`section_${count}`] = {
- className: 'section-wrapper center-content',
- bottomLink: (
-
addColumn(`section_${count}`)}
- className="green-btn"
- >
- Add column
-
- ),
- };
return formFields;
// } else {
// return { section_1, section_2, section_3, section_4, section_5 };
@@ -119,9 +118,9 @@ class FooterConfig extends Component {
{},
this.props.links,
this.addLink,
- this.addColumn,
this.handleRemoveHeader,
- this.handleRemoveLinks
+ this.handleRemoveLinks,
+ true
),
initialCustom: {
column_header_1: 'EXCHANGE',
@@ -142,9 +141,9 @@ class FooterConfig extends Component {
{},
this.props.links,
this.addLink,
- this.addColumn,
this.handleRemoveHeader,
- this.handleRemoveLinks
+ this.handleRemoveLinks,
+ true
),
});
}
@@ -167,7 +166,6 @@ class FooterConfig extends Component {
prevFields,
this.props.links,
this.addLink,
- this.addColumn,
this.handleRemoveHeader,
this.handleRemoveLinks
),
@@ -200,7 +198,6 @@ class FooterConfig extends Component {
this.state.custom_fields,
this.props.links,
this.addLink,
- this.addColumn,
this.handleRemoveHeader,
this.handleRemoveLinks
),
@@ -230,9 +227,19 @@ class FooterConfig extends Component {
: [];
if (!headerKeys.includes(headerName)) {
data[key] = section;
+ } else {
+ data[key] = '';
}
});
- this.setState({ custom_fields: data });
+ this.setState({
+ custom_fields: link_sections(
+ data,
+ this.props.links,
+ this.addLink,
+ this.handleRemoveHeader,
+ this.handleRemoveLinks
+ ),
+ });
};
handleRemoveLinks = (headerFields = {}, fieldName) => {
@@ -307,7 +314,6 @@ class FooterConfig extends Component {
custom_fields,
this.props.links,
this.addLink,
- this.addColumn,
this.handleRemoveHeader,
this.handleRemoveLinks
),
@@ -365,6 +371,8 @@ class FooterConfig extends Component {
header,
content,
};
+ } else {
+ formValues[sectionKey] = '';
}
});
this.props.handleSubmitFooter(formValues, 'links');
@@ -379,6 +387,7 @@ class FooterConfig extends Component {
fields={custom_fields}
initialValues={initialCustom}
customFields={true}
+ addColumn={this.addColumn}
handleSubmitLinks={this.handleSubmitLinks}
/>
{/*
diff --git a/web/src/containers/Admin/General/FooterForm.js b/web/src/containers/Admin/General/FooterForm.js
index 6997d523ec..3229ded7d1 100644
--- a/web/src/containers/Admin/General/FooterForm.js
+++ b/web/src/containers/Admin/General/FooterForm.js
@@ -1,6 +1,8 @@
import React, { Component, Fragment } from 'react';
import { reduxForm } from 'redux-form';
import { Button } from 'antd';
+import _findLast from 'lodash/findLast';
+import _findLastKey from 'lodash/findLastKey';
import renderFields from '../../../components/AdminForm/utils';
@@ -15,44 +17,69 @@ class FormWrapper extends Component {
this.props.handleSubmitLinks(formProps);
};
+ getNewIndexFromFields = (fields = {}) => {
+ const finalColumn = _findLast(fields);
+ if (finalColumn && finalColumn.header && finalColumn.header.fields) {
+ const headerKey = _findLastKey(finalColumn.header.fields);
+ if (headerKey) {
+ let count = headerKey.replace('column_header_', '');
+ return isNaN(count) ? count : parseInt(count, 10) + 1;
+ }
+ }
+ return 1;
+ };
+
renderCustomFields = (fields = {}) => {
const { getFieldDecorator } = this.props.form;
+ let count = this.getNewIndexFromFields(fields);
return (
- {Object.keys(fields).map((key, index) => {
- let section = fields[key];
- return (
-
-
- {section.header ? (
-
-
+ {Object.keys(fields)
+ .filter((key) => typeof fields[key] !== 'string')
+ .map((key, index) => {
+ let section = fields[key];
+ return (
+
+
+ {section.header ? (
+
+
+ {renderFields(
+ section.header.fields,
+ getFieldDecorator,
+ this.props.initialValues
+ )}
+
+
+ ) : null}
+ {section.content ? (
+
{renderFields(
- section.header.fields,
+ section.content.fields,
getFieldDecorator,
this.props.initialValues
)}
-
-
- ) : null}
- {section.content ? (
-
- {renderFields(
- section.content.fields,
- getFieldDecorator,
- this.props.initialValues
- )}
-
- ) : null}
- {section.bottomLink ?
{section.bottomLink}
: null}
-
{section.bottomLink}
: null}
+
- );
- })}
+ {/* ) : null} */}
+
+ );
+ })}
+
+ this.props.addColumn(`section_${count}`)}
+ className="green-btn"
+ >
+ Add column
+
+
-
Trading Interface
+
Features
- Select the trading interface that will be available on your exchange.
- All interfaces includes a crypto wallet.
+ Select the features that will be available on your exchange.
-
@@ -69,7 +68,7 @@ const InterfaceForm = ({ initialValues = {}, handleSaveInterface }) => {
-
+