reddit-moderator-toolbox
reddit-moderator-toolbox copied to clipboard
toolbox-team
Platform-independent frontend slots
Basically TBListener but beefier - a proper solution for defining platform-independent locations where UI elements can be placed by modules.
frontend/index.tsx defines a set of locations where modules might want to place buttons, regardless of platform. It also defines a standardized set of context information available to each location. It exposes a function modules can use to have React components rendered at those locations, and it exposes types used by platform-specific observers to set where each location is rendered within that specific frontend.
frontend/newreddit.tsx defines the observer for new Reddit. It's the simplest to implement by far, because the elements are mostly already provided by the new Reddit jsAPI; we just insert new renderers into the slots we receive. Observers for other platforms are stubs for now but will be implemented before this PR is ready to merge (with the exception of shreddit, which will happen in its own PR).
The end goal here is to replace TBListener with this new system. TBListener handles new Reddit via jsAPI only, and old Reddit is basically handled by spoofing TBListener events so that we can pretend old Reddit has jsAPI. Extending this system to Shreddit presents challenges, because we need an entirely new system to scrape the required information from the shreddit frontend before emitting it as events, and the actual data models provided by jsAPI are not super well defined.
Fixes #865. Shreddit observer will be handled separately, after this PR, as a fix for #864.
- [ ] Implement locations
- [x] By submission author names
- [x] By comment author names
- [x] By modmail message author names
- [ ] User hovercards
- Partially done, implemented for the modmail sidebar and nothing else
- [ ] Bottom of submissions
- [ ] Bottom of comments
- [x] Implement observers
- [x] Implement new Reddit observer
- [x] Implement old Reddit observer
- [x] Implement modmail observer
- [x] Set up placeholder for shreddit
- Actually implementing the Shreddit observer will happen in a future PR. This PR is just a refactor of existing functionality into a system that will make the eventual Shreddit implementation possible.
- [ ] Rework modules to use this API instead of TBListener
- As usual this has started with modnotes since it's the freshest code. ~~Other observers should be implemented before doing more of this~~ that's done so I can do this now
- [ ] Remove TBListener and the oldreddit module after verifying nothing is left that relies on it
Wanted to do some work on this, but because slot contents are rendered in the shadow DOM now, legacy styles don't work with this PR at all. Putting a JQueryRenderer in a slot works but there's no styles applied to its contents because of the shadow DOM boundary.
I've gotten this up-to-date with current master again but I think I'm going to continue not working on this until all the slottable UI stuff is reworked to use component styles. We can maybe get away with not doing literally everything first, since windows and stuff we can just insert into the bottom of <body> outside the shadow DOM or whatever, but I'm not confident about that. In any case it's clear that the place to start is with the rest of the styles being redone
okay i lied i got a little bit of shreddit working, enough to show that this will actually work there in the future. the focus here should still not be on that yet though - we still need parity on all the other platforms before i can put a ton of effort into the shreddit observer. i just wanted to throw together a proof of concept that assures me all this work isn't for nothing
branch compare with a partially working shreddit observer: compare feat/platform-observers...feat/shreddit-observer as of 2024-10-17
new Reddit is dead (#1027) so rip the newreddit observer. brought up to date with master again