aljaz/opencode
1
0
Fork 0
mirror of https://github.com/aljazceru/opencode.git synced 2025-12-22 02:04:22 +01:00
Code Issues Packages Projects Releases Wiki Activity

wip: desktop work

Browse Source
This commit is contained in:
Adam
2025-10-22 17:51:09 -05:00
parent f435049d36
commit 3c3d2f5a6e
4 changed files with 18 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
packages/desktop/src/pages/index.tsx
View File

@@ -315,19 +315,27 @@ export default function Page() {
<SelectDialog <SelectDialog
defaultOpen defaultOpen
title="Select file" title="Select file"
placeholder="Search files"
emptyMessage="No files found"
items={local.file.search} items={local.file.search}
key={(x) => x} key={(x) => x}
onOpenChange={(open) => setStore("fileSelectOpen", open)} onOpenChange={(open) => setStore("fileSelectOpen", open)}
onSelect={(x) => (x ? local.file.open(x, { pinned: true }) : undefined)} onSelect={(x) => (x ? local.file.open(x, { pinned: true }) : undefined)}
> >
{(i) => ( {(i) => (
<div class="w-full flex items-center justify-between"> <div
<div class="flex items-center gap-x-2 text-text-muted grow min-w-0"> classList={{
"w-full flex items-center justify-between rounded-md": true,
}}
>
<div class="flex items-center gap-x-2 grow min-w-0">
<FileIcon node={{ path: i, type: "file" }} class="shrink-0 size-4" /> <FileIcon node={{ path: i, type: "file" }} class="shrink-0 size-4" />
<span class="text-xs text-text whitespace-nowrap">{getFilename(i)}</span> <div class="flex items-center text-14-regular">
<span class="text-xs text-text-muted/80 whitespace-nowrap overflow-hidden overflow-ellipsis truncate min-w-0"> <span class="text-text-weak whitespace-nowrap overflow-hidden overflow-ellipsis truncate min-w-0">
{getDirectory(i)} {getDirectory(i)}/
</span> </span>
<span class="text-text-strong whitespace-nowrap">{getFilename(i)}</span>
</div>
</div> </div>
<div class="flex items-center gap-x-1 text-text-muted/40 shrink-0"></div> <div class="flex items-center gap-x-1 text-text-muted/40 shrink-0"></div>
</div> </div>

1
packages/ui/src/components/icon.tsx
View File

@@ -134,6 +134,7 @@ const newIcons = {
"plus-small": `<path d="M9.99984 5.41699V10.0003M9.99984 10.0003V14.5837M9.99984 10.0003H5.4165M9.99984 10.0003H14.5832" stroke="currentColor" stroke-linecap="square"/>`, "plus-small": `<path d="M9.99984 5.41699V10.0003M9.99984 10.0003V14.5837M9.99984 10.0003H5.4165M9.99984 10.0003H14.5832" stroke="currentColor" stroke-linecap="square"/>`,
"chevron-down": `<path d="M6.6665 8.33325L9.99984 11.6666L13.3332 8.33325" stroke="currentColor" stroke-linecap="square"/>`, "chevron-down": `<path d="M6.6665 8.33325L9.99984 11.6666L13.3332 8.33325" stroke="currentColor" stroke-linecap="square"/>`,
"arrow-up": `<path fill-rule="evenodd" clip-rule="evenodd" d="M9.99991 2.24121L16.0921 8.33343L15.2083 9.21731L10.6249 4.63397V17.5001H9.37492V4.63398L4.7916 9.21731L3.90771 8.33343L9.99991 2.24121Z" fill="currentColor"/>`, "arrow-up": `<path fill-rule="evenodd" clip-rule="evenodd" d="M9.99991 2.24121L16.0921 8.33343L15.2083 9.21731L10.6249 4.63397V17.5001H9.37492V4.63398L4.7916 9.21731L3.90771 8.33343L9.99991 2.24121Z" fill="currentColor"/>`,
"check-small": `<path d="M6.5 11.4412L8.97059 13.5L13.5 6.5" stroke="currentColor" stroke-linecap="square"/>`,
} }
export interface IconProps extends ComponentProps<"svg"> { export interface IconProps extends ComponentProps<"svg"> {

2
packages/ui/src/components/select.css
View File

@@ -87,6 +87,8 @@
} }
[data-slot="item-indicator"] { [data-slot="item-indicator"] {
margin-left: auto; margin-left: auto;
width: 16px;
height: 16px;
} }
&:focus { &:focus {
outline: none; outline: none;

2
packages/ui/src/components/select.tsx
View File

@@ -52,7 +52,7 @@ export function Select<T>(props: SelectProps<T> & ButtonProps) {
{props.label ? props.label(itemProps.item.rawValue) : (itemProps.item.rawValue as string)} {props.label ? props.label(itemProps.item.rawValue) : (itemProps.item.rawValue as string)}
</Kobalte.ItemLabel> </Kobalte.ItemLabel>
<Kobalte.ItemIndicator data-slot="item-indicator"> <Kobalte.ItemIndicator data-slot="item-indicator">
<Icon name="checkmark" /> <Icon name="check-small" size="small" />
</Kobalte.ItemIndicator> </Kobalte.ItemIndicator>
</Kobalte.Item> </Kobalte.Item>
)} )}