==== Motivation
While the data is being fetched for display in the IP Info popup or box, we should show a loading state indicator to the user so they know they should wait for it.
==== Specs
|IP info popup loading state|IP Info box loading state|IP Info box data fetch error|IP Info box incomplete data|
|{F34551014,size=300}|{F34551017,size=300}|{F34551021,size=300}|{F34551033,size=300}
[Full design spec on Figma](https://www.figma.com/file/B4fwmRmzGkeIdQEkN2jaL5/IP-Info-Wireframe?node-id=710%3A427)
* The loading state for the popup shows up after the user has clicked the info button next to an IP and a request to fetch the data has been generated
* The loading state for the box shows up while the data is being fetched after the user has clicked the box to open it or when the user lands on the page and the box was already open
* If no data is found for the IP address, it results in an error: //There is no data for this IP address in our external data provider: Maxmind (GeoIP2)//
** If the box is collapsed, the error shows up on the right hand side: //Error loading data//
* If all the data for the IP is found, the loading state goes away and is replaced by the data: F34534727
* If some data fields are missing, those fields appear with an error: //Not available// while other fields appear populated
* Note: The loading state shimmer is built into OOUI.
==== Relevant links
* {T271670}
* Task for displaying API errors: {T263442}