Add org selection dropdown to org auth token button #7716
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
Since this is sadly hard to test on the preview 😬 Just to clarify
I like it! |
Correct! See sentry-docs/src/components/codeBlock.tsx Lines 214 to 218 in 4290615
Also correct! (See screenshot in PR description) |
|
Nice, that's what I figured but just to be extra clear :D Maybe @ArthurKnaus can also give it a review from a React perspective. From an outcome-perspective, I think this is great and will make this much more flexible to be used 🎉 |
src/components/codeBlock.tsx
Outdated
| | {status: 'none'} | ||
| | {status: 'loading'} | ||
| | {status: 'success'; token: string} | ||
| | {status: 'error'} |
There was a problem hiding this comment.
nit: I would probably define the type TokenState outside the component to keep the component cleaner 🤷
Same goes for the popper options.
src/components/codeBlock.tsx
Outdated
| const [isOpen, setIsOpen] = useState(false); | ||
| const [referenceEl, setReferenceEl] = useState<HTMLSpanElement>(null); | ||
| const [dropdownEl, setDropdownEl] = useState<HTMLElement>(null); | ||
| const {codeKeywords} = useContext(CodeContext); |
There was a problem hiding this comment.
nit: I would move the context subscription to the first line then it is easier to spot.
(as it is a dependency that component has)
src/components/codeBlock.tsx
Outdated
| codeKeywords?.PROJECT?.forEach(projectKeyword => { | ||
| orgSet.add(projectKeyword.ORG_SLUG); | ||
| }); | ||
| const orgs = [...orgSet]; |
There was a problem hiding this comment.
So it is clear further down the component that those are the slugs and not whole objects.
| const orgs = [...orgSet]; | |
| const orgSlugs = [...orgSet]; |
Co-authored-by: ArthurKnaus <[email protected]>
Added a dropdown to select an organization for the org auth token button. This should help make it more clear for which org a token is gonna be generated. Especially on pages where we don't have
___ORG_SLUG___or___PROJECT_SLUG___magic strings.Looks like this: