Add the CoffeyLabs.org copyright beside the licence link

A Legal component renders "© <year> CoffeyLabs.org · AGPL-3.0 source" with
both linked. It replaces the bare licence link in the sidebar footer and on
the login and setup pages, and sits at the foot of the user menu on phones,
where the sidebar is hidden. The sidebar and menu stack the two halves;
the auth pages keep one centred line. Screenshots retaken.

web/src/components/Layout.tsx

@@ -5,6 +5,7 @@ import { useLive } from "../state";
 import { Mark } from "./Mark";
 import { ThemeToggle } from "./ThemeSwitch";
 import { UserMenu } from "./UserMenu";
+import { Legal } from "./Legal";
 
 // Account is reached through the user menu, so it is not a nav item.
 const groups = [
@@ -87,9 +88,7 @@ export function Layout({ children }: { children: ReactNode }) {
             <ThemeToggle />
           </div>
           <UserMenu placement="up" showName />
-          <a className="source" href="https://github.com/Coffey-Labs/WGX" target="_blank" rel="noreferrer">
-            AGPL-3.0 source
-          </a>
+          <Legal />
         </div>
       </aside>
 

web/src/components/Legal.tsx

@@ -0,0 +1,21 @@
+// Copyright and licence line. Shown wherever the AGPL link used to stand
+// alone: the sidebar footer, the auth pages and, on phones, the user menu.
+export function Legal({ center = false }: { center?: boolean }) {
+  const year = new Date().getFullYear();
+  return (
+    <p className={`legal${center ? " center" : ""}`}>
+      <span>
+        &copy; {year}{" "}
+        <a href="https://coffeylabs.org" target="_blank" rel="noreferrer">
+          CoffeyLabs.org
+        </a>
+      </span>
+      <span className="legal-sep" aria-hidden="true">
+        ·
+      </span>
+      <a href="https://github.com/Coffey-Labs/WGX" target="_blank" rel="noreferrer">
+        AGPL-3.0 source
+      </a>
+    </p>
+  );
+}

web/src/components/UserMenu.tsx

@@ -3,6 +3,7 @@ import { Link } from "wouter";
 import { ChevronDown, LogOut, Shield } from "lucide-react";
 import { useAuth } from "../state";
 import { ThemeSwitch } from "./ThemeSwitch";
+import { Legal } from "./Legal";
 
 // The signed-in user: avatar button that opens a small menu with the
 // account page, the theme switch and sign out. `placement` says which way
@@ -67,6 +68,9 @@ export function UserMenu({ placement, showName = false }: { placement: "up" | "d
           <button type="button" role="menuitem" className="menu-item" onClick={() => void signOut()}>
             <LogOut size={16} /> Sign out
           </button>
+          <div className="menu-foot">
+            <Legal />
+          </div>
         </div>
       )}
     </div>