daonanchao/vibe-kanban
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Task attempt ed00b339-eaec-4c8f-b4f5-79504e6105c6 - Final changes

Browse Source
This commit is contained in:
Louis Knight-Webb
2025-06-24 17:46:21 +01:00
parent b4b2890573
commit a7217df3fc
2 changed files with 32 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/src/components/tasks/TaskDetailsPanel.tsx
View File

@@ -1235,7 +1235,7 @@ export function TaskDetailsPanel({
<AlertDescription>{followUpError}</AlertDescription> <AlertDescription>{followUpError}</AlertDescription>
</Alert> </Alert>
)} )}
<div className="flex gap-3"> <div className="space-y-3">
<FileSearchTextarea <FileSearchTextarea
placeholder="Ask a follow-up question about this task... Type @ to search files." placeholder="Ask a follow-up question about this task... Type @ to search files."
value={followUpMessage} value={followUpMessage}
@@ -1255,12 +1255,12 @@ export function TaskDetailsPanel({
} }
} }
}} }}
className="flex-1 min-h-[80px] resize-none" className="w-full min-h-[80px] resize-none"
disabled={!canSendFollowUp} disabled={!canSendFollowUp}
projectId={projectId} projectId={projectId}
rows={4} rows={4}
/> />
<div className="flex flex-col justify-end"> <div className="flex justify-end">
<Button <Button
onClick={handleSendFollowUp} onClick={handleSendFollowUp}
disabled={ disabled={
@@ -1273,7 +1273,10 @@ export function TaskDetailsPanel({
{isSendingFollowUp ? ( {isSendingFollowUp ? (
<div className="animate-spin rounded-full h-4 w-4 border-b-2 border-current" /> <div className="animate-spin rounded-full h-4 w-4 border-b-2 border-current" />
) : ( ) : (
<Send className="h-4 w-4" /> <>
<Send className="h-4 w-4 mr-2" />
Send
</>
)} )}
</Button> </Button>
</div> </div>

45
frontend/src/components/ui/file-search-textarea.tsx
View File

@@ -177,25 +177,28 @@ export function FileSearchTextarea({
const lineHeight = parseInt(computedStyle.lineHeight) || 20 const lineHeight = parseInt(computedStyle.lineHeight) || 20
const fontSize = parseInt(computedStyle.fontSize) || 14 const fontSize = parseInt(computedStyle.fontSize) || 14
const charWidth = fontSize * 0.6 // Approximate character width const charWidth = fontSize * 0.6 // Approximate character width
const paddingLeft = parseInt(computedStyle.paddingLeft) || 12
const paddingTop = parseInt(computedStyle.paddingTop) || 8
// Position relative to textarea // Position relative to textarea
const relativeTop = (currentLine + 1) * lineHeight + 8 const relativeTop = paddingTop + (currentLine * lineHeight) + lineHeight
const relativeLeft = charWidth * charInLine const relativeLeft = paddingLeft + (charWidth * charInLine)
// Convert to viewport coordinates // Convert to viewport coordinates
const viewportTop = textareaRect.top + relativeTop const viewportTop = textareaRect.top + relativeTop
const viewportLeft = textareaRect.left + relativeLeft const viewportLeft = textareaRect.left + relativeLeft
// Adjust for viewport boundaries // Dropdown dimensions
const dropdownHeight = 240 // max-h-60 = 240px
const dropdownWidth = 256 // min-w-64 = 256px const dropdownWidth = 256 // min-w-64 = 256px
const minDropdownHeight = 120
const maxDropdownHeight = 240 // max-h-60 = 240px
let finalTop = viewportTop let finalTop = viewportTop
let finalLeft = viewportLeft let finalLeft = viewportLeft
let maxHeight = dropdownHeight let maxHeight = maxDropdownHeight
// Prevent going off the right edge // Prevent going off the right edge
if (viewportLeft + dropdownWidth > window.innerWidth) { if (viewportLeft + dropdownWidth > window.innerWidth - 16) {
finalLeft = window.innerWidth - dropdownWidth - 16 finalLeft = window.innerWidth - dropdownWidth - 16
} }
@@ -205,20 +208,22 @@ export function FileSearchTextarea({
} }
// Prevent going off the bottom edge // Prevent going off the bottom edge
if (viewportTop + dropdownHeight > window.innerHeight) { const availableSpaceBelow = window.innerHeight - viewportTop - 16
// Try positioning above the line instead const availableSpaceAbove = textareaRect.top + (currentLine * lineHeight) - 16
const aboveTop = textareaRect.top + (currentLine * lineHeight) - dropdownHeight - 8
if (aboveTop > 16) { if (availableSpaceBelow < minDropdownHeight && availableSpaceAbove > availableSpaceBelow) {
finalTop = aboveTop // Position above the cursor line
} else { finalTop = textareaRect.top + paddingTop + (currentLine * lineHeight) - maxDropdownHeight - 8
// If can't fit above either, limit height and scroll maxHeight = Math.min(maxDropdownHeight, availableSpaceAbove)
maxHeight = window.innerHeight - viewportTop - 16 } else {
if (maxHeight < 120) { // Position below the cursor line
// If still too small, position at bottom with limited height maxHeight = Math.min(maxDropdownHeight, availableSpaceBelow)
finalTop = window.innerHeight - 120 - 16 }
maxHeight = 120
} // Ensure minimum height
} if (maxHeight < minDropdownHeight) {
maxHeight = minDropdownHeight
finalTop = Math.max(16, window.innerHeight - minDropdownHeight - 16)
} }
return { top: finalTop, left: finalLeft, maxHeight } return { top: finalTop, left: finalLeft, maxHeight }