Skip to content

[Panic]: Lint or type issues found caused panic #8906

Description

@sekeidesign

Panic message

error: Lint or type issues found
Rolldown panicked. This is a bug in Rolldown, not your code.

thread '<unnamed>' (8114667) panicked at library/std/src/io/stdio.rs:1165:9:
failed printing to stdout: Resource temporarily unavailable (os error 35)
note: run with `RUST_BACKTRACE=1` environment variable to display a backtrace

Please report this issue at: https://github.com/rolldown/rolldown/issues/new?template=panic_report.yml
× eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/SignUpForm.tsx:9:6]
  8 │   return (
  9 │     <form className="relative isolate mt-8 flex items-center pr-1">
    ·      ────
 10 │       <label htmlFor={id} className="sr-only">
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/SignUpForm.tsx:10:8]
  9 │     <form className="relative isolate mt-8 flex items-center pr-1">
 10 │       <label htmlFor={id} className="sr-only">
    ·        ─────
 11 │         Email address
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/SignUpForm.tsx:13:8]
 12 │       </label>
 13 │       <input
    ·        ─────
 14 │         required
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/SignUpForm.tsx:22:8]
 21 │       />
 22 │       <Button type="submit" arrow>
    ·        ──────
 23 │         Get updates
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/SignUpForm.tsx:25:8]
 24 │       </Button>
 25 │       <div className="absolute inset-0 -z-10 rounded-lg transition peer-focus:ring-4 peer-focus:ring-sky-300/15" />
    ·        ───
 26 │       <div className="absolute inset-0 -z-10 rounded-lg bg-white/2.5 ring-1 ring-white/15 transition peer-focus:ring-sky-300" />
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/SignUpForm.tsx:26:8]
 25 │       <div className="absolute inset-0 -z-10 rounded-lg transition peer-focus:ring-4 peer-focus:ring-sky-300/15" />
 26 │       <div className="absolute inset-0 -z-10 rounded-lg bg-white/2.5 ring-1 ring-white/15 transition peer-focus:ring-sky-300" />
    ·        ───
 27 │     </form>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/page.tsx:33:5]
 32 │   return (
 33 │     <>
    ·     ──
 34 │       <main className="min-h-screen md:pt-24 py-10 md:pb-20">
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/page.tsx:34:8]
 33 │     <>
 34 │       <main className="min-h-screen md:pt-24 py-10 md:pb-20">
    ·        ────
 35 │         <Container className="flex flex-col gap-10">
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/page.tsx:35:10]
 34 │       <main className="min-h-screen md:pt-24 py-10 md:pb-20">
 35 │         <Container className="flex flex-col gap-10">
    ·          ─────────
 36 │           <FeatureTextBlock>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/page.tsx:36:12]
 35 │         <Container className="flex flex-col gap-10">
 36 │           <FeatureTextBlock>
    ·            ────────────────
 37 │             <FeatureSectionTitle>{t("title")}</FeatureSectionTitle>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/page.tsx:37:14]
 36 │           <FeatureTextBlock>
 37 │             <FeatureSectionTitle>{t("title")}</FeatureSectionTitle>
    ·              ───────────────────
 38 │             <FeatureSectionDescription>{t("description")}</FeatureSectionDescription>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/page.tsx:38:14]
 37 │             <FeatureSectionTitle>{t("title")}</FeatureSectionTitle>
 38 │             <FeatureSectionDescription>{t("description")}</FeatureSectionDescription>
    ·              ─────────────────────────
 39 │           </FeatureTextBlock>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/page.tsx:40:12]
 39 │           </FeatureTextBlock>
 40 │           <BlogCardList posts={posts} />
    ·            ────────────
 41 │         </Container>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/FormattedDate.tsx:15:6]
 14 │   return (
 15 │     <time dateTime={date.toISOString()} {...props}>
    ·      ────
 16 │       {dateFormatter.format(date)}
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/api/og/inefficiency-calculator/route.tsx:37:6]
 36 │   return new ImageResponse(
 37 │     <div
    ·      ───
 38 │       style={{
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/api/og/inefficiency-calculator/route.tsx:52:8]
 51 │       {/* Header */}
 52 │       <div
    ·        ───
 53 │         style={{
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/api/og/inefficiency-calculator/route.tsx:60:10]
 59 │       >
 60 │         <span
    ·          ────
 61 │           style={{
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/api/og/inefficiency-calculator/route.tsx:69:10]
 68 │         </span>
 69 │         <span
    ·          ────
 70 │           style={{
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/api/og/inefficiency-calculator/route.tsx:77:10]
 76 │         />
 77 │         <span style={{ color: "#78716c", fontSize: "16px" }}>ERP inefficiency calculator</span>
    ·          ────
 78 │       </div>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/api/og/inefficiency-calculator/route.tsx:81:8]
 80 │       {/* Main content */}
 81 │       <div
    ·        ───
 82 │         style={{
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/api/og/inefficiency-calculator/route.tsx:91:10]
 90 │         {/* Left: savings number */}
 91 │         <div
    ·          ───
 92 │           style={{
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
     ╭─[src/app/api/og/inefficiency-calculator/route.tsx:99:12]
  98 │         >
  99 │           <div
     ·            ───
 100 │             style={{
     ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
     ╭─[src/app/api/og/inefficiency-calculator/route.tsx:108:12]
 107 │           </div>
 108 │           <div
     ·            ───
 109 │             style={{
     ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
     ╭─[src/app/api/og/inefficiency-calculator/route.tsx:118:12]
 117 │           </div>
 118 │           <div
     ·            ───
 119 │             style={{
     ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
     ╭─[src/app/api/og/inefficiency-calculator/route.tsx:130:10]
 129 │         {/* Right: breakdown */}
 130 │         <div
     ·          ───
 131 │           style={{
     ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
     ╭─[src/app/api/og/inefficiency-calculator/route.tsx:140:14]
 139 │           {results.areas.map((area, i) => (
 140 │             <div
     ·              ───
 141 │               key={area.id}
     ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
     ╭─[src/app/api/og/inefficiency-calculator/route.tsx:155:16]
 154 │             >
 155 │               <span style={{ color: "#a8a29e", fontSize: "15px" }}>
     ·                ────
 156 │                 {AREA_LABELS[area.id] ?? area.id}
     ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
     ╭─[src/app/api/og/inefficiency-calculator/route.tsx:158:16]
 157 │               </span>
 158 │               <span
     ·                ────
 159 │                 style={{
     ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
     ╭─[src/app/api/og/inefficiency-calculator/route.tsx:173:8]
 172 │       {/* Footer */}
 173 │       <div
     ·        ───
 174 │         style={{
     ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
     ╭─[src/app/api/og/inefficiency-calculator/route.tsx:180:10]
 179 │       >
 180 │         <span style={{ color: "#44403c", fontSize: "14px" }}>tato.co</span>
     ·          ────
 181 │       </div>
     ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:11:6]
 10 │   return (
 11 │     <div className="pointer-events-none absolute inset-0 z-50 overflow-hidden lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-lg lg:overflow-visible">
    ·      ───
 12 │       <svg
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:12:8]
 11 │     <div className="pointer-events-none absolute inset-0 z-50 overflow-hidden lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-lg lg:overflow-visible">
 12 │       <svg
    ·        ───
 13 │         className="absolute top-0 left-[max(0px,calc(50%-18.125rem))] h-full w-1.5 lg:left-full lg:ml-1 xl:right-1 xl:left-auto xl:ml-0"
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:16:10]
 15 │       >
 16 │         <defs>
    ·          ────
 17 │           <pattern id={id} width="6" height="8" patternUnits="userSpaceOnUse">
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:17:12]
 16 │         <defs>
 17 │           <pattern id={id} width="6" height="8" patternUnits="userSpaceOnUse">
    ·            ───────
 18 │             <path d="M0 0H6M0 8H6" className="stroke-stone-900/20" fill="none" />
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:18:14]
 17 │           <pattern id={id} width="6" height="8" patternUnits="userSpaceOnUse">
 18 │             <path d="M0 0H6M0 8H6" className="stroke-stone-900/20" fill="none" />
    ·              ────
 19 │           </pattern>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:21:10]
 20 │         </defs>
 21 │         <rect width="100%" height="100%" fill={`url(#${id})`} />
    ·          ────
 22 │       </svg>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:29:6]
 28 │   return (
 29 │     <div className="absolute inset-0 -z-10 overflow-hidden bg-surface-low lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-lg mask-l-to-100% mask-l-from-5%">
    ·      ───
 30 │       <Grainient
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:30:8]
 29 │     <div className="absolute inset-0 -z-10 overflow-hidden bg-surface-low lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-lg mask-l-to-100% mask-l-from-5%">
 30 │       <Grainient
    ·        ─────────
 31 │         className="absolute inset-0 opacity-80"
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:38:8]
 37 │       />
 38 │       <div className="absolute inset-x-0 right-0 bottom-0 h-px bg-stone-900/5 lg:top-0 lg:left-auto lg:h-auto lg:w-px" />
    ·        ───
 39 │     </div>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:45:6]
 44 │   return (
 45 │     <div className="relative flex-none overflow-hidden px-6 lg:pointer-events-none lg:fixed lg:inset-0 lg:z-40 lg:flex lg:px-0">
    ·      ───
 46 │       <Glow />
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:46:8]
 45 │     <div className="relative flex-none overflow-hidden px-6 lg:pointer-events-none lg:fixed lg:inset-0 lg:z-40 lg:flex lg:px-0">
 46 │       <Glow />
    ·        ────
 47 │       <div className="relative flex w-full lg:pointer-events-auto lg:pr-40 lg:mr-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-lg lg:overflow-x-hidden lg:overflow-y-auto lg:pl-[max(4rem,calc(35%-38rem))]">
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:47:8]
 46 │       <Glow />
 47 │       <div className="relative flex w-full lg:pointer-events-auto lg:pr-40 lg:mr-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-lg lg:overflow-x-hidden lg:overflow-y-auto lg:pl-[max(4rem,calc(35%-38rem))]">
    ·        ───
 48 │         <div className="mx-auto max-w-lg lg:mx-0 lg:flex lg:max-w-2xl lg:flex-col pt-10 lg:pt-20">
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:48:10]
 47 │       <div className="relative flex w-full lg:pointer-events-auto lg:pr-40 lg:mr-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-lg lg:overflow-x-hidden lg:overflow-y-auto lg:pl-[max(4rem,calc(35%-38rem))]">
 48 │         <div className="mx-auto max-w-lg lg:mx-0 lg:flex lg:max-w-2xl lg:flex-col pt-10 lg:pt-20">
    ·          ───
 49 │           <div className="pt-10 pb-8 sm:pt-20 sm:pb-16 lg:py-10">
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:49:12]
 48 │         <div className="mx-auto max-w-lg lg:mx-0 lg:flex lg:max-w-2xl lg:flex-col pt-10 lg:pt-20">
 49 │           <div className="pt-10 pb-8 sm:pt-20 sm:pb-16 lg:py-10">
    ·            ───
 50 │             <div className="relative">{main}</div>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:50:14]
 49 │           <div className="pt-10 pb-8 sm:pt-20 sm:pb-16 lg:py-10">
 50 │             <div className="relative">{main}</div>
    ·              ───
 51 │           </div>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:52:12]
 51 │           </div>
 52 │           <div className="flex flex-1 items-end justify-center pb-4 lg:justify-start lg:pb-6">
    ·            ───
 53 │             {footer}
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:63:5]
 62 │   return (
 63 │     <>
    ·     ──
 64 │       <FixedSidebar main={<Intro />} footer={<IntroFooter />} />
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:64:8]
 63 │     <>
 64 │       <FixedSidebar main={<Intro />} footer={<IntroFooter />} />
    ·        ────────────
 65 │       <div className="relative flex-auto">
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:64:28]
 63 │     <>
 64 │       <FixedSidebar main={<Intro />} footer={<IntroFooter />} />
    ·                            ─────
 65 │       <div className="relative flex-auto">
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:64:47]
 63 │     <>
 64 │       <FixedSidebar main={<Intro />} footer={<IntroFooter />} />
    ·                                               ───────────
 65 │       <div className="relative flex-auto">
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:65:8]
 64 │       <FixedSidebar main={<Intro />} footer={<IntroFooter />} />
 65 │       <div className="relative flex-auto">
    ·        ───
 66 │         <Timeline />
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:66:10]
 65 │       <div className="relative flex-auto">
 66 │         <Timeline />
    ·          ────────
 67 │         <main className="space-y-16 py-10 sm:space-y-28 sm:py-20 bg-surface-low">{children}</main>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Layout.tsx:67:10]
 66 │         <Timeline />
 67 │         <main className="space-y-16 py-10 sm:space-y-28 sm:py-20 bg-surface-low">{children}</main>
    ·          ────
 68 │       </div>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/inefficiency-calculator/page.tsx:49:6]
 48 │   return (
 49 │     <Suspense>
    ·      ────────
 50 │       <RoiCalculatorPage />
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/inefficiency-calculator/page.tsx:50:8]
 49 │     <Suspense>
 50 │       <RoiCalculatorPage />
    ·        ─────────────────
 51 │     </Suspense>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/[slug]/page.tsx:42:5]
 41 │   return (
 42 │     <>
    ·     ──
 43 │       <main className="min-h-screen">
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/[slug]/page.tsx:43:8]
 42 │     <>
 43 │       <main className="min-h-screen">
    ·        ────
 44 │         <Container className="max-w-[85ch]">
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/[slug]/page.tsx:44:10]
 43 │       <main className="min-h-screen">
 44 │         <Container className="max-w-[85ch]">
    ·          ─────────
 45 │           {/* Hero */}
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/[slug]/page.tsx:46:12]
 45 │           {/* Hero */}
 46 │           <header className="py-20 space-y-6">
    ·            ──────
 47 │             {post.logo && (
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/[slug]/page.tsx:48:16]
 47 │             {post.logo && (
 48 │               <Image
    ·                ─────
 49 │                 src={post.logo}
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/[slug]/page.tsx:56:14]
 55 │             )}
 56 │             <h1 className="text-3xl md:text-5xl font-new-spirit font-[400] text-primary leading-tight mb-6">
    ·              ──
 57 │               {post.title}
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/[slug]/page.tsx:59:14]
 58 │             </h1>
 59 │             <p className="max-w-3xl text-lg font-[400] text-secondary leading-loose">
    ·              ─
 60 │               {post.description}
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/[slug]/page.tsx:65:12]
 64 │           {/* Cover image */}
 65 │           <div className="relative aspect-video rounded-xl overflow-hidden mb-10 ring ring-subtle">
    ·            ───
 66 │             <Image src={post.image} alt={post.title} fill className="object-cover" priority />
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/[slug]/page.tsx:66:14]
 65 │           <div className="relative aspect-video rounded-xl overflow-hidden mb-10 ring ring-subtle">
 66 │             <Image src={post.image} alt={post.title} fill className="object-cover" priority />
    ·              ─────
 67 │           </div>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/[slug]/page.tsx:70:12]
 69 │           {/* MDX body */}
 70 │           <article className="prose-custom max-w-[65ch] mx-auto">
    ·            ───────
 71 │             <MDXRemote
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/[slug]/page.tsx:71:14]
 70 │           <article className="prose-custom max-w-[65ch] mx-auto">
 71 │             <MDXRemote
    ·              ─────────
 72 │               source={post.content}
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/app/[locale]/blog/[slug]/page.tsx:78:10]
 77 │         </Container>
 78 │         <CTASection />
    ·          ──────────
 79 │       </main>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:14:26]
 13 │   Challenge,
 14 │   KeyResult: (props) => <KeyResult {...props} />,
    ·                          ─────────
 15 │   h1: (props) => (
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:16:6]
 15 │   h1: (props) => (
 16 │     <h1
    ·      ──
 17 │       className="text-4xl md:text-4xl font-[400] text-primary mt-16 mb-4 font-new-spirit"
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:22:6]
 21 │   h2: (props) => (
 22 │     <h2 className="text-3xl font-[400] text-primary mt-16 mb-4 font-new-spirit" {...props} />
    ·      ──
 23 │   ),
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:24:19]
 23 │   ),
 24 │   h3: (props) => <h3 className="text-lg font-medium text-primary mt-10 mb-2" {...props} />,
    ·                   ──
 25 │   p: (props) => <p className="text-base text-secondary leading-loose mb-4" {...props} />,
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:25:18]
 24 │   h3: (props) => <h3 className="text-lg font-medium text-primary mt-10 mb-2" {...props} />,
 25 │   p: (props) => <p className="text-base text-secondary leading-loose mb-4" {...props} />,
    ·                  ─
 26 │   a: (props) => (
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:27:6]
 26 │   a: (props) => (
 27 │     <a
    ·      ─
 28 │       className="text-action-primary underline underline-offset-2 hover:text-action-primary-hover"
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:34:19]
 33 │   ),
 34 │   ul: (props) => <ul className="list-disc pl-6 mb-4 space-y-2 text-secondary" {...props} />,
    ·                   ──
 35 │   ol: (props) => <ol className="list-decimal pl-6 mb-4 space-y-2 text-secondary" {...props} />,
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:35:19]
 34 │   ul: (props) => <ul className="list-disc pl-6 mb-4 space-y-2 text-secondary" {...props} />,
 35 │   ol: (props) => <ol className="list-decimal pl-6 mb-4 space-y-2 text-secondary" {...props} />,
    ·                   ──
 36 │   li: (props) => <li className="text-base leading-relaxed" {...props} />,
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:36:19]
 35 │   ol: (props) => <ol className="list-decimal pl-6 mb-4 space-y-2 text-secondary" {...props} />,
 36 │   li: (props) => <li className="text-base leading-relaxed" {...props} />,
    ·                   ──
 37 │   blockquote: (props) => (
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:38:6]
 37 │   blockquote: (props) => (
 38 │     <blockquote
    ·      ──────────
 39 │       className="border-l-4 border-action-primary pl-4 my-6 italic text-subtle"
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:44:6]
 43 │   code: (props) => (
 44 │     <code className="bg-component-default text-sm px-1.5 py-0.5 rounded-md font-mono" {...props} />
    ·      ────
 45 │   ),
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:47:6]
 46 │   pre: (props) => (
 47 │     <pre className="bg-component-default rounded-lg p-4 overflow-x-auto mb-4 text-sm" {...props} />
    ·      ───
 48 │   ),
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:49:14]
 48 │   ),
 49 │   hr: () => <hr className="border-medium my-8" />,
    ·              ──
 50 │   strong: (props) => <strong className="font-semibold text-primary" {...props} />,
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:50:23]
 49 │   hr: () => <hr className="border-medium my-8" />,
 50 │   strong: (props) => <strong className="font-semibold text-primary" {...props} />,
    ·                       ──────
 51 │   img: (props) => (
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/mdx-components.tsx:52:6]
 51 │   img: (props) => (
 52 │     <Image
    ·      ─────
 53 │       src={props.src ?? ""}
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  ⚠ eslint-plugin-jsx-a11y(anchor-has-content): Missing accessible content when using `a` elements.
    ╭─[src/components/mdx-components.tsx:27:5]
 26 │       a: (props) => (
 27 │ ╭─▶     <a
 28 │ │         className="text-action-primary underline underline-offset-2 hover:text-action-primary-hover"
 29 │ │         target={props.href?.startsWith("http") ? "_blank" : undefined}
 30 │ │         rel={props.href?.startsWith("http") ? "noopener noreferrer" : undefined}
 31 │ │         {...props}
 32 │ ╰─▶     />
 33 │       ),
    ╰────
  help: Provide screen reader accessible content when using `a` elements.

  ⚠ eslint-plugin-jsx-a11y(heading-has-content): Headings must have content and the content must be accessible by a screen reader.
    ╭─[src/components/mdx-components.tsx:16:5]
 15 │       h1: (props) => (
 16 │ ╭─▶     <h1
 17 │ │         className="text-4xl md:text-4xl font-[400] text-primary mt-16 mb-4 font-new-spirit"
 18 │ │         {...props}
 19 │ ╰─▶     />
 20 │       ),
    ╰────
  help: Provide screen reader accessible content when using heading elements.

  ⚠ eslint-plugin-jsx-a11y(heading-has-content): Headings must have content and the content must be accessible by a screen reader.
    ╭─[src/components/mdx-components.tsx:22:5]
 21 │   h2: (props) => (
 22 │     <h2 className="text-3xl font-[400] text-primary mt-16 mb-4 font-new-spirit" {...props} />
    ·     ─────────────────────────────────────────────────────────────────────────────────────────
 23 │   ),
    ╰────
  help: Provide screen reader accessible content when using heading elements.

  ⚠ eslint-plugin-jsx-a11y(heading-has-content): Headings must have content and the content must be accessible by a screen reader.
    ╭─[src/components/mdx-components.tsx:24:18]
 23 │   ),
 24 │   h3: (props) => <h3 className="text-lg font-medium text-primary mt-10 mb-2" {...props} />,
    ·                  ─────────────────────────────────────────────────────────────────────────
 25 │   p: (props) => <p className="text-base text-secondary leading-loose mb-4" {...props} />,
    ╰────
  help: Provide screen reader accessible content when using heading elements.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
   ╭─[src/components/changelog/Intro.tsx:5:6]
 4 │   return (
 5 │     <svg viewBox="0 0 16 16" aria-hidden="true" fill="currentColor" {...props}>
   ·      ───
 6 │       <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401zm-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4z" />
   ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
   ╭─[src/components/changelog/Intro.tsx:6:8]
 5 │     <svg viewBox="0 0 16 16" aria-hidden="true" fill="currentColor" {...props}>
 6 │       <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401zm-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4z" />
   ·        ────
 7 │     </svg>
   ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Intro.tsx:13:6]
 12 │   return (
 13 │     <div className="space-y-4 relative">
    ·      ───
 14 │       <div className="absolute top-0 left-0 w-full h-full bg-stone-100/75 -z-1 rounded-full blur-3xl" />
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Intro.tsx:14:8]
 13 │     <div className="space-y-4 relative">
 14 │       <div className="absolute top-0 left-0 w-full h-full bg-stone-100/75 -z-1 rounded-full blur-3xl" />
    ·        ───
 15 │       <h1 className="font-new-spirit text-3xl lg:text-4xl/tight font-[400] text-primary">
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Intro.tsx:15:8]
 14 │       <div className="absolute top-0 left-0 w-full h-full bg-stone-100/75 -z-1 rounded-full blur-3xl" />
 15 │       <h1 className="font-new-spirit text-3xl lg:text-4xl/tight font-[400] text-primary">
    ·        ──
 16 │         What&apos;s new in Tato
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Intro.tsx:18:8]
 17 │       </h1>
 18 │       <p className="text-base/6 text-secondary">
    ·        ─
 19 │         Stay up to date with the latest product updates, new features, and improvements to Tato —
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Intro.tsx:23:8]
 22 │
 23 │       <IconLink
    ·        ────────
 24 │         href="https://www.linkedin.com/company/tato-solutions"
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Intro.tsx:36:6]
 35 │   return (
 36 │     <p className="flex items-baseline gap-x-2 text-[0.8125rem]/6 text-subtle">
    ·      ─
 37 │       &copy; {new Date().getFullYear()}{" "}
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/changelog/Intro.tsx:38:8]
 37 │       &copy; {new Date().getFullYear()}{" "}
 38 │       <IconLink href="https://tato.co" compact>
    ·        ────────
 39 │         Tato Technology Solutions Inc.
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
     ╭─[src/components/ui/icon-button.tsx:104:6]
 103 │   return (
 104 │     <button
     ·      ──────
 105 │       className={cn(
     ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
     ╭─[src/components/ui/icon-button.tsx:118:8]
 117 │     >
 118 │       <div className="flex items-center justify-center">{children}</div>
     ·        ───
 119 │     </button>
     ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
     ╭─[src/components/ui/icon-button.tsx:136:6]
 135 │   return (
 136 │     <a
     ·      ─
 137 │       className={cn(
     ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
     ╭─[src/components/ui/icon-button.tsx:150:8]
 149 │     >
 150 │       <div className="flex items-center justify-center">{children}</div>
     ·        ───
 151 │     </a>
     ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/blog/key-result.tsx:40:6]
 39 │   return (
 40 │     <div
    ·      ───
 41 │       ref={ref}
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/blog/key-result.tsx:44:8]
 43 │     >
 44 │       <AnimateNumber
    ·        ─────────────
 45 │         format={format}
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/blog/key-result.tsx:59:8]
 58 │       </AnimateNumber>
 59 │       <span className="text-sm text-secondary">{label}</span>
    ·        ────
 60 │     </div>
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[src/components/ui/container.tsx:9:11]
  8 │ }) {
  9 │   return <div className={cn("container max-w-6xl mx-auto px-4", className)}>{children}</div>;
    ·           ───
 10 │ }
    ╰────
  help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.

  × eslint-plugin-react(no-unknown-property): Unknown property found
     ╭─[src/app/[locale]/why-tato/page.tsx:185:14]
 184 │       {/* Add custom CSS for the feature images */}
 185 │       <style jsx global>{`
     ·              ───
 186 │         .problem-image,
     ╰────
  help: Remove unknown property

Reproduction

I migrated my next js website using vp migrate, ran vp install, then tried to commit the changes which triggered vp check --fix which seems to have triggered the error

System Info

System:
    OS: macOS 26.3.1
    CPU: (10) arm64 Apple M4
    Memory: 84.16 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 24.14.1 - /Users/pggonni/.vite-plus/js_runtime/node/24.14.1/bin/node
    Yarn: 1.22.22 - /Users/pggonni/.nvm/versions/node/v22.19.0/bin/yarn
    npm: 11.11.0 - /Users/pggonni/.vite-plus/js_runtime/node/24.14.1/bin/npm
    pnpm: 10.33.0 - /Users/pggonni/Library/pnpm/pnpm
  Browsers:
    Safari: 26.3.1

Additional context

No response

Metadata

Metadata

Type

Fields

Priority

None yet

Effort

None yet

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions