Reduce the use of `@ts-expect-error`

[urban pagoda]

In my blog page, I used more @ts-expect-error than I would have liked to due to various reasons, I wonder if I can define the type better and reduce the use of @ts-expect-error, as that's a bit too hacky.

Here's the full code: https://github.com/mwskwong/resume/blob/feature/blog/app/blog/[slug]/page.tsx

A short summary:

1. The data-* props are not defined in the prop type.
2. The ref prop is in type LegacyRef while my components (MUI in this case) expects to be RefObject.

<MDXRemote
  components={{
    code: (props) => {
      // @ts-expect-error (1) data attribute auto injected by rehype-pretty-code
      const inlineCode = !props["data-language"];
      
      if (inlineCode) {
        const { color, ...rest } = props;
        return (
          // @ts-expect-error (2) LegacyRef passed to RefObject
          <Typography {/* props omitted... */} {...rest} />
        );
      }

      // @ts-expect-error (2) LegacyRef passed to RefObject
      return <Box {/* props omitted... */} {...props} />;
    },
  }}
/>

[dreamy basalt]

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

[urban pagoda]

Bump