k88936
e6b3199490
之前遇到几次弹窗的样式不生效,bug 现在在画布agent的删除对话弹窗又出现了, 这个pr把类似的修改集中到最下层的UnifiedModal,适用于所有的modal, 一些特殊的modal有特殊处理. 画布agent的删除对话弹窗  --------- Co-authored-by: 段舒康 <kdletters@qq.com> Reviewed-on: http://192.168.35.82/git/GenarrativeAI/Genarrative/pulls/122 Reviewed-by: 段舒康 <kdletters@qq.com> Co-authored-by: 王德宇 <kvtodev@outlook.com> Co-committed-by: 王德宇 <kvtodev@outlook.com>
72 lines
2.7 KiB
TypeScript
72 lines
2.7 KiB
TypeScript
import { type Dispatch, type SetStateAction } from 'react';
|
|
|
|
import { UnifiedModal } from '../common/UnifiedModal';
|
|
import { ImageCanvasBasicGenerationComposerView } from './ImageCanvasBasicGenerationComposerView';
|
|
import type { GenerateDialogState } from './ImageCanvasEditorTypes';
|
|
import { calculateEditorImageGenerationPrice } from './ImageCanvasGenerationModel';
|
|
|
|
type ImageCanvasEditGenerationModalViewProps = {
|
|
dialog: GenerateDialogState | null;
|
|
setGenerateDialog: Dispatch<SetStateAction<GenerateDialogState | null>>;
|
|
onSubmit: (dialog: GenerateDialogState) => void;
|
|
};
|
|
|
|
export function ImageCanvasEditGenerationModalView({
|
|
dialog,
|
|
setGenerateDialog,
|
|
onSubmit,
|
|
}: ImageCanvasEditGenerationModalViewProps) {
|
|
const isOpen = dialog?.mode === 'edit' && dialog.status !== 'generating';
|
|
const dialogImageModel = dialog?.imageModel ?? 'gpt-image-2';
|
|
const dialogImageSize = dialog?.imageSize ?? '1K';
|
|
const editPrice = calculateEditorImageGenerationPrice({
|
|
kind: 'quick-edit',
|
|
model: dialogImageModel,
|
|
imageSize: dialogImageSize,
|
|
});
|
|
|
|
// TODO: Remove this override after full dark style support.
|
|
return (
|
|
<UnifiedModal
|
|
open={isOpen}
|
|
title={dialog?.mode === 'edit' ? '修改图片' : '生成图片'}
|
|
size="sm"
|
|
portalTheme="light"
|
|
closeLabel={dialog?.mode === 'edit' ? '关闭修改图片' : '关闭生成图片'}
|
|
closeDisabled={dialog?.status === 'generating'}
|
|
onClose={() => setGenerateDialog(null)}
|
|
panelClassName="image-canvas-editor__generate-dialog"
|
|
bodyClassName="image-canvas-editor__generate-dialog-body"
|
|
>
|
|
{dialog?.mode === 'edit' ? (
|
|
<ImageCanvasBasicGenerationComposerView
|
|
dialog={{
|
|
...dialog,
|
|
mode: 'edit',
|
|
imageModel: dialogImageModel,
|
|
aspectRatio: dialog.aspectRatio ?? '1:1',
|
|
imageSize: dialogImageSize,
|
|
generationReferences: [],
|
|
}}
|
|
style={{}}
|
|
setGenerateDialog={setGenerateDialog}
|
|
onRequestUpload={() => {}}
|
|
onSubmit={onSubmit}
|
|
dialogLabel="修改图片"
|
|
includeDimensions={false}
|
|
includeModel={false}
|
|
includeReferences={false}
|
|
promptPlaceholder="描述你想如何修改这张图片"
|
|
submitLabel="修改"
|
|
submitAriaLabel={`修改${editPrice}泥点`}
|
|
submittingStatusLabel="修改中"
|
|
formClassName="image-canvas-editor__generate-form"
|
|
footerClassName="image-canvas-editor__generate-body"
|
|
promptClassName="image-canvas-editor__generate-prompt"
|
|
submitButtonClassName="image-canvas-editor__generate-submit"
|
|
/>
|
|
) : null}
|
|
</UnifiedModal>
|
|
);
|
|
}
|