Skip to content
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

Fix es_ui_shared eslint violations for useRequest hook #59626

Closed

Conversation

cjcenizal
Copy link
Contributor

@cjcenizal cjcenizal commented Mar 9, 2020

Partially addresses #49554
Closes #49572 (originally fixed as part of the NP migration)
Closes #49562 (originally fixed as part of the NP migration)

This PR:

  • Removes the unused original request.ts helper and replaces it with the NP-ready version
  • Adds clean-up logic for when the component using this helper is unmounted (This was reverted)

To test:

  • Verify that requests behave as expected in Index Management, Watcher, Snapshot Restore, Ingest Manager, and Transforms

@cjcenizal cjcenizal added chore v8.0.0 Team:Kibana Management Dev Tools, Index Management, Upgrade Assistant, ILM, Ingest Node Pipelines, and more release_note:skip Skip the PR/issue when compiling release notes v7.7.0 labels Mar 9, 2020
@elasticmachine
Copy link
Contributor

Pinging @elastic/es-ui (Team:Elasticsearch UI)

@cjcenizal cjcenizal force-pushed the chore/remove-es-ui-eslint-overrides branch 6 times, most recently from 2fd8696 to 29ba8b5 Compare March 10, 2020 23:28
@cjcenizal cjcenizal requested a review from a team as a code owner March 10, 2020 23:28
@cjcenizal cjcenizal changed the title Fix es_ui_shared eslint violations Fix es_ui_shared eslint violations for useRequest hook Mar 10, 2020
@cjcenizal cjcenizal force-pushed the chore/remove-es-ui-eslint-overrides branch from 5af8709 to 9914f70 Compare March 11, 2020 01:56
@walterra walterra self-requested a review March 11, 2020 08:08
Copy link
Contributor

@walterra walterra left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code LGTM, also tested a checkout, thanks for the update!

@cjcenizal cjcenizal force-pushed the chore/remove-es-ui-eslint-overrides branch from 9914f70 to 1a58bc1 Compare March 11, 2020 16:26
body,
pollIntervalMs,
initialData,
deserializer = (data: any): any => data,
}: UseRequestConfig
): UseRequestResponse => {
): UseRequestResponse<D, E> => {
const isMounted = useRef(true);
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I added this to handle the case when the owner component unmounts before a request has resolved.

@cjcenizal cjcenizal requested a review from a team as a code owner April 10, 2020 00:40
@elastic elastic deleted a comment from kibanamachine Apr 10, 2020
@cjcenizal
Copy link
Contributor Author

cjcenizal commented Apr 10, 2020

@sebelga Could you please test Index Management, Watcher, and Snapshot Restore and see if you spot any bugs regarding requests?

@cjcenizal
Copy link
Contributor Author

@elastic/ingest-management Could someone from your team please test the Ingest Manager and make sure I haven't introduced any buggy behavior on your end?

@cjcenizal cjcenizal requested a review from sebelga April 10, 2020 00:42
Copy link
Contributor

@jen-huang jen-huang left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ran a smoke test of Ingest Manager locally and things are working as expected 👍

Copy link
Contributor

@sebelga sebelga left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Tested locally watcher, IM, and S & R and did not spot any regression.

if (pollInterval.current) {
pollIntervalId.current = setTimeout(_sendRequest, pollInterval.current);
if (pollIntervalMsRef.current && isMounted.current) {
pollIntervalIdRef.current = setTimeout(
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: isn't it the same as

pollIntervalIdRef.current = setTimeout(
  sendRequestRef.current!,
  pollIntervalMsRef.current
);

): UseRequestResponse<D, E> => {
const isMounted = useRef(true);
const sendRequestRef = useRef<() => Promise<SendRequestResponse<D, E>>>();
const scheduleRequestRef = useRef<() => void>();
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you explain why you created a ref here? I would have used useCallback for this purpose. Was it necessary to add the ref?

I see that sendRequestRef is also a ref. I think useCallback is better for this purpose. Maybe I'm missing something?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think switching to useCallback is an interesting idea and could yield optimization benefits by returning a memoized reference to sendRequest. It would look something like this, though I'm not sure about the implications of mutating a ref you're dependent upon (any risk of infinite loop?):

  const scheduleRequest = useCallback(
    () => {
      // Clear current interval
      if (pollIntervalIdRef.current) {
        clearTimeout(pollIntervalIdRef.current);
      }

      // Set new interval
      if (pollIntervalMsRef.current && isMounted.current) {
        pollIntervalIdRef.current = setTimeout(
          () => sendRequestRef.current!(),
          pollIntervalMsRef.current
        );
      }
    },
    [pollIntervalIdRef.current, pollIntervalMsRef.current, isMounted.current, pollIntervalIdRef.current, sendRequestRef.current],
  );

However, the original NP-ready code uses refs and I find them easier to reason about than the useCallback example above, so I think I'll leave optimization to another day.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, it would imply a bigger refactor (e.g. why do we have a ref for pollInterval?), but I agree we can leave that to another day. 👍

- Add clearer cleanup logic for unmounted components.
- Align logic and comments in np_ready_request.ts and original request.ts.
@cjcenizal cjcenizal force-pushed the chore/remove-es-ui-eslint-overrides branch from 2a52625 to b0c309a Compare April 24, 2020 21:56
…o false during cleanups unrelated to unmounting.
@cjcenizal cjcenizal force-pushed the chore/remove-es-ui-eslint-overrides branch from b0c309a to 616d4a6 Compare April 24, 2020 22:01
@cjcenizal
Copy link
Contributor Author

I just noticed a subtle change in the way sendRequest returns errors. It changed from this:

return {
  data: null,
  error: e.response ? e.response : e,
};

To this:

return {
  data: null,
  error: e.response && e.response.data ? e.response.data : e.body,
};

To find and fix any bugs means we'll need to look through the plugins which depend upon the old behavior (Snapshot Restore and Ingest Manager).

@jen-huang Can you or someone from the Ingest team please audit Ingest Manager and make sure errors returned by sendRequest are being consumed correctly?

@kibanamachine
Copy link
Contributor

💚 Build Succeeded

History

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

@cjcenizal
Copy link
Contributor Author

This branch is too stale to continue on. Closing in favor of #72947

@cjcenizal cjcenizal closed this Jul 22, 2020
@cjcenizal cjcenizal deleted the chore/remove-es-ui-eslint-overrides branch April 19, 2021 19:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
blocked chore release_note:skip Skip the PR/issue when compiling release notes Team:Kibana Management Dev Tools, Index Management, Upgrade Assistant, ILM, Ingest Node Pipelines, and more v8.0.0
Projects
None yet
6 participants