AutoMod Studio

Inspiration

Reddit AutoModerator is one of the most powerful moderation tools on the platform — but communities still configure it by hand-editing a wall of YAML in a plain wiki text box. One misplaced indent, a malformed regex, or an accidentally broad rule can silently break moderation for an entire subreddit. We built AutoMod Studio so moderators who understand policy — not just syntax — can ship safe AutoMod changes without leaving Reddit.

What it does

AutoMod Studio is a native Devvit workspace that replaces the raw wiki editor with a visual control room — entirely inside Reddit.

• Templates — starter rules for spam, new accounts, civility, link farming, flair enforcement, and title quality
• My Rules — table view of the live config/automoderator config with readiness indicators
• Rule Builder — guided fields for common AutoMod conditions and actions, with per-rule YAML preview
• Simulator — approximate local matching on sample title, body, URL, and content type before anything hits production
• Version History — one timeline merging local snapshots (on Save) with Reddit wiki revisions (restore to editor or revert on Reddit)
• Safety guardrails — flags overly broad or duplicate rules, confirms destructive actions, and warns that deploy replaces the full AutoModerator wiki page

Moderators open the app from Mod Tools, edit in a tall custom post webview, and deploy back to r/subreddit/wiki/config/automoderator through Devvit’s Reddit API — no third-party hosts and no moderation config leaving the platform.

How we built it

The stack is deliberately small and Devvit-native:

Data flow: the webview sends typed messages to src/main.tsx → Devvit reads config/automoderator → parser turns YAML into rule cards → moderators edit and simulate locally → serializer rebuilds YAML → updateWikiPage writes the wiki on explicit Save.

We use event delegation for all UI actions (no inline handlers), a custom in-app confirm dialog (native window.confirm is blocked in the sandboxed iframe), and system font stacks instead of Google Fonts (external stylesheets violate style-src CSP).

Challenges we ran into

1. Devvit sandbox + CSP
The webview runs in a locked-down iframe: window.confirm() is ignored without allow-modals, and external assets like Google Fonts are blocked. We replaced native dialogs with an in-app modal and dropped remote font CDNs — small UX details that are mandatory on Reddit.

2. Real-world AutoModerator YAML
Production configs are messy: multiple --- documents, empty sections, legacy fields, and partial rules. The parser had to warn and skip bad documents without bricking the whole editor, and the serializer had to round-trip common rule shapes moderators actually use.

3. Wiki permissions (HTTP 415)
Saving to config/automoderator failed until we understood Devvit’s split workflow: devvit upload publishes the app; devvit install <subreddit> (or playtest) grants the installed app account mod/wiki access. Opening a stale custom post from before install can still fail — we document opening fresh from Mod Tools and using playtest URLs with ?playtest=automodstudio.

4. “Upload” ≠ “on my subreddit”
Early testing targeted the wrong subreddit because upload auto-installs a default *_dev community. Wiring ModQueueLab (and playtest) made the loop real: edit → simulate → deploy → read wiki revisions on the mod’s own test sub.

Accomplishments we're proud of

• A full visual IDE for AutoModerator — templates, builder, simulator, history, and deploy — that runs 100% on Reddit via Devvit
  
• Draft + local history so moderators can iterate safely before touching the live wiki
  
• Wiki revision integration so Reddit’s audit trail and our local snapshots share one UI
  
• A product path for non-technical mods who should never have to debug YAML indentation to keep a community safe
  

What we learned

Building inside Devvit means designing with the sandbox first: CSP, modal policy, and install/playtest flows are not polish — they are core requirements. That constraint pushed us toward vanilla JS, explicit message protocols, and honest copy about what runs locally (simulator) vs. what hits production (wiki Save).

It also reinforced why moderators care: the wiki is the source of truth. AutoMod Studio does not replace Reddit’s config — it makes editing that config safer, reviewable, and approachable while keeping every byte of moderation policy on Reddit’s infrastructure.

Built With

• css3
• devvit
• html5
• javascript
• js-yaml
• redditapi
• typescript