Add a button to launch community browser directly from action panel.

Author: ianmacd

_locales/en/messages.json

@@ -526,5 +526,6 @@
   "reactionPopupThree": "$name$, $name2$ & $name3$",
   "reactionPopupMany": "$name$, $name2$, $name3$ &",
   "reactionListCountSingular": "And $otherSingular$ has reacted <span>$emoji$</span> to this message",
-  "reactionListCountPlural": "And $otherPlural$ have reacted <span>$emoji$</span> to this message"
+  "reactionListCountPlural": "And $otherPlural$ have reacted <span>$emoji$</span> to this message",
+  "launchingCommunityBrowser": "Launching communities in browser..."
 }

ts/components/leftpane/ActionsPanel.tsx

@@ -28,11 +28,11 @@ import { editProfileModal, onionPathModal } from '../../state/ducks/modalDialog'
 
 // tslint:disable-next-line: no-import-side-effect no-submodule-imports
 
-import { ipcRenderer } from 'electron';
+import { ipcRenderer, shell } from 'electron';
 import { loadDefaultRooms } from '../../session/apis/open_group_api/opengroupV2/ApiUtil';
 import { getOpenGroupManager } from '../../session/apis/open_group_api/opengroupV2/OpenGroupManagerV2';
 import { getSwarmPollingInstance } from '../../session/apis/snode_api';
-import { UserUtils } from '../../session/utils';
+import { ToastUtils, UserUtils } from '../../session/utils';
 import { Avatar, AvatarSize } from '../avatar/Avatar';
 import { ActionPanelOnionStatusLight } from '../dialog/OnionStatusPathDialog';
 import { SessionIconButton } from '../icon';
@@ -75,6 +75,9 @@ const Section = (props: { type: SectionType }) => {
         usePrimaryColor: true,
         dispatch,
       });
+    } else if (type === SectionType.Communities) {
+      void shell.openExternal('https://sessioncommunities.online');
+      ToastUtils.pushToastSuccess('launch', window.i18n('launchingCommunityBrowser'))
     } else if (type === SectionType.PathIndicator) {
       // Show Path Indicator Modal
       dispatch(onionPathModal({}));
@@ -121,6 +124,16 @@ const Section = (props: { type: SectionType }) => {
           isSelected={isSelected}
         />
       );
+    case SectionType.Communities:
+      return (
+        <SessionIconButton
+          iconSize="medium"
+          dataTestId="communities-section"
+          iconType={'communities'}
+          onClick={handleClick}
+          isSelected={isSelected}
+        />
+      );
     case SectionType.PathIndicator:
       return (
         <ActionPanelOnionStatusLight
@@ -293,6 +306,7 @@ export const ActionsPanel = () => {
         <Section type={SectionType.Profile} />
         <Section type={SectionType.Message} />
         <Section type={SectionType.Settings} />
+        <Section type={SectionType.Communities} />
         <Section type={SectionType.PathIndicator} />
         <Section type={SectionType.ColorMode} />
       </LeftPaneSectionContainer>

ts/state/ducks/section.tsx

@@ -10,6 +10,7 @@ export enum SectionType {
   Profile,
   Message,
   Settings,
+  Communities,
   ColorMode,
   PathIndicator,
 }

ts/types/LocalizerKeys.ts

@@ -526,4 +526,6 @@ export type LocalizerKeys =
   | 'openGroupsTitle'
   | 'serverBanUserAndDeleteAll'
   | 'serverBanUser'
-  | 'serverUnbanUser';
+  | 'serverUnbanUser'
+  | 'reportIssue'
+  | 'launchingCommunityBrowser';