ssb: Show sync/stay connected options on the sidebar when relevant.

apps/ssb/tf-tab-news.js

@@ -26,6 +26,8 @@ class TfTabNewsElement extends LitElement {
 			private_messages: {type: Array},
 			recent_reactions: {type: Array},
 			peer_exchange: {type: Boolean},
+			is_administrator: {type: Boolean},
+			stay_connected: {type: Boolean},
 		};
 	}
 
@@ -174,10 +176,6 @@ class TfTabNewsElement extends LitElement {
 			.map((x) => x[0]);
 	}
 
-	refresh() {
-		tfrpc.rpc.sync();
-	}
-
 	async enable_peer_exchange() {
 		await tfrpc.rpc.globalSettingsSet('peer_exchange', true);
 		await this.check_peer_exchange();
@@ -196,6 +194,32 @@ class TfTabNewsElement extends LitElement {
 				>
 					×
 				</div>
+				${this.is_administrator
+					? html`
+							<button
+								class="w3-bar-item w3-button"
+								@click=${() =>
+									this.dispatchEvent(
+										new Event('refresh', {bubbles: true, composed: true})
+									)}
+							>
+								<span style="width: 1.5em; height: 1.5em; padding: 8px">↻</span>
+								Sync now
+							</button>
+							<button
+								class="w3-bar-item w3-button w3-ripple"
+								@click=${() =>
+									this.dispatchEvent(
+										new Event('toggle_stay_connected', {
+											bubbles: true,
+											composed: true,
+										})
+									)}
+							>
+								${this.stay_connected ? '🔗 Online mode' : '⛓️‍💥 Passive mode'}
+							</button>
+						`
+					: undefined}
 				${this.hash.startsWith('##') &&
 				this.channels.indexOf(this.hash.substring(2)) == -1
 					? html`
@@ -266,7 +290,10 @@ class TfTabNewsElement extends LitElement {
 								(this.connections?.some((x) => x.flags.one_shot)
 									? ' w3-spin'
 									: '')}
-								@click=${this.refresh}
+								@click=${() =>
+									this.dispatchEvent(
+										new Event('refresh', {bubbles: true, composed: true})
+									)}
 							>
 								↻ Sync now
 							</button>