-
Notifications
You must be signed in to change notification settings - Fork 48
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
WizardV2: validate uniqueness of name (HMS-3801) #1944
base: main
Are you sure you want to change the base?
Conversation
02dbbdb
to
d77833e
Compare
const { data: sameNameBlueprint, isFetching } = useGetBlueprintsQuery( | ||
{ name: blueprintName }, | ||
{ skip: blueprintName.length < 2 } | ||
); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We're firing for every name change, which is bit unfortunate, but I didn't manage to make debounce work for this.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
have you tried something like:
const [debouncedBlueprintName, setDebouncedBlueprintName] = useState(blueprintName);
useEffect(() => {
const handler = setTimeout(() => {
setDebouncedBlueprintName(blueprintName);
}, 500);
return () => {
clearTimeout(handler);
};
}, [blueprintName]);
const { data: sameNameBlueprint, isFetching } = useGetBlueprintsQuery(
{ name: debouncedBlueprintName },
{ skip: debouncedBlueprintName.length < 2 }
);
this is not a classic debounced function, but it uses the state update mechanism of react to achieve it
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I haven't, I guess this would work, but it would be setting the name to the local state on top of the global one.
Tho I guess it's simpliest solution we have now.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I've fixed this in new version, but unfortunatelly it requires the caller to provide a memoized function, so it's prone to mistakes.
d77833e
to
4c2955f
Compare
Actually #1949 might make it bit easier :) |
edc05f2
to
d341a95
Compare
I've rebased this to use the new state validation :) |
asyncValidator?: ( | ||
value: string, | ||
callback: (isValid: boolean) => void | ||
) => void; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We now have second validator prop, that allows for async validation, when provided, it waits for the async validation to finish to mark validation success.
8e8b8fd
to
f1c4111
Compare
f1c4111
to
df4b539
Compare
Is this ready for review, @ezr-ondrej ? |
Definitelly ready for review, but if we prefer to wait until we figure out the validation properly, we can do that as well :) |
802953e
to
fef7846
Compare
Heya! I guess we went with the "wait until we figure out the validation properly" plan? Added a "blocked" label, feel free to replace it with "ready for review" in case I guessed wrong 😅 |
Fetches Bluepritnts with the same name as inputed and when there is already one in the database, fails the validation.
This is implemented by adding async validation to the StateValidatedInput, which is bit complex as we wanted to add debounce for that validation as well, so it doesn't fire too frequently.