Merge pull request #8 from amina-deriv/upgrade_model_new_signup

Amina/Upgrade model new signup

packages/components/src/components/icon/icons.js

@@ -161,6 +161,12 @@ import './common/ic-arrow-right-curly.svg';
 import './common/ic-arrow-right.svg';
 import './common/ic-arrow-up-bold.svg';
 import './common/ic-arrow-up.svg';
+import './common/ic-assets-commodities.svg';
+import './common/ic-assets-crypto.svg';
+import './common/ic-assets-forex.svg';
+import './common/ic-assets-indices.svg';
+import './common/ic-assets-stocks.svg';
+import './common/ic-assets-synthetics.svg';
 import './common/ic-attachment.svg';
 import './common/ic-bank-dashboard.svg';
 import './common/ic-bank.svg';

packages/components/src/components/table/table-footer.jsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import classNames from 'classnames';
+import PropTypes from 'prop-types';
+
+const Footer = ({ children, className }) => (
+    <div role='rowgroup' className={classNames('dc-table__footer', className)}>
+        {children}
+    </div>
+);
+
+Footer.propTypes = {
+    children: PropTypes.node.isRequired,
+    className: PropTypes.string,
+};
+
+export default Footer;

packages/components/src/components/table/table.jsx

@@ -5,6 +5,7 @@ import Header from './table-header.jsx';
 import Body from './table-body.jsx';
 import Row from './table-row.jsx';
 import Cell from './table-cell.jsx';
+import Footer from './table-footer.jsx';
 import ThemedScrollbars from '../themed-scrollbars/themed-scrollbars.jsx';
 
 // TODO: update the <Table /> component to fit with the DataTable in Trader
@@ -35,6 +36,6 @@ Table.Header = Header;
 Table.Body = Body;
 Table.Row = Row;
 Table.Cell = Cell;
-// TODO add footer
+Table.Footer = Footer;
 
 export default Table;

packages/components/src/components/table/table.scss

@@ -48,6 +48,9 @@
             justify-content: flex-end;
         }
     }
+    &__footer {
+        height: 80px;
+    }
     &--scroll {
         .dc-table__header {
             position: sticky;

packages/components/stories/icon/icons.js

@@ -167,6 +167,12 @@ export const icons = {
         'IcArrowRight',
         'IcArrowUpBold',
         'IcArrowUp',
+        'IcAssetsCommodities',
+        'IcAssetsCrypto',
+        'IcAssetsForex',
+        'IcAssetsIndices',
+        'IcAssetsStocks',
+        'IcAssetsSynthetics',
         'IcAttachment',
         'IcBankDashboard',
         'IcBank',