change spinner

apps/app/src/components/Page/RevisionLoader.tsx

@@ -64,7 +64,7 @@ export const RevisionLoader = (props: RevisionLoaderProps): JSX.Element => {
     return (
       <div className="wiki">
         <div className="text-muted text-center">
-          <i className="fa fa-2x fa-spinner fa-pulse me-1"></i>
+          <span className="me-1"><LoadingSpinnerPulse /></span>
         </div>
       </div>
     );

apps/app/src/components/PageAccessoriesModal/PageAttachment.tsx

@@ -63,7 +63,7 @@ const PageAttachment = (): JSX.Element => {
     if (dataAttachments == null || inUseAttachmentsMap == null) {
       return (
         <div className="text-muted text-center">
-          <i className="fa fa-2x fa-spinner fa-pulse me-1"></i>
+          <span className="me-1"><LoadingSpinnerPulse /></span>
         </div>
       );
     }

apps/app/src/components/PageList/PageList.tsx

@@ -30,7 +30,7 @@ const PageList = (props: Props<IPageInfoForEntity>): JSX.Element => {
     return (
       <div className="wiki">
         <div className="text-muted text-center">
-          <i className="fa fa-2x fa-spinner fa-pulse me-1"></i>
+          <span className="me-1"><LoadingSpinnerPulse /></span>
         </div>
       </div>
     );

apps/app/src/components/SearchPage/SearchPageBase.tsx

@@ -181,7 +181,7 @@ const SearchPageBaseSubstance: ForwardRefRenderFunction<ISelectableAll & IReturn
           {/* Loading */}
           { pages == null && (
             <div className="mw-0 flex-grow-1 flex-basis-0 m-5 text-muted text-center">
-              <i className="fa fa-2x fa-spinner fa-pulse me-1"></i>
+              <span className="me-1"><LoadingSpinnerPulse /></span>
             </div>
           ) }
 

apps/app/src/components/TemplateModal/TemplateModal.tsx

@@ -186,7 +186,7 @@ const TemplateModalSubstance = (props: TemplateModalSubstanceProps): JSX.Element
 
             { isLoading && (
               <div className="h-100 d-flex justify-content-center align-items-center">
-                <i className="fa fa-2x fa-spinner fa-pulse text-muted mx-auto"></i>
+                <span className="mx-auto text-muted"><LoadingSpinnerPulse /></span>
               </div>
             ) }
 

packages/remark-attachment-refs/src/client/components/AttachmentList.tsx

@@ -43,7 +43,7 @@ export const AttachmentList = ({
     if (isLoading) {
       return (
         <div className="text-muted">
-          <i className="fa fa-spinner fa-pulse me-1"></i>
+          <span className="me-1"><LoadingSpinnerPulse /></span>
           <span className="attachment-refs-blink">{refsContext.toString()}</span>
         </div>
       );

packages/remark-lsx/src/client/components/Lsx.tsx

@@ -71,7 +71,7 @@ const LsxSubstance = React.memo(({
     return (
       <div className={`text-muted ${isLoading ? 'lsx-blink' : ''}`}>
         <small>
-          <i className="fa fa-spinner fa-pulse me-1"></i>
+          <span className="me-1"><LoadingSpinnerPulse /></span>
           {lsxContext.toString()}
         </small>
       </div>