chore: Move Seer icons into the main list #93555
Conversation
github-actions
bot
added
the
Scope: Frontend
static/app/icons/iconSeer.tsx
Outdated
There was a problem hiding this comment.
Changed this file from the img on the left, to be the img on the right:
static/app/icons/index.tsx
Outdated
| @@ -94,6 +94,8 @@ export {IconResize} from './iconResize'; | |||
| export {IconRewind10} from './iconRewind10'; | |||
| export {IconSad} from './iconSad'; | |||
| export {IconSearch} from './iconSearch'; | |||
| export {IconSeer} from './iconSeer'; | |||
| export {IconSeerLoading, IconSeerWaiting} from './iconSeerLoading'; | |||
There was a problem hiding this comment.
@roaga can we make these icons something like <IconSeer state="loading|waiting"/>, or are they so different that they warrant separate icons?
There was a problem hiding this comment.
It's definitely doable that way. Not sure which approach is more semantically correct/aligns with how we want to organize icons, but I'm fine if y'all want to go with your suggestion
There was a problem hiding this comment.
Having a single seer icon would be preferable then. Note that we have a couple icons that have different states (loading, circled etc).
The main difference here is in terms of imports and discoverability.
<IconSeer variant={isLoading ? 'loading' : undefined} {...props} /> vs
// two places where you need to worry about props.
isLoading ? <IconSeerLoading {...props}/> : <IconSeer {...props/>A common problem with the latter is that if you use inline props, it's easy to forget to update them on all nodes (think size for example), but also adding new variants becomes more involved than you'd want, because you need to change the entire node. Having a single jsx node guides the developer to the correct outcome, which is a nice side effect of the API design.
There was a problem hiding this comment.
i'll merge all three and add the variant: undefined | 'loading' | 'waiting' prop
There was a problem hiding this comment.
@ryan953 Thank you! I'm going to approve this and we can tackle it in a separate PR btw, so it's easier to review and we can keep this PR only about moving seer to the icon set
There was a problem hiding this comment.
I just threw all the icon css into one file and updated the few callsites that use waiting and loading.
Also i updated the story file so each variation is rendered there... there's a video of the animations in the PR desc above.
The icons have little animations, and look like this:
Screen.Recording.2025-06-16.at.10.23.35.AM.mov