diff --git a/web/src/components/list-filter-bar.tsx b/web/src/components/list-filter-bar.tsx index a6949098c..f1d2cf8ef 100644 --- a/web/src/components/list-filter-bar.tsx +++ b/web/src/components/list-filter-bar.tsx @@ -4,11 +4,13 @@ import { Button } from './ui/button'; interface IProps { title: string; + showDialog?: () => void; } export default function ListFilterBar({ title, children, + showDialog, }: PropsWithChildren) { return (
@@ -16,7 +18,7 @@ export default function ListFilterBar({
-
diff --git a/web/src/components/rename-dialog/index.tsx b/web/src/components/rename-dialog/index.tsx new file mode 100644 index 000000000..c1be4eabe --- /dev/null +++ b/web/src/components/rename-dialog/index.tsx @@ -0,0 +1,55 @@ +import { Button } from '@/components/ui/button'; +import { + Dialog, + DialogContent, + DialogDescription, + DialogFooter, + DialogHeader, + DialogTitle, + DialogTrigger, +} from '@/components/ui/dialog'; +import { Input } from '@/components/ui/input'; +import { Label } from '@/components/ui/label'; + +export function DialogDemo() { + return ( + + + + + + + Edit profile + + Make changes to your profile here. Click save when you're done. + + +
+
+ + +
+
+ + +
+
+ + + + + + ); +} diff --git a/web/src/components/ui/dialog.tsx b/web/src/components/ui/dialog.tsx index 36d18f8a1..65df4fffd 100644 --- a/web/src/components/ui/dialog.tsx +++ b/web/src/components/ui/dialog.tsx @@ -38,7 +38,7 @@ const DialogContent = React.forwardRef< ( span]:line-clamp-1', + 'flex h-10 w-full items-center justify-between rounded-md border border-input bg-colors-background-inverse-weak px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1', className, )} {...props} diff --git a/web/src/components/ui/textarea.tsx b/web/src/components/ui/textarea.tsx index 63745407e..f3013bccc 100644 --- a/web/src/components/ui/textarea.tsx +++ b/web/src/components/ui/textarea.tsx @@ -9,7 +9,7 @@ const Textarea = React.forwardRef< return ( + This is your public display name. diff --git a/web/src/pages/dataset/setting/basic-setting-form.tsx b/web/src/pages/dataset/setting/basic-setting-form.tsx index b90245a62..86d777318 100644 --- a/web/src/pages/dataset/setting/basic-setting-form.tsx +++ b/web/src/pages/dataset/setting/basic-setting-form.tsx @@ -78,10 +78,7 @@ export default function BasicSettingForm() { {t('name')} - + @@ -94,10 +91,7 @@ export default function BasicSettingForm() { Username - + @@ -111,7 +105,7 @@ export default function BasicSettingForm() { {t('language')} + + + + )} + /> + + + ); +} + +export function DatasetCreatingDialog({ hideModal }: IModalProps) { + const { t } = useTranslation(); + + return ( + + + + {t('knowledgeList.createKnowledgeBase')} + + + + + + + + ); +} diff --git a/web/src/pages/datasets/hooks.ts b/web/src/pages/datasets/hooks.ts new file mode 100644 index 000000000..e978a6243 --- /dev/null +++ b/web/src/pages/datasets/hooks.ts @@ -0,0 +1,47 @@ +import { KnowledgeRouteKey } from '@/constants/knowledge'; +import { useSetModalState } from '@/hooks/common-hooks'; +import { useCreateKnowledge } from '@/hooks/knowledge-hooks'; +import { useCallback, useState } from 'react'; +import { useNavigate } from 'umi'; + +export const useSearchKnowledge = () => { + const [searchString, setSearchString] = useState(''); + + const handleInputChange = (e: React.ChangeEvent) => { + setSearchString(e.target.value); + }; + return { + searchString, + handleInputChange, + }; +}; + +export const useSaveKnowledge = () => { + const { visible: visible, hideModal, showModal } = useSetModalState(); + const { loading, createKnowledge } = useCreateKnowledge(); + const navigate = useNavigate(); + + const onCreateOk = useCallback( + async (name: string) => { + const ret = await createKnowledge({ + name, + }); + + if (ret?.code === 0) { + hideModal(); + navigate( + `/knowledge/${KnowledgeRouteKey.Configuration}?id=${ret.data.kb_id}`, + ); + } + }, + [createKnowledge, hideModal, navigate], + ); + + return { + loading, + onCreateOk, + visible, + hideModal, + showModal, + }; +}; diff --git a/web/src/pages/datasets/index.tsx b/web/src/pages/datasets/index.tsx index 2e6d188f8..867b08917 100644 --- a/web/src/pages/datasets/index.tsx +++ b/web/src/pages/datasets/index.tsx @@ -2,6 +2,8 @@ import ListFilterBar from '@/components/list-filter-bar'; import { Button } from '@/components/ui/button'; import { Card, CardContent } from '@/components/ui/card'; import { ChevronRight, MoreHorizontal, Plus } from 'lucide-react'; +import { DatasetCreatingDialog } from './dataset-creating-dialog'; +import { useSaveKnowledge } from './hooks'; const datasets = [ { @@ -79,9 +81,16 @@ const datasets = [ ]; export default function Datasets() { + const { + visible, + hideModal, + showModal, + onCreateOk, + loading: creatingLoading, + } = useSaveKnowledge(); return (
- + Create dataset @@ -121,6 +130,13 @@ export default function Datasets() { ))}
+ {visible && ( + + )} ); } diff --git a/web/src/pages/profile-setting/model/model-card.tsx b/web/src/pages/profile-setting/model/model-card.tsx index 23c8006fc..d84fd8917 100644 --- a/web/src/pages/profile-setting/model/model-card.tsx +++ b/web/src/pages/profile-setting/model/model-card.tsx @@ -62,7 +62,7 @@ export function SystemModelSetting() {
+
- +
- + diff --git a/web/tailwind.config.js b/web/tailwind.config.js index e10accd4e..ca5dfe037 100644 --- a/web/tailwind.config.js +++ b/web/tailwind.config.js @@ -19,7 +19,7 @@ module.exports = { }, extend: { colors: { - border: 'hsl(var(--border))', + border: 'var(--colors-outline-neutral-strong)', input: 'hsl(var(--input))', ring: 'hsl(var(--ring))', background: 'var(--background)', diff --git a/web/tailwind.css b/web/tailwind.css index 603c083f0..7e91eeacf 100644 --- a/web/tailwind.css +++ b/web/tailwind.css @@ -40,6 +40,7 @@ --colors-background-inverse-standard: rgba(29, 26, 44, 0.1); --colors-background-inverse-strong: rgba(11, 10, 18, 0.8); --colors-background-inverse-weak: rgba(17, 16, 23, 0.1); + --colors-background-neutral-standard: white; --button-blue-text: rgb(22, 119, 255);