HIGHSecuritysmallNext.js + Supabase Standards

Never pass server-only data as props to client components

Props to client components are serialized as JSON and sent to the browser. Don't pass full database records with sensitive fields.

Why This Matters

Passing a full user object with email, role, internal IDs, or API keys as props exposes them in the client bundle.

Related Rules

Use route groups to organize app sections

Architecture

HIGH

Colocate page files with their route segment

Architecture

MEDIUM

Use (select auth.uid()) instead of auth.uid() in policies

Performance

MEDIUM

Use kebab-case for file and directory names

Quality

MEDIUM

Catch this automatically on every PR

BeforeMerge scans your pull requests against this rule and 2+ others. Get actionable feedback before code ships.

Join Waitlist Browse All Rules

Why This Matters

Props to "use client" components are serialized and sent to the browser. Anyone can see them in DevTools.

Good

// Server component — pick only needed fields
export default async function Page() {
  const user = await getUser()
  return <UserAvatar name={user.display_name} avatarUrl={user.avatar_url} />
}

Bad

// Passes entire user object including email, role, internal IDs
export default async function Page() {
  const user = await getUser()
  return <UserAvatar user={user} />  // all fields visible in browser!
}

Never pass server-only data as props to client components

Why This Matters

Tags

Related Rules

Catch this automatically on every PR

Why This Matters

Good

Bad