diff --git a/bun.lockb b/bun.lockb
old mode 100644
new mode 100755
index 34b171d5..ddcf9900
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/src/components/AiChatInterface.tsx b/src/components/AiChatInterface.tsx
index 4a5d88ae..98032eed 100644
--- a/src/components/AiChatInterface.tsx
+++ b/src/components/AiChatInterface.tsx
@@ -10,6 +10,8 @@ import { Link, useLocation } from "wouter"
 import { useSnippet } from "@/hooks/use-snippet"
 import { Edit2 } from "lucide-react"
 import { SnippetLink } from "./SnippetLink"
+import { useGlobalStore } from "@/hooks/use-global-store"
+import { useSignIn } from "@/hooks/use-sign-in"
 
 export default function AIChatInterface({
   code,
@@ -19,8 +21,10 @@ export default function AIChatInterface({
   onStartStreaming,
   onStopStreaming,
   errorMessage,
+  disabled,
 }: {
   code: string
+  disabled?: boolean
   hasUnsavedChanges: boolean
   snippetId?: string | null
   onCodeChange: (code: string) => void
@@ -36,6 +40,8 @@ export default function AIChatInterface({
   const [currentCodeBlock, setCurrentCodeBlock] = useState<string | null>(null)
   const [location, navigate] = useLocation()
   const isStreamingRef = useRef(false)
+  const isLoggedIn = useGlobalStore((s) => Boolean(s.session))
+  const signIn = useSignIn()
 
   useEffect(() => {
     messagesEndRef.current?.scrollIntoView({ behavior: "smooth" })
@@ -159,12 +165,28 @@ export default function AIChatInterface({
             </Button>
           </div>
         )}
-        {messages.length === 0 && (
+        {messages.length === 0 && isLoggedIn && (
           <div className="text-gray-500 text-xl text-center pt-[30vh] flex flex-col items-center">
             <div>Submit a prompt to {snippet ? "edit!" : "get started!"}</div>
             <div className="text-6xl mt-4">↓</div>
           </div>
         )}
+        {!isLoggedIn && (
+          <div className="text-gray-500 text-xl text-center pt-[30vh] flex flex-col items-center">
+            <div>
+              Sign in use the AI chat or{" "}
+              <Link className="text-blue-500 underline" href="/quickstart">
+                use the regular editor
+              </Link>
+            </div>
+            <div className="mt-4 flex gap-2">
+              <Button onClick={() => signIn()}>Sign In</Button>
+              <Button onClick={() => signIn()} variant="outline">
+                Sign Up
+              </Button>
+            </div>
+          </div>
+        )}
         {messages.map((message, index) => (
           <AiChatMessage key={index} message={message} />
         ))}
@@ -176,6 +198,7 @@ export default function AIChatInterface({
             onClick={() => {
               addMessage(`Fix this error: ${errorMessage}`)
             }}
+            disabled={!isLoggedIn}
             className="mb-2 bg-green-50 hover:bg-green-100"
             variant="outline"
           >
@@ -191,7 +214,7 @@ export default function AIChatInterface({
         onSubmit={async (message: string) => {
           addMessage(message)
         }}
-        disabled={isStreaming}
+        disabled={isStreaming || !isLoggedIn}
       />
     </div>
   )
diff --git a/src/components/ChatInput.tsx b/src/components/ChatInput.tsx
index 7be92ae6..775627d5 100644
--- a/src/components/ChatInput.tsx
+++ b/src/components/ChatInput.tsx
@@ -44,6 +44,7 @@ export default function ChatInput({ onSubmit, disabled }: ChatInputProps) {
         type="submit"
         size="icon"
         className="absolute right-2 top-1/2 transform -translate-y-1/2 bg-blue-500 hover:bg-blue-600 text-white rounded-full"
+        disabled={disabled}
       >
         <ArrowUp className="h-5 w-5" />
       </Button>
diff --git a/src/components/CodeAndPreview.tsx b/src/components/CodeAndPreview.tsx
index 3c7b9ff6..787484ba 100644
--- a/src/components/CodeAndPreview.tsx
+++ b/src/components/CodeAndPreview.tsx
@@ -21,6 +21,9 @@ import { ErrorBoundary } from "react-error-boundary"
 import { ErrorTabContent } from "./ErrorTabContent"
 import { cn } from "@/lib/utils"
 import { PreviewContent } from "./PreviewContent"
+import { useGlobalStore } from "@/hooks/use-global-store"
+import { useUrlParams } from "@/hooks/use-url-params"
+import { getSnippetTemplate } from "@/lib/get-snippet-template"
 
 interface Props {
   snippet?: Snippet | null
@@ -28,18 +31,31 @@ interface Props {
 
 export function CodeAndPreview({ snippet }: Props) {
   const axios = useAxios()
+  const isLoggedIn = useGlobalStore((s) => Boolean(s.session))
+  const urlParams = useUrlParams()
+  const templateFromUrl = useMemo(
+    () => getSnippetTemplate(urlParams.template),
+    [],
+  )
   const defaultCode = useMemo(() => {
-    return decodeUrlHashToText(window.location.toString()) ?? snippet?.code
+    return (
+      decodeUrlHashToText(window.location.toString()) ??
+      snippet?.code ??
+      templateFromUrl.code
+    )
   }, [])
   const [code, setCode] = useState(defaultCode ?? "")
   const [dts, setDts] = useState("")
   const [showPreview, setShowPreview] = useState(true)
+  const snippetType: "board" | "package" | "model" | "footprint" =
+    snippet?.snippet_type ?? (templateFromUrl.type as any)
 
   useEffect(() => {
-    if (snippet?.code && !defaultCode) {
+    if (snippet?.code) {
       setCode(snippet.code)
     }
-  }, [snippet?.code])
+  }, [Boolean(snippet)])
+
   const { toast } = useToast()
 
   const {
@@ -50,7 +66,7 @@ export function CodeAndPreview({ snippet }: Props) {
     tsxRunTriggerCount,
   } = useRunTsx({
     code,
-    type: snippet?.snippet_type,
+    type: snippetType,
   })
   const qc = useQueryClient()
 
@@ -91,7 +107,7 @@ export function CodeAndPreview({ snippet }: Props) {
 
   const hasUnsavedChanges = snippet?.code !== code
 
-  if (!snippet) {
+  if (!snippet && isLoggedIn) {
     return <div>Loading...</div>
   }
 
@@ -100,6 +116,7 @@ export function CodeAndPreview({ snippet }: Props) {
       <EditorNav
         circuitJson={circuitJson}
         snippet={snippet}
+        snippetType={snippetType}
         code={code}
         isSaving={updateSnippetMutation.isLoading}
         hasUnsavedChanges={hasUnsavedChanges}
diff --git a/src/components/EditorNav.tsx b/src/components/EditorNav.tsx
index 8fda04a4..70aed5ec 100644
--- a/src/components/EditorNav.tsx
+++ b/src/components/EditorNav.tsx
@@ -33,6 +33,7 @@ import { cn } from "@/lib/utils"
 import { DownloadButtonAndMenu } from "./DownloadButtonAndMenu"
 import { TypeBadge } from "./TypeBadge"
 import { SnippetLink } from "./SnippetLink"
+import { useGlobalStore } from "@/hooks/use-global-store"
 
 export default function EditorNav({
   circuitJson,
@@ -42,11 +43,13 @@ export default function EditorNav({
   onTogglePreview,
   previewOpen,
   onSave,
+  snippetType,
   isSaving,
 }: {
+  snippet?: Snippet | null
   circuitJson: any
-  snippet: Snippet
   code: string
+  snippetType?: string
   hasUnsavedChanges: boolean
   previewOpen: boolean
   onTogglePreview: () => void
@@ -54,19 +57,30 @@ export default function EditorNav({
   onSave: () => void
 }) {
   const [, navigate] = useLocation()
+  const isLoggedIn = useGlobalStore((s) => Boolean(s.session))
   return (
     <nav className="flex items-center justify-between px-2 py-3 border-b border-gray-200 bg-white text-sm border-t">
       <div className="flex items-center space-x-1">
-        <SnippetLink snippet={snippet} />
-        <Link href={`/${snippet.name}`}>
-          <Button variant="ghost" size="icon" className="h-6 w-6 ml-1">
-            <OpenInNewWindowIcon className="h-3 w-3 text-gray-700" />
-          </Button>
-        </Link>
+        {snippet && (
+          <>
+            <SnippetLink snippet={snippet} />
+            <Link href={`/${snippet.name}`}>
+              <Button variant="ghost" size="icon" className="h-6 w-6 ml-1">
+                <OpenInNewWindowIcon className="h-3 w-3 text-gray-700" />
+              </Button>
+            </Link>
+          </>
+        )}
+        {!isLoggedIn && (
+          <div className="bg-orange-100 text-orange-700 py-1 px-2 text-xs opacity-70">
+            Not logged in, can't save
+          </div>
+        )}
         <Button
           variant="outline"
           size="sm"
           className={"h-6 px-2 text-xs"}
+          disabled={!snippet}
           onClick={onSave}
         >
           <Save className="mr-1 h-3 w-3" />
@@ -97,25 +111,25 @@ export default function EditorNav({
             Saving...
           </div>
         )}
-        {hasUnsavedChanges && !isSaving && (
+        {hasUnsavedChanges && !isSaving && isLoggedIn && (
           <div className="animate-fadeIn bg-yellow-100 text-yellow-800 text-xs font-medium px-2.5 py-0.5 rounded">
             unsaved changes
           </div>
         )}
       </div>
       <div className="flex items-center space-x-1">
-        {snippet && <TypeBadge type={snippet.snippet_type} />}
+        {snippet && <TypeBadge type={snippetType ?? snippet.snippet_type} />}
         <Button
           variant="ghost"
           size="sm"
-          disabled={hasUnsavedChanges || isSaving}
-          onClick={() => navigate(`/ai?snippet_id=${snippet.snippet_id}`)}
+          disabled={hasUnsavedChanges || isSaving || !snippet}
+          onClick={() => navigate(`/ai?snippet_id=${snippet!.snippet_id}`)}
         >
           <Sparkles className="mr-1 h-3 w-3" />
           Edit with AI
         </Button>
         <DownloadButtonAndMenu
-          snippetUnscopedName={snippet.unscoped_name}
+          snippetUnscopedName={snippet?.unscoped_name}
           circuitJson={circuitJson}
           className="hidden md:flex"
         />
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 6ecd4091..ef350ee9 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -11,14 +11,16 @@ const HeaderButton = ({
   href,
   children,
   className,
+  alsoHighlightForUrl,
 }: {
   href: string
   children: React.ReactNode
   className?: string
+  alsoHighlightForUrl?: string
 }) => {
   const [location] = useLocation()
 
-  if (location === href) {
+  if (location === href || location === alsoHighlightForUrl) {
     return (
       <Button
         variant="ghost"
@@ -60,15 +62,17 @@ export default function Header() {
                 <HeaderButton href="/newest">Newest</HeaderButton>
               </li>
               <li>
-                <HeaderButton href="/quickstart">Editor</HeaderButton>
+                <HeaderButton href="/quickstart" alsoHighlightForUrl="/editor">
+                  Editor
+                </HeaderButton>
               </li>
               <li>
                 <HeaderButton href="/ai">AI</HeaderButton>
               </li>
               <li>
-                <Link href="https://docs.tscircuit.com">
+                <a href="https://docs.tscircuit.com">
                   <Button variant="ghost">Docs</Button>
-                </Link>
+                </a>
               </li>
             </ul>
           </nav>
@@ -127,6 +131,7 @@ export default function Header() {
                 <HeaderButton
                   className="w-full justify-start"
                   href="/quickstart"
+                  alsoHighlightForUrl="/editor"
                 >
                   Editor
                 </HeaderButton>
diff --git a/src/components/HeaderLogin.tsx b/src/components/HeaderLogin.tsx
index 29984f3c..57813f7a 100644
--- a/src/components/HeaderLogin.tsx
+++ b/src/components/HeaderLogin.tsx
@@ -13,6 +13,7 @@ import { useSnippetsBaseApiUrl } from "@/hooks/use-snippets-base-api-url"
 import { useGlobalStore } from "@/hooks/use-global-store"
 import { useAccountBalance } from "@/hooks/use-account-balance"
 import { useIsUsingFakeApi } from "@/hooks/use-is-using-fake-api"
+import { useSignIn } from "@/hooks/use-sign-in"
 
 interface HeaderLoginProps {}
 
@@ -23,6 +24,7 @@ export const HeaderLogin: React.FC<HeaderLoginProps> = () => {
   const setSession = useGlobalStore((s) => s.setSession)
   const snippetsBaseApiUrl = useSnippetsBaseApiUrl()
   const isUsingFakeApi = useIsUsingFakeApi()
+  const signIn = useSignIn()
   const { data: accountBalance } = useAccountBalance()
 
   if (!isLoggedIn) {
@@ -45,21 +47,10 @@ export const HeaderLogin: React.FC<HeaderLoginProps> = () => {
           </Button>
         ) : (
           <>
-            <Button
-              onClick={() => {
-                window.location.href = `${snippetsBaseApiUrl}/internal/oauth/github/authorize?next=${window.location.origin}/authorize`
-              }}
-              variant="ghost"
-              size="sm"
-            >
+            <Button onClick={() => signIn()} variant="ghost" size="sm">
               Login
             </Button>
-            <Button
-              size="sm"
-              onClick={() => {
-                window.location.href = `${snippetsBaseApiUrl}/internal/oauth/github/authorize?next=${window.location.origin}/authorize`
-              }}
-            >
+            <Button size="sm" onClick={() => signIn()}>
               Sign Up
             </Button>
           </>
diff --git a/src/components/PreviewContent.tsx b/src/components/PreviewContent.tsx
index 0942ebec..0fcd8488 100644
--- a/src/components/PreviewContent.tsx
+++ b/src/components/PreviewContent.tsx
@@ -51,7 +51,7 @@ export type PreviewContentProps =
 const PreviewEmptyState = ({
   triggerRunTsx,
 }: { triggerRunTsx: () => void }) => (
-  <div className="flex items-center gap-3 bg-gray-200 text-center justify-center py-10">
+  <div className="flex items-center gap-3 bg-gray-100 text-center justify-center py-10">
     No circuit json loaded
     <Button className="bg-blue-600 hover:bg-blue-500" onClick={triggerRunTsx}>
       Run Code
diff --git a/src/hooks/use-current-snippet-id.ts b/src/hooks/use-current-snippet-id.ts
index 3276cb27..ccd0e704 100644
--- a/src/hooks/use-current-snippet-id.ts
+++ b/src/hooks/use-current-snippet-id.ts
@@ -1,19 +1,17 @@
 import { useEffect, useRef, useState } from "react"
 import { useUrlParams } from "./use-url-params"
 import { useAxios } from "./use-axios"
-import { defaultCodeForBlankPage } from "@/lib/defaultCodeForBlankCode"
 import { useLocation, useParams } from "wouter"
 import { useMutation } from "react-query"
 import { useSnippetByName } from "./use-snippet-by-name"
-import { blankPackageTemplate } from "@/lib/templates/blank-package-template"
-import { blankFootprintTemplate } from "@/lib/templates/blank-footprint-template"
-import { blankCircuitBoardTemplate } from "@/lib/templates/blank-circuit-board-template"
-import { blank3dModelTemplate } from "@/lib/templates/blank-3d-model-template"
+import { getSnippetTemplate } from "@/lib/get-snippet-template"
+import { useGlobalStore } from "./use-global-store"
 
 export const useCurrentSnippetId = (): string | null => {
   const urlParams = useUrlParams()
   const urlSnippetId = urlParams.snippet_id
   const templateName = urlParams.template
+  const isLoggedIn = useGlobalStore((s) => Boolean(s.session))
   const wouter = useParams()
   const [location] = useLocation()
   const axios = useAxios()
@@ -25,25 +23,10 @@ export const useCurrentSnippetId = (): string | null => {
       : null,
   )
 
-  const getTemplate = (template: string | undefined) => {
-    switch (template) {
-      case "blank-circuit-module":
-        return blankPackageTemplate
-      case "blank-footprint":
-        return blankFootprintTemplate
-      case "blank-circuit-board":
-        return blankCircuitBoardTemplate
-      case "blank-3d-model":
-        return blank3dModelTemplate
-      default:
-        return { code: defaultCodeForBlankPage, type: "board" }
-    }
-  }
-
   const createSnippetMutation = useMutation({
     mutationKey: ["createSnippet"],
     mutationFn: async () => {
-      const template = getTemplate(templateName)
+      const template = getSnippetTemplate(templateName)
       const {
         data: { snippet },
       } = await axios.post("/snippets/create", {
@@ -70,6 +53,7 @@ export const useCurrentSnippetId = (): string | null => {
     if (location !== "/editor") return
     if (wouter?.author && wouter?.snippetName) return
     if ((window as any).AUTO_CREATED_SNIPPET) return
+    if (!isLoggedIn) return
     ;(window as any).AUTO_CREATED_SNIPPET = true
     createSnippetMutation.mutate()
     return () => {
diff --git a/src/hooks/use-sign-in.ts b/src/hooks/use-sign-in.ts
new file mode 100644
index 00000000..02eb2d66
--- /dev/null
+++ b/src/hooks/use-sign-in.ts
@@ -0,0 +1,21 @@
+import { useGlobalStore } from "./use-global-store"
+import { useIsUsingFakeApi } from "./use-is-using-fake-api"
+import { useSnippetsBaseApiUrl } from "./use-snippets-base-api-url"
+
+export const useSignIn = () => {
+  const snippetsBaseApiUrl = useSnippetsBaseApiUrl()
+  const isUsingFakeApi = useIsUsingFakeApi()
+  const setSession = useGlobalStore((s) => s.setSession)
+  return () => {
+    if (!isUsingFakeApi) {
+      window.location.href = `${snippetsBaseApiUrl}/internal/oauth/github/authorize?next=${window.location.origin}/authorize`
+    } else {
+      setSession({
+        account_id: "account-1234",
+        github_username: "testuser",
+        token: "1234",
+        session_id: "session-1234",
+      })
+    }
+  }
+}
diff --git a/src/lib/defaultCodeForBlankCode.tsx b/src/lib/defaultCodeForBlankCode.tsx
index a9552b26..933c7113 100644
--- a/src/lib/defaultCodeForBlankCode.tsx
+++ b/src/lib/defaultCodeForBlankCode.tsx
@@ -1,27 +1,7 @@
 export const defaultCodeForBlankPage = `
 export default () => (
   <board width="10mm" height="10mm">
-    <resistor
-      resistance="1k"
-      cadModel={{
-        objUrl:
-          "https://modelcdn.tscircuit.com/easyeda_models/download?pn=C2889342",
-      }}
-      footprint="0402"
-      name="R1"
-      pcbX={3}
-    />
-    <capacitor
-      capacitance="1000pF"
-      cadModel={{
-        objUrl:
-          "https://modelcdn.tscircuit.com/easyeda_models/download?pn=C2889342",
-      }}
-      footprint="0402"
-      name="C1"
-      pcbX={-3}
-    />
-    <trace from=".R1 > .pin1" to=".C1 > .pin1" />
+    {/* write your code here! */}
   </board>
 )
 `.trim()
diff --git a/src/lib/get-snippet-template.ts b/src/lib/get-snippet-template.ts
new file mode 100644
index 00000000..70ba8a82
--- /dev/null
+++ b/src/lib/get-snippet-template.ts
@@ -0,0 +1,20 @@
+import { blankPackageTemplate } from "@/lib/templates/blank-package-template"
+import { blankFootprintTemplate } from "@/lib/templates/blank-footprint-template"
+import { blankCircuitBoardTemplate } from "@/lib/templates/blank-circuit-board-template"
+import { blank3dModelTemplate } from "@/lib/templates/blank-3d-model-template"
+import { defaultCodeForBlankPage } from "@/lib/defaultCodeForBlankCode"
+
+export const getSnippetTemplate = (template: string | undefined) => {
+  switch (template) {
+    case "blank-circuit-module":
+      return blankPackageTemplate
+    case "blank-footprint":
+      return blankFootprintTemplate
+    case "blank-circuit-board":
+      return blankCircuitBoardTemplate
+    case "blank-3d-model":
+      return blank3dModelTemplate
+    default:
+      return { code: defaultCodeForBlankPage, type: "board" }
+  }
+}
diff --git a/src/pages/ai.tsx b/src/pages/ai.tsx
index 11f2e3b8..16a01c89 100644
--- a/src/pages/ai.tsx
+++ b/src/pages/ai.tsx
@@ -15,6 +15,7 @@ import { useSaveSnippet } from "@/hooks/use-save-snippet"
 import { useToast } from "@/hooks/use-toast"
 import { useSnippet } from "@/hooks/use-snippet"
 import { PreviewContent } from "@/components/PreviewContent"
+import { useGlobalStore } from "@/hooks/use-global-store"
 
 export const AiPage = () => {
   const [code, setCode] = useState("")