MillionLint.vite() plugin affecting Recharts

[charlieforward9]

What version of million are you using?

^1.0.0-rc.24

Are you using an SSR adapter? If so, which one?

n/a

What package manager are you using?

npm

What operating system are you using?

Windows

What browser are you using?

Chrome

Describe the Bug

Prior to adding the MillionLint.vite() plugin to my Vite config, my Recharts coloring behaves as expected.

After adding the plugin to my project, my Rechart graphs do not show the charts properly

My recharts graph has worked properly for months, enduring dozens of additional npm packages in the repo. Something about Million is affecting it differently

If necessary, here is my simple recharts data

<BarChart
            className="z-0"
            height={300}
            width={350}
            data={chartData}
            onClick={onChartChange}
          >
            <CartesianGrid strokeDasharray="3 3" />
            <XAxis
              tick={{ fontSize: 10 }}
              interval="preserveStartEnd"
              dataKey="type"
            />
            <YAxis tick={{ fontSize: 12 }} />
            <Tooltip />
            <Bar
              dataKey={"count"}
              fill="#8884d8"
              stroke="#000000"
              strokeWidth={1}
            >
              {chartData?.map((b, index) => (
                <Cell
                  role="cell"
                  aria-label={"cell" + index}
                  key={type + "cell" + index}
                  fill={
                    b.visible
                      ? InventoryUtils.colorGradient[size][index]
                      : "gray"
                  }
                />
              ))}
            </Bar>
          </BarChart>
/* Might not be optimized, feedback is welcome while I have Million off till fix 😆 */

It seems that Million is affecting hte display of not only the Cell component, but also the XAxis and YAxis components.

What's the expected result?

I expect my Recharts to remain the same after depending on this incredible Million Linter.

Link to Minimal Reproducible Example

Will make this if necessary, hopefully it is not.

Participation

• I am willing to submit a pull request for this issue.

[github-actions]

Thanks for opening this issue! A maintainer will review it soon.

[aidenybai]

@charlieforward9 triaging now, thanks for the report

[charlieforward9]

I am very excited to integrate this into my workflow. Really love what youre doing here. Any updates on this? @aidenybai

[NisargIO]

Hi @charlieforward9, Recharts should work now on the latest version! Can you try running the setup script npx million@latest. Once it's done, please restart your VSCode/Cursor. Let me know if that works for you!

[NisargIO]

Hello @NisargIO ,

When I try to reinstall million with npx million@latest, to test this fix, I am shown this

However, it does not give me any additional information, just hangs forever. I have manually installed the extension, and made sure to have signed in to million, tried it a few times, waited an hour, refreshed vscode... Unsure where to check next?

Interesting, will take a look at that! In the meantime, can you try manually installing Million Lint? https://million.dev/docs#manual-installation

[RobPruzan]

This is an unintuitive UI that we will be changing- it's actually a select dialogue with a single option. If you press enter the installation will continue. It wants to confirm you want to install the extension into vscode (as oppose to other editors which you don't have installed)

[charlieforward9]

Thank you @RobPruzan , I was able to install.

@NisargIO with "@million/lint": "^1.0.11" my recharts components are still uncolored. I see no change relative to when I filed this bug report.

With the newly styled Dashboard, I am really excited to use this tool! Unfortunately I will not be able to push the Million dependency for the team to use until this is resolved. Hope its not too complicated!

[NisargIO]

hey @charlieforward9 ! I'm looking into this!

[aidenybai]

Hey @charlieforward9, sorry about the delay. I tried reproducing your issue and I can't. Can we call sometime to fix it https://cal.com/aiden?

[charlieforward9]

Been a while since I checked this,

I'll retry tomorrow morning and if it's still not resolved, we can check it during the 2PM meeting I scheduled regarding #1151

[charlieforward9]

Migrating to https://github.com/aidenybai/react-scan solves this. Thanks!