Tauri + App Shell 3

A one-line Next.js + Tauri desktop starter built on App Shell 3 — the Notion-style sidebar with rounded top-nav tabs. Boots as a web app and a native desktop window out of the box, with the Squad app icon baked in.

One-line install

Scaffold a new project by sparse-checking out just the template folder (squad-sdk is private, so this uses your git auth — no full clone, no git history left behind).

$Terminal

git clone --depth 1 --filter=blob:none --sparse https://github.com/sis-thesqd/squad-sdk _sdk \
  && git -C _sdk sparse-checkout set templates/tauri-app-shell-3 \
  && mv _sdk/templates/tauri-app-shell-3 my-app && rm -rf _sdk

Setup

`npm install` also vends App Shell 3 (sidebar-3-block) and its dependencies from the squad-sdk registry via a postinstall step.

$Terminal

cd my-app
npm install        # also vends App Shell 3 from the squad-sdk registry

With auth built in

Pass `SQUAD_AUTH=1` to the install (or run `npm run enable-auth` later) to ship behind Squad auth — Google OAuth + one-time-code, gated to your org domain. Wires `AuthProvider` and gates the home route with `<Sidebar3Demo requireAuth />`.

$Terminal

# Ship it behind Squad auth (Google OAuth + one-time-code):
SQUAD_AUTH=1 npm install      # wires AuthProvider + gates the home route

# already installed? enable it any time:
npm run enable-auth

# then fill .env.local:
NEXT_PUBLIC_SUPABASE_URL=https://wttgwoxlezqoyzmesekt.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-publishable-anon-key

How auth verifies

Desktop Google sign-in opens the system browser (Google blocks embedded webviews) and returns via a localhost loopback. Sign-in is gated to the org domain and verified against an ACTIVE `rippling.workers` row.

$Notes

# Desktop Google sign-in opens the system browser and returns via a
# localhost loopback (Google rejects OAuth inside embedded webviews).
# Whitelist this redirect in Supabase → Auth → URL Configuration:
http://localhost:14256/auth/callback

# Employee gating (providers.tsx): allowedDomain="churchmediasquad.com" + verifyEmployee
#   → verify_current_employee RPC checks an ACTIVE rippling.workers row after sign-in.
# Install the verify RPCs: https://sdk-components.thesqd.com/authentication.md

Run

Develop in the browser, then open the same app as a native desktop window.

$Terminal

npm run dev          # web — http://localhost:3009
npm run tauri:dev    # desktop window (loads the dev server, HMR)
npm run tauri:build  # packaged desktop app (static export → bundle)

Desktop prerequisites

The web app needs nothing extra. The desktop build needs Rust + your platform's native build deps — the only manual step.

$Terminal

# Tauri needs the Rust toolchain + your platform's native build deps.
# This is the one thing the template can't install for you.

# 1. Install Rust
curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

# 2. Platform deps — see https://tauri.app/start/prerequisites/
#    macOS:   Xcode Command Line Tools
#    Windows: WebView2 + MSVC build tools
#    Linux:   webkit2gtk, libappindicator, etc.

What's in the box

The template ships the Tauri scaffold, static-export wiring, Squad UI tokens, and the Squad app icon.

my-app
├── app/
│   ├── page.tsx          renders <Sidebar3Demo /> on "/" (requireAuth w/ auth)
│   ├── layout.tsx        Inter + next-themes (+ Providers w/ auth)
│   ├── providers.tsx     AuthProvider — only when auth is enabled
│   ├── globals.css       squad-ui tokens + thin scrollbars
│   └── squad-ui.css      Squad UI design tokens (shipped)
├── components/
│   └── blocks/           App Shell 3 — vended on install via shadcn
├── lib/tauri/oauth.ts    desktop Google OAuth (system browser + loopback)
├── next.config.ts        output: "export" only during tauri build
├── scripts/              postinstall (vend shell) + enable-auth
├── src-tauri/
│   ├── tauri.conf.json    overlay titlebar, traffic lights, devUrl/frontendDist
│   ├── Cargo.toml         Tauri 2 + size-optimized [profile.release]
│   ├── src/lib.rs         entry point + oauth_listen loopback command
│   └── icons/             the Squad app icon (icns/ico/png)
└── package.json          dev / tauri:dev / tauri:build / enable-auth

Troubleshooting

Gotchas from running this template end-to-end — private-repo auth, the desktop OAuth loopback redirect, port clashes, and first-build timing.

$Notes

# squad-sdk is a PRIVATE repo. The install clones over HTTPS and reuses your
# existing git credentials (gh auth / credential helper). Do NOT use
# `npx degit` or any GitHub-tarball tool (giget, etc.): the tarball API 404s
# on a private repo, degit then silently falls back to cloning the WHOLE repo
# and ignores the subdirectory — you get all of squad-sdk, not the template.
# The documented sparse-checkout is the only reliable path.

# The component CLI hits the same wall: `npx shadcn add …` pulls from
# raw.githubusercontent.com/sis-thesqd/squad-sdk, which also 404s without auth.

# First `npm run tauri:dev` compiles the Rust crate (~0.5–3 min, ~380 deps).
# Later runs are incremental and near-instant. Needs Rust + platform deps below.

# Port: tauri:dev runs `npm run dev` itself (beforeDevCommand) on :3009. Don't
# also run `npm run dev` in another terminal while tauri:dev is up — port clash.

# Desktop Google sign-in opens the SYSTEM browser and returns via a localhost
# loopback. This EXACT redirect must be whitelisted in
# Supabase → Auth → URL Configuration → Redirect URLs, or sign-in hangs:
http://localhost:14256/auth/callback

# Employee gating needs the verify_current_employee + is_email_allowed RPCs in
# the target Supabase project — install them from
# https://sdk-components.thesqd.com/authentication.md