Extendable embed stream tabs

2026-09-12 13:01:11 +08:00 · 2017-11-15 19:38:25 +01:00
parent 81d90cb138
commit ce4ad426a7
8 changed files with 108 additions and 70 deletions
@@ -0,0 +1,42 @@
+import React from 'react';
+import {Spinner, TabBar, TabContent} from 'coral-ui';
+import PropTypes from 'prop-types';
+import styles from './ExtendableTabPanel.css';
+
+class ExtendableTabPanel extends React.Component {
+
+  render() {
+    const {activeTab, setActiveTab, tabs, tabPanes, sub, loading, ...rest} = this.props;
+    return (
+      <div {...rest}>
+        <TabBar activeTab={activeTab} onTabClick={setActiveTab} sub={sub}>
+          {tabs}
+        </TabBar>
+        {loading
+          ? <div className={styles.spinnerContainer}><Spinner /></div>
+          : <TabContent activeTab={activeTab} sub={sub}>
+            {tabPanes}
+          </TabContent>
+        }
+      </div>
+    );
+  }
+}
+
+ExtendableTabPanel.propTypes = {
+  activeTab: PropTypes.string.isRequired,
+  setActiveTab: PropTypes.func.isRequired,
+  loading: PropTypes.bool,
+  tabs: PropTypes.oneOfType([
+    PropTypes.element,
+    PropTypes.arrayOf(PropTypes.element)
+  ]),
+  tabPanes: PropTypes.oneOfType([
+    PropTypes.element,
+    PropTypes.arrayOf(PropTypes.element)
+  ]),
+  className: PropTypes.string,
+  sub: PropTypes.bool,
+};
+
+export default ExtendableTabPanel;