formatted code according to project + minor update

Author: thomasbuilds

examples/with-solidstart/README.md

@@ -40,18 +40,18 @@ To ensure Web3-related logic runs only on the client, use the `clientOnly` utili
 1. **Client-Only Component** (e.g. for a component showing user balance)
 
    ```jsx
-   import { clientOnly } from "@solidjs/start/client";
+   import { clientOnly } from '@solidjs/start/client'
 
-   const ClientComponent = clientOnly(() => import("./ClientOnlyComponent"));
+   const ClientComponent = clientOnly(() => import('./ClientOnlyComponent'))
    ```
 
 2. **Client-Only Page** (e.g. for a `/swap` page)
    Add the following at the top of your route file to render the entire page on the client:
 
    ```jsx
-   import { clientOnly } from "@solidjs/start/client";
+   import { clientOnly } from '@solidjs/start/client'
 
-   export default clientOnly(async () => ({ default: MyPage }));
+   export default clientOnly(async () => ({ default: MyPage }))
    ```
 
 For more details, refer to the `clientOnly` [documentation](https://docs.solidjs.com/solid-start/reference/client/client-only#clientonly).

examples/with-solidstart/app.config.ts

@@ -1,7 +1,7 @@
-import { defineConfig } from "@solidjs/start/config";
-import tailwindcss from "@tailwindcss/vite";
+import { defineConfig } from '@solidjs/start/config'
+import tailwindcss from '@tailwindcss/vite'
 
 export default defineConfig({
-  server: { preset: "" }, // your deployment
+  server: { preset: '' }, // your deployment
   vite: { plugins: [tailwindcss()] }
-});
+})

examples/with-solidstart/package.json

@@ -3,8 +3,7 @@
   "scripts": {
     "dev": "vinxi dev --port 3001",
     "build": "vinxi build",
-    "start": "vinxi start",
-    "format": "prettier --write . --trailing-comma none"
+    "start": "vinxi start"
   },
   "dependencies": {
     "@solidjs/meta": "^0.29.4",
@@ -19,7 +18,6 @@
   },
   "devDependencies": {
     "@tailwindcss/vite": "^4.1.16",
-    "prettier": "^3.6.2",
     "tailwindcss": "^4.1.16"
   },
   "engines": {

examples/with-solidstart/src/app.css

@@ -1,4 +1,4 @@
-@import "tailwindcss";
+@import 'tailwindcss';
 
 #app {
   background-color: white;

examples/with-solidstart/src/app.tsx

@@ -1,21 +1,21 @@
-import { Suspense } from "solid-js";
-import { Router, type RouteDefinition } from "@solidjs/router";
-import { FileRoutes } from "@solidjs/start/router";
-import { MetaProvider } from "@solidjs/meta";
-import { querySession } from "./auth";
-import AuthProvider from "./auth/Provider";
-import Nav from "./components/Nav";
-import ErrorNotification from "./components/Error";
-import "./app.css";
+import { Suspense } from 'solid-js'
+import { Router, type RouteDefinition } from '@solidjs/router'
+import { FileRoutes } from '@solidjs/start/router'
+import { MetaProvider } from '@solidjs/meta'
+import { querySession } from './auth'
+import AuthProvider from './auth/Provider'
+import Nav from './components/Nav'
+import ErrorNotification from './components/Error'
+import './app.css'
 
 export const route: RouteDefinition = {
   preload: ({ location }) => querySession(location.pathname)
-};
+}
 
 export default function App() {
   return (
     <Router
-      root={(props) => (
+      root={props => (
         <MetaProvider>
           <AuthProvider>
             <Suspense>
@@ -29,5 +29,5 @@ export default function App() {
     >
       <FileRoutes />
     </Router>
-  );
+  )
 }

examples/with-solidstart/src/auth/Provider.tsx

@@ -1,105 +1,97 @@
-import { createEffect, createResource, on, type ParentProps } from "solid-js";
+import { createEffect, createResource, on, type ParentProps } from 'solid-js'
 import {
   useLocation,
   createAsync,
   useAction,
   useSearchParams
-} from "@solidjs/router";
-import injectedWallets from "@web3-onboard/injected-wallets";
-import { signOutAction, querySession } from "~/auth";
-import { sign, authWalletAction, addWalletAction } from "~/auth/web3";
-import useWeb3Onboard, { BASE_ID, load } from "~/web3";
-import Context from "./context";
+} from '@solidjs/router'
+import injectedWallets from '@web3-onboard/injected-wallets'
+import { signOutAction, querySession } from '~/auth'
+import { sign, authWalletAction, addWalletAction } from '~/auth/web3'
+import useWeb3Onboard, { BASE_ID, load } from '~/web3'
+import Context from './context'
 
 export default function AuthProvider(props: ParentProps) {
-  const location = useLocation();
-  const [searchParams, setSearchParams] = useSearchParams();
+  const location = useLocation()
+  const [searchParams, setSearchParams] = useSearchParams()
   const session = createAsync(() => querySession(location.pathname), {
     deferStream: true
-  });
+  })
 
-  const authWallet = useAction(authWalletAction);
-  const addWallet = useAction(addWalletAction);
-  const signOut = useAction(signOutAction);
-  const signedIn = () => Boolean(session()?.id);
+  const authWallet = useAction(authWalletAction)
+  const addWallet = useAction(addWalletAction)
+  const signOut = useAction(signOutAction)
+  const signedIn = () => Boolean(session()?.id)
 
   const onboard = useWeb3Onboard({
     wallets: [injectedWallets()],
     connect: { autoConnectLastWallet: true },
     chains: [{ id: BASE_ID }],
     appMetadata: {
-      name: "SolidStart",
-      description: "SolidStart web3-onboard template",
-      icon: "favicon.svg"
+      name: 'SolidStart',
+      description: 'SolidStart web3-onboard template',
+      icon: 'favicon.svg'
     }
-  });
+  })
 
   createResource(
-    () => searchParams.login === "true" && !signedIn() && onboard,
-    async (instance) => {
+    () => searchParams.login === 'true' && !signedIn() && onboard,
+    async instance => {
       try {
-        const [wallet] = await instance.connectWallet();
-        if (!wallet?.provider) throw new Error("Wallet connection failed");
-        const address = await sign(wallet.provider);
-        const r = searchParams.redirect;
-        await authWallet(address, Array.isArray(r) ? r[0] : r);
+        const [wallet] = await instance.connectWallet()
+        if (!wallet?.provider) throw new Error('Wallet connection failed')
+        const address = await sign(wallet.provider)
+        const r = searchParams.redirect
+        await authWallet(address, Array.isArray(r) ? r[0] : r)
       } catch (err) {
         setSearchParams({
-          error: err instanceof Error ? err.message : "",
-          login: ""
-        });
+          error: err instanceof Error ? err.message : '',
+          login: ''
+        })
       }
     }
-  );
+  )
 
   const [web3] = createResource(
     onboard?.connectedWallet,
     async ({ provider }) => {
       if (onboard!.connectedChain().id !== BASE_ID)
-        await onboard!.setChain({ chainId: BASE_ID });
-      return load(provider);
+        await onboard!.setChain({ chainId: BASE_ID })
+      return load(provider)
     }
-  );
+  )
 
   createEffect(
     on(
       () => onboard?.walletAddress(),
       async (current, previous) => {
-        const saved = session()?.wallets;
-        if (!saved?.length || !previous) return;
-        if (!current) await signOut();
+        const saved = session()?.wallets
+        if (!saved?.length || !previous) return
+        if (!current) await signOut()
         if (current && current !== previous) {
           try {
-            const { provider } = onboard!.connectedWallet();
-            const addr = current.toLowerCase();
-            const verified = saved.includes(addr) ? addr : await sign(provider);
-            await addWallet(verified);
+            const { provider } = onboard!.connectedWallet()
+            const addr = current.toLowerCase()
+            const verified = saved.includes(addr) ? addr : await sign(provider)
+            await addWallet(verified)
           } catch (err) {
-            setSearchParams({ error: err instanceof Error ? err.message : "" });
+            setSearchParams({ error: err instanceof Error ? err.message : '' })
           }
         }
       },
       { defer: true }
     )
-  );
+  )
 
   const logout = async () => {
-    try {
-      const wallet = onboard?.connectedWallet();
-      if (wallet) {
-        await onboard!.disconnectWallet({ label: wallet.label });
-      }
-    } finally {
-      await signOut();
-    }
-  };
-  };
-
-   return (
+    const wallet = onboard?.connectedWallet()
+    if (wallet) await onboard!.disconnectWallet({ label: wallet.label })
+    return signOut()
+  }
 
   return (
     <Context.Provider value={{ session, signedIn, logout, web3 }}>
       {props.children}
     </Context.Provider>
-  );
+  )
 }

examples/with-solidstart/src/auth/context.ts

@@ -1,13 +1,13 @@
-import { createContext, type Resource } from "solid-js";
-import type { AccessorWithLatest } from "@solidjs/router";
-import type { Session } from "~/auth/server";
-import type { Web3 } from "~/web3";
+import { createContext, type Resource } from 'solid-js'
+import type { AccessorWithLatest } from '@solidjs/router'
+import type { Session } from '~/auth/server'
+import type { Web3 } from '~/web3'
 
 interface Context {
-  session: AccessorWithLatest<Session | undefined>;
-  signedIn: () => boolean;
-  logout: () => Promise<never>;
-  web3: Resource<Web3>;
+  session: AccessorWithLatest<Session | undefined>
+  signedIn: () => boolean
+  logout: () => Promise<never>
+  web3: Resource<Web3>
 }
 
-export default createContext<Context>();
+export default createContext<Context>()

examples/with-solidstart/src/auth/index.ts

@@ -1,34 +1,33 @@
-import { useContext } from "solid-js";
-import { query, redirect, action } from "@solidjs/router";
-import { getSession } from "./server";
-import context from "./context";
+import { useContext } from 'solid-js'
+import { query, redirect, action } from '@solidjs/router'
+import { getSession } from './server'
+import context from './context'
 
-const PROTECTED_ROUTES = ["/"];
+const PROTECTED_ROUTES = ['/']
 
 export const protectedRoute = (path: string) =>
-  PROTECTED_ROUTES.some((route) =>
-    route.endsWith("/*")
+  PROTECTED_ROUTES.some(route =>
+    route.endsWith('/*')
       ? path.startsWith(route.slice(0, -2))
-      : path === route || path.startsWith(route + "/")
-  );
+      : path === route || path.startsWith(route + '/')
+  )
 
 export const querySession = query(async (path: string) => {
-  "use server";
-  const { data: session } = await getSession();
-  if (session.wallets?.length) return session;
-  if (protectedRoute(path))
-    throw redirect("/about?login=true&redirect=" + path);
-}, "querySession");
+  'use server'
+  const { data: session } = await getSession()
+  if (session.wallets?.length) return session
+  if (protectedRoute(path)) throw redirect('/about?login=true&redirect=' + path)
+}, 'querySession')
 
 export const signOutAction = action(async () => {
-  "use server";
-  const session = await getSession();
-  await session.update({ wallets: undefined });
-  throw redirect("/about", { revalidate: querySession.key });
-});
+  'use server'
+  const session = await getSession()
+  await session.update({ wallets: undefined })
+  throw redirect('/about', { revalidate: querySession.key })
+})
 
 export default function useAuth() {
-  const ctx = useContext(context);
-  if (!ctx) throw new Error("useAuth must be used within AuthProvider");
-  return ctx;
+  const ctx = useContext(context)
+  if (!ctx) throw new Error('useAuth must be used within AuthProvider')
+  return ctx
 }

examples/with-solidstart/src/auth/server.ts

@@ -1,31 +1,22 @@
-import { redirect } from "@solidjs/router";
-import { useSession } from "vinxi/http";
+import { redirect } from '@solidjs/router'
+import { useSession } from 'vinxi/http'
 
 export interface Session {
-  id: number | undefined;
-  wallets: string[] | undefined;
+  id: number | undefined
+  wallets: string[] | undefined
 }
 
 export const getSession = () =>
-  useSession<Session>({
-    name: "session",
-    password: process.env.SESSION_SECRET!,
-    cookie: {
-      secure: true,
-      sameSite: "lax",
-      expires: new Date(Date.now() + 1000 * 60 * 60 * 24 * 7),
-      httpOnly: true
-    }
-  });
+  useSession<Session>({ password: process.env.SESSION_SECRET! })
 
 export const updateSession = async (wallets: string[], id?: number) => {
-  const session = await getSession();
+  const session = await getSession()
   const { data } = await session.update(() => ({
     id: id || session.data.id,
     wallets
-  }));
-  return data as Session;
-};
+  }))
+  return data as Session
+}
 
 export const safeRedirect = (url?: string) =>
-  redirect(url?.startsWith("/") && !url.startsWith("//") ? url : "/");
+  redirect(url?.startsWith('/') && !url.startsWith('//') ? url : '/')