-
Notifications
You must be signed in to change notification settings - Fork 13
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[SolidJS-Tailwind] Implement authentication #734
Conversation
This pull request is automatically being deployed by Amplify Hosting (learn more). |
This pull request is automatically being deployed by Amplify Hosting (learn more). |
I'm hesitant about the bailing mechanism, trying to figure out if there's a more native way. |
resolve: { | ||
conditions: ['development', 'browser'], | ||
alias: { | ||
'node-fetch': 'isomorphic-fetch', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this makes octokit work in the browser
} | ||
|
||
setAuth({ token: token() }); | ||
navigate(sessionStorage.getItem('auth_return_path')); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
what happens if auth_return_path undefined and i am not sure what's happening here after token is stored.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can't hurt to implement a fallback, I'll add it 👍
The trick is to return the user to where they came from before going through the authentication loop.
const location = useLocation(); | ||
|
||
if (!authStore.isAuthenticated) { | ||
sessionStorage.setItem('auth_return_path', location.pathname); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
WHat's happening here? Why do we need to do this?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This way we know where we came from on Signin.jsx:22 . It helps us to return the user to their origin.
@@ -0,0 +1,6 @@ | |||
const ROUTES = { | |||
HOME: '/', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
we can make this like so also in other to distinguish auth required pages from others
HOME: {
path: '/',
requiresAuth: true,
}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
using Home as example.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
My idea was to split pages and routes. The page knows whether it needs authentication or not, the route is just the pointer to that page.
Maybe PATHS
is a better name for this constant?
#744 should be done at some point, cleaning up some of the mess created here. |
import { useNavigate } from '@solidjs/router'; | ||
|
||
const fetchToken = () => | ||
fetch('http://localhost:4000/api/auth/token', { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can you make this an ebvironment variable, other showcases do it that way http://api.starter.dev/api/
<main class="absolute bg-black text-gray-500 w-full h-full m-0 p-0 table"> | ||
<form class="p-64 block mx-auto mb-2"> | ||
<a | ||
href="http://localhost:4000/api/auth/signin?redirect_url=http%3A%2F%2Flocalhost%3A3000" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
same, env variable
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
how did we get this? http%3A%2F%2Flocalhost%3A3000
.rest.users.getAuthenticated() | ||
.then((response) => response.data); | ||
} catch { | ||
return Promise.resolve({}); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Promise.resolve or Promise.reject?
* setup: get branch caught up and ready for work * feat: refactored repository service and test * feat: refactor of user service and test * feat: updated user service spec * feat: created dashboard store files; updated global state files; renamed RepoState and updated all calls * attempt to fix issues with service updates; some refactoring and adjusting so app compiles * feat: added auth user data to auth state; updated nav component to use auth state * feat: adjusted auth call; fixed user call so home page loads * moved some user logic; still having reload issues and repo view issues * feat: got app working again! cleaned out console logs * rebased and fixed most files * fix broken tests * removed unused code * fix: fix pr comments and most tests * fix: fixed final broken unit test * fix: updated test; removed unused code in user effect; new user mapping file * add todo for refactor improvements; update authUser effect to use different rxjs operation Co-authored-by: LindaT <[email protected]>
* chore: repo card with story and test * fix comments * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]>
* chore: gist panel UI * fix coment * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]>
* chore(solidjs): remove example components * feat(solidjs): add signin page * refactor(solidjs): improve auth setup * feat(solidjs): pencil in auth flow * feat(solidjs): add example github communication * [Angular - NgRx - SCSS] 440: state & service refactor (#527) * setup: get branch caught up and ready for work * feat: refactored repository service and test * feat: refactor of user service and test * feat: updated user service spec * feat: created dashboard store files; updated global state files; renamed RepoState and updated all calls * attempt to fix issues with service updates; some refactoring and adjusting so app compiles * feat: added auth user data to auth state; updated nav component to use auth state * feat: adjusted auth call; fixed user call so home page loads * moved some user logic; still having reload issues and repo view issues * feat: got app working again! cleaned out console logs * rebased and fixed most files * fix broken tests * removed unused code * fix: fix pr comments and most tests * fix: fixed final broken unit test * fix: updated test; removed unused code in user effect; new user mapping file * add todo for refactor improvements; update authUser effect to use different rxjs operation Co-authored-by: LindaT <[email protected]> * feat(solidjs) - Create navigation header (#840) * fix(angular-apollo-tailwind): append protocol if missing from user url (#637) * fix(angular-apollo-tailwind): append protocol if missing from user url Refs: #591 * test(angular-apollo-tailwind): update with testcases Closes: #591 * chore: repo card with story and test (#737) * chore: repo card with story and test * fix comments * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * chore: gist panel UI (#741) * chore: gist panel UI * fix coment * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * chore(solidjs): remove example components * fixed comments, clean ups Co-authored-by: Linda Thompson <[email protected]> Co-authored-by: LindaT <[email protected]> Co-authored-by: Daian Scuarissi <[email protected]> Co-authored-by: Oluwakorede Cole <[email protected]> Co-authored-by: Jerry Hogan <[email protected]> Co-authored-by: Victor Chukwuebuka Umeh <[email protected]>
* chore(solidjs): remove example components * feat(solidjs): add signin page * refactor(solidjs): improve auth setup * feat(solidjs): pencil in auth flow * feat(solidjs): add example github communication * [Angular - NgRx - SCSS] 440: state & service refactor (#527) * setup: get branch caught up and ready for work * feat: refactored repository service and test * feat: refactor of user service and test * feat: updated user service spec * feat: created dashboard store files; updated global state files; renamed RepoState and updated all calls * attempt to fix issues with service updates; some refactoring and adjusting so app compiles * feat: added auth user data to auth state; updated nav component to use auth state * feat: adjusted auth call; fixed user call so home page loads * moved some user logic; still having reload issues and repo view issues * feat: got app working again! cleaned out console logs * rebased and fixed most files * fix broken tests * removed unused code * fix: fix pr comments and most tests * fix: fixed final broken unit test * fix: updated test; removed unused code in user effect; new user mapping file * add todo for refactor improvements; update authUser effect to use different rxjs operation Co-authored-by: LindaT <[email protected]> * feat(solidjs) - Create navigation header (#840) * fix(angular-apollo-tailwind): append protocol if missing from user url (#637) * fix(angular-apollo-tailwind): append protocol if missing from user url Refs: #591 * test(angular-apollo-tailwind): update with testcases Closes: #591 * chore: repo card with story and test (#737) * chore: repo card with story and test * fix comments * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * chore: gist panel UI (#741) * chore: gist panel UI * fix coment * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * chore(solidjs): remove example components * fixed comments, clean ups Co-authored-by: Linda Thompson <[email protected]> Co-authored-by: LindaT <[email protected]> Co-authored-by: Daian Scuarissi <[email protected]> Co-authored-by: Oluwakorede Cole <[email protected]> Co-authored-by: Jerry Hogan <[email protected]> Co-authored-by: Victor Chukwuebuka Umeh <[email protected]>
* in progress * chore: get all repos api * [Angular - NgRx - SCSS] 440: state & service refactor (#527) * setup: get branch caught up and ready for work * feat: refactored repository service and test * feat: refactor of user service and test * feat: updated user service spec * feat: created dashboard store files; updated global state files; renamed RepoState and updated all calls * attempt to fix issues with service updates; some refactoring and adjusting so app compiles * feat: added auth user data to auth state; updated nav component to use auth state * feat: adjusted auth call; fixed user call so home page loads * moved some user logic; still having reload issues and repo view issues * feat: got app working again! cleaned out console logs * rebased and fixed most files * fix broken tests * removed unused code * fix: fix pr comments and most tests * fix: fixed final broken unit test * fix: updated test; removed unused code in user effect; new user mapping file * add todo for refactor improvements; update authUser effect to use different rxjs operation Co-authored-by: LindaT <[email protected]> * feat(solidjs) - Create navigation header (#840) * fix(angular-apollo-tailwind): append protocol if missing from user url (#637) * fix(angular-apollo-tailwind): append protocol if missing from user url Refs: #591 * test(angular-apollo-tailwind): update with testcases Closes: #591 * chore: repo card with story and test (#737) * chore: repo card with story and test * fix comments * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * chore: gist panel UI (#741) * chore: gist panel UI * fix coment * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * [solidjs-pod] : Create component for search input and filter sort buttons (#831) * in progress * in progress * in progress, paused for now * chore: search filter sort component * fixed comments on icons * [solidjs-tailwinf] Add user profile card (#830) * [SolidJS-Tailwind] Implement authentication (#734) * chore(solidjs): remove example components * feat(solidjs): add signin page * refactor(solidjs): improve auth setup * feat(solidjs): pencil in auth flow * feat(solidjs): add example github communication * [Angular - NgRx - SCSS] 440: state & service refactor (#527) * setup: get branch caught up and ready for work * feat: refactored repository service and test * feat: refactor of user service and test * feat: updated user service spec * feat: created dashboard store files; updated global state files; renamed RepoState and updated all calls * attempt to fix issues with service updates; some refactoring and adjusting so app compiles * feat: added auth user data to auth state; updated nav component to use auth state * feat: adjusted auth call; fixed user call so home page loads * moved some user logic; still having reload issues and repo view issues * feat: got app working again! cleaned out console logs * rebased and fixed most files * fix broken tests * removed unused code * fix: fix pr comments and most tests * fix: fixed final broken unit test * fix: updated test; removed unused code in user effect; new user mapping file * add todo for refactor improvements; update authUser effect to use different rxjs operation Co-authored-by: LindaT <[email protected]> * feat(solidjs) - Create navigation header (#840) * fix(angular-apollo-tailwind): append protocol if missing from user url (#637) * fix(angular-apollo-tailwind): append protocol if missing from user url Refs: #591 * test(angular-apollo-tailwind): update with testcases Closes: #591 * chore: repo card with story and test (#737) * chore: repo card with story and test * fix comments * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * chore: gist panel UI (#741) * chore: gist panel UI * fix coment * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * chore(solidjs): remove example components * fixed comments, clean ups Co-authored-by: Linda Thompson <[email protected]> Co-authored-by: LindaT <[email protected]> Co-authored-by: Daian Scuarissi <[email protected]> Co-authored-by: Oluwakorede Cole <[email protected]> Co-authored-by: Jerry Hogan <[email protected]> Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * chore: updated amplify.yml file (#729) * chore: updated amplify.yml file * changed pnpm to npm * chore: workflow added (#745) * chore: workflow added * CI setup fixes and testing * CI setup fixes and testing * CI setup fixes and testing * tried everything but doesn't work, i think we have to merge this * auth token added to header * ..updates * ..updates * auth token added to header * fix file issues * CI adjustments * CI adjustments Co-authored-by: Linda Thompson <[email protected]> Co-authored-by: LindaT <[email protected]> Co-authored-by: Daian Scuarissi <[email protected]> Co-authored-by: Oluwakorede Cole <[email protected]> Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> Co-authored-by: Maarten Bicknese <[email protected]>
* chore: get gists api * updated gists api function * [Angular - NgRx - SCSS] 440: state & service refactor (#527) * setup: get branch caught up and ready for work * feat: refactored repository service and test * feat: refactor of user service and test * feat: updated user service spec * feat: created dashboard store files; updated global state files; renamed RepoState and updated all calls * attempt to fix issues with service updates; some refactoring and adjusting so app compiles * feat: added auth user data to auth state; updated nav component to use auth state * feat: adjusted auth call; fixed user call so home page loads * moved some user logic; still having reload issues and repo view issues * feat: got app working again! cleaned out console logs * rebased and fixed most files * fix broken tests * removed unused code * fix: fix pr comments and most tests * fix: fixed final broken unit test * fix: updated test; removed unused code in user effect; new user mapping file * add todo for refactor improvements; update authUser effect to use different rxjs operation Co-authored-by: LindaT <[email protected]> * feat(solidjs) - Create navigation header (#840) * fix(angular-apollo-tailwind): append protocol if missing from user url (#637) * fix(angular-apollo-tailwind): append protocol if missing from user url Refs: #591 * test(angular-apollo-tailwind): update with testcases Closes: #591 * chore: repo card with story and test (#737) * chore: repo card with story and test * fix comments * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * chore: gist panel UI (#741) * chore: gist panel UI * fix coment * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * [solidjs-pod] : Create component for search input and filter sort buttons (#831) * in progress * in progress * in progress, paused for now * chore: search filter sort component * fixed comments on icons * [solidjs-tailwinf] Add user profile card (#830) * [SolidJS-Tailwind] Implement authentication (#734) * chore(solidjs): remove example components * feat(solidjs): add signin page * refactor(solidjs): improve auth setup * feat(solidjs): pencil in auth flow * feat(solidjs): add example github communication * [Angular - NgRx - SCSS] 440: state & service refactor (#527) * setup: get branch caught up and ready for work * feat: refactored repository service and test * feat: refactor of user service and test * feat: updated user service spec * feat: created dashboard store files; updated global state files; renamed RepoState and updated all calls * attempt to fix issues with service updates; some refactoring and adjusting so app compiles * feat: added auth user data to auth state; updated nav component to use auth state * feat: adjusted auth call; fixed user call so home page loads * moved some user logic; still having reload issues and repo view issues * feat: got app working again! cleaned out console logs * rebased and fixed most files * fix broken tests * removed unused code * fix: fix pr comments and most tests * fix: fixed final broken unit test * fix: updated test; removed unused code in user effect; new user mapping file * add todo for refactor improvements; update authUser effect to use different rxjs operation Co-authored-by: LindaT <[email protected]> * feat(solidjs) - Create navigation header (#840) * fix(angular-apollo-tailwind): append protocol if missing from user url (#637) * fix(angular-apollo-tailwind): append protocol if missing from user url Refs: #591 * test(angular-apollo-tailwind): update with testcases Closes: #591 * chore: repo card with story and test (#737) * chore: repo card with story and test * fix comments * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * chore: gist panel UI (#741) * chore: gist panel UI * fix coment * fix coment Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * chore(solidjs): remove example components * fixed comments, clean ups Co-authored-by: Linda Thompson <[email protected]> Co-authored-by: LindaT <[email protected]> Co-authored-by: Daian Scuarissi <[email protected]> Co-authored-by: Oluwakorede Cole <[email protected]> Co-authored-by: Jerry Hogan <[email protected]> Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> * chore: updated amplify.yml file (#729) * chore: updated amplify.yml file * changed pnpm to npm * chore: workflow added (#745) * chore: workflow added * CI setup fixes and testing * CI setup fixes and testing * CI setup fixes and testing * tried everything but doesn't work, i think we have to merge this * ..updates * ..updates * ..updates * added auth token * added auth token Co-authored-by: Linda Thompson <[email protected]> Co-authored-by: LindaT <[email protected]> Co-authored-by: Daian Scuarissi <[email protected]> Co-authored-by: Oluwakorede Cole <[email protected]> Co-authored-by: Victor Chukwuebuka Umeh <[email protected]> Co-authored-by: Maarten Bicknese <[email protected]>
Implements: #693