tasiaiso/tildefriends
1
0
Fork 0
forked from cory/tildefriends
Code Issues Pull Requests Releases Wiki Activity

ssb: Make the connections tab a bit less scary.

Browse Source
This commit is contained in:
Cory McWilliams 2025-02-27 20:04:38 -05:00
parent 8b47938238
commit f500e14aa3
2 changed files with 29 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/ssb.json
View File

@ -1,5 +1,5 @@
{ {
"type": "tildefriends-app", "type": "tildefriends-app",
"emoji": "🦀", "emoji": "🦀",
"previous": "&jAAzd36Nmpw0sRA1Dx9wLiIwGX+q//+S/Han+RLlEOw=.sha256" "previous": "&Qae0CxJGEH7OspuapuXX/GurmV+VBtQiMhHRmCBKCwU=.sha256"
} }

45
apps/ssb/tf-tab-connections.js
View File

@ -206,6 +206,23 @@ class TfTabConnectionsElement extends LitElement {
}); });
} }
toggle_accordian(id) {
let element = this.renderRoot.getElementById(id);
element.classList.toggle('w3-hide');
}
valid_connections() {
return this.connections.filter((x) => x.tunnel === undefined);
}
valid_broadcasts() {
return this.broadcasts
.filter((x) => x.address)
.filter(
(x) => this.connections.map((c) => c.id).indexOf(x.pubkey) == -1
);
}
render() { render() {
let self = this; let self = this;
return html` return html`
@ -220,27 +237,21 @@ class TfTabConnectionsElement extends LitElement {
> >
Connect Connect
</button> </button>
<h2>Broadcasts</h2> <h2 class="w3-button w3-block w3-theme-d1" @click=${() => self.toggle_accordian('connections')}>Connections (${this.valid_connections().length})</h2>
<ul class="w3-ul w3-border"> <ul class="w3-ul w3-border" id="connections">
${this.broadcasts ${this.valid_connections()
.filter((x) => x.address)
.filter(
(x) => self.connections.map((c) => c.id).indexOf(x.pubkey) == -1
)
.map((x) => self.render_broadcast(x))}
</ul>
<h2>Connections</h2>
<ul class="w3-ul w3-border">
${this.connections
.filter((x) => x.tunnel === undefined)
.map( .map(
(x) => html` (x) => html`
<li class="w3-bar">${this.render_connection(x)}</li> <li class="w3-bar">${this.render_connection(x)}</li>
` `
)} )}
</ul> </ul>
<h2>Stored Connections</h2> <h2 class="w3-button w3-block w3-theme-d1" @click=${() => self.toggle_accordian('broadcasts')}>Broadcasts (${this.valid_broadcasts().length})</h2>
<ul class="w3-ul w3-border"> <ul class="w3-ul w3-border w3-hide" id="broadcasts">
${this.valid_broadcasts().map((x) => self.render_broadcast(x))}
</ul>
<h2 class="w3-button w3-block w3-theme-d1" @click=${() => self.toggle_accordian('stored_connections')}>Stored Connections (${this.stored_connections.length})</h2>
<ul class="w3-ul w3-border w3-hide" id="stored_connections">
${this.stored_connections.map( ${this.stored_connections.map(
(x) => html` (x) => html`
<li> <li>
@ -267,8 +278,8 @@ class TfTabConnectionsElement extends LitElement {
` `
)} )}
</ul> </ul>
<h2>Local Accounts</h2> <h2 class="w3-button w3-block w3-theme-d1" @click=${() => self.toggle_accordian('local_accounts')}>Local Accounts (${this.identities.length})</h2>
<div class="w3-container"> <div class="w3-container w3-hide" id="local_accounts">
${this.identities.map( ${this.identities.map(
(x) => (x) =>
html`<div html`<div