Fix: Prevent the loader from rendering more than once on page load

[rumzledz]

Description

Note

I appreciate that this may be more of a band-aid solution 🩹

Justification is that, this hook sits on a top-level component and it only ever makes a network request again when the colonyName changes i.e. when you switch Colonies.

colonyName is plucked directly from the URL via useParams() so it should remain constant whilst you're browsing the same Colony.

The issue is that nextFetchPolicy is causing the useGetFullColonyByNameQuery() hook to make the request twice as soon at it gets invoked:

} = useGetFullColonyByNameQuery({
  variables: {
    name: colonyName,
  },
  fetchPolicy: 'network-only',
  nextFetchPolicy: 'cache-only' // <<-- This one
});

Which then causes this component to render twice:

if (
  walletConnecting ||
  isColonyLoading ||
  userLoading ||
  isContributorLoading
) {
  return <LoadingTemplate loadingText={MSG.loadingText} />;
}

Testing

1. Directly visit a colony: http://localhost:9091/planex/
2. Verify that the following loader only shows up once:

Resolves #3662

[bassgeta]

Legit solution, and I agree with your reasoning 👍

loader-fix-2024-11-07_14.29.26.mp4