Chat: remove title and header (#28327)

Signed-off-by: Strider2342 <[email protected]> Co-authored-by: EugeniyKiyashko <[email protected]>
DevExpress · Nov 8, 2024 · 6b3e959 · 6b3e959
1 parent 7583a24
commit 6b3e959
Show file tree

Hide file tree

Showing 9 changed files with 1 addition and 255 deletions.
diff --git a/packages/devextreme/js/__internal/ui/chat/chat.ts b/packages/devextreme/js/__internal/ui/chat/chat.ts
@@ -9,15 +9,14 @@ import messageLocalization from '@js/localization/message';
 import type {
   Message,
   MessageEnteredEvent,
-  Properties as ChatProperties,
+  Properties,
   TypingEndEvent,
   TypingStartEvent,
 } from '@js/ui/chat';
 import type { OptionChanged } from '@ts/core/widget/types';
 import Widget from '@ts/core/widget/widget';
 
 import AlertList from './alertlist';
-import ChatHeader from './header';
 import type {
   MessageEnteredEvent as MessageBoxMessageEnteredEvent,
   Properties as MessageBoxProperties,
@@ -30,13 +29,7 @@ import MessageList from './messagelist';
 const CHAT_CLASS = 'dx-chat';
 const TEXTEDITOR_INPUT_CLASS = 'dx-texteditor-input';
 
-type Properties = ChatProperties & {
-  title: string;
-};
-
 class Chat extends Widget<Properties> {
-  _chatHeader?: ChatHeader;
-
   _messageBox!: MessageBox;
 
   _messageList!: MessageList;
@@ -52,7 +45,6 @@ class Chat extends Widget<Properties> {
   _getDefaultOptions(): Properties {
     return {
       ...super._getDefaultOptions(),
-      title: '',
       showDayHeaders: true,
       activeStateEnabled: true,
       focusStateEnabled: true,
@@ -118,12 +110,6 @@ class Chat extends Widget<Properties> {
 
     super._initMarkup();
 
-    const { title } = this.option();
-
-    if (title) {
-      this._renderHeader(title);
-    }
-
     this._renderMessageList();
     this._renderAlertList();
     this._renderMessageBox();
@@ -132,15 +118,6 @@ class Chat extends Widget<Properties> {
     this._updateMessageBoxAria();
   }
 
-  _renderHeader(title: string): void {
-    const $header = $('<div>');
-
-    this.$element().append($header);
-    this._chatHeader = this._createComponent($header, ChatHeader, {
-      title,
-    });
-  }
-
   _renderMessageList(): void {
     const {
       items = [],
@@ -310,19 +287,6 @@ class Chat extends Widget<Properties> {
       case 'hoverStateEnabled':
         this._messageBox.option(name, value);
         break;
-      case 'title': {
-        if (value) {
-          if (this._chatHeader) {
-            this._chatHeader.option('title', value);
-          } else {
-            this._renderHeader(value);
-          }
-        } else if (this._chatHeader) {
-          this._chatHeader.dispose();
-          this._chatHeader.$element().remove();
-        }
-        break;
-      }
       case 'user': {
         const author = value as Properties[typeof name];
 

diff --git a/packages/devextreme/js/__internal/ui/chat/header.ts b/packages/devextreme/js/__internal/ui/chat/header.ts
diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chat.markup.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chat.markup.tests.js
@@ -7,7 +7,6 @@ QUnit.testStart(() => {
     $('#qunit-fixture').html(markup);
 });
 
-import './chatParts/header.markup.tests.js';
 import './chatParts/avatar.markup.tests.js';
 import './chatParts/messageBox.markup.tests.js';
 import './chatParts/messageBubble.markup.tests.js';

diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chat.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chat.tests.js
@@ -7,7 +7,6 @@ QUnit.testStart(() => {
     $('#qunit-fixture').html(markup);
 });
 
-import './chatParts/header.tests.js';
 import './chatParts/avatar.tests.js';
 import './chatParts/messageBox.tests.js';
 import './chatParts/messageBubble.tests.js';

diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chat.markup.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chat.markup.tests.js
@@ -3,7 +3,6 @@ import $ from 'jquery';
 import Chat from 'ui/chat';
 
 const CHAT_CLASS = 'dx-chat';
-const CHAT_HEADER_CLASS = 'dx-chat-header';
 const CHAT_MESSAGEBOX_CLASS = 'dx-chat-messagebox';
 const CHAT_MESSAGELIST_CLASS = 'dx-chat-messagelist';
 const CHAT_ALERTLIST_CLASS = 'dx-chat-alertlist';
@@ -30,46 +29,6 @@ const moduleConfig = {
 
 QUnit.module('Chat', moduleConfig, () => {
     QUnit.module('Render', () => {
-        QUnit.test('Header should be rendered if title is not empty', function(assert) {
-            this.reinit({ title: 'custom' });
-
-            const $header = this.$element.find(`.${CHAT_HEADER_CLASS}`);
-
-            assert.strictEqual($header.length, 1);
-        });
-
-        QUnit.test('Header should not be rendered if title is empty', function(assert) {
-            const $header = this.$element.find(`.${CHAT_HEADER_CLASS}`);
-
-            assert.strictEqual($header.length, 0);
-        });
-
-        QUnit.test('Header should be rendered if title is not empty on init and in runtime', function(assert) {
-            this.reinit({ title: 'custom' });
-            this.instance.option({ title: 'new custom' });
-
-            const $header = this.$element.find(`.${CHAT_HEADER_CLASS}`);
-
-            assert.strictEqual($header.length, 1);
-        });
-
-        QUnit.test('Header should be rendered if title is empty on init and not empty in runtime', function(assert) {
-            this.instance.option({ title: 'new custom' });
-
-            const $header = this.$element.find(`.${CHAT_HEADER_CLASS}`);
-
-            assert.strictEqual($header.length, 1);
-        });
-
-        QUnit.test('Header should be removed if title is empty in runtime', function(assert) {
-            this.reinit({ title: 'custom' });
-            this.instance.option({ title: '' });
-
-            const $header = this.$element.find(`.${CHAT_HEADER_CLASS}`);
-
-            assert.strictEqual($header.length, 0);
-        });
-
         QUnit.test('Message list should be rendered', function(assert) {
             const $messageList = this.$element.find(`.${CHAT_MESSAGELIST_CLASS}`);
 

diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chat.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chat.tests.js
@@ -15,7 +15,6 @@ import { isRenderer } from 'core/utils/type';
 import config from 'core/config';
 import ArrayStore from 'data/array_store';
 
-const CHAT_HEADER_TEXT_CLASS = 'dx-chat-header-text';
 const CHAT_MESSAGEGROUP_CLASS = 'dx-chat-messagegroup';
 const CHAT_MESSAGELIST_CLASS = 'dx-chat-messagelist';
 const CHAT_ALERTLIST_CLASS = 'dx-chat-alertlist';
@@ -32,8 +31,6 @@ const CHAT_LAST_MESSAGEGROUP_ALIGNMENT_END_CLASS = 'dx-chat-last-messagegroup-al
 
 const TEXTEDITOR_INPUT_CLASS = 'dx-texteditor-input';
 
-const MOCK_CHAT_HEADER_TEXT = 'Chat title';
-
 export const MOCK_COMPANION_USER_ID = 'COMPANION_USER_ID';
 export const MOCK_CURRENT_USER_ID = 'CURRENT_USER_ID';
 export const NOW = 1721747399083;
@@ -113,26 +110,6 @@ QUnit.module('Chat', () => {
         });
     });
 
-    QUnit.module('Header integration', moduleConfig, () => {
-        QUnit.test('Header text element should have correct text', function(assert) {
-            this.reinit({
-                title: MOCK_CHAT_HEADER_TEXT
-            });
-
-            const $header = this.$element.find(`.${CHAT_HEADER_TEXT_CLASS}`);
-
-            assert.strictEqual($header.text(), MOCK_CHAT_HEADER_TEXT);
-        });
-
-        QUnit.test('Header text element should have correct text after runtime change', function(assert) {
-            this.instance.option({ title: 'new title' });
-
-            const $header = this.$element.find(`.${CHAT_HEADER_TEXT_CLASS}`);
-
-            assert.strictEqual($header.text(), 'new title');
-        });
-    });
-
     QUnit.module('MessageList integration', moduleConfig, () => {
         QUnit.test('passed currentUserId should be equal generated chat.user.id', function(assert) {
             const messageList = this.getMessageList();

diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/header.markup.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/header.markup.tests.js
diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/header.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/header.tests.js
diff --git a/packages/devextreme/testing/tests/DevExpress.ui/defaultOptions.tests.js b/packages/devextreme/testing/tests/DevExpress.ui/defaultOptions.tests.js
@@ -15,7 +15,6 @@ import Avatar from '__internal/ui/chat/avatar';
 import Button from 'ui/button';
 import ColorBox from 'ui/color_box';
 import Chat from 'ui/chat';
-import ChatHeader from '__internal/ui/chat/header';
 import ChatMessageBox from '__internal/ui/chat/messagebox';
 import ChatMessageBubble from '__internal/ui/chat/messagebubble';
 import ChatMessageGroup from '__internal/ui/chat/messagegroup';
@@ -1355,7 +1354,6 @@ testComponentDefaults(Chat,
         showMessageTimestamp: true,
         dayHeaderFormat: 'shortdate',
         messageTimestampFormat: 'shorttime',
-        title: '',
         dataSource: null,
         reloadOnChange: true,
         items: [],
@@ -1376,13 +1374,6 @@ testComponentDefaults(Avatar,
     }
 );
 
-testComponentDefaults(ChatHeader,
-    {},
-    {
-        title: '',
-    }
-);
-
 testComponentDefaults(ChatMessageBox,
     {},
     {