Elgato_dark/void
1
0
Fork 0
mirror of https://github.com/voideditor/void synced 2026-05-24 09:58:23 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

history style

Browse source
This commit is contained in:
Mathew Pareles 2025-01-12 19:02:26 -08:00
parent 29e1f312c3
commit b3d2453e7f
2 changed files with 64 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/vs/workbench/contrib/void/browser/react/src/sidebar-tsx/SidebarChat.tsx
View file

@ -51,7 +51,6 @@ export const IconX = ({ size, className = '', ...props }: { size: number, classN
);
};
const IconArrowUp = ({ size, className = '' }: { size: number, className?: string }) => {
return (
<svg

109
src/vs/workbench/contrib/void/browser/react/src/sidebar-tsx/SidebarThreadSelector.tsx
View file

@ -7,6 +7,7 @@ import React from "react";
import { useAccessor, useThreadsState } from '../util/services.js';
import { IThreadHistoryService } from '../../../threadHistoryService.js';
import { ISidebarStateService } from '../../../sidebarStateService.js';
import { IconX } from './SidebarChat.js';
const truncate = (s: string) => {
@ -31,61 +32,79 @@ export const SidebarThreadSelector = () => {
const sortedThreadIds = Object.keys(allThreads ?? {}).sort((threadId1, threadId2) => allThreads![threadId1].lastModified > allThreads![threadId2].lastModified ? -1 : 1)
return (
<div className="flex flex-col gap-y-1 max-h-[400px] overflow-y-auto">
<div className="flex p-2 flex-col gap-y-1 max-h-[400px] overflow-y-auto">
{/* X button at top right */}
<div className="text-right">
<button className="btn btn-sm" onClick={() => sidebarStateService.setState({ isHistoryOpen: false })}>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
className="size-4"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M6 18 18 6M6 6l12 12"
/>
</svg>
<div className="w-full relative flex justify-center items-center">
{/* title */}
<h2 className='font-bold text-lg'>{`History`}</h2>
{/* X button at top right */}
<button
type='button'
className='absolute top-0 right-0'
onClick={() => sidebarStateService.setState({ isHistoryOpen: false })}
>
<IconX
size={16}
className="p-[1px] stroke-[2] opacity-80 text-void-fg-3 hover:brightness-95"
/>
</button>
</div>
{/* a list of all the past threads */}
<div className='px-1'><div className='flex flex-col gap-y-1 overflow-y-auto'>
{sortedThreadIds.map((threadId) => {
if (!allThreads)
return <>Error: Threads not found.</>
const pastThread = allThreads[threadId]
let firstMsg: string | null = null
let secondMsg: string | null = null
<div className="px-1">
<ul className="flex flex-col gap-y-1 overflow-y-auto list-disc pl-4">
{sortedThreadIds.map((threadId) => {
if (!allThreads) {
return <li key="error" className="text-void-warning">{`No history found.`}</li>;
}
const firstMsgIdx = allThreads[threadId].messages.findIndex(msg => msg.role !== 'system' && !!msg.displayContent) ?? ''
if (firstMsgIdx !== -1)
firstMsg = truncate(allThreads[threadId].messages[firstMsgIdx].displayContent ?? '')
else
firstMsg = '""'
const pastThread = allThreads[threadId];
let firstMsg = null;
let secondMsg = null;
const secondMsgIdx = allThreads[threadId].messages.findIndex((msg, i) => msg.role !== 'system' && !!msg.displayContent && i > firstMsgIdx) ?? ''
if (secondMsgIdx !== -1)
secondMsg = truncate(allThreads[threadId].messages[secondMsgIdx].displayContent ?? '')
const firstMsgIdx = pastThread.messages.findIndex(
(msg) => msg.role !== 'system' && !!msg.displayContent
);
const numMessages = allThreads[threadId].messages.filter((msg, i) => msg.role !== 'system').length
if (firstMsgIdx !== -1) {
firstMsg = truncate(pastThread.messages[firstMsgIdx].displayContent ?? '');
} else {
firstMsg = '""';
}
return (
<button
key={pastThread.id}
className={`rounded-sm`}
onClick={() => threadsStateService.switchToThread(pastThread.id)}
title={new Date(pastThread.createdAt).toLocaleString()}
>
{`${firstMsg} (${numMessages})`}
</button>
)
})}
</div></div>
const secondMsgIdx = pastThread.messages.findIndex(
(msg, i) => msg.role !== 'system' && !!msg.displayContent && i > firstMsgIdx
);
if (secondMsgIdx !== -1) {
secondMsg = truncate(pastThread.messages[secondMsgIdx].displayContent ?? '');
}
const numMessages = pastThread.messages.filter(
(msg) => msg.role !== 'system'
).length;
return (
<li key={pastThread.id}>
<button
className={`
hover:bg-void-bg-1
${threadsState._currentThreadId === pastThread.id ? 'bg-void-bg-1' : ''}
rounded-sm px-2 py-1
w-full
text-left
`}
onClick={() => threadsStateService.switchToThread(pastThread.id)}
title={new Date(pastThread.createdAt).toLocaleString()}
>
{`${firstMsg} (${numMessages})`}
</button>
</li>
);
})}
</ul>
</div>
</div>
)