yujunjun/OpenMetadata
1
0
Fork 0
mirror of https://github.com/open-metadata/OpenMetadata.git synced 2025-08-24 00:48:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

UI - Add help text for valid and invalid condition (#7180)

Browse Source
This commit is contained in:
Sachin Chaurasiya 2022-09-03 09:13:20 +05:30 committed by GitHub
parent 00e6996ac0
commit 9817dfca89
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 21 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/RuleForm/RuleForm.tsx
View File

@ -52,6 +52,7 @@ const RuleForm: FC<RuleFormProps> = ({ ruleData, setRuleData }) => {
const [validationError, setValidationError] = useState<string>('');
const [isValidatingCondition, setIsvalidating] = useState<boolean>(false);
const [isValidCondition, setIsvalidCondition] = useState<boolean>(false);
/**
* Derive the resources from policy resources
@ -146,21 +147,25 @@ const RuleForm: FC<RuleFormProps> = ({ ruleData, setRuleData }) => {
}
};
const handleConditionValidation = async () => {
const handleConditionValidation = async (condition: string) => {
const defaultErrorText = 'Condition is invalid';
if (ruleData.condition) {
if (condition) {
setIsvalidating(true);
try {
const response = await validateRuleCondition(ruleData.condition);
const response = await validateRuleCondition(condition);
/**
* If request is successful then we will only get response as success without any data
* So, here we have to check the response status code
*/
[200, 204].includes(response.status)
? setValidationError('')
: setValidationError(defaultErrorText);
const check = [200, 204].includes(response.status);
if (check) {
setValidationError('');
setIsvalidCondition(true);
setTimeout(() => setIsvalidCondition(false), 2000);
} else {
setValidationError(defaultErrorText);
}
} catch (error) {
setValidationError(getErrorText(error as AxiosError, defaultErrorText));
} finally {
@ -283,23 +288,28 @@ const RuleForm: FC<RuleFormProps> = ({ ruleData, setRuleData }) => {
options={conditionOptions}
placeholder="Condition"
value={ruleData.condition}
onBlur={handleConditionValidation}
onChange={(value) => {
setRuleData((prev: Rule) => ({ ...prev, condition: value }));
!value && setValidationError('');
handleConditionValidation(value);
}}
onSearch={handleConditionSearch}
/>
{validationError && (
<div className="ant-form-item-explain-error" role="alert">
{validationError}
<div className="tw-mt-1" role="alert">
{`❌ Invalid condition : ${validationError}`}
</div>
)}
{isValidatingCondition && (
<div className="tw-text-grey-body" role="alert">
<div className="tw-mt-1" role="alert">
Validating the condition...
</div>
)}
{isValidCondition && !isValidatingCondition && !validationError && (
<div className="tw-mt-1" role="alert">
✅ Valid condition
</div>
)}
</>
</Form.Item>
</>