ThePalaceProject / web-patron / 31043020290

30%

push

github

Only render user account header items in the client (#173)

## Description

<!--- Describe your changes -->
Wraps user account header components in `ClientOnly` component, ensuring
they are only rendered in the client.

No changes in functionality are included.

## Motivation and Context

<!--- Why is this change required? What problem does it solve? -->
<!--- If it fixes an open issue, please link to the issue here. -->
<img width="400" height="300" alt="image"
src="https://github.com/user-attachments/assets/9eceaa79-7921-4201-8d2c-3de31fb9355b"
/>

The hooks that check for user credentials reference local storage. The
Web Storage API is not available on the server, so the server always
sends the "Sign In" link as an `<a>` element. This causes a hydration
error when a user is already "signed in," i.e. have credentials present
in local storage, because React expects to find a `<button>` element.

## How Has This Been Tested?

<!--- Please describe in detail how you tested your changes. -->
<!--- Include details of your testing environment, and the tests you ran
to -->
<!--- see how your change affects other areas of the code, etc. -->
- Manually tested in Firefox, Chrome, and Safari
- All existing tests pass

## Checklist:

<!--- Go over all the following points, and put an `x` in all the boxes
that apply. -->
<!--- If you're unsure about any of these, don't hesitate to ask. We're
here to help! -->

- [ ] I have updated the documentation accordingly.
- [x] All new and existing tests passed.

296 of 393 branches covered (75.32%)

Branch coverage included in aggregate %.

503 of 584 relevant lines covered (86.13%)

29.74 hits per line