ishangsf/DeepCodeGeniusWeb-gui
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor Topic component to improve readability and maintainability

Browse Source
This commit is contained in:
smallstone 2024-01-17 17:13:43 +08:00
parent 378abec5db
commit 556c589050
1 changed files with 75 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

140
src/views/components/InputMessage/Topic.tsx
View File

@ -105,76 +105,72 @@ export default function Topic({ styleName }) {
}, },
}} }}
> >
{topicList.map((item: any, index) => ( <Box>
<Box> {topicList.map((item: any, index) => (
<Flex sx={{ width: "100%" }} gap="sm"> <Box>
<Box <Flex sx={{ width: "100%" }} gap="sm">
sx={{ <Box
cursor: "pointer",
flex: 1,
overflow: "hidden",
}}
onClick={() => showTopic(item?.root_prompt)}
>
<Flex justify="space-between" gap="sm">
<Text
fz="sm"
fw={700}
sx={{
whiteSpace: "nowrap",
overflow: "hidden",
textOverflow: "ellipsis",
flex: 1,
}}
>
{item?.root_prompt.title}
</Text>
<Text
fz="sm"
c="dimmed"
sx={{
whiteSpace: "nowrap",
overflow: "hidden",
textOverflow: "ellipsis",
}}
>
{dayjs(item?.latest_time * 1000).format("MM-DD HH:mm:ss")}
</Text>
</Flex>
<Text
c="dimmed"
fz="sm"
sx={{ sx={{
whiteSpace: "nowrap", cursor: "pointer",
flex: 1,
overflow: "hidden", overflow: "hidden",
textOverflow: "ellipsis",
}} }}
onClick={() => showTopic(item?.root_prompt)}
> >
{item?.root_prompt.responses?.[0]} <Flex justify="space-between" gap="sm">
</Text> <Text
</Box> fz="sm"
<Flex align="center"> fw={700}
<ActionIcon sx={{
onClick={() => { whiteSpace: "nowrap",
deleteTopic(item?.root_prompt.hash); overflow: "hidden",
}} textOverflow: "ellipsis",
> flex: 1,
<IconTrash size="1rem" /> }}
</ActionIcon> >
{item?.root_prompt.title}
</Text>
<Text
fz="sm"
c="dimmed"
sx={{
whiteSpace: "nowrap",
overflow: "hidden",
textOverflow: "ellipsis",
}}
>
{dayjs(item?.latest_time * 1000).format("MM-DD HH:mm:ss")}
</Text>
</Flex>
<Text
c="dimmed"
fz="sm"
sx={{
whiteSpace: "nowrap",
overflow: "hidden",
textOverflow: "ellipsis",
}}
>
{item?.root_prompt.responses?.[0]}
</Text>
</Box>
<Flex align="center">
<ActionIcon
onClick={() => {
deleteTopic(item?.root_prompt.hash);
}}
>
<IconTrash size="1rem" />
</ActionIcon>
</Flex>
</Flex> </Flex>
</Flex> {index !== topicList.length - 1 && (
{index !== topicList.length - 1 && ( <Divider variant="solid" my={6} opacity="0.5" />
<Divider variant="solid" my={6} opacity="0.5" /> )}
)} </Box>
</Box> ))}
))} </Box>
<LoadingOverlay
visible={loading}
overlayBlur={3}
overlayOpacity={0}
keepMounted={true}
/>
</Drawer> </Drawer>
<ActionIcon <ActionIcon
className={styleName} className={styleName}
@ -184,6 +180,20 @@ export default function Topic({ styleName }) {
> >
<IconClock size="1rem" /> <IconClock size="1rem" />
</ActionIcon> </ActionIcon>
<LoadingOverlay
style={{
height: "380px",
inset: "auto",
bottom: "0",
left: "0",
right: "0",
position: "fixed",
}}
visible={loading}
overlayBlur={3}
overlayOpacity={0}
keepMounted={true}
/>
</> </>
); );
} }