MM-28716: expose textbox's openWhenEmpty (#6460) (#6553)

* MM-28716: expose textbox's openWhenEmpty (#6460) * expose openWhenEmpty on textbox * handle no active channel when in backstage * patch snapshots for cloud-beta * Fix autocomplete in DM (#6233) (#6408) Co-authored-by: Mattermod <[email protected]> (cherry picked from commit 50179c8) Co-authored-by: Shota Gvinepadze <[email protected]> Co-authored-by: Mattermost Build <[email protected]> Co-authored-by: Shota Gvinepadze <[email protected]>
mattermost · Sep 28, 2020 · be00c05 · be00c05
1 parent f6c7028
commit be00c05
Show file tree

Hide file tree

Showing 5 changed files with 166 additions and 4 deletions.
diff --git a/components/__snapshots__/textbox.test.tsx.snap b/components/__snapshots__/textbox.test.tsx.snap
@@ -1,5 +1,121 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`components/TextBox should match snapshot with additional, optional props 1`] = `
+<div
+ className="textarea-wrapper textarea-wrapper--preview"
+>
+ <SuggestionBox
+ channelId="channelId"
+ className="form-control custom-textarea custom-textarea--emoji-picker bad-connection custom-textarea--preview"
+ completeOnTab={true}
+ containerClass=""
+ contextId="channelId"
+ disabled={true}
+ forceSuggestionsWhenBlur={false}
+ id="someid"
+ inputComponent={[Function]}
+ isRHS={true}
+ listComponent={[Function]}
+ listStyle="style"
+ listenForMentionKeyClick={true}
+ onBlur={[Function]}
+ onChange={[Function]}
+ onComposition={[Function]}
+ onHeightChange={[Function]}
+ onKeyDown={[Function]}
+ onKeyPress={[Function]}
+ onKeyUp={[Function]}
+ onMouseUp={[Function]}
+ onSelect={[Function]}
+ openOnFocus={false}
+ openWhenEmpty={true}
+ placeholder="placeholder text"
+ providers={
+ Array [
+ AtMentionProvider {
+ "autocompleteGroups": Array [
+ Object {
+ "id": "gid1",
+ },
+ Object {
+ "id": "gid2",
+ },
+ ],
+ "autocompleteUsersInChannel": [Function],
+ "currentUserId": "currentUserId",
+ "data": null,
+ "disableDispatches": false,
+ "lastCompletedWord": "",
+ "lastPrefixWithNoResults": "",
+ "latestComplete": true,
+ "latestPrefix": "",
+ "profilesInChannel": Array [
+ Object {
+ "id": "id1",
+ },
+ Object {
+ "id": "id2",
+ },
+ ],
+ "profilesNotInChannel": Array [
+ Object {
+ "id": "id3",
+ },
+ Object {
+ "id": "id4",
+ },
+ ],
+ "requestStarted": false,
+ "searchAssociatedGroupsForReference": [Function],
+ "useChannelMentions": true,
+ },
+ ChannelMentionProvider {
+ "autocompleteChannels": [MockFunction],
+ "disableDispatches": false,
+ "lastCompletedWord": "",
+ "lastPrefixTrimmed": "",
+ "lastPrefixWithNoResults": "",
+ "latestComplete": true,
+ "latestPrefix": "",
+ "requestStarted": false,
+ },
+ EmoticonProvider {
+ "disableDispatches": false,
+ "latestComplete": true,
+ "latestPrefix": "",
+ "requestStarted": false,
+ },
+ ]
+ }
+ renderDividers={true}
+ renderNoResults={false}
+ replaceAllInputOnSelect={false}
+ requiredCharacters={1}
+ spellCheck="true"
+ style={
+ Object {
+ "visibility": "hidden",
+ }
+ }
+ value="some test text"
+ />
+ <div
+ className="form-control custom-textarea textbox-preview-area"
+ onBlur={[Function]}
+ onKeyDown={[Function]}
+ onKeyPress={[Function]}
+ onSelect={[Function]}
+ tabIndex={0}
+ >
+ <Connect(PostMarkdown)
+ isRHS={true}
+ mentionKeys={Array []}
+ message="some test text"
+ />
+ </div>
+</div>
+`;
+
 exports[`components/TextBox should match snapshot with required props 1`] = `
 <div
  className="textarea-wrapper"

diff --git a/components/suggestion/command_provider.jsx b/components/suggestion/command_provider.jsx
@@ -130,7 +130,7 @@ export default class CommandProvider extends Provider {
 
  handleWebapp(pretext, resultCallback) {
  const command = pretext.toLowerCase();
-
+ const teamId = getCurrentTeamId(store.getState());
  const selectedPost = getSelectedPost(store.getState());
  let rootId;
  if (this.isInRHS) {
@@ -139,11 +139,11 @@ export default class CommandProvider extends Provider {
  const channel = this.isInRHS && selectedPost.channel_id ? getChannel(store.getState(), selectedPost.channel_id) : getCurrentChannel(store.getState());
 
  const args = {
- channel_id: channel.id,
+ channel_id: channel?.id,
  ...(rootId && {root_id: rootId, parent_id: rootId}),
  };
 
- Client4.getCommandAutocompleteSuggestionsList(command, channel.team_id, args).then(
+ Client4.getCommandAutocompleteSuggestionsList(command, teamId, args).then(
  (data) => {
  const matches = [];
  let cmd = 'Ctrl';

diff --git a/components/suggestion/command_provider.test.js b/components/suggestion/command_provider.test.js
@@ -4,7 +4,7 @@
 import React from 'react';
 import {shallow} from 'enzyme';
 
-import {CommandSuggestion} from './command_provider';
+import CommandProvider, {CommandSuggestion} from './command_provider';
 
 describe('CommandSuggestion', () => {
  const baseProps = {
@@ -29,3 +29,12 @@ describe('CommandSuggestion', () => {
  expect(wrapper.find('.slash-command__desc').first().text()).toEqual('Invite a user to a channel');
  });
 });
+
+describe('CommandProvider', () => {
+ test('no active channel', () => {
+ const provider = new CommandProvider({});
+ const resultCallback = jest.fn();
+
+ expect(provider.handlePretextChanged('/test', resultCallback)).toEqual(true);
+ });
+});
diff --git a/components/textbox.test.tsx b/components/textbox.test.tsx
@@ -49,6 +49,41 @@ describe('components/TextBox', () => {
  expect(wrapper).toMatchSnapshot();
  });
 
+ test('should match snapshot with additional, optional props', () => {
+ function emptyFunction() {} //eslint-disable-line no-empty-function
+
+ const wrapper = shallow(
+ <Textbox
+ id='someid'
+ value='some test text'
+ onChange={emptyFunction}
+ onKeyPress={emptyFunction}
+ characterLimit={4000}
+ createMessage='placeholder text'
+ supportsCommands={false}
+ {...baseProps}
+ rootId='root_id'
+ onComposition={() => {}}
+ onHeightChange={() => {}}
+ onKeyDown={() => {}}
+ onSelect={() => {}}
+ onMouseUp={() => {}}
+ onKeyUp={() => {}}
+ onBlur={() => {}}
+ handlePostError={() => {}}
+ suggestionListStyle='style'
+ emojiEnabled={true}
+ isRHS={true}
+ disabled={true}
+ badConnection={true}
+ listenForMentionKeyClick={true}
+ preview={true}
+ openWhenEmpty={true}
+ />,
+ );
+ expect(wrapper).toMatchSnapshot();
+ });
+
  test('should throw error when value is too long', () => {
  function emptyFunction() {} //eslint-disable-line no-empty-function
 

diff --git a/components/textbox/textbox.tsx b/components/textbox/textbox.tsx
@@ -56,6 +56,7 @@ type Props = {
  };
  useChannelMentions: boolean;
  inputComponent?: ElementType;
+ openWhenEmpty?: boolean;
 };
 
 export default class Textbox extends React.PureComponent<Props> {
@@ -275,6 +276,7 @@ export default class Textbox extends React.PureComponent<Props> {
  contextId={this.props.channelId}
  listenForMentionKeyClick={this.props.listenForMentionKeyClick}
  wrapperHeight={wrapperHeight}
+ openWhenEmpty={this.props.openWhenEmpty}
  />
  {preview}
  </div>