Files
CodeNomad/packages/ui/src/components/prompt-input/PromptAttachmentsBar.tsx
Shantur Rathore a93252621a refactor(ui): split prompt input into hooks and API
Extract prompt draft/history, attachments, picker, and keydown logic into co-located hooks. Introduce PromptInputApi for quote/expand/setText and migrate SessionView off DOM poking; remove legacy registerQuoteHandler.
2026-02-11 10:36:28 +00:00

51 lines
1.8 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import { For, Show, type Component } from "solid-js"
import { Expand } from "lucide-solid"
import type { Attachment } from "../../types/attachment"
import { useI18n } from "../../lib/i18n"
interface PromptAttachmentsBarProps {
attachments: Attachment[]
onRemoveAttachment: (attachmentId: string) => void
onExpandTextAttachment: (attachmentId: string) => void
}
const PromptAttachmentsBar: Component<PromptAttachmentsBarProps> = (props) => {
const { t } = useI18n()
return (
<div class="flex flex-wrap items-center gap-1.5 border-t px-3 py-2" style="border-color: var(--border-base);">
<For each={props.attachments}>
{(attachment) => {
const isText = attachment.source.type === "text"
return (
<div class="attachment-chip" title={attachment.source.type === "file" ? attachment.source.path : undefined}>
<span class="font-mono">{attachment.display}</span>
<Show when={isText}>
<button
type="button"
class="attachment-expand"
onClick={() => props.onExpandTextAttachment(attachment.id)}
aria-label={t("sessionView.attachments.expandPastedTextAriaLabel")}
title={t("sessionView.attachments.insertPastedTextTitle")}
>
<Expand class="h-3 w-3" aria-hidden="true" />
</button>
</Show>
<button
type="button"
class="attachment-remove"
onClick={() => props.onRemoveAttachment(attachment.id)}
aria-label={t("sessionView.attachments.removeAriaLabel")}
>
×
</button>
</div>
)
}}
</For>
</div>
)
}
export default PromptAttachmentsBar