The Senate

• 

• 

Inspiration

Most mod tools are built by developers who don't actually moderate; they build bigger shovels to clear the spam queue faster. But if you talk to veteran moderators of massive subreddits (like r/AskHistorians or r/science), spam isn't their biggest problem. Their biggest problems are social exhaustion, team inconsistency, and institutional amnesia. Moderation teams suffer from "zombie debates"—constantly re-arguing the same subjective edge-cases (e.g., "is this meme too political?") because they lose their community knowledge when a senior mod retires. I wanted to build a tool that didn't just filter spam, but actually helped teams govern their communities with consistency and transparency.

What it does

The Senate is built natively as a Devvit webview application with three core features:

1. The Living Constitution: A searchable, persistent log of edge-case rulings. When a subjective decision is made, mods log the rule and the rationale. It acts as "Case Law" to instantly settle future debates and onboard new mods.

1. Dynamic Settings & Datalists: The app adapts to any subreddit. Mods can define their custom rules in the subreddit settings, which populate an autocomplete that still allows on-the-fly custom rule typing.

1. The Mod Mirror: An analytics dashboard that maps out visual distribution bars of individual moderator actions. It shows head-mods exactly how their team is applying the rules, ensuring no single mod is acting as a rogue agent or burning out.

How I built it

I built this as a solo developer using the new Devvit Webview API (Vite + Hono).

Frontend: React and Tailwind CSS. I designed a premium "Liquid Glass" UI aesthetic using custom SVG filters (<feTurbulence> and <feDisplacementMap>) piped directly into CSS backdrop-filter properties to physically refract and bend the background behind the UI cards.

Backend: I used Hono for routing and Devvit's built-in Redis plugin for persistent data storage.

Data Engine: I built a custom mapping function in the backend to aggregate discrete Redis logs into statistical profiles for the Mod Mirror on the fly.

Challenges I ran into

The "White Screen of Death": Early on, I struggled with React DOM mounting inside the Vite template before realizing my createRoot boilerplate was missing from the component files.

The Captivator: Building the "Thick Glass" refraction effect was incredibly difficult. Getting Chrome/Safari to properly pass the background rendering layer into a mathematical SVG displacement map required precise CSS hacks (backdrop-filter: blur(0px) vs injecting it directly into the URL). But in the end, to save load time, I reverted back to normal .png backgrounds and very Thin Glass "Glassmorphism". The buttons have hover glow to them which makes it more eye catching.

TypeScript Strictness: Handling dynamic dictionary keys in the backend aggregation engine and strict state overlaps ('view' | 'log' | 'mirror') required deep dives into TypeScript's control-flow analysis and non-null assertion operators.

Full-Stack Security: I initially thought about hiding the submission UI from non-mods, but realized a savvy user could bypass the frontend and hit the API directly. I had to build a backend verification gate that cross-references reddit.getCurrentUsername() against the official reddit.getModerators() array before allowing any database writes.

Accomplishments that I'm proud of

Building a fully functioning, secure, Redis-backed React application inside a Devvit iframe.

Nailing the high-end "Glassmorphism" UI design—it doesn't look like a standard Reddit menu; it looks like a premium, standalone governance OS.

Identifying a massive vulnerability in my own frontend logic and successfully building an impenetrable backend security gate to protect the database.

What I learned

I gained a massive appreciation for how Devvit splits its architecture between the Client (handling local UI and context) and the Server (handling secure authentication tokens implicitly).

I learned advanced CSS/SVG compositing techniques.

Most importantly, I learned how to identify true Product-Market Fit. I learned that solving human problems (like team arguments and inconsistent rule enforcement) is often much more impactful than just solving purely technical problems.

What's next for The Senate

Advanced Search & Filtering: Adding a search bar to the "Living Constitution" so mods can instantly query keywords from past precedents.

Modmail Integration: Allowing mods to easily generate a link to a specific Senate Precedent to send directly to a user in Modmail, removing subjectivity and shutting down arguments.

Data Export: Allowing head-mods to export the Mod Mirror analytics to CSV for monthly team reviews.

Built With

• css3
• devvit
• hono
• html5
• react
• redis
• tailwind-css
• typescript
• vite