7x31
/
ChatGPT-Next-Web
mirror of https://github.com/Yidadaa/ChatGPT-Next-Web.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

chat item style fit sidebar collapse

This commit is contained in:
dakai 2023-04-03 12:35:45 +08:00
parent 6bec3d6dcf
commit b5958e713a
2 changed files with 27 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
app/components/chat-list.tsx
View File

@ -21,14 +21,39 @@ export function ChatItem(props: {
time: string;
selected: boolean;
}) {
return (
const [sidebarCollapse] = useChatStore((state) => [state.sidebarCollapse]);
return sidebarCollapse ? (
<div
className={`${styles["chat-item-collapse"]} ${
props.selected && styles["chat-item-selected"]
}`}
onClick={props.onClick}
>
<div className={styles["chat-item-info-collapse"]}>
{Locale.ChatItem.ChatItemCount(props.count).replace(/[^0-9]/g, "")
.length <= 3
? Locale.ChatItem.ChatItemCount(props.count).replace(/[^0-9]/g, "")
: ":)"}
</div>
<div
className={
sidebarCollapse
? styles["chat-item-delete-collapse"]
: styles["chat-item-delete"]
}
onClick={props.onDelete}
>
<DeleteIcon />
</div>
</div>
) : (
<div
className={`${styles["chat-item"]} ${
props.selected && styles["chat-item-selected"]
}`}
onClick={props.onClick}
>
<div className={styles["chat-item-title"]}>{props.title}</div>
<div>{props.title}</div>
<div className={styles["chat-item-info"]}>
<div className={styles["chat-item-count"]}>
{Locale.ChatItem.ChatItemCount(props.count)}

54
app/components/home.tsx
View File

@ -58,60 +58,6 @@ export function Avatar(props: { role: Message["role"] }) {
);
}
export function ChatItem(props: {
onClick?: () => void;
onDelete?: () => void;
title: string;
count: number;
time: string;
selected: boolean;
}) {
const [sidebarCollapse] = useChatStore((state) => [state.sidebarCollapse]);
return sidebarCollapse ? (
<div
className={`${styles["chat-item-collapse"]} ${
props.selected && styles["chat-item-selected"]
}`}
onClick={props.onClick}
>
<div className={styles["chat-item-info-collapse"]}>
{Locale.ChatItem.ChatItemCount(props.count).replace(/[^0-9]/g, "")
.length <= 3
? Locale.ChatItem.ChatItemCount(props.count).replace(/[^0-9]/g, "")
: ":)"}
</div>
<div
className={
sidebarCollapse
? styles["chat-item-delete-collapse"]
: styles["chat-item-delete"]
}
onClick={props.onDelete}
>
<DeleteIcon />
</div>
</div>
) : (
<div
className={`${styles["chat-item"]} ${
props.selected && styles["chat-item-selected"]
}`}
onClick={props.onClick}
>
<div>{props.title}</div>
<div className={styles["chat-item-info"]}>
<div className={styles["chat-item-count"]}>
{Locale.ChatItem.ChatItemCount(props.count)}
</div>
<div className={styles["chat-item-date"]}>{props.time}</div>
</div>
<div className={styles["chat-item-delete"]} onClick={props.onDelete}>
<DeleteIcon />
</div>
</div>
);
}
function useSubmitHandler() {
const config = useChatStore((state) => state.config);
const submitKey = config.submitKey;