P5.js-web-editor: Order files alphabetically in sidebar and nested folders

[Felixpaulsen]

Nature of issue?

• [ ] Found a bug
• [ ] Existing feature enhancement
• [X] New feature request

New feature details: I would love to be able to rearrange the files in the left file tree, so that I can keep my relevant .js files at the top and the html and css file at the bottom, by simply dragging them around.

[catarak]

I agree, this would be great. Also, another option—would it make sense for the files to be in alphabetical order? Right now the order is just the order in which the files/folders were added to the sketch. Open to whatever feels the most useful.

[catarak]

For me, I think the thing that would be most useful would be the ability to move files in and out of folders.

[nopivnick]

@catarak

would it make sense for the files to be in alphabetical order?

I vote for alphabetical order, at least as the initial feature. it's easy enough to edit file names to force order and I assume alphabetical order is quicker to implement.

[Felixpaulsen]

@nopivnick that would at least be a good temporary solution.

[catarak]

I'm not even sure that alphabetical would be faster than a fixed, rearrangeable order. So really, I'm curious which is more desirable.

[Felixpaulsen]

I think rearranging is more important than alphabetical. Just my opinion though.

[nopivnick]

custom ordering hands down.

[nimishagarwal76]

@catarak I feel that sorted alphabatical order would be nice. VS Code follows similar structure, its really nice. Even sublime follows the same.

If it is to be implemented I would like to work upon it.

[nimishagarwal76]

Isn't #789 and this issue same?

[catarak]

i agree that alphabetical would be best. while a custom order would be nice, i think it introduces some complexity to the UI/UX that i don't think is totally necessary. and no, it is not the same as #789, since that is in references to sketches, rather than the files that are contained within a sketch.

[siddhant1]

I think I can work on maintaining an alphabetical order for now , should I start @catarak?

[catarak]

@siddhant1 go ahead!

[Jaeger-Tim]

When will we see this?

[catarak]

@TJHUNTER2001 I don't have a timeline for this issue unfortunately. unless anyone else wants to pick it up!

[siddhant1]

@shakti97 would you like to pick this up?

[shakti97]

Sure

[ashu8912]

Hey @catarak need a little help here can you please tell where is the map function that lays out the files

[aldrinjenson]

@ashu8912 Are you still working on the issue?

[aldrinjenson]

I would like to do something for the issue, but I am a bit reluctant to touch the reducers because of the comment message given on the FileNode Component as that 'this is a hack and that the state is updated before the props' on line 301
https://github.com/processing/p5.js-web-editor/blob/8bf9c1089a329e875649eac59ffc25d82202aa84/client/modules/IDE/components/FileNode.jsx#L301
Any suggestions or advice would be greatly appreciated. Thanks

[ashu8912]

No go ahead.

[jordanja]

Hey, has anyone completed this? It seems to still be an issue in the live website.

If not, I'll try take a stab at it as my first open source contribution.

[catarak]

@jordanja it hasn't been fixed! you can absolutely go ahead and work on it 😄

[neelesh7singh]

@jordanja are you still working on this issue?

[neelesh7singh]

Hey, @catarak I made a few changes in the file reducer and got this results -

Is this fine??

[catarak]

@neelesh7singh yes! make a PR so I can review your code 😸