Feat: Replace antd modal with shadcn dialog.

This commit is contained in:
bill 2025-12-03 13:42:33 +08:00
parent ef4c558306
commit 8ea76da152
5 changed files with 39 additions and 66 deletions

View file

@ -14,8 +14,8 @@ import { Radio, Tooltip } from 'antd';
import { useCallback } from 'react';
import { useTranslation } from 'react-i18next';
import FeedbackDialog from '../feedback-dialog';
import { PromptDialog } from '../prompt-dialog';
import { useRemoveMessage, useSendFeedback, useSpeech } from './hooks';
import PromptModal from './prompt-modal';
interface IProps {
messageId: string;
@ -87,11 +87,11 @@ export const AssistantGroupButton = ({
></FeedbackDialog>
)}
{promptVisible && (
<PromptModal
<PromptDialog
visible={promptVisible}
hideModal={hidePromptModal}
prompt={prompt}
></PromptModal>
></PromptDialog>
)}
</>
);

View file

@ -1,30 +0,0 @@
import { IModalProps } from '@/interfaces/common';
import { IFeedbackRequestBody } from '@/interfaces/request/chat';
import { Modal, Space } from 'antd';
import HightLightMarkdown from '../highlight-markdown';
import SvgIcon from '../svg-icon';
const PromptModal = ({
visible,
hideModal,
prompt,
}: IModalProps<IFeedbackRequestBody> & { prompt?: string }) => {
return (
<Modal
title={
<Space>
<SvgIcon name={`prompt`} width={18}></SvgIcon>
Prompt
</Space>
}
width={'80%'}
open={visible}
onCancel={hideModal}
footer={null}
>
<HightLightMarkdown>{prompt}</HightLightMarkdown>
</Modal>
);
};
export default PromptModal;

View file

@ -18,9 +18,9 @@ import { Download, NotebookText } from 'lucide-react';
import { useCallback, useContext } from 'react';
import { useTranslation } from 'react-i18next';
import FeedbackDialog from '../feedback-dialog';
import { PromptDialog } from '../prompt-dialog';
import { ToggleGroup, ToggleGroupItem } from '../ui/toggle-group';
import { useRemoveMessage, useSendFeedback, useSpeech } from './hooks';
import PromptModal from './prompt-modal';
interface IProps {
messageId: string;
@ -137,11 +137,11 @@ export const AssistantGroupButton = ({
></FeedbackDialog>
)}
{promptVisible && (
<PromptModal
<PromptDialog
visible={promptVisible}
hideModal={hidePromptModal}
prompt={prompt}
></PromptModal>
></PromptDialog>
)}
</>
);

View file

@ -1,30 +0,0 @@
import { IModalProps } from '@/interfaces/common';
import { IFeedbackRequestBody } from '@/interfaces/request/chat';
import { Modal, Space } from 'antd';
import HightLightMarkdown from '../highlight-markdown';
import SvgIcon from '../svg-icon';
const PromptModal = ({
visible,
hideModal,
prompt,
}: IModalProps<IFeedbackRequestBody> & { prompt?: string }) => {
return (
<Modal
title={
<Space>
<SvgIcon name={`prompt`} width={18}></SvgIcon>
Prompt
</Space>
}
width={'80%'}
open={visible}
onCancel={hideModal}
footer={null}
>
<HightLightMarkdown>{prompt}</HightLightMarkdown>
</Modal>
);
};
export default PromptModal;

View file

@ -0,0 +1,33 @@
import { IModalProps } from '@/interfaces/common';
import { IFeedbackRequestBody } from '@/interfaces/request/chat';
import HightLightMarkdown from './highlight-markdown';
import SvgIcon from './svg-icon';
import { Dialog, DialogContent, DialogHeader, DialogTitle } from './ui/dialog';
type PromptDialogProps = IModalProps<IFeedbackRequestBody> & {
prompt?: string;
};
export function PromptDialog({
visible,
hideModal,
prompt,
}: PromptDialogProps) {
return (
<Dialog open={visible} onOpenChange={hideModal}>
<DialogContent className="max-w-[80vw]">
<DialogHeader>
<DialogTitle>
<div className="space-x-2">
<SvgIcon name={`prompt`} width={18}></SvgIcon>
<span> Prompt</span>
</div>
</DialogTitle>
</DialogHeader>
<section className="max-h-[80vh] overflow-auto">
<HightLightMarkdown>{prompt}</HightLightMarkdown>
</section>
</DialogContent>
</Dialog>
);
}