DaOfficialWizard🧙
DaOfficialWizard🧙
PostsComments
SSolidJS
Created by DaOfficialWizard🧙 on 5/18/2024 in #support
Assistance with SolidStart and Supabase Auth in SSR
I solved this particular error - i had to create the frontend client in a different file entirely.
25 replies
SSolidJS
Created by DaOfficialWizard🧙 on 5/18/2024 in #support
Assistance with SolidStart and Supabase Auth in SSR
you're 100% correct - that was a lingering bit from old code 🙂
25 replies
SSolidJS
Created by DaOfficialWizard🧙 on 5/18/2024 in #support
Assistance with SolidStart and Supabase Auth in SSR
So, i must have to do something else.
25 replies
SSolidJS
Created by DaOfficialWizard🧙 on 5/18/2024 in #support
Assistance with SolidStart and Supabase Auth in SSR
No, that must not be it ... i am getting a Error: Module "node:async_hooks" has been externalized for browser compatibility. Cannot access "node:async_hooks.AsyncLocalStorage" in client code.
25 replies
SSolidJS
Created by DaOfficialWizard🧙 on 5/18/2024 in #support
Assistance with SolidStart and Supabase Auth in SSR
 server: {
        //preset: 'vercel',
        experimental: { asyncContext: true, openAPI: true },
    },
 server: {
        //preset: 'vercel',
        experimental: { asyncContext: true, openAPI: true },
    },
I have set this as my server in the app.config.ts
25 replies
SSolidJS
Created by DaOfficialWizard🧙 on 5/18/2024 in #support
Assistance with SolidStart and Supabase Auth in SSR
Now ... does this look right xD
25 replies
SSolidJS
Created by DaOfficialWizard🧙 on 5/18/2024 in #support
Assistance with SolidStart and Supabase Auth in SSR
This is what i have 🙂
25 replies
SSolidJS
Created by DaOfficialWizard🧙 on 5/18/2024 in #support
Assistance with SolidStart and Supabase Auth in SSR
export function createSupabaseBackendClient() {
    return createServerClient(process.env.SUPABASE_URL!, process.env.SUPABASE_SERVICE_KEY!, {
        cookies: {
            get: (key: string) => {
                // get the cookie value from the request
                return getCookie(key)
            },
            set: (key: string, value: string, options: CookieOptions) =>{
                // set the cookie value in the response
                setCookie(key, value, options)
            },
            remove: (key: string, options: CookieOptions) =>{
                // remove the cookie from the session
                deleteCookie(key, options)
            },
        },
    })
}
export function createSupabaseBackendClient() {
    return createServerClient(process.env.SUPABASE_URL!, process.env.SUPABASE_SERVICE_KEY!, {
        cookies: {
            get: (key: string) => {
                // get the cookie value from the request
                return getCookie(key)
            },
            set: (key: string, value: string, options: CookieOptions) =>{
                // set the cookie value in the response
                setCookie(key, value, options)
            },
            remove: (key: string, options: CookieOptions) =>{
                // remove the cookie from the session
                deleteCookie(key, options)
            },
        },
    })
}
import { createHandler, StartServer } from '@solidjs/start/server'
import { createSupabaseBackendClient } from '@src/server/db'

export default createHandler(() => {
    if (!global.supabaseClient) {
        global.supabaseClient = createSupabaseBackendClient()
    }
    return (
        <StartServer
            document={({ assets, children, scripts }) => (
                <html lang="en">
                    <head>
                        <meta charset="utf-8" />
                        <meta name="viewport" content="width=device-width, initial-scale=1" />
                        <link rel="icon" href="/favicon.ico" />
                        {assets}
                    </head>
                    <body>
                        <div id="app">{children}</div>
                        {scripts}
                    </body>
                </html>
            )}
        />
    )
})
import { createHandler, StartServer } from '@solidjs/start/server'
import { createSupabaseBackendClient } from '@src/server/db'

export default createHandler(() => {
    if (!global.supabaseClient) {
        global.supabaseClient = createSupabaseBackendClient()
    }
    return (
        <StartServer
            document={({ assets, children, scripts }) => (
                <html lang="en">
                    <head>
                        <meta charset="utf-8" />
                        <meta name="viewport" content="width=device-width, initial-scale=1" />
                        <link rel="icon" href="/favicon.ico" />
                        {assets}
                    </head>
                    <body>
                        <div id="app">{children}</div>
                        {scripts}
                    </body>
                </html>
            )}
        />
    )
})
25 replies
SSolidJS
Created by DaOfficialWizard🧙 on 5/18/2024 in #support
Assistance with SolidStart and Supabase Auth in SSR
The trouble i am running into - how do i setup the createServerClient override methods using the middleware strategy? I can grab the nativeEvent and pass that to the vinxi helpers - but that doesn't really help me setup the client? Should i construct the client inside the onRequest callback and then assign it to the global context? Is that possible? That seems silly ...
25 replies
SSolidJS
Created by DaOfficialWizard🧙 on 5/18/2024 in #support
Assistance with SolidStart and Supabase Auth in SSR
this sounds interesting, could you elaborate a bit? I am not seeing where i would assign the client to the module.
25 replies
SSolidJS
Created by DaOfficialWizard🧙 on 5/18/2024 in #support
Assistance with SolidStart and Supabase Auth in SSR
if however a new one is created for each request then matters could be considerably simpler)
Since the supabase/ssr package exposes the client as a singleton i think this can be achieved.
25 replies
SSolidJS
Created by DaOfficialWizard🧙 on 5/18/2024 in #support
Assistance with SolidStart and Supabase Auth in SSR
Thanks for your input @peerreynders - this is the conclusion that i've come to as well. I am just struggling with the implementation - being new to SolidStart it is not entirely clear to me what the flow is for middleware.
25 replies
SSolidJS
Created by DaOfficialWizard🧙 on 1/5/2024 in #support
Solid-UI The `border-border` class does not exist.
I have made an issue on the repo, and will close this support thread.
3 replies
SSolidJS
Created by DaOfficialWizard🧙 on 1/5/2024 in #support
Solid-UI The `border-border` class does not exist.
Note - i took the contents of ui.presets.js and i simply added them manually (then promptly removed that extraneous file) to my tailwind.config.ts file and the issue went away. Seems that there is an issue with the method of adding the presets to tailwind that causes the issue. I can not use solid-ui and daisyui along side each other - with a lot more granularity.
3 replies
SSolidJS
Created by DaOfficialWizard🧙 on 1/2/2024 in #support
Help with some JSX logic in Typescript on an Advanced Resizing Component
Tht way i am automatically bound. Haha, better than a wrapper tbh.
38 replies
SSolidJS
Created by DaOfficialWizard🧙 on 1/2/2024 in #support
Help with some JSX logic in Typescript on an Advanced Resizing Component
return (
        <div class="card h-auto pb-8 min-h-0">
            <aside
                ref={setSidebar}
                style={{
                    width: `${width()}px`,
                }}>
                <Resizer
                    ref={resizer}
                    side="right"
                    onResize={(clientY) => {
                        changeWidth(clientY)
                    }}>
                    {props.children}
                </Resizer>
            </aside>
        </div>
    )
return (
        <div class="card h-auto pb-8 min-h-0">
            <aside
                ref={setSidebar}
                style={{
                    width: `${width()}px`,
                }}>
                <Resizer
                    ref={resizer}
                    side="right"
                    onResize={(clientY) => {
                        changeWidth(clientY)
                    }}>
                    {props.children}
                </Resizer>
            </aside>
        </div>
    )
Just put the Resizer in the div i want to resize. That solved it. Duh.
38 replies