wassname/Open-Assistant
1
0
Fork 0
mirror of https://github.com/wassname/Open-Assistant.git synced 2026-07-08 00:10:24 +08:00
Code Issues Packages Projects Releases Wiki Activity

Added collapsable text for text that's too long

Browse Source
This commit is contained in:
Kostia
2023-01-03 03:11:50 +02:00
parent a83eb7ffe1
commit 1fdb3c4876
3 changed files with 41 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
website/src/components/CollapsableText.tsx
+37
View File
@@ -0,0 +1,37 @@
import { Button, Container, useDisclosure } from "@chakra-ui/react"
import {
Modal,
ModalOverlay,
ModalContent,
ModalHeader,
ModalBody,
ModalCloseButton,
} from '@chakra-ui/react'
import React from "react";
export const CollapsableText = ({text, maxLength=220}) => {
const { isOpen, onOpen, onClose } = useDisclosure()
if (typeof(text) != 'string' || text.length <= maxLength) {
return text;
} else {
return (
<>
{text.substring(0, maxLength-3)}
<Button style={{display: 'contents'}} onClick={onOpen}>...</Button>
<Container maxW='full'>
<Modal isOpen={isOpen} onClose={onClose} size="xl" scrollBehavior={'inside'} >
<ModalOverlay>
<ModalContent maxH="400">
<ModalHeader>Full Text</ModalHeader>
<ModalCloseButton />
<ModalBody>
{text}
</ModalBody>
</ModalContent>
</ModalOverlay>
</Modal>
</Container>
</>
);
}
}
website/src/components/Sortable/Sortable.tsx
+2 -1
View File
@@ -17,6 +17,7 @@ import {
verticalListSortingStrategy,
} from "@dnd-kit/sortable";
import { ReactNode, useEffect, useState } from "react";
import { CollapsableText } from "../CollapsableText";
import { SortableItem } from "./SortableItem";
@@ -61,7 +62,7 @@ export const Sortable = ({ items, onChange }: SortableProps) => {
<Flex direction="column" gap={2}>
{itemsWithIds.map(({ id, item }) => (
<SortableItem key={id} id={id}>
{item}
<CollapsableText text={item} />
</SortableItem>
))}
</Flex>
website/src/pages/evaluate/rank_assistant_replies.tsx
+2
View File
@@ -57,6 +57,8 @@ const RankAssistantReplies = () => {
const replies = tasks[0].task.replies as string[];
const endTask = tasks[tasks.length - 1];
// Added for testing purposes, will be removed:
replies.push("My test text that is very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long.");
return (
<>
<Head>