From 116e16e30dfda4ffd9aea5e006d78db525a323d3 Mon Sep 17 00:00:00 2001 From: Yidadaa Date: Tue, 2 May 2023 02:52:25 +0800 Subject: [PATCH 1/3] fixup --- app/components/chat.tsx | 1 + app/components/markdown.tsx | 12 ++---------- 2 files changed, 3 insertions(+), 10 deletions(-) diff --git a/app/components/chat.tsx b/app/components/chat.tsx index bd2c913d..4aaa8437 100644 --- a/app/components/chat.tsx +++ b/app/components/chat.tsx @@ -725,6 +725,7 @@ export function Chat() { }} fontSize={fontSize} parentRef={scrollRef} + defaultShow={i >= messages.length - 10} /> {!isUser && !message.preview && ( diff --git a/app/components/markdown.tsx b/app/components/markdown.tsx index eefb31f3..b5805e50 100644 --- a/app/components/markdown.tsx +++ b/app/components/markdown.tsx @@ -62,11 +62,12 @@ export function Markdown( loading?: boolean; fontSize?: number; parentRef: RefObject; + defaultShow?: boolean; } & React.DOMAttributes, ) { const mdRef = useRef(null); const renderedHeight = useRef(0); - const inView = useRef(false); + const inView = useRef(!!props.defaultShow); const parent = props.parentRef.current; const md = mdRef.current; @@ -90,15 +91,6 @@ export function Markdown( } }; - useEffect(() => { - setTimeout(() => { - if (!inView.current) { - checkInView(); - } - }, 30); - // eslint-disable-next-line react-hooks/exhaustive-deps - }, []); - checkInView(); return ( From 132f6c842073d354f7c88fc06fa18d705a978717 Mon Sep 17 00:00:00 2001 From: Yidadaa Date: Tue, 2 May 2023 03:01:42 +0800 Subject: [PATCH 2/3] feat: improve mask ui --- app/components/mask.module.scss | 9 +++------ app/components/mask.tsx | 21 ++++++++++----------- 2 files changed, 13 insertions(+), 17 deletions(-) diff --git a/app/components/mask.module.scss b/app/components/mask.module.scss index 0618cc06..c1778d45 100644 --- a/app/components/mask.module.scss +++ b/app/components/mask.module.scss @@ -23,8 +23,9 @@ .mask-filter { width: 100%; max-width: 100%; - margin-bottom: 10px; + margin-bottom: 20px; animation: search-in ease 0.3s; + height: 40px; display: flex; @@ -32,7 +33,6 @@ flex-grow: 1; max-width: 100%; min-width: 0; - margin-bottom: 20px; animation: search-in ease 0.3s; } @@ -45,10 +45,7 @@ height: 100%; margin-left: 10px; box-sizing: border-box; - - button { - padding: 10px; - } + min-width: 80px; } } diff --git a/app/components/mask.tsx b/app/components/mask.tsx index 3f239aca..c980c48c 100644 --- a/app/components/mask.tsx +++ b/app/components/mask.tsx @@ -291,17 +291,16 @@ export function MaskPage() { ))} -
- } - text={Locale.Mask.Page.Create} - bordered - onClick={() => { - const createdMask = maskStore.create(); - setEditingMaskId(createdMask.id); - }} - /> -
+ } + text={Locale.Mask.Page.Create} + bordered + onClick={() => { + const createdMask = maskStore.create(); + setEditingMaskId(createdMask.id); + }} + />
From 717c123b82e5b20e27b1bd29849ba4f64bbd9b6b Mon Sep 17 00:00:00 2001 From: Yidadaa Date: Tue, 2 May 2023 03:10:13 +0800 Subject: [PATCH 3/3] feat: improve mask ui --- app/components/mask.module.scss | 15 +-------------- app/components/new-chat.module.scss | 5 ++--- app/components/new-chat.tsx | 23 +++++++++++++---------- app/locales/cn.ts | 2 +- 4 files changed, 17 insertions(+), 28 deletions(-) diff --git a/app/components/mask.module.scss b/app/components/mask.module.scss index c1778d45..d66d9886 100644 --- a/app/components/mask.module.scss +++ b/app/components/mask.module.scss @@ -1,16 +1,4 @@ @import "../styles/animation.scss"; - -@keyframes search-in { - from { - opacity: 0; - transform: translateY(5vh) scaleX(0.5); - } - to { - opacity: 1; - transform: translateY(0) scaleX(1); - } -} - .mask-page { height: 100%; display: flex; @@ -24,7 +12,7 @@ width: 100%; max-width: 100%; margin-bottom: 20px; - animation: search-in ease 0.3s; + animation: slide-in ease 0.3s; height: 40px; display: flex; @@ -33,7 +21,6 @@ flex-grow: 1; max-width: 100%; min-width: 0; - animation: search-in ease 0.3s; } .mask-filter-lang { diff --git a/app/components/new-chat.module.scss b/app/components/new-chat.module.scss index 36f447bb..b0e472ea 100644 --- a/app/components/new-chat.module.scss +++ b/app/components/new-chat.module.scss @@ -59,10 +59,9 @@ display: flex; justify-content: center; - .search-bar { + .more { font-size: 12px; - margin-right: 10px; - width: 40vw; + margin-left: 10px; } } diff --git a/app/components/new-chat.tsx b/app/components/new-chat.tsx index 8cb4d35e..42612e0a 100644 --- a/app/components/new-chat.tsx +++ b/app/components/new-chat.tsx @@ -5,10 +5,11 @@ import { EmojiAvatar } from "./emoji"; import styles from "./new-chat.module.scss"; import LeftIcon from "../icons/left.svg"; -import AddIcon from "../icons/lightning.svg"; +import LightningIcon from "../icons/lightning.svg"; +import EyeIcon from "../icons/eye.svg"; import { useLocation, useNavigate } from "react-router-dom"; -import { createEmptyMask, Mask, useMaskStore } from "../store/mask"; +import { Mask, useMaskStore } from "../store/mask"; import Locale from "../locales"; import { useAppConfig, useChatStore } from "../store"; import { MaskAvatar } from "./mask"; @@ -148,20 +149,22 @@ export function NewChat() {
{Locale.NewChat.SubTitle}
- navigate(Path.Masks)} - /> - startChat()} - icon={} + icon={} type="primary" shadow /> + + navigate(Path.Masks)} + icon={} + bordered + shadow + />
diff --git a/app/locales/cn.ts b/app/locales/cn.ts index 45dc10a9..f973dfbc 100644 --- a/app/locales/cn.ts +++ b/app/locales/cn.ts @@ -224,7 +224,7 @@ const cn = { ConfirmNoShow: "确认禁用？禁用后可以随时在设置中重新启用。", Title: "挑选一个面具", SubTitle: "现在开始，与面具背后的灵魂思维碰撞", - More: "搜索更多", + More: "查看全部", }, UI: {