SvelteKit Auth: Globally accessible browser client store & Svelte 5 syntax
Greetings!
I am developing a platform that will be used in my university for sharing educational materials between lecturers. I need some help with the browser client, because I have trouble figuring it out. So far, I have used AuthJS for authentication but I decided to entirely switch to supabase.
So far, in the documentation and other tutorials I have only seen the browser client being passed via the PageLoad Data
data of pages.
AuthJS had this super convenient store located in $page and it gave you access to its client anywhere. I would really like to be able to call the SignOut function e.g. from a Header.svelte component or similiar, because just passing it down via props will lead to prop drilling and bad code quality.
what's more the code in the official documentation seems to be using old Svelte 4 reactivity label
instead of Svelte 5's derived rune
7 Replies
This is also because it would've been great if I could access the global session from components, without having to propdrill a supabase client
Because Svelte 5 was just released the other day and many users are still using Svelte 4 reactivity label. You can create a PR to update this as its open source.
There is only prop drilling if you developed your app with plenty of props to be drilling down to. My Header sits directly in my
+layout.svelte so there is no prop drilling going on.I will make a PR in a second. Perhaps it would be a good idea to make it a tab and persist the older Svelte 4 syntax as well.
Do you think it's a bad idea to have a global store of the browser client by the way? Would that possibly lead to any security vulnerabilities? Thanks
did you make any progress with this s5 login system?
Seems like it is still using Svelte 4 syntax, I recently made a pr, can anyone check it? https://github.com/supabase/supabase/pull/31229
GitHub
fix(docs): update SvelteKit tutorial to use Svelte 5 syntax by oleg...
I have read the CONTRIBUTING.md file.
YES
What kind of change does this PR introduce?
Docs update
What is the current behavior?
Tutorial uses Svelte 4 syntax
What is the new behavior?
Tutorial uses...
can you send your pr as well? I also made one last month but it was never merged
Funny i was looking at the same thread rn to fix issues
I never made one because I already saw yours!
I will endorse it by commenting