success to create twostranded button for mobile

src/client/js/components/Navbar/ThreeStrandedButton.jsx

@@ -132,33 +132,9 @@ export const TwoStrandedButton = withTranslation()((props) => {
         aria-label="three-stranded-button"
         id="grw-three-stranded-button"
       >
-        { viewButton() }
-        { editButton() }
-        { hackMDButton() }
-        {/* <button
-          type="button"
-          className={`btn btn-outline-primary view-button ${editorMode === 'view' && 'active'} ${isBtnDisabled && 'disabled'}`}
-          onClick={() => { threeStrandedButtonClickedHandler('view') }}
-        >
-          <i className="icon-control-play icon-fw grw-three-stranded-button-icon" />
-          { t('view') }
-        </button>
-        <button
-          type="button"
-          className={`btn btn-outline-primary edit-button ${editorMode === 'edit' && 'active'} ${isBtnDisabled && 'disabled'}`}
-          onClick={() => { threeStrandedButtonClickedHandler('edit') }}
-        >
-          <i className="icon-note icon-fw grw-three-stranded-button-icon" />
-          { t('Edit') }
-        </button>
-        <button
-          type="button"
-          className={`btn btn-outline-primary hackmd-button ${editorMode === 'hackmd' && 'active'} ${isBtnDisabled && 'disabled'}`}
-          onClick={() => { threeStrandedButtonClickedHandler('hackmd') }}
-        >
-          <i className="fa fa-fw fa-file-text-o grw-three-stranded-button-icon" />
-          { t('hackmd.hack_md') }
-        </button> */}
+        {editorMode === 'view' && <>{editButton()} {hackMDButton()}</>}
+        {editorMode === 'edit' && <>{viewButton()} {hackMDButton()}</>}
+        {editorMode === 'hackmd' && <>{viewButton()} {editButton()}</>}
       </div>
       {isBtnDisabled && (
         <UncontrolledTooltip placement="top" target="grw-three-stranded-button" fade={false}>