Add server-wide and user-only federation controls (#133)

### Description

Completes #122

### Please confirm

- [x] I am the legal owner or represent the legal owner of all work submitted (including LLM-generated code, if any)
- [x] I consent to my changes being added to this FOSS project
- [x] I have confirmed that this does not add new errors or warnings with `utils/clippy.sh`
- [ ] This PR used LLMs to generate some or all of the code changes

Reviewed-on: https://git.ngram.ca/OpenJam/rc-servers/pulls/133

assets/templates/rc_society/dashboard.html.hbs

@@ -200,10 +200,18 @@
       <div class="access-box">
         <h4 class="access-box-title">Federation</h4>
         <div class="box-details">
-          <div class="box-details-key">TODO</div> <!-- TODO -->
-          <div class="box-details-value">TODO</div>
+          <div class="box-details-key">Enabled</div>
+          <div class="box-details-value">{{form.fediverse.enabled}}</div>
+          <div class="box-details-key">Blocked</div>
+          <div class="box-details-value">
+            {{#each form.fediverse.defederated}}
+              <span>{{this}}</span><br/>
+            {{else}}
+              <span>[None]</span>
+            {{/each}}
+          </div>
         </div>
-        <a href="#"> <!-- TODO -->
+        <a href="/federation/list"> <!-- TODO -->
           <div class="access-box-banner">
             Manage My Federation
           </div>

assets/templates/rc_society/garage_import.html.hbs

@@ -50,7 +50,7 @@
         {{else}}
           <input type="hidden" id="garage_id" name="garage_id" value="-1"/>
         {{/if}}
-        <div class="access-row-box">
+        <div class="access-row-box access-row-box-input">
           <label>Import with</label>
           <select id="plugin" name="plugin" required>
             {{#each form.importers}}
@@ -58,11 +58,11 @@
             {{/each}}
           </select>
         </div>
-        <div class="access-row-box">
-          <input type="file" id="files" name="files" required {{#if form.garage}} {{else}}multiple{{/if}} />
+        <div class="access-row-box access-row-box-input">
+          <input class="form-input-box" type="file" id="files" name="files" required {{#if form.garage}} {{else}}multiple{{/if}} />
         </div>
-        <div class="access-row-box">
-          <input type="submit" value="{{#if form.garage}}Override garage slot {{form.garage.slot}}{{else}}Import{{/if}}" />
+        <div class="access-row-box form-submit access-row-box-input">
+          <input class="form-submit-button" style="width:50%;" type="submit" value="{{#if form.garage}}Override garage slot {{form.garage.slot}}{{else}}Import{{/if}}" />
         </div>
       </div>
     </form>

assets/templates/rc_society/index.html.hbs

@@ -85,10 +85,30 @@
           <div class="box-details-value"><a class="box-details-link" href="{{form.links.wiki}}">{{form.links.wiki}}</a></div>
         </div>
       </div>
-      <!--<div class="access-box">
-        Grid item 3
-      </div>
       <div class="access-box">
+        <h4 class="access-box-title">Federation</h4>
+        <div class="box-details">
+          <div class="box-details-key">Enabled</div>
+          <div class="box-details-value">{{form.fediverse.enabled}}</div>
+          <div class="box-details-key">Aliases</div>
+          <div class="box-details-value">
+            {{#each form.fediverse.alias}}
+              <span>{{@key}} -> {{this}}</span><br/>
+            {{else}}
+              <span>[None]</span>
+            {{/each}}
+          </div>
+          <div class="box-details-key">Blocked</div>
+          <div class="box-details-value">
+            {{#each form.fediverse.defederated}}
+              <span>{{this}}</span><br/>
+            {{else}}
+              <span>[None]</span>
+            {{/each}}
+          </div>
+        </div>
+      </div>
+      <!--<div class="access-box">
         Grid item 4
       </div>
       <div class="access-box">

assets/templates/rc_society/login.html.hbs

@@ -98,6 +98,9 @@
       background-color: lightgrey;
       font-size: 20px;
     }
+    input[type=submit] {
+      cursor: pointer;
+    }
     .input-required-hint::after {
       color: red;
       /*content: "*required";*/

assets/templates/rc_society/stylesheet.html.hbs

@@ -36,6 +36,34 @@ body {
 .form-padded {
     padding: 0 25px;
 }
+input:required:invalid.form-input-box {
+    border-color: red;
+}
+input:required:invalid.form-input-box::after {
+    content: "*required";
+    color: red;
+    font-size: 12px;
+}
+input {
+    width: 100%;
+    border: thin solid white;
+    background-color: lightgrey;
+}
+input[type=submit] {
+    cursor: pointer;
+}
+.form-submit {
+    margin: 0 auto;
+}
+.form-submit-button {
+    background-color: black;
+    color: lightgrey;
+}
+.input-required-hint::after {
+    color: red;
+    /*content: "*required";*/
+    font-size: 12px;
+}
 h1, h2, h3, h4, h5 {
     text-align: center;
 }
@@ -55,6 +83,10 @@ form {
     padding-right: 25px;
     padding-bottom: 250px;
 }
+.inline-form {
+    padding: 0;
+    display: contents;
+}
 .form-error {
     position: relative;
     width: 100%;
@@ -112,6 +144,9 @@ form {
     text-align: center;
     width: 100%;
 }
+.access-row-box-input {
+    padding: 5px;
+}
 .access-box-title {
     padding: 5px;
     margin: 0 auto;
@@ -144,6 +179,13 @@ form {
     color: black;
     text-align: left;
 }
+.box-details-input {
+    padding: 0;
+    margin: auto 0;
+}
+.box-details-input-text {
+    padding-right: 6px;
+}
 .export-plugin {
     color: white;
 }

assets/templates/rc_society/user_federation.html.hbs

@@ -0,0 +1,90 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <!-- Primary Meta Tags -->
+  <title>Garages - Openjam</title>
+  <meta name="title" content="Federation - Openjam" />
+  <meta name="description" content="User federation controls for third-party Robocraft servers" />
+
+  <!-- Open Graph / Facebook -->
+  <meta property="og:type" content="website" />
+  <meta property="og:url" content="https://git.ngram.ca/OpenJam/rc-servers" />
+  <meta property="og:title" content="Federation - Openjam" />
+  <meta property="og:description" content="View your federation settings for third-party Robocraft servers" />
+  <meta property="og:image" content="https://git.ngram.ca/OpenJam/rc-servers/raw/branch/main/assets/robocraft/favicon.jpg" />
+
+  <!-- Twitter -->
+  <meta property="twitter:card" content="summary" />
+  <meta property="twitter:url" content="https://git.ngram.ca/OpenJam/rc-servers" />
+  <meta property="twitter:title" content="Federation - Openjam" />
+  <meta property="twitter:description" content="View your federation settings for third-party Robocraft servers" />
+  <meta property="twitter:image" content="https://git.ngram.ca/OpenJam/rc-servers/raw/branch/main/assets/robocraft/favicon.jpg" />
+
+
+  <link rel="icon" type="image/x-icon" href="/favicon.ico">
+  {{> stylesheet}}
+</head>
+<body>
+  <div class="form-stripe">
+    <div class="form-header-right">
+      Welcome {{form.display_name}}! |
+      <a href="/">Home</a>
+    </div>
+    <h1 class="form-banner">{{form.display_name}} Federation Settings</h1>
+    {{#if error}}
+      <div class="form-error">
+        <p class="form-error-message">{{error}}</p>
+      </div>
+    {{/if}}
+    <div class="access-grid">
+      <div class="access-box">
+        {{#if form.enabled}}
+        <h4 class="access-box-title">Disable Federation</h4>
+        <form class="inline-form box-details" method="post" action="./off">
+          <div class="box-details-value">Turn Off</div>
+          <div class="box-details-key box-details-input"><input class="form-submit-button" type="submit" value="Confirm" /></div>
+        </form>
+        {{else}}
+        <h4 class="access-box-title">Enable Federation</h4>
+        <form class="inline-form box-details" method="post" action="./on">
+          <div class="box-details-value">Turn On</div>
+          <div class="box-details-key box-details-input"><input class="form-submit-button" type="submit" value="Confirm" /></div>
+        </form>
+        {{/if}}
+      </div>
+      <div class="access-box">
+        <h4 class="access-box-title">Defederated Domains</h4>
+        <div class="box-details">
+          {{#each form.defederated}}
+          <form class="inline-form" method="post" action="./list/remove/{{this}}">
+            <div class="box-details-key">{{this}}</div>
+            <div class="box-details-input box-details-value">
+              <input type="submit" value="Remove" />
+            </div>
+          </form>
+          {{else}}
+            <div class="box-details-key">No Domains</div>
+            <div class="box-details-value">To Remove</div>
+          {{/each}}
+        </div>
+      </div>
+      <div class="access-box">
+        <h4 class="access-box-title">Defederated A Domain</h4>
+        <form class="inline-form box-details" method="post" action="./list/add">
+          <div class="box-details-value box-details-input box-details-input-text"><input class="form-input-box" placeholder="example.com" type="text" id="domain" name="domain" required /></div>
+          <div class="box-details-key box-details-input"><input class="form-submit-button" type="submit" value="Add" /></div>
+        </form>
+      </div>
+    </div>
+
+    <footer>
+      <div class="footer">
+        {{version}}
+        | <a href="{{source_url}}#readme">About</a>
+        | <a href="https://liberapay.com/NGram">Support Me</a>
+      </div>
+    </footer>
+  </div>
+</body>
+</html>