Query and Policy Flow: SQL error in realtime (#3158)

This commit is contained in:
RachelElysia 2021-12-01 12:18:58 -05:00 committed by GitHub
parent 2302606ca0
commit cb4707cef0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 34 additions and 31 deletions

View file

@ -0,0 +1 @@
* Query and Policy SQL errors showing on Save now show in realtime

View file

@ -107,6 +107,15 @@ const PolicyForm = ({
useEffect(() => {
debounceCompatiblePlatforms(lastEditedQueryBody);
let valid = true;
const { valid: isValidated, errors: newErrors } = validateQuerySQL(
lastEditedQueryBody
);
valid = isValidated;
setErrors({
...newErrors,
});
}, [lastEditedQueryBody]);
const hasTeamMaintainerPermissions = isEditMode
@ -136,7 +145,11 @@ const PolicyForm = ({
});
};
const handleSavePolicy = (forceNew = false) => (
const onChangePolicy = (sqlString: string) => {
setLastEditedQueryBody(sqlString);
};
const promptSavePolicy = (forceNew = false) => (
evt: React.MouseEvent<HTMLButtonElement>
) => {
evt.preventDefault();
@ -149,15 +162,9 @@ const PolicyForm = ({
}
let valid = true;
const { valid: isValidated, errors: newErrors } = validateQuerySQL(
lastEditedQueryBody
);
const { valid: isValidated } = validateQuerySQL(lastEditedQueryBody);
valid = isValidated;
setErrors({
...errors,
...newErrors,
});
if (valid) {
if (!isEditMode || forceNew) {
@ -168,15 +175,11 @@ const PolicyForm = ({
description: lastEditedQueryDescription,
query: lastEditedQueryBody,
});
setErrors({});
}
setIsEditingName(false);
setIsEditingDescription(false);
}
return null;
};
const renderAuthor = (): JSX.Element | null => {
@ -224,8 +227,6 @@ const PolicyForm = ({
} else if (compatiblePlatforms[0] === "None") {
return "No platforms (check your query for invalid tables or tables that are supported on different platforms)";
}
return null;
};
const displayFormattedPlatforms = compatiblePlatforms.map((string) => {
@ -424,10 +425,8 @@ const PolicyForm = ({
name="query editor"
onLoad={onLoad}
wrapperClassName={`${baseClass}__text-editor-wrapper`}
onChange={(sqlString: string) => {
setLastEditedQueryBody(sqlString);
}}
handleSubmit={handleSavePolicy}
onChange={onChangePolicy}
handleSubmit={promptSavePolicy}
/>
{renderPlatformCompatibility()}
{renderLiveQueryWarning()}
@ -449,7 +448,7 @@ const PolicyForm = ({
<Button
className={`${baseClass}__save`}
variant="brand"
onClick={handleSavePolicy()}
onClick={promptSavePolicy()}
disabled={
isAnyTeamMaintainerOrTeamAdmin &&
!hasTeamMaintainerPermissions

View file

@ -108,6 +108,15 @@ const QueryForm = ({
useEffect(() => {
debounceCompatiblePlatforms(lastEditedQueryBody);
let valid = true;
const { valid: isValidated, errors: newErrors } = validateQuerySQL(
lastEditedQueryBody
);
valid = isValidated;
setErrors({
...newErrors,
});
}, [lastEditedQueryBody]);
const hasTeamMaintainerPermissions = isEditMode
@ -137,6 +146,10 @@ const QueryForm = ({
});
};
const onChangeQuery = (sqlString: string) => {
setLastEditedQueryBody(sqlString);
};
const promptSaveQuery = (forceNew = false) => (
evt: React.MouseEvent<HTMLButtonElement>
) => {
@ -150,15 +163,9 @@ const QueryForm = ({
}
let valid = true;
const { valid: isValidated, errors: newErrors } = validateQuerySQL(
lastEditedQueryBody
);
const { valid: isValidated } = validateQuerySQL(lastEditedQueryBody);
valid = isValidated;
setErrors({
...errors,
...newErrors,
});
if (valid) {
if (!isEditMode || forceNew) {
@ -170,8 +177,6 @@ const QueryForm = ({
query: lastEditedQueryBody,
observer_can_run: lastEditedQueryObserverCanRun,
});
setErrors({});
}
}
};
@ -432,9 +437,7 @@ const QueryForm = ({
name="query editor"
onLoad={onLoad}
wrapperClassName={`${baseClass}__text-editor-wrapper`}
onChange={(sqlString: string) => {
setLastEditedQueryBody(sqlString);
}}
onChange={onChangeQuery}
handleSubmit={promptSaveQuery}
/>
{renderPlatformCompatibility()}