Better handling of failures

Some mastodon instances are getting hit hard

src/pages/home.jsx

@@ -276,7 +276,19 @@ function Home({ hidden }) {
               </ul>
             )}
             {uiState === 'error' && (
-              <p class="ui-state">Error loading statuses</p>
+              <p class="ui-state">
+                Unable to load statuses
+                <br />
+                <br />
+                <button
+                  type="button"
+                  onClick={() => {
+                    loadStatuses(true);
+                  }}
+                >
+                  Try again
+                </button>
+              </p>
             )}
           </>
         )}

src/pages/notifications.jsx

@@ -402,7 +402,14 @@ function Notifications() {
               </>
             )}
             {uiState === 'error' && (
-              <p class="ui-state">Error loading notifications</p>
+              <p class="ui-state">
+                Unable to load notifications
+                <br />
+                <br />
+                <button type="button" onClick={() => loadNotifications(true)}>
+                  Try again
+                </button>
+              </p>
             )}
           </>
         )}

src/pages/status.jsx

@@ -103,7 +103,6 @@ function StatusPage({ id }) {
         } catch (e) {
           console.error(e);
           setUIState('error');
-          alert('Error fetching status');
           return;
         }
       }
@@ -345,6 +344,7 @@ function StatusPage({ id }) {
             </Link>
           </div>
         </header>
+        {!!statuses.length && heroStatus ? (
           <ul
             class={`timeline flat contextual grow ${
               uiState === 'loading' ? 'loading' : ''
@@ -453,6 +453,32 @@ function StatusPage({ id }) {
               </li>
             )}
           </ul>
+        ) : (
+          <>
+            {uiState === 'loading' && (
+              <ul class="timeline flat contextual grow loading">
+                <li>
+                  <Status skeleton size="l" />
+                </li>
+              </ul>
+            )}
+            {uiState === 'error' && (
+              <p class="ui-state">
+                Unable to load status
+                <br />
+                <br />
+                <button
+                  type="button"
+                  onClick={() => {
+                    states.reloadStatusPage++;
+                  }}
+                >
+                  Try again
+                </button>
+              </p>
+            )}
+          </>
+        )}
       </div>
     </div>
   );