Conversation
…penidconnect-playground into step-one-component
|
Preview URL https://openidconnect-dpr7mvnhr-okta.vercel.app |
…penidconnect-playground into step-one-component
|
Preview URL https://openidconnect-hvkljb5yd-okta.vercel.app |
|
Preview URL https://openidconnect-h6bjgd24h-okta.vercel.app |
|
Preview URL https://openidconnect-n2ays9elq-okta.vercel.app |
|
Preview URL https://openidconnect-gfeksz6p7-okta.vercel.app |
| onClick?: () => void; | ||
| }) => { | ||
| return ( | ||
| <button className={styles.button} onClick={onClick}> |
There was a problem hiding this comment.
add type="button" as this is not used to submit a form
| }; | ||
| interface CodeBlockProps { | ||
| title: string; | ||
| type: "request" | "json"; |
There was a problem hiding this comment.
"json" does not seem to be implemented, might be in a future PR?
| .code_block { | ||
| color: var(--color_fg_link); | ||
| font-feature-settings: 'liga' off, 'clig' off; | ||
| font-family: "Roboto Mono"; |
| </div> | ||
| {requestData.params.map((data, idx) => ( | ||
| <div key={idx} className={styles.code_line}> | ||
| <p className={styles.code_line_number}>{`0${idx + 2}`}</p> |
There was a problem hiding this comment.
Is a request always going to be less than 9 lines? Otherwise, this line numbering will break, eg, 09 , 010.
Implementing a helper function that adds padding might be a better solution:
const formatLineNumber = (num: number) => num.toString().padStart(2, '0');
<p className={styles.code_line_number}>{formatLineNumber(1)}</p>
...
<p className={styles.code_line_number}>{formatLineNumber(idx + 2)}</p>
(This will again break with 100 cause of the padding 2)
2 participants
By submitting a PR to this repository, you agree to the terms within the Auth0 Code of Conduct. Please see the contributing guidelines for how to create and submit a high-quality PR for this repo.
Description
The following PR adds the step one component, which shows the request that will be done to the Auth0 tenant. The changes include:
Screenshots
Desktop
Mobile
Desktop
Mobile
References
Link to Figma design
Testing
Checklist