Migrate Query Source page to React: Editor area #4468
Conversation
Not really 😄 I want to get the entire page working, and then I'll have better vision on the entire thing, and will start decomposing it into components/hooks/etc. |
|
@gabrieldutra I think tomorrow I'll use your execute query hook to make Execute button working as well, so probably will request review once more |
…source-to-react--editor
7571a17 to
126eeba
Compare
|
@gabrieldutra I implemented "Execute" button and added execution status block - please review it once more. Thanks! |
| } | ||
|
|
||
| return ( | ||
| <Alert |
There was a problem hiding this comment.
I think using banner styling may result in a better-looking alert, but perhaps it's worth it to change Antd Alert style globally (not in here of course).
2320544 to
d857074
Compare
There was a problem hiding this comment.
Found two issues:
1 - We should check canExecuteQuery for query execution through key press - otherwise it's possible to bypass it (it also creates issues with Parameters Apply All). Perhaps only bind it when canExecuteQuery is true?
2 - Turns out it's also necessary to update dirtyParameters when [parameters] changes, in the query view you couldn't change Parameters, so I didn't know about it before 😅. In any case, you can reproduce a bug when you have Parametes to be applied and you delete the query text containing that parameter.
e4e50db to
16057bf
Compare
| title: `${modKey} + Enter`, | ||
| disabled: isEmpty(query.query) || !canExecuteQuery || isQueryExecuting, | ||
| disabled: !canExecuteQuery, | ||
| shortcut: "mod+enter, alt+enter", |
There was a problem hiding this comment.
Very interesting shortcut definition 🚀
Only thing is that for the Query execution button I think it's better if the tooltip shows only "[Mod]+Enter" (even though it also works for Alt) - looks too much with both shortcuts appearing in the tooltip, so perhaps make the tooltip replaceable if you agree?
There was a problem hiding this comment.
I decided that it may be useful to see all shortcuts, but I agree with your point - tooltip becomes too crowded. Fixed in 57bf864
* Migrate Query Source View page to React: skeleton * Sync QueryView and QuerySource (#4430) * Migrate schema browser to react (#4432) * Restyle code with Prettier * Migrate Query page to React: Save changes (#4452) * Migrate query source to React: Set of updates (#4457) * Migrate Query page to React: Visualization Tabs (#4453) Co-Authored-By: Levko Kravets <[email protected]> * Migrate Query Source page to React: Visualizations area (#4463) * Migrate Query page to React: Delete visualization button (#4461) * Migrate Query Source page to React: Visualization actions (#4467) * Migrate Query pages to React: Execute query hook (#4470) * Migrate Query Source page to React: Editor area (#4468) * Migrate Query Source page to React: metadata, schedule and description blocks (#4476) * Migrate Query page to React: Cancel query execution (#4496) * Migrate Query Source page to React: refine code (#4499) * Migrate Query Source page to React: alerts (#4504) * Migrate Query Source page to React: unsaved changes alert (#4505) * Migrate Query Source to React: resizable areas (v2) (#4503) * Migrate Query page to React: Query View (#4455) Co-authored-by: Levko Kravets <[email protected]> * Switch React and Angular versions of pages (until Angular version removed) * Migrate Query pages to React: fix permissions (#4506) * Migrate Query Source page to React: don't reload when saving new query (#4507) * Migrate Query pages to React: fix tests (#4509) * Use skipParametersDirtyFlag in executeQuery * Fix: cannot fork query from Query View page * Optimize query editor: handle query text changes faster * Revert "Optimize query editor: handle query text changes faster" This reverts commit 2934e53. * Reduce debounced time to 100 * Migrate Query pages to React: cleanup (#4512) * Migrate Query pages to React: cleanup * Further cleanup * Remove unused dependencies * Fix embed pages * Attempt to fix flaky test * Cleanup: explicitly register the last Angular component * Move contents of /filters folder to /lib * Remove unnecessary import * Remove cy.wait from Parameters spec Co-authored-by: Gabriel Dutra <[email protected]> Co-authored-by: Levko Kravets <[email protected]>
What type of PR is this? (check all applicable)
Related Tickets & Documents
#4429