Added a action to return only the active channel and used it in the dropdown component (#25508)

* [MI-3718] Updated code to not return archived channels in the response of auto complete channels API

* [MM-135] Update webapp logic to not show archived channels in intercative dialog

webapp/channels/src/actions/channel_actions.ts

@@ -114,6 +114,26 @@ export function autocompleteChannels(term: string, success: (channels: Channel[]
     };
 }
 
+export function autocompleteActiveChannels(term: string, success: (channels: Channel[]) => void, error?: (err: ServerError) => void): ActionFuncAsync {
+    return async (dispatch, getState) => {
+        const state = getState();
+        const teamId = getCurrentTeamId(state);
+        if (!teamId) {
+            return {data: false};
+        }
+
+        const {data, error: err} = await dispatch(ChannelActions.autocompleteChannels(teamId, term));
+        if (data && success) {
+            const activeChannels = data.filter((channel: Channel) => channel.delete_at === 0);
+            success(activeChannels);
+        } else if (err && error) {
+            error({id: err.server_error_id, ...err});
+        }
+
+        return {data: true};
+    };
+}
+
 export function autocompleteChannelsForSearch(term: string, success?: (channels: Channel[]) => void, error?: (err: ServerError) => void): ActionFuncAsync {
     return async (dispatch, getState) => {
         const state = getState();

webapp/channels/src/components/interactive_dialog/dialog_element/dialog_element.test.tsx

@@ -16,7 +16,7 @@ describe('components/interactive_dialog/DialogElement', () => {
         type: 'text',
         maxLength: 100,
         actions: {
-            autocompleteChannels: jest.fn(),
+            autocompleteActiveChannels: jest.fn(),
             autocompleteUsers: jest.fn(),
         },
         onChange: jest.fn(),

webapp/channels/src/components/interactive_dialog/dialog_element/dialog_element.tsx

@@ -45,7 +45,7 @@ export type Props = {
     onChange: (name: string, selected: string) => void;
     autoFocus?: boolean;
     actions: {
-        autocompleteChannels: (term: string, success: (channels: Channel[]) => void, error?: (err: ServerError) => void) => (ActionResult | Promise<ActionResult | ActionResult[]>);
+        autocompleteActiveChannels: (term: string, success: (channels: Channel[]) => void, error?: (err: ServerError) => void) => (ActionResult | Promise<ActionResult | ActionResult[]>);
         autocompleteUsers: (search: string) => Promise<UserAutocomplete>;
     };
 }
@@ -66,7 +66,7 @@ export default class DialogElement extends React.PureComponent<Props, State> {
             if (props.dataSource === 'users') {
                 this.providers = [new GenericUserProvider(props.actions.autocompleteUsers)];
             } else if (props.dataSource === 'channels') {
-                this.providers = [new GenericChannelProvider(props.actions.autocompleteChannels)];
+                this.providers = [new GenericChannelProvider(props.actions.autocompleteActiveChannels)];
             } else if (props.options) {
                 this.providers = [new MenuActionProvider(props.options)];
             }

webapp/channels/src/components/interactive_dialog/dialog_element/index.ts

@@ -5,7 +5,7 @@ import {connect} from 'react-redux';
 import {bindActionCreators} from 'redux';
 import type {Dispatch} from 'redux';
 
-import {autocompleteChannels} from 'actions/channel_actions';
+import {autocompleteActiveChannels} from 'actions/channel_actions';
 import {autocompleteUsers} from 'actions/user_actions';
 
 import DialogElement from './dialog_element';
@@ -13,7 +13,7 @@ import DialogElement from './dialog_element';
 function mapDispatchToProps(dispatch: Dispatch) {
     return {
         actions: bindActionCreators({
-            autocompleteChannels,
+            autocompleteActiveChannels,
             autocompleteUsers,
         }, dispatch),
     };