It is arranged in objects defined as TypeScript interfaces. It can be easily broken down into numerous smaller files and be equally organized, but then the code would be in multiple places without any benefits except that there would be fewer lines in one file.

I get the impression that people who are only used to seeing front end code as JSX don't have any idea how to proceed when its just JavaScript. If they aren't also writing code outside the browser they are likely never exposed to application code in any real form because all they see is template abstractions. The reality is that it is just JavaScript which is no different in the browser compared to in Node, except for calling a different API. If this is the case then anything that isn't JSX is cause for an anxiety attack, most especially if its more than 120 lines of code.

If you are not capable of reading code then no matter of alternate guidance will matter.

> I get the impression that people who are only used to seeing front end code as JSX don't have any idea how to proceed when its just JavaScript.

I knew anything I said your answer would be something in this line. You think what you wrote is amazing but it is just verbose bad abstraction. If you think the difference between 4k lines of code and separated logical modules is just a matter of fewer lines (which might not even be the case), there is nothing I can say to you but it is funny that you use this terrible code as an example. You literally wrote all DOM manipulation repetitively and inefficiently by hand. But it makes you proud! Congratulations, I guess.

I couldn't care less about JSX tho you made too many assumptions about someone that thinks the example code sucks.