From d91c775a67ec19363e3fda8ae4e908b07ee684c5 Mon Sep 17 00:00:00 2001 From: EugeniyKiyashko Date: Thu, 29 Aug 2024 15:49:11 +0400 Subject: [PATCH 1/4] Chan: publish dataSource option --- .../devextreme-angular/src/ui/chat/index.ts | 25 +++++++++++++++++++ packages/devextreme-vue/src/chat.ts | 3 +++ .../devextreme/js/__internal/ui/chat/chat.ts | 1 + packages/devextreme/js/ui/chat.d.ts | 13 +++++++++- .../DevExpress.ui/defaultOptions.tests.js | 1 + packages/devextreme/ts/dx.all.d.ts | 6 +++++ 6 files changed, 48 insertions(+), 1 deletion(-) diff --git a/packages/devextreme-angular/src/ui/chat/index.ts b/packages/devextreme-angular/src/ui/chat/index.ts index 76c5db468900..c6545c97766c 100644 --- a/packages/devextreme-angular/src/ui/chat/index.ts +++ b/packages/devextreme-angular/src/ui/chat/index.ts @@ -22,6 +22,8 @@ import { } from '@angular/core'; +import { Store } from 'devextreme/data'; +import DataSource, { Options as DataSourceOptions } from 'devextreme/data/data_source'; import { DisposingEvent, InitializedEvent, Message, MessageSendEvent, OptionChangedEvent, User } from 'devextreme/ui/chat'; import DxChat from 'devextreme/ui/chat'; @@ -88,6 +90,19 @@ export class DxChatComponent extends DxComponent implements OnDestroy, OnChanges } + /** + * [descr:dxChatOptions.dataSource] + + */ + @Input() + get dataSource(): Store | DataSource | DataSourceOptions | null | string | Array { + return this._getOption('dataSource'); + } + set dataSource(value: Store | DataSource | DataSourceOptions | null | string | Array) { + this._setOption('dataSource', value); + } + + /** * [descr:WidgetOptions.disabled] @@ -289,6 +304,13 @@ export class DxChatComponent extends DxComponent implements OnDestroy, OnChanges */ @Output() activeStateEnabledChange: EventEmitter; + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() dataSourceChange: EventEmitter>; + /** * This member supports the internal infrastructure and is not intended to be used directly from your code. @@ -403,6 +425,7 @@ export class DxChatComponent extends DxComponent implements OnDestroy, OnChanges { subscribe: 'optionChanged', emit: 'onOptionChanged' }, { emit: 'accessKeyChange' }, { emit: 'activeStateEnabledChange' }, + { emit: 'dataSourceChange' }, { emit: 'disabledChange' }, { emit: 'elementAttrChange' }, { emit: 'focusStateEnabledChange' }, @@ -433,6 +456,7 @@ export class DxChatComponent extends DxComponent implements OnDestroy, OnChanges ngOnChanges(changes: SimpleChanges) { super.ngOnChanges(changes); + this.setupChanges('dataSource', changes); this.setupChanges('items', changes); } @@ -443,6 +467,7 @@ export class DxChatComponent extends DxComponent implements OnDestroy, OnChanges } ngDoCheck() { + this._idh.doCheck('dataSource'); this._idh.doCheck('items'); this._watcherHelper.checkWatchers(); super.ngDoCheck(); diff --git a/packages/devextreme-vue/src/chat.ts b/packages/devextreme-vue/src/chat.ts index 54a67dc1680e..2ffc0116a838 100644 --- a/packages/devextreme-vue/src/chat.ts +++ b/packages/devextreme-vue/src/chat.ts @@ -5,6 +5,7 @@ import { createConfigurationComponent } from "./core/index"; type AccessibleOptions = Pick { ...super._getDefaultOptions(), title: '', items: [], + dataSource: null, user: { id: new Guid().toString() }, onMessageSend: undefined, }; diff --git a/packages/devextreme/js/ui/chat.d.ts b/packages/devextreme/js/ui/chat.d.ts index 5ec786dbd800..bb480880c07d 100644 --- a/packages/devextreme/js/ui/chat.d.ts +++ b/packages/devextreme/js/ui/chat.d.ts @@ -5,6 +5,7 @@ import { InitializedEventInfo, ChangedOptionInfo, } from '../events/index'; +import DataSource, { DataSourceLike } from '../data/data_source'; /** * @docid _ui_chat_DisposingEvent @@ -108,6 +109,13 @@ export type Message = { * @docid */ export interface dxChatOptions extends WidgetOptions { + /** + * @docid + * @type string | Array | Store | DataSource | DataSourceOptions | null + * @default null + * @public + */ + dataSource?: DataSourceLike | null; /** * @docid * @default { id: new Guid().toString() } @@ -122,6 +130,7 @@ export interface dxChatOptions extends WidgetOptions { title?: string; /** * @docid + * @type Array * @fires dxChatOptions.onOptionChanged * @public */ @@ -138,7 +147,7 @@ export interface dxChatOptions extends WidgetOptions { /** * @docid - * @inherits Widget + * @inherits Widget, DataHelperMixin * @namespace DevExpress.ui * @public */ @@ -149,6 +158,8 @@ export default class dxChat extends Widget { * @public */ renderMessage(message: Message): void; + + getDataSource(): DataSource; } /** @public */ diff --git a/packages/devextreme/testing/tests/DevExpress.ui/defaultOptions.tests.js b/packages/devextreme/testing/tests/DevExpress.ui/defaultOptions.tests.js index c77881bb8a22..ac4b14b995c6 100644 --- a/packages/devextreme/testing/tests/DevExpress.ui/defaultOptions.tests.js +++ b/packages/devextreme/testing/tests/DevExpress.ui/defaultOptions.tests.js @@ -1344,6 +1344,7 @@ testComponentDefaults(Chat, { title: '', onMessageSend: null, + dataSource: null, } ); diff --git a/packages/devextreme/ts/dx.all.d.ts b/packages/devextreme/ts/dx.all.d.ts index 80039db74b04..64ac3a9ff570 100644 --- a/packages/devextreme/ts/dx.all.d.ts +++ b/packages/devextreme/ts/dx.all.d.ts @@ -9420,6 +9420,8 @@ declare module DevExpress.ui { * [descr:dxChat.renderMessage(message)] */ renderMessage(message: DevExpress.ui.dxChat.Message): void; + + getDataSource(): DevExpress.data.DataSource; } module dxChat { /** @@ -9461,6 +9463,10 @@ declare module DevExpress.ui { * @deprecated [depNote:dxChatOptions] */ export interface dxChatOptions extends WidgetOptions { + /** + * [descr:dxChatOptions.dataSource] + */ + dataSource?: DevExpress.data.DataSource.DataSourceLike | null; /** * [descr:dxChatOptions.user] */ From 01febb68cb929ba2da7c1da4316a38bfb45b55d4 Mon Sep 17 00:00:00 2001 From: EugeniyKiyashko Date: Fri, 30 Aug 2024 13:19:56 +0400 Subject: [PATCH 2/4] fix optionchanged tests --- .../devextreme/js/__internal/ui/chat/chat.ts | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/packages/devextreme/js/__internal/ui/chat/chat.ts b/packages/devextreme/js/__internal/ui/chat/chat.ts index 3030d8e103c9..8b54e8d167c8 100644 --- a/packages/devextreme/js/__internal/ui/chat/chat.ts +++ b/packages/devextreme/js/__internal/ui/chat/chat.ts @@ -1,3 +1,4 @@ +import type { ComponentFactory } from '@js/core/component_registrator'; import registerComponent from '@js/core/component_registrator'; import Guid from '@js/core/guid'; import type { dxElementWrapper } from '@js/core/renderer'; @@ -63,13 +64,14 @@ class Chat extends Widget { } _renderMessageList(): void { - const { items = [], user } = this.option(); + const { items = [], dataSource, user } = this.option(); const currentUserId = user?.id; const $messageList = $('
').appendTo(this.element()); this._messageList = this._createComponent($messageList, MessageList, { items, + dataSource, currentUserId, }); } @@ -129,16 +131,17 @@ class Chat extends Widget { case 'activeStateEnabled': case 'focusStateEnabled': case 'hoverStateEnabled': - this._messageBox.option({ [name]: value }); + this._messageBox.option(name, value as Properties[typeof name]); break; case 'title': - this._chatHeader.option('title', (value as Properties['title']) ?? ''); + this._chatHeader.option('title', (value as Properties[typeof name]) ?? ''); break; case 'user': - this._messageList.option('currentUserId', (value as Properties['user'])?.id); + this._messageList.option('currentUserId', (value as Properties[typeof name])?.id); break; case 'items': - this._messageList.option('items', (value as Properties['items']) ?? []); + case 'dataSource': + this._messageList.option(name, value as Properties[typeof name]); break; case 'onMessageSend': this._createMessageSendAction(); @@ -157,7 +160,6 @@ class Chat extends Widget { } } -// @ts-expect-error ts-error -registerComponent('dxChat', Chat); +registerComponent('dxChat', Chat as ComponentFactory); export default Chat; From 20b80a79c210e4c26d3966531e684fb78fd01a7d Mon Sep 17 00:00:00 2001 From: EugeniyKiyashko Date: Fri, 30 Aug 2024 13:39:26 +0400 Subject: [PATCH 3/4] fix error --- packages/devextreme/js/__internal/ui/chat/chat.ts | 5 ++--- packages/devextreme/js/core/component_registrator.d.ts | 2 +- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/packages/devextreme/js/__internal/ui/chat/chat.ts b/packages/devextreme/js/__internal/ui/chat/chat.ts index 8b54e8d167c8..fecd6c0da719 100644 --- a/packages/devextreme/js/__internal/ui/chat/chat.ts +++ b/packages/devextreme/js/__internal/ui/chat/chat.ts @@ -64,14 +64,13 @@ class Chat extends Widget { } _renderMessageList(): void { - const { items = [], dataSource, user } = this.option(); + const { items = [], user } = this.option(); const currentUserId = user?.id; const $messageList = $('
').appendTo(this.element()); this._messageList = this._createComponent($messageList, MessageList, { items, - dataSource, currentUserId, }); } @@ -160,6 +159,6 @@ class Chat extends Widget { } } -registerComponent('dxChat', Chat as ComponentFactory); +registerComponent('dxChat', Chat as unknown as ComponentFactory); export default Chat; diff --git a/packages/devextreme/js/core/component_registrator.d.ts b/packages/devextreme/js/core/component_registrator.d.ts index c9637a60890d..3676d7fcc739 100644 --- a/packages/devextreme/js/core/component_registrator.d.ts +++ b/packages/devextreme/js/core/component_registrator.d.ts @@ -1,7 +1,7 @@ import DOMComponent from './dom_component'; import { UserDefinedElement } from './element'; -type ComponentFactory = { +export type ComponentFactory = { new(element: UserDefinedElement, options?: Record): TComponent; getInstance(element: UserDefinedElement): TComponent; }; From 388a715cb149f4d7f7ad7d9269b5056c01ab19db Mon Sep 17 00:00:00 2001 From: Mikhail Preyskurantov <5574159+mpreyskurantov@users.noreply.github.com> Date: Fri, 30 Aug 2024 18:21:49 +0300 Subject: [PATCH 4/4] redundant --- packages/devextreme/js/ui/chat.d.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/devextreme/js/ui/chat.d.ts b/packages/devextreme/js/ui/chat.d.ts index 1761a2bbecf9..b1b05e1bf3f8 100644 --- a/packages/devextreme/js/ui/chat.d.ts +++ b/packages/devextreme/js/ui/chat.d.ts @@ -141,7 +141,6 @@ export interface dxChatOptions extends WidgetOptions { title?: string; /** * @docid - * @type Array * @fires dxChatOptions.onOptionChanged * @public */