[Refactoring] Middle Header: Small refactoring

src/components/middle/HeaderActions.tsx

@@ -126,47 +126,51 @@ const HeaderActions: FC<OwnProps & StateProps & DispatchProps> = ({
 
   return (
     <div className="HeaderActions">
-      {!IS_SINGLE_COLUMN_LAYOUT && canExpandActions && canSubscribe && (
+      {!IS_SINGLE_COLUMN_LAYOUT && (
-        <Button
+        <>
-          size="tiny"
+          {canExpandActions && canSubscribe && (
-          ripple
+            <Button
-          fluid
+              size="tiny"
-          onClick={handleSubscribeClick}
+              ripple
-        >
+              fluid
-          {lang(isChannel ? 'ProfileJoinChannel' : 'ProfileJoinGroup')}
+              onClick={handleSubscribeClick}
-        </Button>
+            >
-      )}
+              {lang(isChannel ? 'ProfileJoinChannel' : 'ProfileJoinGroup')}
-      {!IS_SINGLE_COLUMN_LAYOUT && canExpandActions && canStartBot && (
+            </Button>
-        <Button
+          )}
-          size="tiny"
+          {canExpandActions && canStartBot && (
-          ripple
+            <Button
-          fluid
+              size="tiny"
-          onClick={handleStartBot}
+              ripple
-        >
+              fluid
-          {lang('BotStart')}
+              onClick={handleStartBot}
-        </Button>
+            >
-      )}
+              {lang('BotStart')}
-      {!IS_SINGLE_COLUMN_LAYOUT && canExpandActions && canRestartBot && (
+            </Button>
-        <Button
+          )}
-          size="tiny"
+          {canExpandActions && canRestartBot && (
-          ripple
+            <Button
-          fluid
+              size="tiny"
-          onClick={handleRestartBot}
+              ripple
-        >
+              fluid
-          {lang('BotRestart')}
+              onClick={handleRestartBot}
-        </Button>
+            >
-      )}
+              {lang('BotRestart')}
-      {!IS_SINGLE_COLUMN_LAYOUT && canSearch && (
+            </Button>
-        <Button
+          )}
-          round
+          {canSearch && (
-          ripple={isRightColumnShown}
+            <Button
-          color="translucent"
+              round
-          size="smaller"
+              ripple={isRightColumnShown}
-          onClick={handleSearchClick}
+              color="translucent"
-          ariaLabel="Search in this chat"
+              size="smaller"
-        >
+              onClick={handleSearchClick}
-          <i className="icon-search" />
+              ariaLabel="Search in this chat"
-        </Button>
+            >
+              <i className="icon-search" />
+            </Button>
+          )}
+        </>
       )}
       <Button
         ref={menuButtonRef}