diff --git a/frontend/pages/queries/QueryPage/components/QueryForm/QueryForm.tsx b/frontend/pages/queries/QueryPage/components/QueryForm/QueryForm.tsx index 6e5f0799ba..a503e00d47 100644 --- a/frontend/pages/queries/QueryPage/components/QueryForm/QueryForm.tsx +++ b/frontend/pages/queries/QueryPage/components/QueryForm/QueryForm.tsx @@ -102,7 +102,7 @@ const QueryForm = ({ } = useContext(AppContext); const { renderFlash } = useContext(NotificationContext); - const isEditMode = !!queryIdForEdit; + const savedQueryMode = !!queryIdForEdit; const [errors, setErrors] = useState<{ [key: string]: any }>({}); // string | null | undefined or boolean | undefined const [isSaveModalOpen, setIsSaveModalOpen] = useState(false); const [showQueryEditor, setShowQueryEditor] = useState( @@ -135,7 +135,7 @@ const QueryForm = ({ debounceSQL(lastEditedQueryBody); }, [lastEditedQueryBody, lastEditedQueryId]); - const hasTeamMaintainerPermissions = isEditMode + const hasTeamMaintainerPermissions = savedQueryMode ? isAnyTeamMaintainerOrTeamAdmin && storedQuery && currentUser && @@ -180,7 +180,7 @@ const QueryForm = ({ ) => { evt.preventDefault(); - if (isEditMode && !lastEditedQueryName) { + if (savedQueryMode && !lastEditedQueryName) { return setErrors({ ...errors, name: "Query name must be present", @@ -248,7 +248,7 @@ const QueryForm = ({ const promptSaveQuery = () => (evt: React.MouseEvent) => { evt.preventDefault(); - if (isEditMode && !lastEditedQueryName) { + if (savedQueryMode && !lastEditedQueryName) { return setErrors({ ...errors, name: "Query name must be present", @@ -261,7 +261,7 @@ const QueryForm = ({ valid = isValidated; if (valid) { - if (!isEditMode) { + if (!savedQueryMode) { setIsSaveModalOpen(true); } else { onUpdate({ @@ -327,7 +327,7 @@ const QueryForm = ({ }); const renderName = () => { - if (isEditMode) { + if (savedQueryMode) { return ( <>
@@ -363,7 +363,7 @@ const QueryForm = ({ }; const renderDescription = () => { - if (isEditMode) { + if (savedQueryMode) { return ( <>
@@ -424,7 +424,9 @@ const QueryForm = ({ name="query editor" label="Query" wrapperClassName={`${baseClass}__text-editor-wrapper`} - readOnly={!isObserverPlus || !isAnyTeamObserverPlus} + readOnly={ + (!isObserverPlus && !isAnyTeamObserverPlus) || savedQueryMode + } labelActionComponent={isObserverPlus && renderLabelComponent()} wrapEnabled /> @@ -459,7 +461,7 @@ const QueryForm = ({ {renderName()} {renderDescription()}
-
{isEditMode && renderAuthor()}
+
{savedQueryMode && renderAuthor()}
{renderPlatformCompatibility()} - {isEditMode && ( + {savedQueryMode && ( <> {(hasSavePermissions || isAnyTeamMaintainerOrTeamAdmin) && ( <> - {isEditMode && ( + {savedQueryMode && (