Fix #1762, add a link to see the mastodon account directly on your home server if the contributor has a mastodon set

langs/en.json

@@ -723,7 +723,8 @@
         "fediverse": {
             "description": "A fediverse handle, often @username@server.tld",
             "feedback": "A fediverse handle consists of @username@server.tld or is a link to a profile",
-            "invalidHost": "{host} is not a valid hostname"
+            "invalidHost": "{host} is not a valid hostname",
+            "onYourServer": "See and follow on your server"
         },
         "float": {
             "description": "a number",

src/UI/InputElement/Validators/FediverseValidator.ts

@@ -3,7 +3,7 @@ import { Translation } from "../../i18n/Translation"
 import Translations from "../../i18n/Translations"
 
 export default class FediverseValidator extends Validator {
-    public static readonly usernameAtServer: RegExp = /^@?(\w+)@((\w|\.)+)$/
+    public static readonly usernameAtServer: RegExp = /^@?(\w+)@((\w|-|\.)+)$/
 
     constructor() {
         super(

src/UI/SpecialVisualizations.ts

@@ -88,6 +88,7 @@ import MaprouletteSetStatus from "./MapRoulette/MaprouletteSetStatus.svelte"
 import DirectionIndicator from "./Base/DirectionIndicator.svelte"
 import Img from "./Base/Img"
 import Qr from "../Utils/Qr"
+import { log } from "node:util"
 
 class NearbyImageVis implements SpecialVisualization {
     // Class must be in SpecialVisualisations due to weird cyclical import that breaks the tests
@@ -1387,11 +1388,35 @@ export default class SpecialVisualizations {
                                 const [_, username, host] = fediAccount.match(
                                     FediverseValidator.usernameAtServer
                                 )
-                                return new SvelteUIElement(Link, {
+
+                                const normalLink = new SvelteUIElement(Link, {
                                     text: fediAccount,
-                                    url: "https://" + host + "/@" + username,
+                                    href: "https://" + host + "/@" + username,
                                     newTab: true,
                                 })
+
+                                const loggedInContributorMastodon =
+                                    state.userRelatedState?.preferencesAsTags?.data?.[
+                                        "_mastodon_link"
+                                    ]
+                                console.log(
+                                    "LoggedinContributorMastodon",
+                                    loggedInContributorMastodon
+                                )
+                                if (!loggedInContributorMastodon) {
+                                    return normalLink
+                                }
+                                const homeUrl = new URL(loggedInContributorMastodon)
+                                const homeHost = homeUrl.protocol + "//" + homeUrl.hostname
+
+                                return new Combine([
+                                    normalLink,
+                                    new SvelteUIElement(Link, {
+                                        href: homeHost + "/" + fediAccount,
+                                        text: Translations.t.validation.fediverse.onYourServer,
+                                        newTab: true,
+                                    }).SetClass("button"),
+                                ])
                             })
                     )
                 },