adding loading spinner for watch visualization #35798
Conversation
bmcconaghy
added
Feature:Watcher
Team:Kibana Management
|
Pinging @elastic/es-ui |
There was a problem hiding this comment.
@bmcconaghy thanks for adding this! Left a couple comments, the one might be obsolete if the suggestion I mentioned around use_request works.
Also, nit, but I noticed EUI has a loading component for charts, EuiLoadingChart: https://elastic.github.io/eui/#/display/loading. What do you think about swapping the spinner out with this?
| timezone: getTimezone(), | ||
| }); | ||
| setIsLoading(true); | ||
| const { visualizeData } = (await getWatchVisualizationData(watch, visualizeOptions)) as any; |
There was a problem hiding this comment.
could you update getWatchVisualizationData in api.ts to use the use_request helper CJ added? I think that returns an isLoading prop.
There was a problem hiding this comment.
Got an error when I tried to do this. Punting for now.
| const WatchVisualizationUi = () => { | ||
| const { watch } = useContext(WatchContext); | ||
| const [watchVisualizationData, setWatchVisualizationData] = useState<any>({}); | ||
|
|
||
| const [isLoading, setIsLoading] = useState(false); |
There was a problem hiding this comment.
Should the initial state be true? Otherwise, I noticed the callout message flashes briefly before the spinner.
There was a problem hiding this comment.
yeah makes sense, fixed
💚 Build Succeeded |
|
@alisonelizabeth mind taking another look? |
💚 Build Succeeded |
This adds a loading spinner while the visualization loads. You can comment out the
setIsLoading(false);line to see what it looks like.