Adds single panel option to the slider

src/features/rewards/walletSummarySlider/__snapshots__/spec.tsx.snap

@@ -7,193 +7,8 @@ exports[`WalletSummarySlider tests basic tests matches the snapshot 1`] = `
   position: relative;
 }
 
-.c1 {
-  height: 100%;
-  opacity: 1;
-  overflow: unset;
-}
-
-.c10 {
-  height: 0;
-  opacity: 0;
-  overflow: hidden;
-}
-
-.c2 {
-  width: 100%;
-  display: block;
-  padding: 20px 30px;
-  top: unset;
-  position: static;
-  background: #E9EBFF;
-}
-
-.c11 {
-  width: 100%;
-  display: block;
-  padding: 20px;
-  top: 12px;
-  position: absolute;
-  background: inherit;
-}
-
-.c5 {
-  color: #A1A8F2;
-  font-size: 14px;
-  font-weight: 600;
-  text-transform: uppercase;
-  -webkit-letter-spacing: 0.35px;
-  -moz-letter-spacing: 0.35px;
-  -ms-letter-spacing: 0.35px;
-  letter-spacing: 0.35px;
-  line-height: 22px;
-}
-
-.c7 {
-  width: 25px;
-  height: 25px;
-  display: block;
-  margin-left: 32px;
-  margin-top: -2px;
-  color: #696FDC;
-}
-
-.c12 {
-  width: 25px;
-  height: 25px;
-  display: block;
-  margin-left: 32px;
-  margin-top: -22px;
-  color: #696FDC;
-}
-
-.c3 {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-flex-direction: row;
-  -ms-flex-direction: row;
-  flex-direction: row;
-  -webkit-box-pack: end;
-  -webkit-justify-content: flex-end;
-  -ms-flex-pack: end;
-  justify-content: flex-end;
-}
-
-.c4 {
-  -webkit-flex: 5 0 0;
-  -ms-flex: 5 0 0;
-  flex: 5 0 0;
-}
-
-.c6 {
-  -webkit-flex: 1 0 0;
-  -ms-flex: 1 0 0;
-  flex: 1 0 0;
-}
-
-.c9 {
-  width: 100%;
-  height: 100%;
-  fill: currentColor;
-}
-
-.c8 {
-  -webkit-transform: rotate(180deg);
-  -ms-transform: rotate(180deg);
-  transform: rotate(180deg);
-}
-
 <div
   className="c0"
   id="wallet-slider"
->
-  <div
-    className="c1"
-  >
-    <div
-      className="c0"
-    >
-      <div
-        className="c2"
-        onClick={[Function]}
-      >
-        <div
-          className="c3"
-        >
-          <div
-            className="c4"
-            size="5"
-          >
-            <span
-              className="c5"
-            >
-              MISSING: rewardsSummary
-            </span>
-          </div>
-          <div
-            className="c6"
-            size="1"
-          >
-            <span
-              className="c7"
-            >
-              <svg
-                aria-hidden="true"
-                className="c8 c9"
-                focusable="false"
-                viewBox="0 0 32 32"
-              >
-                <path
-                  d="M16 17.68292l6.3492-5.44218c.41933-.35942 1.05063-.31086 1.41006.10847.35942.41932.31086 1.05062-.10847 1.41005l-7 6c-.37449.32099-.9271.32099-1.30158 0l-7-6c-.41933-.35943-.46789-.99073-.10847-1.41005.35943-.41933.99073-.46789 1.41005-.10847L16 17.68292z"
-                />
-              </svg>
-            </span>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div
-    className="c10"
-  >
-    <div
-      className="c0"
-    >
-      <div
-        className="c11"
-        onClick={[Function]}
-      >
-        <div
-          className="c3"
-        >
-          <div
-            className="c4"
-            size="5"
-          />
-          <div
-            className="c6"
-            size="1"
-          >
-            <span
-              className="c12"
-            >
-              <svg
-                aria-hidden="true"
-                className="c9"
-                focusable="false"
-                viewBox="0 0 32 32"
-              >
-                <path
-                  d="M16 17.68292l6.3492-5.44218c.41933-.35942 1.05063-.31086 1.41006.10847.35942.41932.31086 1.05062-.10847 1.41005l-7 6c-.37449.32099-.9271.32099-1.30158 0l-7-6c-.41933-.35943-.46789-.99073-.10847-1.41005.35943-.41933.99073-.46789 1.41005-.10847L16 17.68292z"
-                />
-              </svg>
-            </span>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
+/>
 `;

src/features/rewards/walletSummarySlider/index.tsx

@@ -20,7 +20,7 @@ import { CaratUpIcon, CaratDownIcon } from '../../../components/icons'
 export interface Props {
   id?: string,
   onToggle?: () => void
-  children?: React.ReactNode[]
+  children?: React.ReactNode | React.ReactNode[]
 }
 
 interface State {
@@ -94,6 +94,14 @@ export default class WalletSummarySlider extends React.PureComponent<Props, Stat
   render () {
     const { id, children } = this.props
 
+    if (!Array.isArray(children) || children[0] === null) {
+      return (
+        <StyledWrapper id={id}>
+          {children}
+        </StyledWrapper>
+      )
+    }
+
     if (!children || children.length !== 2) {
       return null
     }