fix(user-home): add reference tab loading skeletons

assets/css/routes/user-home.css

@@ -516,6 +516,53 @@
     text-align: center;
 }
 
+.aksrt-user-home .dashboard-panel .uh-follow__list--placeholder {
+    display: none;
+}
+
+.aksrt-user-home .dashboard-panel.is-loading .uh-follow__list--placeholder {
+    display: block;
+}
+
+.aksrt-user-home .dashboard-panel.is-loading .uh-follow__subtabs,
+.aksrt-user-home .dashboard-panel.is-loading .uh-follow__list:not(.uh-follow__list--placeholder),
+.aksrt-user-home .dashboard-panel.is-loading .uh-pagination,
+.aksrt-user-home .dashboard-panel.is-loading .profile-empty {
+    display: none;
+}
+
+.aksrt-user-home .dashboard-panel.is-load-error .uh-follow__list--placeholder {
+    display: block;
+}
+
+.aksrt-user-home .uh-panel-load-error {
+    display: none;
+    margin: 12px 0;
+    color: var(--color-ink-4);
+    font-size: 13px;
+    text-align: center;
+    grid-column: 1 / -1;
+}
+
+.aksrt-user-home .dashboard-panel.is-load-error .uh-panel-load-error {
+    display: block;
+}
+
+.aksrt-user-home .uh-panel-load-error button {
+    margin-left: 8px;
+    padding: 0;
+    border: 0;
+    color: var(--color-primary);
+    background: transparent;
+    font: inherit;
+    cursor: pointer;
+}
+
+.aksrt-user-home .uh-follow__placeholder {
+    display: inline-flex;
+    margin: 5px 8px;
+}
+
 .aksrt-user-home .uh-follow__pagination {
     margin-top: 16px;
     text-align: center;
@@ -608,6 +655,21 @@
     animation: aksrtFadeIn 0.2s ease both;
 }
 
+.aksrt-user-home .dashboard-panel.is-load-error .post_ajax_loader {
+    display: block;
+}
+
+.aksrt-user-home .dashboard-panel.is-load-error .aksrt-user-home__post-list[data-view="list"] > .post_ajax_loader {
+    display: grid;
+    gap: 16px;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    align-items: start;
+}
+
+.aksrt-user-home .dashboard-panel.is-load-error .placeholder {
+    animation: none;
+}
+
 @media (prefers-reduced-motion: reduce) {
     .aksrt-user-home .dashboard-panel .post_ajax_loader .placeholder {
         animation: none;

assets/js/author.js

@@ -97,6 +97,7 @@
           trigger.setAttribute('aria-busy', 'true');
           trigger.textContent = '加载中…';
         }
+        panel.classList.remove('is-load-error');
         panel.classList.add('is-loading');
 
         var url = restBase.replace(/\/$/, '') + '/user-home/panel/' + userId + '/' + encodeURIComponent(name)
@@ -117,10 +118,14 @@
             } else {
               panel.innerHTML = payload.data.html;
             }
+            panel.dataset.panelLoaded = 'true';
             if (window.jQuery) jQuery(document).trigger('post_ajax.ed', [panel]);
             if (typeof window.auto_fun === 'function') window.auto_fun();
           });
         }).catch(function (error) {
+          if (panel.dataset.panelLoaded === 'false') {
+            panel.classList.add('is-load-error');
+          }
           if (appendComments && trigger && trigger.isConnected) {
             trigger.disabled = false;
             trigger.removeAttribute('aria-busy');
@@ -141,7 +146,12 @@
 
       tabs.forEach(function (tab) {
         tab.addEventListener('click', function () {
-          switchTo(tab.getAttribute('data-tab'));
+          var name = tab.getAttribute('data-tab');
+          switchTo(name);
+          var panel = panels[name] && panels[name].panel;
+          if (panel && panel.dataset.panelLoaded === 'false') {
+            loadPanelBody(panel, name, 1, 'followers').catch(notifyLoadError);
+          }
         });
       });
 
@@ -161,6 +171,17 @@
           return;
         }
 
+        var retryBtn = target.closest('[data-uh-retry]');
+        if (retryBtn) {
+          event.preventDefault();
+          var retryPanel = retryBtn.closest('.dashboard-panel');
+          if (!retryPanel) return;
+          var retryName = panelNameOf(retryPanel);
+          if (!retryName) return;
+          loadPanelBody(retryPanel, retryName, 1, 'followers').catch(notifyLoadError);
+          return;
+        }
+
         var commentsNext = target.closest('[data-uh-comments-next]');
         if (commentsNext) {
           event.preventDefault();