fix: massive descriptions breaking usability, truncate after reasonable length

Signed-off-by: Chapman Pendery <cpendery@vt.edu>
This commit is contained in:
Chapman Pendery
2023-10-06 23:27:04 -07:00
parent 692759848d
commit 9b1ba7683e
+17 -1
View File
@@ -1,25 +1,41 @@
import React, { useState, useCallback, useEffect } from "react";
import { Text, useInput, Box, measureElement, DOMElement } from "ink";
import wrapAnsi from "wrap-ansi";
import { Suggestion } from "../runtime/model.js";
const MaxSuggestions = 5;
const SuggestionWidth = 40;
const DescriptionWidth = 30;
const DescriptionMaxHeight = 6;
const BorderWidth = 2;
const ActiveSuggestionBackgroundColor = "#7D56F4";
function Description({ description }: { description: string }) {
wrapAnsi(description, DescriptionWidth, { hard: true });
if (description.length !== 0) {
return (
<Box flexDirection="column">
<Box borderStyle="single" width={DescriptionWidth}>
<Text>{description}</Text>
<Text>{truncateDescription(description, DescriptionMaxHeight)}</Text>
</Box>
</Box>
);
}
}
function truncateDescription(description: string, maxHeight: number) {
const wrappedText = wrapAnsi(description, DescriptionWidth - BorderWidth, {
trim: false,
hard: true,
});
const lines = wrappedText.split("\n");
const truncatedLines = lines.slice(0, maxHeight);
if (lines.length > maxHeight) {
truncatedLines[maxHeight - 1] = [...truncatedLines[maxHeight - 1]].slice(0, -1).join("") + "…";
}
return truncatedLines.join("\n");
}
function SuggestionList({ suggestions, activeSuggestionIdx }: { suggestions: Suggestion[]; activeSuggestionIdx: number }) {
return (
<Box flexDirection="column">