1 files changed, 18 insertions, 1 deletions
diff --git a/packages/meshbay-hub/src/meshbay_hub/static/files-app.js b/packages/meshbay-hub/src/meshbay_hub/static/files-app.js
index 3d51e67..d2f0727 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/files-app.js
+++ b/packages/meshbay-hub/src/meshbay_hub/static/files-app.js
@@ -27,7 +27,7 @@ function FilesPanel({
   groupId, transportRef, gekRef, status,
   entries, nodeDirs, nodeRoots, setEntries, setNodeDirs, setNodeRoots, applyIndex,
   isNodeAdmin, operatorPaired, mayUpload, userId, setError, onPreview,
-  showGroup, readOnly, getTransport,
+  showGroup, readOnly, getTransport, onRefreshIndex,
 }) {
   const [selecting, setSelecting] = useState(false);
   const [selected, setSelected] = useState(() => new Set());
@@ -35,6 +35,16 @@ function FilesPanel({
   const [sortAsc, setSortAsc] = useState(true);
   const [filter, setFilter] = useState('');
   const [currentPath, setCurrentPath] = useState('');
+  const [refreshing, setRefreshing] = useState(false);
+
+  // Force a re-fetch of the group index from the node — the client's file
+  // list is a view over a cached copy, and there is no other way to pull a
+  // fresh one on demand.
+  const doRefresh = useCallback(async () => {
+    if (refreshing || !onRefreshIndex) return;
+    setRefreshing(true);
+    try { await onRefreshIndex(); } finally { setRefreshing(false); }
+  }, [refreshing, onRefreshIndex]);
 
   // A directory from the group just left rarely exists in the one just
   // entered (e.g. "outputs" in one group, absent in another) — Files would
@@ -329,6 +339,13 @@ function FilesPanel({
         </div>
 
         <div class="breadcrumbs">
+          ${onRefreshIndex && html`
+            <button class="crumb crumb-refresh ${refreshing ? 'spinning' : ''}"
+              onClick=${doRefresh} disabled=${refreshing}
+              title=${t('group.refresh_index')}>
+              <${Icon} name="refresh" />
+            </button>
+          `}
           <a class="crumb" onClick=${() => setCurrentPath('')}>
             <${Icon} name="home" />
           </a>