The goal of this ticket is to define how we want to load content in the search preview on mobile so that there is a visual indication that the content is loading.
The desktop preview loading is covered in T318951 and some of the desktop concept will also be applied to mobile with a few differences.
**Notes on interaction**
[x] Show the loading indicator in the beginning when we are still fetching information on whether the article has image or not. [[ https://www.figma.com/file/86M7oLZplSxXKwKJR59mIK/Special%3ASearch-on-Wikipedia?node-id=3472%3A50841 | Specs in Figma ]]
{F35848092}
[] When we are fetching information on whether the content for next card exist or not, show the loading icon after the card. [[ https://www.figma.com/file/86M7oLZplSxXKwKJR59mIK/Special%3ASearch-on-Wikipedia?node-id=3469%3A50780 | Specs in Figma ]]
{F35693246}
[] Each skeleton will have the [[ https://codepen.io/matthiasmullie/pen/eYKmQYm | animation ]] until the content is loaded in that card.
[] Load content in the order of the cards.
{F35693274}
[] The following cards in the preview will have the skeleton.
[] The size of the article image skeleton box will be the dimension of the image.
[x] The size of the wikidata skeleton box will be the size of the wikidata card which is predefined.[[ https://www.figma.com/file/86M7oLZplSxXKwKJR59mIK/Special%3ASearch-on-Wikipedia?node-id=3432%3A50470 | Specs in Figma ]]
{F35693259}
[] Images from commons will have skeleton boxes as per image dimensions. [[ https://www.figma.com/file/86M7oLZplSxXKwKJR59mIK/Special%3ASearch-on-Wikipedia?node-id=3455%3A51005 | Specs in Figma ]]
{F35693269}
[x] Show the skeleton cards only when we know that information exists. Show them as soon as we know the information for that card exists.
[x] The loading icon disappears once all the cards/skeletons are loaded.
[x] If there is no content, show the message as shown in the image below. [[ https://www.figma.com/file/86M7oLZplSxXKwKJR59mIK/Special%3ASearch-on-Wikipedia?node-id=3472%3A50938 | Specs in Figma ]]. This is a back up plan if we the AC in T320528 is not feasible: "Do not show arrow for the results that have no quick view.)information."
{F35848094}