From 240d33000101cad4b4a81da9ee514fbe6b1156e6 Mon Sep 17 00:00:00 2001 From: Dean-YZG Date: Tue, 7 May 2024 15:05:29 +0800 Subject: [PATCH] feat: 1)add font source 2)add validator in ListItem 3)settings page ui optiminize --- app/components/Btn/index.tsx | 2 +- app/components/Input/index.tsx | 8 ++- app/components/List/index.tsx | 50 +++++++++++++++--- app/components/Select/index.tsx | 2 +- .../Chat/components/ChatInputPanel.tsx | 2 +- .../Chat/components/ChatMessagePanel.tsx | 2 +- .../Settings/components/ModelSetting.tsx | 11 +++- app/containers/Settings/index.tsx | 6 +-- app/fonts/Satoshi-Variable.ttf | Bin 0 -> 127420 bytes app/fonts/Satoshi-Variable.woff | Bin 0 -> 35160 bytes app/fonts/Satoshi-Variable.woff2 | Bin 0 -> 42588 bytes app/locales/cn.ts | 1 + app/locales/en.ts | 1 + app/styles/base-new.scss | 4 +- app/styles/globals.css | 5 +- tailwind.config.js | 2 + 16 files changed, 77 insertions(+), 19 deletions(-) create mode 100644 app/fonts/Satoshi-Variable.ttf create mode 100644 app/fonts/Satoshi-Variable.woff create mode 100644 app/fonts/Satoshi-Variable.woff2 diff --git a/app/components/Btn/index.tsx b/app/components/Btn/index.tsx index c9ba305bf..9a65a50ba 100644 --- a/app/components/Btn/index.tsx +++ b/app/components/Btn/index.tsx @@ -42,7 +42,7 @@ export default function Btn(props: BtnProps) { } text-text-btn-primary `; break; case "danger": - btnClassName = `bg-danger-btn text-text-btn-danger hover:bg-hovered-btn`; + btnClassName = `bg-danger-btn text-text-btn-danger hover:bg-hovered-danger-btn`; break; default: btnClassName = `bg-default-btn text-text-btn-default hover:bg-hovered-btn`; diff --git a/app/components/Input/index.tsx b/app/components/Input/index.tsx index 9e28e886a..79826a4b4 100644 --- a/app/components/Input/index.tsx +++ b/app/components/Input/index.tsx @@ -4,7 +4,6 @@ import { DetailedHTMLProps, InputHTMLAttributes, useContext, - useEffect, useLayoutEffect, useState, } from "react"; @@ -17,6 +16,7 @@ export interface CommonInputProps > { className?: string; } + export interface NumberInputProps { onChange?: (v: number) => void; type?: "number"; @@ -49,12 +49,16 @@ export default function Input(props: CommonInputProps & InputProps) { const internalType = (show && "text") || type; - const { update } = useContext(List.ListContext); + const { update, handleValidate } = useContext(List.ListContext); useLayoutEffect(() => { update?.({ type: "input" }); }, []); + useLayoutEffect(() => { + handleValidate?.(value); + }, [value]); + return (
void; nextline?: boolean; + validator?: (v: any) => Error | Promise; } export const ListContext = createContext< - { isMobileScreen?: boolean; update?: (m: ChildrenMeta) => void } & WidgetStyle + { + isMobileScreen?: boolean; + update?: (m: ChildrenMeta) => void; + handleValidate?: (v: any) => void; + } & WidgetStyle >({ isMobileScreen: false }); export function ListItem(props: ListItemProps) { @@ -48,6 +63,7 @@ export function ListItem(props: ListItemProps) { subTitle, children, nextline, + validator, } = props; const context = useContext(ListContext); @@ -56,9 +72,11 @@ export function ListItem(props: ListItemProps) { const { inputNextLine, rangeNextLine } = context; + const { type, error } = childrenMeta; + let internalNextLine; - switch (childrenMeta.type) { + switch (type) { case "input": internalNextLine = !!(nextline || inputNextLine); break; @@ -70,7 +88,22 @@ export function ListItem(props: ListItemProps) { } const update = useCallback((m: ChildrenMeta) => { - setMeta(m); + setMeta((pre) => ({ ...pre, ...m })); + }, []); + + const handleValidate = useCallback((v: any) => { + const insideValidator = validator || (() => {}); + + Promise.resolve(insideValidator(v)).then((result) => { + if (result && result.error) { + return update({ + error: result.message, + }); + } + update({ + error: undefined, + }); + }); }, []); return ( @@ -88,13 +121,18 @@ export function ListItem(props: ListItemProps) {
{subTitle}
)}
- +
- {children} +
{children}
+ {!!error && ( +
+
{error}
+
+ )}
diff --git a/app/components/Select/index.tsx b/app/components/Select/index.tsx index 728d97b41..640b98737 100644 --- a/app/components/Select/index.tsx +++ b/app/components/Select/index.tsx @@ -96,7 +96,7 @@ const Select = (props: SearchProps) => { className={selectClassName} >
( {!isMobileScreen && (
 
-
+
{Locale.Chat.Input(submitKey)}