-
Notifications
You must be signed in to change notification settings - Fork 432
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
feat(sanity): request access flow #7248
Conversation
The latest updates on your projects. Learn more about Vercel for Git ↗︎
1 Skipped Deployment
|
No changes to documentation |
1ce879c
to
c330cd7
Compare
Component Testing Report Updated Aug 20, 2024 2:12 PM (UTC) ✅ All Tests Passed -- expand for details
|
9657fb4
to
7429aac
Compare
|
||
import {NotAuthenticatedScreen} from './NotAuthenticatedScreen' | ||
|
||
interface AccessRequest { |
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.
Not sure if this is where this type should go? I believe this will be the only screen to use it but would prefer to follow standard practice for codebase if applicable
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.
I think this seems sensible
} | ||
}) | ||
.catch((err) => { | ||
console.error(err) |
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.
Not sure if it's standard practice to send silent/handled errors to the console for the studio. In NotAuthenticatedScreen
it seemed like we just threw an error and crashed the studio if we saw one
Co-authored-by: Rico Kahler <[email protected]>
aef872f
to
3d2f3fe
Compare
* feat: create request access screen * refactor: readablity edits * feat: add submitting states and toasts * refactor: merge useEffect hook and update some comments * chore: add comment explaining the client access strategy * feat: update pending state copy and style * fix: remove eslint disable from AuthBoundary * revert: not authenticated screen text * fix: typo in comment * fix: bug in date check * fix: authboundary provider error, client config bug, and enter key to submit * fix: update text copy for NotAuthenticated * fix: remove toast for success message * fix: couple small ui tweaks * fix: revert muted text color * feat: add requestURL to project request payload * fix: copy changes, check for declined invite, error handling * fix: use date-fns, change copy if resubmitting a request * use ui-components for button/dialog * pnpm-lock * maxLength for text input for note * feat: limit note length, show char count * hide submit button when declined * remove dialog padding * use error responses for submission errors * pnpm-lock.yaml * pnpm-lock.yaml * optional chaining on err response object Co-authored-by: Rico Kahler <[email protected]> --------- Co-authored-by: svirs <[email protected]> Co-authored-by: Rico Kahler <[email protected]>
* feat: create request access screen * refactor: readablity edits * feat: add submitting states and toasts * refactor: merge useEffect hook and update some comments * chore: add comment explaining the client access strategy * feat: update pending state copy and style * fix: remove eslint disable from AuthBoundary * revert: not authenticated screen text * fix: typo in comment * fix: bug in date check * fix: authboundary provider error, client config bug, and enter key to submit * fix: update text copy for NotAuthenticated * fix: remove toast for success message * fix: couple small ui tweaks * fix: revert muted text color * feat: add requestURL to project request payload * fix: copy changes, check for declined invite, error handling * fix: use date-fns, change copy if resubmitting a request * use ui-components for button/dialog * pnpm-lock * maxLength for text input for note * feat: limit note length, show char count * hide submit button when declined * remove dialog padding * use error responses for submission errors * pnpm-lock.yaml * pnpm-lock.yaml * optional chaining on err response object Co-authored-by: Rico Kahler <[email protected]> --------- Co-authored-by: svirs <[email protected]> Co-authored-by: Rico Kahler <[email protected]>
Description
This PR introduces a new "Request Access" flow for non-authorized users trying to access a studio.
Link to project/issue in Linear
What to review
This PR redirects users to a new
RequestAccessScreen
component from theAuthBoundary
if the user is not authorized and they are not using thesanity
authentication provider. More information about this decision can be found here.On mount, the
RequestAccessScreen
component makes a call to the/access/requests/me
endpoint and checks if the user currently has a pending request for this project. If the user does, we show them a "request pending" state.If they do not, we show them the form to create a new access request with an optional note:
Once submitted, the user will see the "request pending" state and a toast message saying their request was submitted.
In the case where they have submitted too many requests in a certain period as defined by the backend, we show them a warning message after submitting.
In the case where there is an error fetching from the Access API, we fallback to the current
NotAuthenticatedScreen
.Testing
No automated tests were added for this screen, but testing can be done by running the code against the development studio while logged into a non-authorized account.
Notes for release
See section above for a description of the new flow. I do not believe any new documentation needs to be written for this feature.