102 lines
3.2 KiB
TypeScript
102 lines
3.2 KiB
TypeScript
import { type FormEvent } from "react";
|
|
import Icon from "../common/Icon";
|
|
import type { ScriptItem, Visibility } from "../../services/api";
|
|
import { scriptIcon } from "../../features/platform/WorkspaceTree";
|
|
|
|
type PublishModalProps = {
|
|
publishTarget: ScriptItem | null;
|
|
releaseNote: string;
|
|
publishVisibility: Visibility;
|
|
publishing: boolean;
|
|
onReleaseNoteChange: (note: string) => void;
|
|
onPublishVisibilityChange: (visibility: Visibility) => void;
|
|
onSubmit: (event: FormEvent) => void;
|
|
onClose: () => void;
|
|
};
|
|
|
|
export function PublishModal({
|
|
publishTarget,
|
|
releaseNote,
|
|
publishVisibility,
|
|
publishing,
|
|
onReleaseNoteChange,
|
|
onPublishVisibilityChange,
|
|
onSubmit,
|
|
onClose,
|
|
}: PublishModalProps) {
|
|
if (!publishTarget) return null;
|
|
|
|
return (
|
|
<div className="modal-backdrop" role="presentation">
|
|
<section className="modal publish-modal" role="dialog" aria-modal="true">
|
|
<div className="modal__header">
|
|
<div>
|
|
<span className="modal__eyebrow">不可变制品</span>
|
|
<h2>发布稳定版本</h2>
|
|
</div>
|
|
<button
|
|
className="icon-button"
|
|
type="button"
|
|
aria-label="关闭"
|
|
onClick={onClose}
|
|
>
|
|
<Icon name="close" />
|
|
</button>
|
|
</div>
|
|
<form onSubmit={onSubmit}>
|
|
<div className="publish-source">
|
|
<span className={`file-icon file-icon--${publishTarget.script_type}`}>
|
|
<Icon name={scriptIcon(publishTarget)} size={18} />
|
|
</span>
|
|
<span>
|
|
<strong>{publishTarget.script_name}</strong>
|
|
<small>当前 Workspace 工作副本</small>
|
|
</span>
|
|
</div>
|
|
<label className="form-field">
|
|
<span>发布说明</span>
|
|
<textarea
|
|
maxLength={1000}
|
|
placeholder="例如：完成数据清洗和特征工程"
|
|
value={releaseNote}
|
|
onChange={(event) => onReleaseNoteChange(event.target.value)}
|
|
/>
|
|
<small>稳定版本内容不可修改，可作为后续调度节点输入。</small>
|
|
</label>
|
|
<label className="form-field">
|
|
<span>可见范围</span>
|
|
<select
|
|
value={publishVisibility}
|
|
onChange={(event) =>
|
|
onPublishVisibilityChange(event.target.value as Visibility)}
|
|
>
|
|
<option value="private">仅自己可见</option>
|
|
<option value="workspace">Workspace 成员可见</option>
|
|
<option value="public">公开</option>
|
|
</select>
|
|
</label>
|
|
<div className="modal__footer">
|
|
<button
|
|
className="secondary-button"
|
|
type="button"
|
|
onClick={onClose}
|
|
>
|
|
取消
|
|
</button>
|
|
<button
|
|
className="primary-button"
|
|
type="submit"
|
|
disabled={publishing}
|
|
>
|
|
{publishing
|
|
? <span className="button-spinner" />
|
|
: <Icon name="release" size={16} />}
|
|
{publishing ? "正在发布…" : "确认发布"}
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</section>
|
|
</div>
|
|
);
|
|
}
|