feat: ability to modify existing files

[TheComputerM]

Describe the feature

I have components that require existing files to be modified, like adding new css variables or some javascript.

It would be great if we could specify it in the manifest json using some diff-like language, functionality would be similar to shadcn's css vars

Validations

• I have checked other issues to see if my feature was already requested or added

[TheComputerM]

GritQL would be very suitable for this task

[ieedan]

I am currently working on some stuff that would make this possible but it is a bit of a ways out atm

[ieedan]

It's still very early but what I am thinking is a vite-style kind of plugin where you can add a transform to the code before it's written. This would also be where formatting would happen.

Something like this:

export type Transform = {
	transform: (code: string, { cwd, fileName }: { cwd: string; fileName: string }) => Promise<{ code?: string }>;
};

That way you can write a plugin for your users and jsrepo can still do the transformation without having to introduce more complexity or dependencies to jsrepo. Currently we get into a death spiral of "support this language" and we need to add a new parser or something. This would solve that and allow us to keep jsrepo light and fast.

[TheComputerM]

Thats also a good idea, I guess the only questions I would have with this is:

1. Currently all config is done through json, where would this js file live?
2. When you download from a registry, will the plugin automatically be pulled or will the user have to add the plugin manually (Ideally it should be pulled along with the repo to reduce development overhead imo, would really dislike installing another npm package)
3. As this code would execute on the user's system, there could be malicious attacks that run as side-effects in the transform function

(here I used *user *as the end user of the registry, the one who installs components)

[ieedan]

The JS config would replace the json config.

Nothing is actually decided yet but I think it would be nice for plugins to be installed when you init a registry. There wouldn't be any sort of "postinstall" or invisible hooks it would probably be just would you like to install "jsrepo-plugin-park-ui" and if you say yes it can add it to your config. (Maybe not cause modifying JS is much more difficult, it may have to be a kind of "try my best" kind of thing)

Plugins will probably still be npm packages installed as dev dependencies. Like vite plugins there wouldn't by any production penalty.

[TheComputerM]

Hmm, any way to not use npm packages? would just increase the maintenance effort by the registry authors.

[ieedan]

Ideally if there wasn't any specific work that needed to be done no plugins would be needed. I plan to support all the currently supported languages out of the box. But for more specific tasks you will probably need a plugin to do it so that we don't introduce unnecessary plugins to jsrepo.

[ieedan]

If you think GritQL would be enough on its own we may be able to consider adding some implementation of it as a dependency. Trying to be more conscious this time around to reduce startup times.

[ieedan]

Hmm, any way to not use npm packages? would just increase the maintenance effort by the registry authors.

I have been working on the autoinstall functionality for plugins and it's actually quite reliable. Users will be able to add new plugins by running:

jsrepo config add transform @jsrepo/jsrepo-transform-prettier

And we can automatically install and add the plugin to the config!

The next step would be to make it so that registry owners can define the plugins that their users need to install their registry (and of course add those on init).

All this to say from my testing so far it's actually very reliable and I feel good about being able to automatically add plugins so far!