ssb: Add some UI for posting 'flag' messages.

apps/ssb.json

@@ -1,5 +1,5 @@
 {
 	"type": "tildefriends-app",
 	"emoji": "🦀",
-	"previous": "&7dPNAI4sffljUTiwGr3XEUeB8sBD72CFkWMk/o0Z2pw=.sha256"
+	"previous": "&gc8AmnXs6wU8P+wJo4Q49M0L0M5MrzUB7kWkhuiDBMU=.sha256"
 }

apps/ssb/tf-message.js

@@ -196,6 +196,26 @@ class TfMessageElement extends LitElement {
 		);
 	}
 
+	flag(event) {
+		let reason = prompt(
+			'What is the reason for reporting this content (spam, nsfw, ...)?',
+			'offensive'
+		);
+		if (reason !== undefined) {
+			tfrpc.rpc
+				.appendMessage(this.whoami, {
+					type: 'flag',
+					flag: {
+						link: this.message.id,
+						reason: reason.length ? reason : undefined,
+					},
+				})
+				.catch(function (error) {
+					alert(error?.message);
+				});
+		}
+	}
+
 	show_image(link) {
 		let div = document.createElement('div');
 		div.style.left = 0;
@@ -499,11 +519,14 @@ class TfMessageElement extends LitElement {
 								</button>
 							`
 						: undefined}
+					<button class="w3-button w3-bar-item" @click=${this.react}>
+						👍 React
+					</button>
 					<button
 						class="w3-button w3-bar-item w3-border-bottom"
-						@click=${this.react}
+						@click=${this.flag}
 					>
-						👍 React
+						⚠️ Flag
 					</button>
 					${formats.map(
 						([format, name]) => html`