Merge branch 'feat/channel-preview' into 'master'

[Preview mode]Handle join channel without a member registration. See merge request kchat/webapp!608
Infomaniak · Feb 20, 2024 · bf27181 · bf27181
2 parents 2f8c06a + bedfb69
commit bf27181
Show file tree

Hide file tree

Showing 33 changed files with 571 additions and 180 deletions.
diff --git a/webapp/channels/src/actions/global_actions.tsx b/webapp/channels/src/actions/global_actions.tsx
@@ -55,6 +55,7 @@ import WebSocketClient from 'client/web_websocket_client';
 
 import type {GlobalState} from 'types/store';
 
+import {joinChannelById} from './views/channel';
 import {openModal} from './views/modals';
 
 const dispatch = store.dispatch;
@@ -442,6 +443,10 @@ export async function redirectUserToDefaultTeam() {
     getHistory().push('/select_team');
 }
 
+export function joinChannel(channelId: string) {
+    dispatch(joinChannelById(channelId));
+}
+
 export function redirectToManagerDashboard(groupId: number) {
     window.open(`${IKConstants.MANAGER_URL}v3/${groupId}/ng/kchat`, '_blank');
 }

diff --git a/webapp/channels/src/components/__snapshots__/size_aware_image.test.jsx.snap b/webapp/channels/src/components/__snapshots__/size_aware_image.test.jsx.snap
@@ -43,6 +43,48 @@ exports[`components/SizeAwareImage should load download and copy link buttons wh
         src="https://example.com/image.png"
         tabIndex="0"
       />
+      <span
+        className="image-preview-utility-buttons-container"
+        style={
+          Object {
+            "right": "50px",
+          }
+        }
+      >
+        <OverlayTrigger
+          className="hidden-xs"
+          defaultOverlayShown={false}
+          delayShow={500}
+          overlay={
+            <Tooltip
+              id="file-name__tooltip"
+            >
+              Save file to kDrive
+            </Tooltip>
+          }
+          placement="top"
+          rootClose={true}
+          trigger={
+            Array [
+              "hover",
+              "focus",
+            ]
+          }
+        >
+          <a
+            className="style--none size-aware-image__download"
+          >
+            <KDriveIcon
+              onClick={[Function]}
+              style={
+                Object {
+                  "transform": "scale(1.5)",
+                }
+              }
+            />
+          </a>
+        </OverlayTrigger>
+      </span>
       <span
         className="image-preview-utility-buttons-container"
       >
@@ -169,6 +211,48 @@ exports[`components/SizeAwareImage should match snapshot when handleSmallImageCo
         src="https://example.com/image.png"
         tabIndex="0"
       />
+      <span
+        className="image-preview-utility-buttons-container"
+        style={
+          Object {
+            "right": "50px",
+          }
+        }
+      >
+        <OverlayTrigger
+          className="hidden-xs"
+          defaultOverlayShown={false}
+          delayShow={500}
+          overlay={
+            <Tooltip
+              id="file-name__tooltip"
+            >
+              Save file to kDrive
+            </Tooltip>
+          }
+          placement="top"
+          rootClose={true}
+          trigger={
+            Array [
+              "hover",
+              "focus",
+            ]
+          }
+        >
+          <a
+            className="style--none size-aware-image__download"
+          >
+            <KDriveIcon
+              onClick={[Function]}
+              style={
+                Object {
+                  "transform": "scale(1.5)",
+                }
+              }
+            />
+          </a>
+        </OverlayTrigger>
+      </span>
       <span
         className="image-preview-utility-buttons-container"
       >
@@ -308,6 +392,48 @@ exports[`components/SizeAwareImage should render a placeholder and has loader wh
         src="https://example.com/image.png"
         tabIndex="0"
       />
+      <span
+        className="image-preview-utility-buttons-container"
+        style={
+          Object {
+            "right": "50px",
+          }
+        }
+      >
+        <OverlayTrigger
+          className="hidden-xs"
+          defaultOverlayShown={false}
+          delayShow={500}
+          overlay={
+            <Tooltip
+              id="file-name__tooltip"
+            >
+              Save file to kDrive
+            </Tooltip>
+          }
+          placement="top"
+          rootClose={true}
+          trigger={
+            Array [
+              "hover",
+              "focus",
+            ]
+          }
+        >
+          <a
+            className="style--none size-aware-image__download"
+          >
+            <KDriveIcon
+              onClick={[Function]}
+              style={
+                Object {
+                  "transform": "scale(1.5)",
+                }
+              }
+            />
+          </a>
+        </OverlayTrigger>
+      </span>
       <span
         className="image-preview-utility-buttons-container"
       >

diff --git a/...rc/components/advanced_create_comment/__snapshots__/advanced_create_comment.test.jsx.snap b/...rc/components/advanced_create_comment/__snapshots__/advanced_create_comment.test.jsx.snap
@@ -53,6 +53,7 @@ exports[`components/AdvancedCreateComment should match snapshot when cannot post
     handleUploadError={[Function]}
     handleUploadProgress={[Function]}
     handleUploadStart={[Function]}
+    handleVoiceMessageUploadStart={[Function]}
     hideEmojiPicker={[Function]}
     isFormattingBarHidden={false}
     isSchedulable={true}
@@ -63,6 +64,7 @@ exports[`components/AdvancedCreateComment should match snapshot when cannot post
     postMsgKeyPress={[Function]}
     removePreview={[Function]}
     serverError={null}
+    setDraftAsPostType={[Function]}
     setShowPreview={[Function]}
     shouldShowPreview={false}
     showEmojiPicker={false}
@@ -75,6 +77,7 @@ exports[`components/AdvancedCreateComment should match snapshot when cannot post
     toggleEmojiPicker={[Function]}
     uploadsProgressPercent={Object {}}
     useChannelMentions={true}
+    voiceMessageClientId=""
   />
 </form>
 `;
@@ -126,6 +129,7 @@ exports[`components/AdvancedCreateComment should match snapshot, comment with me
     handleUploadError={[Function]}
     handleUploadProgress={[Function]}
     handleUploadStart={[Function]}
+    handleVoiceMessageUploadStart={[Function]}
     hideEmojiPicker={[Function]}
     isFormattingBarHidden={false}
     isSchedulable={true}
@@ -136,6 +140,7 @@ exports[`components/AdvancedCreateComment should match snapshot, comment with me
     postMsgKeyPress={[Function]}
     removePreview={[Function]}
     serverError={null}
+    setDraftAsPostType={[Function]}
     setShowPreview={[Function]}
     shouldShowPreview={false}
     showEmojiPicker={false}
@@ -148,6 +153,7 @@ exports[`components/AdvancedCreateComment should match snapshot, comment with me
     toggleEmojiPicker={[Function]}
     uploadsProgressPercent={Object {}}
     useChannelMentions={true}
+    voiceMessageClientId=""
   />
 </form>
 `;
@@ -206,6 +212,7 @@ exports[`components/AdvancedCreateComment should match snapshot, emoji picker di
     handleUploadError={[Function]}
     handleUploadProgress={[Function]}
     handleUploadStart={[Function]}
+    handleVoiceMessageUploadStart={[Function]}
     hideEmojiPicker={[Function]}
     isFormattingBarHidden={false}
     isSchedulable={true}
@@ -216,6 +223,7 @@ exports[`components/AdvancedCreateComment should match snapshot, emoji picker di
     postMsgKeyPress={[Function]}
     removePreview={[Function]}
     serverError={null}
+    setDraftAsPostType={[Function]}
     setShowPreview={[Function]}
     shouldShowPreview={false}
     showEmojiPicker={false}
@@ -228,6 +236,7 @@ exports[`components/AdvancedCreateComment should match snapshot, emoji picker di
     toggleEmojiPicker={[Function]}
     uploadsProgressPercent={Object {}}
     useChannelMentions={true}
+    voiceMessageClientId=""
   />
 </form>
 `;
@@ -279,6 +288,7 @@ exports[`components/AdvancedCreateComment should match snapshot, empty comment 1
     handleUploadError={[Function]}
     handleUploadProgress={[Function]}
     handleUploadStart={[Function]}
+    handleVoiceMessageUploadStart={[Function]}
     hideEmojiPicker={[Function]}
     isFormattingBarHidden={false}
     isSchedulable={true}
@@ -289,6 +299,7 @@ exports[`components/AdvancedCreateComment should match snapshot, empty comment 1
     postMsgKeyPress={[Function]}
     removePreview={[Function]}
     serverError={null}
+    setDraftAsPostType={[Function]}
     setShowPreview={[Function]}
     shouldShowPreview={false}
     showEmojiPicker={false}
@@ -301,6 +312,7 @@ exports[`components/AdvancedCreateComment should match snapshot, empty comment 1
     toggleEmojiPicker={[Function]}
     uploadsProgressPercent={Object {}}
     useChannelMentions={true}
+    voiceMessageClientId=""
   />
 </form>
 `;
@@ -359,6 +371,7 @@ exports[`components/AdvancedCreateComment should match snapshot, non-empty messa
     handleUploadError={[Function]}
     handleUploadProgress={[Function]}
     handleUploadStart={[Function]}
+    handleVoiceMessageUploadStart={[Function]}
     hideEmojiPicker={[Function]}
     isFormattingBarHidden={false}
     isSchedulable={true}
@@ -369,6 +382,7 @@ exports[`components/AdvancedCreateComment should match snapshot, non-empty messa
     postMsgKeyPress={[Function]}
     removePreview={[Function]}
     serverError={null}
+    setDraftAsPostType={[Function]}
     setShowPreview={[Function]}
     shouldShowPreview={false}
     showEmojiPicker={false}
@@ -381,6 +395,7 @@ exports[`components/AdvancedCreateComment should match snapshot, non-empty messa
     toggleEmojiPicker={[Function]}
     uploadsProgressPercent={Object {}}
     useChannelMentions={true}
+    voiceMessageClientId=""
   />
 </form>
 `;
diff --git a/webapp/channels/src/components/advanced_create_comment/advanced_create_comment.tsx b/webapp/channels/src/components/advanced_create_comment/advanced_create_comment.tsx
@@ -5,14 +5,15 @@
 
 import React from 'react';
 
-import type {ChannelMemberCountsByGroup} from '@mattermost/types/channels';
+import type {Channel, ChannelMemberCountsByGroup, ChannelMembership} from '@mattermost/types/channels';
 import type {Emoji} from '@mattermost/types/emojis';
 import type {ServerError} from '@mattermost/types/errors';
 import type {FileInfo} from '@mattermost/types/files';
 import type {Group} from '@mattermost/types/groups';
 import {GroupSource} from '@mattermost/types/groups';
 import type {Post} from '@mattermost/types/posts';
 import type {PreferenceType} from '@mattermost/types/preferences';
+import type {RelationOneToOne} from '@mattermost/types/utilities';
 
 import type {ActionResult} from 'mattermost-redux/types/actions';
 import {sortFileInfos} from 'mattermost-redux/utils/file_utils';
@@ -192,6 +193,7 @@ type Props = {
     emojiMap: EmojiMap;
     isFormattingBarHidden: boolean;
     searchAssociatedGroupsForReference: (prefix: string, teamId: string, channelId: string | undefined) => Promise<{ data: any }>;
+    myChannelMemberships: RelationOneToOne<Channel, ChannelMembership>;
 }
 
 type State = {
@@ -1320,6 +1322,7 @@ class AdvancedCreateComment extends React.PureComponent<Props, State> {
                     isSchedulable={true}
                     handleSchedulePost={this.handleSchedulePost}
                     caretPosition={this.state.caretPosition}
+                    isMember={Boolean(this.props.myChannelMemberships[this.props.channelId])}
                 />
             </form>
         );

diff --git a/webapp/channels/src/components/advanced_create_comment/index.ts b/webapp/channels/src/components/advanced_create_comment/index.ts
@@ -12,7 +12,7 @@ import {resetCreatePostRequest, resetHistoryIndex} from 'mattermost-redux/action
 import {savePreferences} from 'mattermost-redux/actions/preferences';
 import {Permissions, Preferences, Posts} from 'mattermost-redux/constants';
 import {getAllChannelStats, getChannelMemberCountsByGroup as selectChannelMemberCountsByGroup} from 'mattermost-redux/selectors/entities/channels';
-import {getCurrentUserId} from 'mattermost-redux/selectors/entities/common';
+import {getCurrentUserId, getMyChannelMemberships} from 'mattermost-redux/selectors/entities/common';
 import {getConfig, getLicense} from 'mattermost-redux/selectors/entities/general';
 import {getAssociatedGroupsForReferenceByMention} from 'mattermost-redux/selectors/entities/groups';
 import {makeGetMessageInHistoryItem} from 'mattermost-redux/selectors/entities/posts';
@@ -84,6 +84,7 @@ function makeMapStateToProps() {
         const groupsWithAllowReference = useLDAPGroupMentions || useCustomGroupMentions ? getAssociatedGroupsForReferenceByMention(state, channel.team_id, channel.id) : null;
         const isFormattingBarHidden = getBool(state, Constants.Preferences.ADVANCED_TEXT_EDITOR, AdvancedTextEditor.COMMENT);
         const currentTeamId = getCurrentTeamId(state);
+        const myChannelMemberships = getMyChannelMemberships(state);
 
         return {
             currentTeamId,
@@ -114,6 +115,7 @@ function makeMapStateToProps() {
             useCustomGroupMentions,
             emojiMap: getEmojiMap(state),
             canUploadFiles: canUploadFiles(config),
+            myChannelMemberships,
         };
     };
 }