DEV Community

Taylor Andrade
Taylor Andrade

Posted on

RepoGuard Studio: Guarding Next.js Architecture with Sanity Content Lake

#devchallenge #sanitychallenge #sanity #ai

Sanity Challenge Path Two Submission

This is a submission for the Sanity Challenge, Path Two: Vibe-Code Something Strange

🛡️ What I Built

RepoGuard Studio is a living architectural guardrails hub designed to solve one of the most pressing headaches in modern AI-assisted engineering: AI code rot and layer bypassing.

When developers use AI coding assistants (Cursor, Claude Code, Windsurf, Copilot), the models write hundreds of lines in seconds. But without strict repo-level context, the AI quietly introduces destructive anti-patterns:

  • Querying databases directly from React components and API route handlers instead of domain services.
  • Inventing duplicate utility helpers instead of importing existing ones.
  • Infiltrating files with : any to make compilers happy.
  • Exposing mock credentials and creating hydration mismatches.

Instead of hardcoding rules into static text files, RepoGuard Studio stores, structures, and serves architectural guardrails directly from Sanity's Content Lake using GROQ queries and structured schemas.

Key Capabilities:

  1. Interactive Rules Catalog: Filter and explore 8 core architectural rules backed by Sanity JSON documents, complete with interactive Bad Code vs Good Code diff tabs.
  2. Multi-AI Context Generator: Configure your stack (Next.js 15, Prisma, NestJS) and rules to generate tailored .cursorrules, CLAUDE.md, and .windsurfrules with 1-click Copy & Download.
  3. Live Architecture Linter Playground: Paste code in the browser and watch RepoGuard's audit engine calculate an instant Architectural Health Score (100/100, Grade A+ to F).
  4. Sanity GROQ Console: Live inspector executing real-time GROQ queries against the Sanity dataset (dwzoo40f).

🎮 Demo & Live Experience

Run the CLI in your terminal right now with zero installation:

# 1. Audit your repo architecture score:
npx repoguard-rules audit

# 2. Generate stack-tailored guardrails:
npx repoguard-rules init
Enter fullscreen mode Exit fullscreen mode

💻 Code & Schemas

The complete code is open-source under the MIT license on GitHub:
👉 github.com/taylormatematica-beep/repoguard

Sanity Schema Definition (rule.ts): 

import { defineType, defineField } from 'sanity';

export const ruleType = defineType({
  name: 'rule',
  title: 'Architectural Guardrail',
  type: 'document',
  fields: [
    defineField({ name: 'ruleId', title: 'Rule ID', type: 'string', validation: (Rule) => Rule.required() }),
    defineField({ name: 'title', title: 'Rule Title', type: 'string', validation: (Rule) => Rule.required() }),
    defineField({ 
      name: 'category', 
      title: 'Category', 
      type: 'string', 
      options: { list: ['Architecture', 'Security', 'Type Safety', 'Next.js / SSR', 'API Design', 'Code Quality'] } 
    }),
    defineField({ 
      name: 'severity', 
      title: 'Severity Level', 
      type: 'string', 
      options: { list: ['Critical', 'Error', 'Warning', 'Info'] } 
    }),
    defineField({ name: 'description', title: 'Description', type: 'text' }),
    defineField({ name: 'rationale', title: 'Engineering Rationale', type: 'text' }),
    defineField({ name: 'badCode', title: 'Violation Snippet', type: 'text' }),
    defineField({ name: 'goodCode', title: 'Clean Architecture Snippet', type: 'text' }),
    defineField({ name: 'fixSuggestion', title: 'Remediation Fix', type: 'string' }),
  ],
});
Enter fullscreen mode Exit fullscreen mode

GROQ Query Used to Power the App: 

*[_type == "rule"] | order(ruleId asc) {
  _id,
  ruleId,
  title,
  category,
  severity,
  description,
  rationale,
  badCode,
  goodCode,
  fixSuggestion,
  frameworks,
  aiAssistants
}
Enter fullscreen mode Exit fullscreen mode

🛠️ My Build Process

This project was built entirely through an AI-native vibe-coding workflow using Cursor and Arena Agent Mode, with Next.js, React, and Sanity.

1. Where the Model Got Stuck

While scaffolding the Next.js components, Cursor initially attempted to run raw database calls directly inside frontend event handlers — committing the very crime RepoGuard was meant to prevent!

Because the model lacked holistic context about clean separation of concerns, it treated the Sanity client as a generic client-side fetcher without proper error handling and fallback caching.

2. How We Course-Corrected

We used RepoGuard's own .cursorrules to constrain the model:

  1. Enforced that Sanity queries must be encapsulated inside a dedicated data access module (/src/sanity/client.js).
  2. Required explicit TypeScript typing on GROQ query projections.
  3. Added fallback structured seed data so the web app remains resilient and fast even before new documents are published to the dataset.

The result is a fast, robust app that communicates seamlessly with Sanity's Content Lake.

📌 Sanity Project Details

As required by the challenge guidelines, here are the project identifiers for the judges:

  • Sanity Project ID: dwzoo40f
  • Dataset: production
  • Public API Query Endpoint: https://dwzoo40f.api.sanity.io/v2024-01-01/data/query/production?query=*[_type%20==%20%22rule%22]

🤖 Conclusion

By connecting Sanity's structured content model with real-time AI guardrails, RepoGuard Studio demonstrates how content operating systems can serve as the living memory and quality control system for AI-assisted engineering teams.

Happy coding, and guard your codebases! 🛡️

Top comments (0)