From 77e6b583819596bbb80c243d036def9e1a7822d3 Mon Sep 17 00:00:00 2001 From: ayangweb <75017711+ayangweb@users.noreply.github.com> Date: Mon, 21 Apr 2025 14:39:06 +0800 Subject: [PATCH] refactor: show placeholder image when history is empty (#398) --- public/assets/no_data_dark.png | Bin 0 -> 6094 bytes public/assets/no_data_light.png | Bin 0 -> 6178 bytes src/components/Common/HistoryList/index.tsx | 357 ++++++++++---------- src/components/Common/NoDataImage.tsx | 18 + 4 files changed, 201 insertions(+), 174 deletions(-) create mode 100644 public/assets/no_data_dark.png create mode 100644 public/assets/no_data_light.png create mode 100644 src/components/Common/NoDataImage.tsx diff --git a/public/assets/no_data_dark.png b/public/assets/no_data_dark.png new file mode 100644 index 0000000000000000000000000000000000000000..a3aa3852e8644139c8822e45cd7665fc37b61ebe GIT binary patch literal 6094 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 UCKO&jqyPW_07*qoM6N<$g1ez~_5c6? literal 0 HcmV?d00001 diff --git a/public/assets/no_data_light.png b/public/assets/no_data_light.png new file mode 100644 index 0000000000000000000000000000000000000000..0359a69d69aeb7f6f68faa7c2062201be99848ac GIT binary patch literal 6178 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 literal 0 HcmV?d00001 diff --git a/src/components/Common/HistoryList/index.tsx b/src/components/Common/HistoryList/index.tsx index 91acba96..9f985cd8 100644 --- a/src/components/Common/HistoryList/index.tsx +++ b/src/components/Common/HistoryList/index.tsx @@ -19,6 +19,7 @@ import { useTranslation } from "react-i18next"; import VisibleKey from "../VisibleKey"; import { Chat } from "@/components/Assistant/types"; +import NoDataImage from "../NoDataImage"; dayjs.extend(isSameOrAfter); @@ -158,7 +159,7 @@ const HistoryList: FC = (props) => { ref={listRef} id={id} className={clsx( - "h-full overflow-auto px-3 py-2 text-sm bg-[#F3F4F6] dark:bg-[#1F2937]" + "flex flex-col h-full overflow-auto px-3 py-2 text-sm bg-[#F3F4F6] dark:bg-[#1F2937]" )} >
@@ -197,194 +198,202 @@ const HistoryList: FC = (props) => {
-
- {Object.entries(sortedList).map(([label, list]) => { - return ( -
- {t(label)} + {list.length > 0 ? ( + <> +
+ {Object.entries(sortedList).map(([label, list]) => { + return ( +
+ {t(label)} -
    - {list.map((item) => { - const { _id, _source } = item; +
      + {list.map((item) => { + const { _id, _source } = item; - const isActive = _id === active?._id; - const title = _source?.title ?? _id; + const isActive = _id === active?._id; + const title = _source?.title ?? _id; - return ( -
    • { - if (!isActive) { - setIsEdit(false); - } - - onSelect(item); - }} - > -
      - -
      - {isEdit && isActive ? ( - { - if (event.key !== "Enter") return; - - onRename(item._id, event.currentTarget.value); - - setIsEdit(false); - }} - onBlur={(event) => { - onRename(item._id, event.target.value); - - setIsEdit(false); - }} - /> - ) : ( - {title} - )} - -
      - {isActive && !isEdit && ( - + return ( +
    • { + if (!isActive) { + setIsEdit(false); + } - - {isActive && !isEdit && ( - - { - moreButtonRef.current?.click(); - }} - > - - - + onSelect(item); + }} + > +
      + +
      + {isEdit && isActive ? ( + { + if (event.key !== "Enter") return; + + onRename(item._id, event.currentTarget.value); + + setIsEdit(false); + }} + onBlur={(event) => { + onRename(item._id, event.target.value); + + setIsEdit(false); + }} + /> + ) : ( + {title} )} - { - event.stopPropagation(); - }} - > - {menuItems.map((menuItem) => { - const { - label, - icon: Icon, - shortcut, - iconColor, - onClick, - } = menuItem; +
      + {isActive && !isEdit && ( + + )} - return ( - - ); - })} - - -
      -
      -
      • - ); - })} -
    + { + event.stopPropagation(); + }} + > + {menuItems.map((menuItem) => { + const { + label, + icon: Icon, + shortcut, + iconColor, + onClick, + } = menuItem; + + return ( + + ); + })} + + +
+
+ + ); + })} + +
+ ); + })} +
+ + setIsOpen(false)} + className="relative z-1000" + > +
+ +
+ + {t("history_list.delete_modal.title")} + + + {t("history_list.delete_modal.description", { + replace: [active?._source?.title || active?._id], + })} + +
+ +
+ setIsOpen(false)} + > + + + + + + +
+
- ); - })} - - - setIsOpen(false)} - className="relative z-1000" - > -
- -
- - {t("history_list.delete_modal.title")} - - - {t("history_list.delete_modal.description", { - replace: [active?._source?.title || active?._id], - })} - -
- -
- setIsOpen(false)} - > - - - - - - -
- +
+ + ) : ( +
+
- + )} ); }; diff --git a/src/components/Common/NoDataImage.tsx b/src/components/Common/NoDataImage.tsx new file mode 100644 index 00000000..e0c9d425 --- /dev/null +++ b/src/components/Common/NoDataImage.tsx @@ -0,0 +1,18 @@ +import { useThemeStore } from "@/stores/themeStore"; +import clsx from "clsx"; +import { FC, HTMLAttributes } from "react"; + +const NoDataImage: FC> = (props) => { + const { className } = props; + const isDark = useThemeStore((state) => state.isDark); + + return ( + + ); +}; + +export default NoDataImage;