add X to ctrlK

This commit is contained in:
Andrew Pareles 2025-01-05 21:02:31 -08:00
parent fb948b331f
commit 2ba04a78a8
6 changed files with 42 additions and 43 deletions

View file

@ -49,14 +49,14 @@ const CodeButtonsOnHover = ({ text }: { text: string }) => {
return <> return <>
<button <button
className={`${isSingleLine ? '' : 'px-1 py-0.5'} text-xs bg-void-bg-1 text-void-fg-1 hover:brightness-110 border border-vscode-input-border rounded text-xs`} className={`${isSingleLine ? '' : 'px-1 py-0.5'} text-sm bg-void-bg-1 text-void-fg-1 hover:brightness-110 border border-vscode-input-border rounded`}
onClick={onCopy} onClick={onCopy}
> >
{copyButtonState} {copyButtonState}
</button> </button>
<button <button
// btn btn-secondary btn-sm border text-xs border-vscode-input-border rounded // btn btn-secondary btn-sm border text-sm border-vscode-input-border rounded
className={`${isSingleLine ? '' : 'px-1 py-0.5'} text-xs bg-void-bg-1 text-void-fg-1 hover:brightness-110 border border-vscode-input-border rounded text-xs`} className={`${isSingleLine ? '' : 'px-1 py-0.5'} text-sm bg-void-bg-1 text-void-fg-1 hover:brightness-110 border border-vscode-input-border rounded`}
onClick={onApply} onClick={onApply}
> >
Apply Apply
@ -215,7 +215,7 @@ const RenderToken = ({ token, nested = false }: { token: Token | string, nested?
// default // default
return ( return (
<div className="bg-orange-50 rounded-sm overflow-hidden"> <div className="bg-orange-50 rounded-sm overflow-hidden">
<span className="text-xs text-orange-500">Unknown type:</span> <span className="text-sm text-orange-500">Unknown type:</span>
{t.raw} {t.raw}
</div> </div>
) )

View file

@ -120,12 +120,7 @@ export const QuickEditChat = ({ diffareaid, onGetInputBox, onUserUpdateText, onC
@@[&_div.monaco-inputbox]:!void-border-none @@[&_div.monaco-inputbox]:!void-border-none
@@[&_div.monaco-inputbox]:!void-outline-none`} @@[&_div.monaco-inputbox]:!void-outline-none`}
> >
<div className='flex flex-row justify-between items-end gap-1'> <div className='flex flex-row items-center justify-between items-end gap-1'>
<div className='absolute size-[4px] top-0 right-4 z-[1]'>
<X
onClick={onX}
/>
</div>
{/* input */} {/* input */}
<div // copied from SidebarChat.tsx <div // copied from SidebarChat.tsx
@ -150,6 +145,16 @@ export const QuickEditChat = ({ diffareaid, onGetInputBox, onUserUpdateText, onC
/> />
</div> </div>
<div className='absolute pt-1 -top-1 -right-1'>
<span className='cursor-pointer hover:bg-red-500 rounded-md z-1'>
<X
className='size-3 text-vscode-toolbar-foreground'
onClick={onX}
/>
</span>
</div>
</div> </div>

View file

@ -36,38 +36,38 @@ export const ErrorDisplay = ({
return ( return (
<div className={`rounded-lg border border-red-200 bg-red-50 p-4 overflow-auto`}> <div className={`rounded-lg border border-red-200 bg-red-50 p-4 overflow-auto`}>
{/* Header */} {/* Header */}
<div className="flex items-start justify-between"> <div className='flex items-start justify-between'>
<div className="flex gap-3"> <div className='flex gap-3'>
<AlertCircle className="h-5 w-5 text-red-600 mt-0.5" /> <AlertCircle className='h-5 w-5 text-red-600 mt-0.5' />
<div className="flex-1"> <div className='flex-1'>
<h3 className="font-semibold text-red-800"> <h3 className='font-semibold text-red-800'>
{/* eg Error */} {/* eg Error */}
Error Error
</h3> </h3>
<p className="text-red-700 mt-1"> <p className='text-red-700 mt-1'>
{/* eg Something went wrong */} {/* eg Something went wrong */}
{message} {message}
</p> </p>
</div> </div>
</div> </div>
<div className="flex gap-2"> <div className='flex gap-2'>
{details && ( {details && (
<button className="text-red-600 hover:text-red-800 p-1 rounded" <button className='text-red-600 hover:text-red-800 p-1 rounded'
onClick={() => setIsExpanded(!isExpanded)} onClick={() => setIsExpanded(!isExpanded)}
> >
{isExpanded ? ( {isExpanded ? (
<ChevronUp className="h-5 w-5" /> <ChevronUp className='h-5 w-5' />
) : ( ) : (
<ChevronDown className="h-5 w-5" /> <ChevronDown className='h-5 w-5' />
)} )}
</button> </button>
)} )}
{showDismiss && onDismiss && ( {showDismiss && onDismiss && (
<button className="text-red-600 hover:text-red-800 p-1 rounded" <button className='text-red-600 hover:text-red-800 p-1 rounded'
onClick={onDismiss} onClick={onDismiss}
> >
<X className="h-5 w-5" /> <X className='h-5 w-5' />
</button> </button>
)} )}
</div> </div>
@ -75,10 +75,10 @@ export const ErrorDisplay = ({
{/* Expandable Details */} {/* Expandable Details */}
{isExpanded && details && ( {isExpanded && details && (
<div className="mt-4 space-y-3 border-t border-red-200 pt-3 overflow-auto"> <div className='mt-4 space-y-3 border-t border-red-200 pt-3 overflow-auto'>
<div> <div>
<span className="font-semibold text-red-800">Full Error: </span> <span className='font-semibold text-red-800'>Full Error: </span>
<pre className="text-red-700">{details}</pre> <pre className='text-red-700'>{details}</pre>
</div> </div>
</div> </div>
)} )}

View file

@ -272,7 +272,7 @@ export const SelectedFiles = (
return ( return (
!!selections && selections.length !== 0 && ( !!selections && selections.length !== 0 && (
<div <div
className='flex flex-wrap gap-2 text-left' className='flex flex-wrap gap-0.5 text-left'
> >
{selections.map((selection, i) => { {selections.map((selection, i) => {
@ -311,12 +311,7 @@ export const SelectedFiles = (
{/* X button */} {/* X button */}
{type === 'staging' && {type === 'staging' &&
<span <span
className=' className='cursor-pointer hover:bg-vscode-toolbar-hover-bg rounded-md z-1'
cursor-pointer
bg-vscode-editorwidget-bg hover:bg-vscode-toolbar-hover-bg
rounded-md
z-1
'
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
if (type !== 'staging') return; if (type !== 'staging') return;

View file

@ -53,7 +53,7 @@ export const SidebarThreadSelector = () => {
</div> </div>
{/* a list of all the past threads */} {/* a list of all the past threads */}
<div className='flex flex-col gap-y-1 overflow-y-auto'> <div className='px-1'><div className='flex flex-col gap-y-1 overflow-y-auto'>
{sortedThreadIds.map((threadId) => { {sortedThreadIds.map((threadId) => {
if (!allThreads) if (!allThreads)
return <>Error: Threads not found.</> return <>Error: Threads not found.</>
@ -88,7 +88,7 @@ export const SidebarThreadSelector = () => {
</button> </button>
) )
})} })}
</div> </div></div>
</div> </div>
) )

View file

@ -197,7 +197,6 @@ export const ModelDump = () => {
return <div key={`${modelName}${providerName}`} return <div key={`${modelName}${providerName}`}
className={`flex items-center justify-between gap-4 hover:bg-black/10 dark:hover:bg-gray-300/10 py-1 px-3 rounded-sm overflow-hidden cursor-default truncate className={`flex items-center justify-between gap-4 hover:bg-black/10 dark:hover:bg-gray-300/10 py-1 px-3 rounded-sm overflow-hidden cursor-default truncate
${isNewProviderName ? 'border-void-bg-1 border-t' : ''}
`} `}
> >
{/* left part is width:full */} {/* left part is width:full */}
@ -285,7 +284,7 @@ const ProviderSetting = ({ providerName, settingName }: { providerName: Provider
}, [voidSettingsService, providerName, settingName])} }, [voidSettingsService, providerName, settingName])}
multiline={false} multiline={false}
/> />
{subTextMd === undefined ? null : <div className='py-1 px-3 opacity-50 text-xs'> {subTextMd === undefined ? null : <div className='py-1 px-3 opacity-50 text-sm'>
<ChatMarkdownRender string={subTextMd} /> <ChatMarkdownRender string={subTextMd} />
</div>} </div>}
@ -425,13 +424,13 @@ export const Settings = () => {
{/* <h3 className={`opacity-50 mb-2`}>{`Keep your data private by hosting AI locally on your computer.`}</h3> */} {/* <h3 className={`opacity-50 mb-2`}>{`Keep your data private by hosting AI locally on your computer.`}</h3> */}
{/* <h3 className={`opacity-50 mb-2`}>{`Instructions:`}</h3> */} {/* <h3 className={`opacity-50 mb-2`}>{`Instructions:`}</h3> */}
{/* <h3 className={`mb-2`}>{`Void can access any model that you host locally. We automatically detect your local models by default.`}</h3> */} {/* <h3 className={`mb-2`}>{`Void can access any model that you host locally. We automatically detect your local models by default.`}</h3> */}
<h3 className={`text-void-fg-3 mb-2`}>{`Host a model locally and use it in Void. Instructions:`}</h3> <h3 className={`text-void-fg-3 mb-2`}>{`Void can access any model that you host locally. We automatically detect your local models by default.`}</h3>
<div className='pl-4 select-text opacity-50'> <div className='pl-4 select-text opacity-50'>
<h4 className={`text-xs mb-2`}><ChatMarkdownRender string={`1. Download [Ollama](https://ollama.com/download).`} /></h4> <h4 className={`text-sm mb-2`}><ChatMarkdownRender string={`1. Download [Ollama](https://ollama.com/download).`} /></h4>
<h4 className={`text-xs mb-2`}><ChatMarkdownRender string={`2. Open your terminal.`} /></h4> <h4 className={`text-sm mb-2`}><ChatMarkdownRender string={`2. Open your terminal.`} /></h4>
<h4 className={`text-xs mb-2`}><ChatMarkdownRender string={`3. Run \`ollama run llama3.1\`. This installs Meta's llama3.1 model which is best for chat and inline edits. Requires 5GB of memory.`} /></h4> <h4 className={`text-sm mb-2`}><ChatMarkdownRender string={`3. Run \`ollama run llama3.1\`. This installs Meta's llama3.1 model which is best for chat and inline edits. Requires 5GB of memory.`} /></h4>
<h4 className={`text-xs mb-2`}><ChatMarkdownRender string={`4. Run \`ollama run qwen2.5-coder:1.5b\`. This installs a faster autocomplete model. Requires 1GB of memory.`} /></h4> <h4 className={`text-sm mb-2`}><ChatMarkdownRender string={`4. Run \`ollama run qwen2.5-coder:1.5b\`. This installs a faster autocomplete model. Requires 1GB of memory.`} /></h4>
<h4 className={`text-xs mb-2`}><ChatMarkdownRender string={`Void automatically detects locally running models and enables them.`} /></h4> <h4 className={`text-sm mb-2`}><ChatMarkdownRender string={`Void automatically detects locally running models and enables them.`} /></h4>
{/* TODO we should create UI for downloading models without user going into terminal */} {/* TODO we should create UI for downloading models without user going into terminal */}
</div> </div>
@ -440,7 +439,7 @@ export const Settings = () => {
</ErrorBoundary> </ErrorBoundary>
<h2 className={`text-3xl mb-2 mt-16`}>More Providers</h2> <h2 className={`text-3xl mb-2 mt-16`}>More Providers</h2>
<h3 className={`text-void-fg-3 mb-2`}>{`Get access to frontier models. We recommend Anthropic or OpenAI.`}</h3> <h3 className={`text-void-fg-3 mb-2`}>{`Void can also access models from Anthropic, OpenAI, OpenRouter, and more.`}</h3>
{/* <h3 className={`opacity-50 mb-2`}>{`Access models like ChatGPT and Claude. We recommend using Anthropic or OpenAI as providers, or Groq as a faster alternative.`}</h3> */} {/* <h3 className={`opacity-50 mb-2`}>{`Access models like ChatGPT and Claude. We recommend using Anthropic or OpenAI as providers, or Groq as a faster alternative.`}</h3> */}
<ErrorBoundary> <ErrorBoundary>
<VoidProviderSettings providerNames={nonlocalProviderNames} /> <VoidProviderSettings providerNames={nonlocalProviderNames} />