MAstodon server

frontend/static/profile.js

@@ -7,7 +7,6 @@ const passwordForm = document.querySelector('#password-form');
 const mastodonForm = document.querySelector('#mastodon-form');
 const profileLogoutButton = document.querySelector('#logout-button');
 const accessToken = localStorage.getItem('linklogAccessToken');
-const defaultMastodonInstance = 'mastodon.social';
 const defaultPostPrefix = 'From my #LinkLog: ';
 const mastodonConnectButton = document.querySelector('#mastodon-connect');
 
@@ -46,7 +45,7 @@ async function loadMastodonConfig() {
   const response = await fetch('/api/user/plugins/mastodon', {headers: authHeaders()});
   if (!response.ok) throw new Error('Could not load Mastodon settings');
   const config = await response.json();
-  document.querySelector('#mastodon-instance').value = config.instance || defaultMastodonInstance;
+  document.querySelector('#mastodon-instance').value = config.instance || 'mastodon.social';
   document.querySelector('#mastodon-post-prefix').value = config.post_prefix || defaultPostPrefix;
 }
 
@@ -96,8 +95,20 @@ mastodonForm.addEventListener('submit', async (event) => {
 
 mastodonConnectButton.addEventListener('click', async () => {
   mastodonConnectButton.disabled = true;
-  const instance = document.querySelector('#mastodon-instance').value || defaultMastodonInstance;
+  const instance = document.querySelector('#mastodon-instance').value.trim();
+  if (!instance) {
+    setStatus('#mastodon-status', 'Enter the Mastodon server you want to use.', true);
+    mastodonConnectButton.disabled = false;
+    return;
+  }
   try {
+    const settingsResponse = await fetch('/api/user/plugins/mastodon', {
+      method: 'PUT',
+      headers: authHeaders(true),
+      body: JSON.stringify({instance}),
+    });
+    if (!settingsResponse.ok) throw new Error('Could not save the Mastodon server.');
+    setStatus('#mastodon-status', `Authorizing with ${instance}...`);
     const response = await fetch(`/api/mastodon/oauth/start?instance=${encodeURIComponent(instance)}`, {headers: authHeaders()});
     const result = await response.json();
     if (!response.ok || !result.authorization_url) throw new Error(result.error || 'Could not start Mastodon authorization.');

frontend/templates/user_profile.html

@@ -81,14 +81,14 @@
         <h2>Mastodon</h2>
         <form id="mastodon-form">
           <label>
-            Instance
-            <input id="mastodon-instance" name="instance" type="text" value="mastodon.social" placeholder="mastodon.social" />
+            Mastodon server
+            <input id="mastodon-instance" name="instance" type="text" value="mastodon.social" placeholder="mastodon.social" required />
           </label>
           <label>
             Post prefix
             <input id="mastodon-post-prefix" name="post_prefix" type="text" value="From my #LinkLog: " />
           </label>
-          <button id="mastodon-connect" type="button">Connect Mastodon</button>
+          <button id="mastodon-connect" type="button">Authenticate with this server</button>
           <button type="submit">Save Mastodon settings</button>
           <p id="mastodon-status" class="status" role="status"></p>
         </form>
@@ -97,6 +97,6 @@
     <footer class="site-footer">Copyright © 2026 Olaf Kolkman  · <a href="https://git.kolkman.org/olaf/Link-Log">git.kolkman.org/LinkLog</a></footer>
     <script src="/static/auth-header.js?v=3"></script>
     <script src="/static/logout.js?v=2"></script>
-    <script src="/static/profile.js?v=4"></script>
+    <script src="/static/profile.js?v=5"></script>
   </body>
 </html>