Primedocs
Blocks

Password Auth

Password-based authentication block for Next.js

Hey there

Why not use Supabase UI?

Don't get me wrong, the password-based authentication for Supabase is good. But let's be honest, it's kinda stuck in the past.

Key issues with supabase ui block:

  • Outdated file naming conventions — They still use legacy names such as middleware.ts while Next.js 16 and later use proxy.ts

  • Modern framework alignment — The Supabase UI components haven't fully adapted to the latest Next.js architectural changes

  • Technical debt — Continuing with legacy patterns creates maintenance overhead and confusion for developers using newer Next.js versions

The fix: I've updated these legacy naming conventions and outdated patterns to align with modern Next.js standards (v16+).

Installation

npx shadcn@latest add https://ui.quickprimetech.com/r/password-based-auth.json
Open in
coming soon

Usage

Once installed, configure your environment variables:

NEXT_PUBLIC_SUPABASE_URL=your-url
NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY=your-key

Introduction

Internal component library for the QuickPrimeTech team.

Image

Reusable image component with LQIP support, fallback states, and skeleton loading

On this page

Why not use Supabase UI?
Key issues with supabase ui block:
Installation
Usage