feat: allow to disable auth during development (#21)

packages/bolt/README.md

@@ -37,10 +37,10 @@ VITE_LOG_LEVEL=debug
 ```
 
 If you want to run authentication against a local StackBlitz instance, add:
+
 ```
 VITE_CLIENT_ORIGIN=https://local.stackblitz.com:3000
 ```
-`
 
 **Important**: Never commit your `.env.local` file to version control. It's already included in .gitignore.
 

packages/bolt/app/components/chat/Chat.client.tsx

@@ -47,7 +47,7 @@ export function ChatImpl({ initialMessages, storeMessageHistory }: ChatProps) {
   const { messages, isLoading, input, handleInputChange, setInput, handleSubmit, stop, append } = useChat({
     api: '/api/chat',
     onError: (error) => {
-      logger.error(error);
+      logger.error('Request failed\n\n', error);
       toast.error('There was an error processing your request');
     },
     onFinish: () => {

packages/bolt/app/components/header/Header.tsx

@@ -1,6 +1,6 @@
 import { ClientOnly } from 'remix-utils/client-only';
-import { OpenStackBlitz } from './OpenStackBlitz.client';
 import { IconButton } from '~/components/ui/IconButton';
+import { OpenStackBlitz } from './OpenStackBlitz.client';
 
 export function Header() {
   return (

packages/bolt/app/lib/.server/login.ts

@@ -1,12 +1,5 @@
-import { env } from 'node:process';
-import { isAuthenticated } from './sessions';
 import { json, redirect, type LoaderFunctionArgs } from '@remix-run/cloudflare';
-
+import { isAuthenticated } from './sessions';
-export function verifyPassword(password: string, cloudflareEnv: Env) {
-  const loginPassword = env.LOGIN_PASSWORD || cloudflareEnv.LOGIN_PASSWORD;
-
-  return password === loginPassword;
-}
 
 type RequestArgs = Pick<LoaderFunctionArgs, 'request' | 'context'>;
 
@@ -14,7 +7,7 @@ export async function handleAuthRequest<T extends RequestArgs>(args: T, body: ob
   const { request, context } = args;
   const { authenticated, response } = await isAuthenticated(request, context.cloudflare.env);
 
-  if (authenticated) {
+  if (authenticated || import.meta.env.VITE_DISABLE_AUTH) {
     return json(body, response);
   }
 
@@ -25,7 +18,7 @@ export async function handleWithAuth<T extends RequestArgs>(args: T, handler: (a
   const { request, context } = args;
   const { authenticated, response } = await isAuthenticated(request, context.cloudflare.env);
 
-  if (authenticated) {
+  if (authenticated || import.meta.env.VITE_DISABLE_AUTH) {
     const handlerResponse = await handler(args);
 
     if (response) {

packages/bolt/app/lib/.server/sessions.ts

@@ -1,7 +1,7 @@
 import { createCookieSessionStorage, redirect } from '@remix-run/cloudflare';
 import { decodeJwt } from 'jose';
-import { request as doRequest } from '~/lib/fetch';
 import { CLIENT_ID, CLIENT_ORIGIN } from '~/lib/constants';
+import { request as doRequest } from '~/lib/fetch';
 import { logger } from '~/utils/logger';
 
 const DEV_SESSION_SECRET = import.meta.env.DEV ? 'LZQMrERo3Ewn/AbpSYJ9aw==' : undefined;
@@ -33,7 +33,7 @@ export async function isAuthenticated(request: Request, env: Env) {
   try {
     data = await refreshToken(token);
   } catch {
-    // ignore
+    // we can ignore the error here because it's handled below
   }
 
   if (data != null) {

packages/bolt/app/routes/login.tsx

@@ -1,16 +1,16 @@
 import {
   json,
   redirect,
+  redirectDocument,
   type ActionFunctionArgs,
   type LoaderFunctionArgs,
-  redirectDocument,
 } from '@remix-run/cloudflare';
 import { useFetcher, useLoaderData } from '@remix-run/react';
 import { auth, type AuthAPI } from '@webcontainer/api';
 import { useEffect, useState } from 'react';
 import { createUserSession, isAuthenticated, validateAccessToken } from '~/lib/.server/sessions';
-import { request as doRequest } from '~/lib/fetch';
 import { CLIENT_ID, CLIENT_ORIGIN } from '~/lib/constants';
+import { request as doRequest } from '~/lib/fetch';
 import { logger } from '~/utils/logger';
 
 export async function loader({ request, context }: LoaderFunctionArgs) {
@@ -49,7 +49,7 @@ export async function action({ request, context }: ActionFunctionArgs) {
       throw await response.json();
     }
   } catch (error) {
-    logger.warn('Authentication failure');
+    logger.warn('Authentication failed');
     logger.warn(error);
 
     return json({ error: 'invalid-token' as const }, { status: 401 });
@@ -100,7 +100,6 @@ export default function Login() {
         <div>
           <h2 className="mt-6 text-center text-3xl font-extrabold text-gray-900">Login</h2>
         </div>
-
         {redirected ? 'Processing auth...' : <LoginForm />}
       </div>
     </div>
@@ -162,7 +161,6 @@ function LoginForm() {
       >
         {login?.kind === 'pending' ? 'Authenticating...' : 'Continue with StackBlitz'}
       </button>
-
       {login?.kind === 'error' && (
         <div>
           <h2>