Skip to content

Conversation

@louh
Copy link
Member

@louh louh commented Nov 29, 2024

Lots of updates. I tried to keep them pretty contained into individual commits except for the second-to-last one where I was just dumping all of the edits into a large cleanup commit.

Basic rundown of stuff:

  • Update all dependencies to latest (it still works, so yay)
  • Set minimum Node.js to latest (v22) -- v16 reached end-of-life a couple of years ago.
  • Resolved all Gatsby deprecation warnings (except for Gatsby Head, which is a whole effort on its own)
  • Replaced deprecated Gatsby plugins -- there has been a change to its image processor which no longer allows for traced SVG placeholders, but these are not critical
  • Migrated eslint configuration
  • Resolved a large handful of annoying eslint warnings (e.g. they wanted functions written in a particular format) and turned some off. I didn't actually run eslint across the entire codebase though, that's an exercise for some future thing
  • Removed defaultProps in favor of default variables because React was warning this would be deprecated in future (and honestly I feel prop-types should be replaced by TypeScript, eventually)
  • Refactored the way props were spread through components to prevent props from accidentally turning into HTML attributes (if you looked in the rendered source you'd see things like <span conditions="[object Object"]>, which ugh)
  • Similarly -- props that controlled styled components would become HTML attributes, this can be resolved by naming props with a $, e.g. isActive={true} --> $isActive={true}
  • Other small bug fixes, like arrays of React components not having the correct keys

louh added 12 commits November 28, 2024 15:45
Specifically, this:

```
  5:1  warning  Anonymous arrow functions cause Fast Refresh to not preserve local component state.

       Please add a name to your function, for example:

       Before:
       export default () => {}

       After:
       const Named = () => {}
       export default Named;
  no-anonymous-exports-page-templates

✖ 1 problem (0 errors, 1 warning)
```
react/jsx-props-no-spreading: We spread props, a lot. It very often improperly
adds attributes to DOM elements when it shouldn't, so I get why this rule exists.
For now the strategy is to refactor spreading to NOT pass those attributes to
DOM (see console messages for warnings), but not completely remove prop spreading.

react/require-default-props: Default props are being removed from function
components in the future, which throws warnings. So if we don't use default props
anymore, then stop warning us when we don't have them.
@louh louh requested a review from slifty November 29, 2024 16:21
Copy link
Member

@slifty slifty left a comment

Choose a reason for hiding this comment

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

:garf::chefkiss:

chefgarf

@louh louh merged commit 8452b14 into main Nov 29, 2024
1 check passed
@louh louh deleted the louh/updates branch November 29, 2024 22:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants