Help understanding actions and how to manage user session
I want to manage user sessions with firebase auth, how does it actually works? I'm new to SSR frameworks.
I want to make it such that my ViewWrapper ("server" I think) component redirects users to /login page, I know I can do auth.currentUser with firebase but that only works on the web client.
I was looking into actions in the docs wanting to get to know these patterns better so I can use them properly when required but I can't seem to make much sense on how to use actions in form components or how would I just get a login to work an create a cookie that allows my server components to check whether the user should be redirected to /login or not or just "what would be the correct way of making this work"
login:
const isLogin = action(async (data: FormData, event) => {
// validate login and create session cookie (i guess)
});
export default function signin() {
return (
<Wrapper>
<main class="w-full h-full flex justify-center items-center">
<form method="post" action={isLogin} class="flex flex-col justify-center gap-4 w-[350px] ">
<input class="input" type="email" name="user name" placeholder="email" />
<input class="input" type="password" name="password" placeholder="password" />
<input type="submit" name="submit" />
<button class="app-button app-button-secondary mt-4">Sign In</button>
</form>
</main>
</Wrapper>
);
}
Then the ViewWrapper:
const Wrapper = ({ children, secure }: { children: JSX.Element; secure?: boolean }) => {
const cookie = getCookie("not sure what event means", "session cookie?");
if (!cookie && secure) {
redirect("/signin");
}
return (
<div class="relative bg-gradient-to-br from-fuchsia-600 from-30% to-white-bone w-screen h-screen">
{children}
</div>
);
};2 Replies
Sidenote: I'm getting this TS compile error:
The general patterns are captured within the
with-auth example
Of course that doesn't use Firebase but there was a recent article about that:
- article
- repo.SolidJS Todo App with Firebase - Code.Build 💻
SolidJS Todo App with Firebase - Code.Build 💻
I figured SolidJS would be just like React, but it’s not. It’s way better. I had a few learning curves but got my app up and
GitHub
solid-start/examples/with-auth/src/lib/index.ts at 678d9acbc0bb669f...
SolidStart, the Solid app framework. Contribute to solidjs/solid-start development by creating an account on GitHub.