Prompt Name
@@ -62,6 +67,8 @@ function AddPrompt({
@@ -79,6 +86,7 @@ function EditPrompt({
editPromptContent,
setEditPromptContent,
currentPromptEdit,
+ disableSave,
}: {
setModalState: (state: ActiveState) => void;
handleEditPrompt?: (id: string, type: string) => void;
@@ -87,6 +95,7 @@ function EditPrompt({
editPromptContent: string;
setEditPromptContent: (content: string) => void;
currentPromptEdit: { name: string; id: string; type: string };
+ disableSave: boolean;
}) {
return (
@@ -140,7 +149,8 @@ function EditPrompt({
handleEditPrompt &&
handleEditPrompt(currentPromptEdit.id, currentPromptEdit.type);
}}
- disabled={currentPromptEdit.type === 'public'}
+ disabled={currentPromptEdit.type === 'public' || disableSave}
+ title={disableSave && editPromptName ? 'Name already exists' : ''}
>
Save
@@ -151,6 +161,7 @@ function EditPrompt({
}
export default function PromptsModal({
+ existingPrompts,
modalState,
setModalState,
type,
@@ -166,6 +177,7 @@ export default function PromptsModal({
handleAddPrompt,
handleEditPrompt,
}: {
+ existingPrompts: { name: string; id: string; type: string }[];
modalState: ActiveState;
setModalState: (state: ActiveState) => void;
type: 'ADD' | 'EDIT';
@@ -181,6 +193,25 @@ export default function PromptsModal({
handleAddPrompt?: () => void;
handleEditPrompt?: (id: string, type: string) => void;
}) {
+ const [disableSave, setDisableSave] = React.useState(true);
+ const handlePrompNameChange = (edit: boolean, newName: string) => {
+ const nameExists = existingPrompts.find(
+ (prompt) => newName === prompt.name,
+ );
+
+ if (newName && !nameExists) {
+ setDisableSave(false);
+ } else {
+ setDisableSave(true);
+ }
+
+ if (edit) {
+ setEditPromptName(newName);
+ } else {
+ setNewPromptName(newName);
+ }
+ };
+
let view;
if (type === 'ADD') {
@@ -189,9 +220,10 @@ export default function PromptsModal({
setModalState={setModalState}
handleAddPrompt={handleAddPrompt}
newPromptName={newPromptName}
- setNewPromptName={setNewPromptName}
+ setNewPromptName={handlePrompNameChange.bind(null, false)}
newPromptContent={newPromptContent}
setNewPromptContent={setNewPromptContent}
+ disableSave={disableSave}
/>
);
} else if (type === 'EDIT') {
@@ -200,10 +232,11 @@ export default function PromptsModal({
setModalState={setModalState}
handleEditPrompt={handleEditPrompt}
editPromptName={editPromptName}
- setEditPromptName={setEditPromptName}
+ setEditPromptName={handlePrompNameChange.bind(null, true)}
editPromptContent={editPromptContent}
setEditPromptContent={setEditPromptContent}
currentPromptEdit={currentPromptEdit}
+ disableSave={disableSave}
/>
);
} else {
diff --git a/frontend/src/settings/Prompts.tsx b/frontend/src/settings/Prompts.tsx
index 9501b47d..6e1810e5 100644
--- a/frontend/src/settings/Prompts.tsx
+++ b/frontend/src/settings/Prompts.tsx
@@ -179,6 +179,7 @@ export default function Prompts({