Use the same default spinner style for both Tile and List

The tile placeholder method didn't work well because the component doesn't know how big the page size is, so we always end up rendering 1 placeholder tile, followed by N (= page size) placeholders (if not yet resolved). It's pretty ugly.

Removed comments:
- Incorrect/misleading: "injected item" does not mean "ads". It can be any React component that you want to put at a specific index.
- Redundant: don't explain the syntax. It's very annoying having to maintain the comment when the logic changes.

ui/component/claimList/view.jsx

@@ -100,9 +100,8 @@ export default function ClaimList(props: Props) {
 
   const [currentSort, setCurrentSort] = usePersistedState(persistedStorageKey, SORT_NEW);
 
-  // reference to the claim-grid
+  // Resolve the index for injectedItem, if provided; else injectedIndex will be 'undefined'.
   const listRef = React.useRef();
-  // determine the index where the ad should be injected
   const injectedIndex = useLastVisibleItem(injectedItem, listRef);
 
   // Exclude prefix uris in these results variables. We don't want to show
@@ -149,7 +148,6 @@ export default function ClaimList(props: Props) {
   }, []);
 
   // @if process.env.NODE_ENV!='production'
-  // code to enable replacing of a claim tile isn't available here yet
   if (injectedItem && injectedItem.replace) {
     throw new Error('claimList: "injectedItem.replace" is not implemented yet');
   }
@@ -201,7 +199,6 @@ export default function ClaimList(props: Props) {
     />
   );
 
-  // returns injected ad DOM when indexes match
   const getInjectedItem = (index) => {
     if (injectedItem && injectedItem.node && injectedIndex === index) {
       return injectedItem.node;
@@ -210,12 +207,12 @@ export default function ClaimList(props: Props) {
   };
 
   return tileLayout && !header ? (
+    <>
       <section ref={listRef} className={classnames('claim-grid', { 'swipe-list': swipeLayout })}>
         {urisLength > 0 &&
           tileUris.map((uri, index) => (
             <React.Fragment key={uri}>
               {getInjectedItem(index)}
-            {/* inject ad node */}
               <ClaimPreviewTile
                 uri={uri}
                 showHiddenByUser={showHiddenByUser}
@@ -226,10 +223,15 @@ export default function ClaimList(props: Props) {
               />
             </React.Fragment>
           ))}
-      {loading && useLoadingSpinner && <ClaimPreviewTile placeholder="loading" swipeLayout={swipeLayout} />}
         {!timedOut && urisLength === 0 && !loading && <div className="empty main--empty">{empty || noResultMsg}</div>}
         {timedOut && timedOutMessage && <div className="empty main--empty">{timedOutMessage}</div>}
       </section>
+      {loading && useLoadingSpinner && (
+        <div className="spinnerArea--centered">
+          <Spinner type="small" />
+        </div>
+      )}
+    </>
   ) : (
     <section
       className={classnames('claim-list', {