Skip to content

Commit 55a1081

Browse files
sacrodgesacrodge
committed
msg:working-partially; Reverted unnecessary data structures
- Forwarding chatItem to the component temporarily - Later will work for this component to handle fileList data separately
1 parent e1a040a commit 55a1081

File tree

7 files changed

+119
-210
lines changed

7 files changed

+119
-210
lines changed

‎example/src/main.ts‎

Lines changed: 6 additions & 99 deletions
Original file line numberDiff line numberDiff line change
@@ -1645,107 +1645,14 @@ here to see if it gets cut off properly as expected, with an ellipsis through cs
16451645
body: 'Demonstrating the modified files tracker. Watch the component above the chat!',
16461646
});
16471647

1648-
// Make the component visible and set initial state
1649-
mynahUI.updateStore(tabId, {
1650-
modifiedFilesVisible: true,
1651-
modifiedFilesTitle: 'Work in progress...',
1652-
modifiedFilesList: {
1653-
filePaths: [],
1654-
flatList: true
1655-
}
1648+
// Demo will be handled through chatItem approach now
1649+
mynahUI.addChatItem(tabId, {
1650+
type: ChatItemType.ANSWER,
1651+
messageId: generateUID(),
1652+
body: 'Modified files tracker demo is now handled through chatItem.header.fileList approach.',
16561653
});
16571654

1658-
// Simulate file modifications with delays
1659-
setTimeout(() => {
1660-
mynahUI.updateStore(tabId, {
1661-
modifiedFilesList: {
1662-
filePaths: ['src/components/chat-wrapper.ts'],
1663-
flatList: true
1664-
}
1665-
});
1666-
}, 1000);
1667-
1668-
setTimeout(() => {
1669-
mynahUI.updateStore(tabId, {
1670-
modifiedFilesList: {
1671-
filePaths: [
1672-
'src/components/chat-wrapper.ts',
1673-
'src/styles/components/_modified-files-tracker.scss'
1674-
],
1675-
flatList: true
1676-
}
1677-
});
1678-
}, 2000);
1679-
1680-
setTimeout(() => {
1681-
mynahUI.updateStore(tabId, {
1682-
modifiedFilesList: {
1683-
filePaths: [
1684-
'src/components/chat-wrapper.ts',
1685-
'src/styles/components/_modified-files-tracker.scss',
1686-
'src/main.ts'
1687-
],
1688-
flatList: true
1689-
}
1690-
});
1691-
}, 3000);
1692-
1693-
setTimeout(() => {
1694-
mynahUI.updateStore(tabId, {
1695-
modifiedFilesList: {
1696-
filePaths: [
1697-
'src/components/chat-wrapper.ts',
1698-
'src/styles/components/_modified-files-tracker.scss',
1699-
'src/main.ts',
1700-
'example/src/main.ts'
1701-
],
1702-
flatList: true,
1703-
actions: {
1704-
'src/components/chat-wrapper.ts': [{ name: 'undo', icon: 'undo' }],
1705-
'src/styles/components/_modified-files-tracker.scss': [{ name: 'undo', icon: 'undo' }],
1706-
'src/main.ts': [{ name: 'undo', icon: 'undo' }],
1707-
'example/src/main.ts': [{ name: 'undo', icon: 'undo' }]
1708-
}
1709-
}
1710-
});
1711-
}, 4000);
1712-
1713-
setTimeout(() => {
1714-
mynahUI.updateStore(tabId, {
1715-
modifiedFilesTitle: 'Work done!',
1716-
modifiedFilesList: {
1717-
filePaths: [
1718-
'src/components/chat-wrapper.ts',
1719-
'src/styles/components/_modified-files-tracker.scss',
1720-
'src/main.ts',
1721-
'example/src/main.ts'
1722-
],
1723-
flatList: true,
1724-
actions: {
1725-
'src/components/chat-wrapper.ts': [{ name: 'undo', icon: 'undo' }],
1726-
'src/styles/components/_modified-files-tracker.scss': [{ name: 'undo', icon: 'undo' }],
1727-
'src/main.ts': [{ name: 'undo', icon: 'undo' }],
1728-
'example/src/main.ts': [{ name: 'undo', icon: 'undo' }]
1729-
}
1730-
}
1731-
});
1732-
1733-
// Add the undo all button as a separate chat item
1734-
mynahUI.addChatItem(tabId, {
1735-
type: ChatItemType.ANSWER,
1736-
messageId: generateUID(),
1737-
body: '',
1738-
buttons: [
1739-
{ id: 'undo-all', text: 'Undo All', status: 'clear' }
1740-
]
1741-
});
1742-
mynahUI.addChatItem(tabId, {
1743-
type: ChatItemType.ANSWER,
1744-
messageId: generateUID(),
1745-
body: 'Demo complete! The modified files tracker now shows "Work done!" status. Click on any file or use the undo buttons to see the callbacks in action.',
1746-
});
1747-
mynahUI.addChatItem(tabId, defaultFollowUps);
1748-
}, 5000);
1655+
17491656
break;
17501657
case Commands.CARD_WITH_MARKDOWN_LIST:
17511658
getGenerativeAIAnswer(tabId, sampleMarkdownList);

‎src/components/__test__/modified-files-tracker.spec.ts‎

Lines changed: 40 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -85,23 +85,57 @@ describe('ModifiedFilesTracker', () => {
8585
expect(tracker.render.classList.contains('hidden')).toBeTruthy();
8686
});
8787

88-
it('should render visible when visible prop is true', () => {
88+
it('should render with chatItem when provided', () => {
89+
const chatItem: ChatItem = {
90+
type: ChatItemType.ANSWER,
91+
header: {
92+
fileList: {
93+
filePaths: ['test.ts']
94+
}
95+
}
96+
};
97+
8998
const tracker = new ModifiedFilesTracker({
9099
tabId: 'test-tab',
91-
visible: true
100+
chatItem
92101
});
93102

94-
expect(tracker.render.classList.contains('hidden')).toBeFalsy();
103+
expect(tracker).toBeDefined();
95104
});
96105

97-
it('should subscribe to chatItems and modifiedFilesTitle', () => {
106+
it('should not subscribe to store when no chatItem provided', () => {
98107
const tracker = new ModifiedFilesTracker({
99108
tabId: 'test-tab'
100109
});
101110

102111
expect(tracker).toBeDefined();
103-
expect(mockSubscribe).toHaveBeenCalledWith('chatItems', expect.any(Function));
104-
expect(mockSubscribe).toHaveBeenCalledWith('modifiedFilesTitle', expect.any(Function));
112+
// Should not subscribe to any store events when no chatItem is provided
113+
expect(mockSubscribe).not.toHaveBeenCalled();
114+
});
115+
116+
it('should use chatItem fileList when provided', () => {
117+
const chatItem: ChatItem = {
118+
type: ChatItemType.ANSWER,
119+
header: {
120+
fileList: {
121+
filePaths: ['test.ts'],
122+
details: {
123+
'test.ts': {
124+
visibleName: 'test.ts'
125+
}
126+
}
127+
}
128+
}
129+
};
130+
131+
const tracker = new ModifiedFilesTracker({
132+
tabId: 'test-tab',
133+
chatItem
134+
});
135+
136+
expect(tracker).toBeDefined();
137+
// Should not subscribe to store when chatItem is provided
138+
expect(mockSubscribe).not.toHaveBeenCalled();
105139
});
106140

107141
describe('updateContent', () => {
@@ -161,57 +195,7 @@ describe('ModifiedFilesTracker', () => {
161195
});
162196
});
163197

164-
describe('title updates', () => {
165-
it('should update title when modifiedFilesTitle changes', () => {
166-
const mockUpdateTitle = jest.fn();
167-
const { CollapsibleContent } = jest.requireMock('../collapsible-content');
168-
(CollapsibleContent as jest.Mock).mockImplementation(() => ({
169-
render: {
170-
querySelector: jest.fn(() => ({ innerHTML: '', appendChild: jest.fn() }))
171-
},
172-
updateTitle: mockUpdateTitle
173-
}));
174-
175-
const tracker = new ModifiedFilesTracker({
176-
tabId: 'test-tab'
177-
});
178-
179-
expect(tracker).toBeDefined();
180-
181-
const titleCallback = mockSubscribe.mock.calls.find(
182-
(call: any) => call[0] === 'modifiedFilesTitle'
183-
)?.[1];
184-
185-
titleCallback?.('New Title');
186-
187-
expect(mockUpdateTitle).toHaveBeenCalledWith('New Title');
188-
});
189-
190-
it('should not update title when empty string is provided', () => {
191-
const mockUpdateTitle = jest.fn();
192-
const { CollapsibleContent } = jest.requireMock('../collapsible-content');
193-
(CollapsibleContent as jest.Mock).mockImplementation(() => ({
194-
render: {
195-
querySelector: jest.fn(() => ({ innerHTML: '', appendChild: jest.fn() }))
196-
},
197-
updateTitle: mockUpdateTitle
198-
}));
199-
200-
const tracker = new ModifiedFilesTracker({
201-
tabId: 'test-tab'
202-
});
203198

204-
expect(tracker).toBeDefined();
205-
206-
const titleCallback = mockSubscribe.mock.calls.find(
207-
(call: any) => call[0] === 'modifiedFilesTitle'
208-
)?.[1];
209-
210-
titleCallback?.('');
211-
212-
expect(mockUpdateTitle).not.toHaveBeenCalled();
213-
});
214-
});
215199

216200
describe('setVisible method', () => {
217201
it('should show tracker when setVisible(true) is called', () => {

‎src/components/chat-item/chat-wrapper.ts‎

Lines changed: 48 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,8 @@ export class ChatWrapper {
5959
private readonly dragBlurOverlay: HTMLElement;
6060
private dragOverlayVisibility: boolean = true;
6161
private imageContextFeatureEnabled: boolean = false;
62-
private readonly modifiedFilesTracker: ModifiedFilesTracker;
62+
private modifiedFilesTracker: ModifiedFilesTracker;
63+
private modifiedFilesChatItem: ChatItem | null = null;
6364

6465
constructor (props: ChatWrapperProps) {
6566
StyleLoader.getInstance().load('components/chat/_chat-wrapper.scss');
@@ -96,13 +97,10 @@ export class ChatWrapper {
9697
);
9798

9899
this.modifiedFilesTracker = new ModifiedFilesTracker({
99-
tabId: this.props.tabId,
100-
visible: false
101-
});
102-
MynahUITabsStore.getInstance().addListenerToDataStore(this.props.tabId, 'modifiedFilesVisible', (visible: boolean) => {
103-
this.modifiedFilesTracker.setVisible(visible);
100+
tabId: this.props.tabId
104101
});
105102

103+
106104
MynahUITabsStore.getInstance().addListenerToDataStore(this.props.tabId, 'chatItems', (chatItems: ChatItem[]) => {
107105
const chatItemToInsert: ChatItem = chatItems[chatItems.length - 1];
108106

@@ -421,6 +419,18 @@ export class ChatWrapper {
421419
// Add to all rendered chat items map
422420
this.allRenderedChatItems[currentMessageId] = chatItemCard;
423421

422+
// Update ModifiedFilesTracker if chatItem has file data
423+
console.log('[ChatWrapper] Checking chatItem for file data:', {
424+
messageId: chatItem.messageId,
425+
hasHeader: !!chatItem.header,
426+
hasFileList: !!chatItem.header?.fileList,
427+
fileList: chatItem.header?.fileList
428+
});
429+
if (chatItem.header?.fileList != null) {
430+
console.log('[ChatWrapper] Setting ModifiedFilesChatItem with fileList:', chatItem.header.fileList);
431+
this.setModifiedFilesChatItem(chatItem);
432+
}
433+
424434
if (chatItem.type === ChatItemType.PROMPT || chatItem.type === ChatItemType.SYSTEM_PROMPT) {
425435
// Make sure we align to top when there is a new prompt.
426436
// Only if it is a PROMPT!
@@ -552,6 +562,37 @@ export class ChatWrapper {
552562
}
553563

554564
public setModifiedFilesTrackerVisible (visible: boolean): void {
555-
this.modifiedFilesTracker.setVisible(visible);
565+
// No-op: component is always visible
566+
}
567+
568+
public updateModifiedFilesTracker (): void {
569+
console.log('[ChatWrapper] updateModifiedFilesTracker called with modifiedFilesChatItem:', this.modifiedFilesChatItem);
570+
if (this.modifiedFilesChatItem != null) {
571+
console.log('[ChatWrapper] Creating new ModifiedFilesTracker with chatItem:', {
572+
tabId: this.props.tabId,
573+
chatItem: this.modifiedFilesChatItem
574+
});
575+
// Create a new ModifiedFilesTracker with the chatItem
576+
const newTracker = new ModifiedFilesTracker({
577+
tabId: this.props.tabId,
578+
chatItem: this.modifiedFilesChatItem
579+
});
580+
console.log('[ChatWrapper] New ModifiedFilesTracker created:', newTracker);
581+
// Replace the old tracker
582+
this.modifiedFilesTracker.render.replaceWith(newTracker.render);
583+
this.modifiedFilesTracker = newTracker;
584+
console.log('[ChatWrapper] ModifiedFilesTracker replaced successfully');
585+
} else {
586+
console.log('[ChatWrapper] No modifiedFilesChatItem to update tracker with');
587+
}
588+
}
589+
590+
public setModifiedFilesChatItem (chatItem: ChatItem): void {
591+
console.log('[ChatWrapper] setModifiedFilesChatItem called with:', {
592+
messageId: chatItem.messageId,
593+
fileList: chatItem.header?.fileList
594+
});
595+
this.modifiedFilesChatItem = chatItem;
596+
this.updateModifiedFilesTracker();
556597
}
557598
}

0 commit comments

Comments
 (0)