javascript-solid-server 0.0.75 → 0.0.77

package/src/idp/views.js

@@ -105,6 +105,38 @@ const styles = `
   .btn-secondary:hover {
     background: #e0e0e0;
   }
+  .btn-passkey {
+    background: #1a73e8;
+    color: white;
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+  }
+  .btn-passkey:hover {
+    background: #1557b0;
+  }
+  .btn-passkey svg {
+    width: 20px;
+    height: 20px;
+  }
+  .divider {
+    display: flex;
+    align-items: center;
+    margin: 20px 0;
+    color: #666;
+    font-size: 14px;
+  }
+  .divider::before,
+  .divider::after {
+    content: '';
+    flex: 1;
+    border-bottom: 1px solid #ddd;
+  }
+  .divider span {
+    padding: 0 12px;
+  }
   .scopes {
     margin: 20px 0;
   }
@@ -149,6 +181,12 @@ const solidLogo = `
 </svg>
 `;
 
+const passkeyIcon = `
+<svg viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+  <path d="M12.65 10C11.83 7.67 9.61 6 7 6c-3.31 0-6 2.69-6 6s2.69 6 6 6c2.61 0 4.83-1.67 5.65-4H17v4h4v-4h2v-4H12.65zM7 14c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z"/>
+</svg>
+`;
+
 const scopeDescriptions = {
   openid: 'Access your identity',
   webid: 'Access your WebID',
@@ -157,11 +195,125 @@ const scopeDescriptions = {
   offline_access: 'Stay logged in',
 };
 
+/**
+ * Escape string for safe use in JavaScript
+ */
+function escapeJs(text) {
+  if (!text) return '';
+  return String(text)
+    .replace(/\\/g, '\\\\')
+    .replace(/'/g, "\\'")
+    .replace(/"/g, '\\"')
+    .replace(/</g, '\\x3c')
+    .replace(/>/g, '\\x3e')
+    .replace(/\n/g, '\\n')
+    .replace(/\r/g, '\\r');
+}
+
 /**
  * Login page HTML
  */
-export function loginPage(uid, clientId, error = null) {
+export function loginPage(uid, clientId, error = null, passkeyEnabled = true) {
   const appName = clientId || 'An application';
+  const safeUid = escapeJs(uid);
+
+  const passkeySection = passkeyEnabled ? `
+    <button type="button" class="btn btn-passkey" onclick="loginWithPasskey()">
+      ${passkeyIcon}
+      Sign in with Passkey
+    </button>
+
+    <div class="divider"><span>or</span></div>
+  ` : '';
+
+  const passkeyScript = passkeyEnabled ? `
+  <script>
+    var INTERACTION_UID = '${safeUid}';
+
+    async function loginWithPasskey() {
+      try {
+        // Get authentication options
+        const optionsRes = await fetch('/idp/passkey/login/options', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ visitorId: crypto.randomUUID() })
+        });
+        const options = await optionsRes.json();
+        if (options.error) {
+          alert('Error: ' + options.error);
+          return;
+        }
+
+        // Convert base64url to ArrayBuffer
+        options.challenge = base64urlToBuffer(options.challenge);
+        if (options.allowCredentials) {
+          options.allowCredentials = options.allowCredentials.map(c => ({
+            ...c,
+            id: base64urlToBuffer(c.id)
+          }));
+        }
+
+        // Prompt user for passkey
+        const credential = await navigator.credentials.get({ publicKey: options });
+
+        // Send response to server
+        const verifyRes = await fetch('/idp/passkey/login/verify', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({
+            challengeKey: options.challengeKey,
+            credential: {
+              id: credential.id,
+              rawId: bufferToBase64url(credential.rawId),
+              type: credential.type,
+              response: {
+                clientDataJSON: bufferToBase64url(credential.response.clientDataJSON),
+                authenticatorData: bufferToBase64url(credential.response.authenticatorData),
+                signature: bufferToBase64url(credential.response.signature),
+                userHandle: credential.response.userHandle
+                  ? bufferToBase64url(credential.response.userHandle)
+                  : null
+              }
+            }
+          })
+        });
+
+        const result = await verifyRes.json();
+        if (result.success) {
+          // Complete the OIDC interaction - build URL safely
+          const redirectUrl = '/idp/interaction/' + encodeURIComponent(INTERACTION_UID) + '/passkey-complete?accountId=' + encodeURIComponent(result.accountId);
+          window.location.href = redirectUrl;
+        } else {
+          alert('Passkey authentication failed: ' + (result.error || 'Unknown error'));
+        }
+      } catch (err) {
+        if (err.name === 'NotAllowedError') {
+          // User cancelled - do nothing
+        } else {
+          console.error('Passkey error:', err);
+          alert('Passkey authentication failed: ' + err.message);
+        }
+      }
+    }
+
+    function base64urlToBuffer(base64url) {
+      const base64 = base64url.replace(/-/g, '+').replace(/_/g, '/');
+      const padLen = (4 - base64.length % 4) % 4;
+      const padded = base64 + '='.repeat(padLen);
+      const binary = atob(padded);
+      const bytes = new Uint8Array(binary.length);
+      for (let i = 0; i < binary.length; i++) bytes[i] = binary.charCodeAt(i);
+      return bytes.buffer;
+    }
+
+    function bufferToBase64url(buffer) {
+      const bytes = new Uint8Array(buffer);
+      let binary = '';
+      for (let i = 0; i < bytes.length; i++) binary += String.fromCharCode(bytes[i]);
+      return btoa(binary).replace(/[+]/g, '-').replace(/[/]/g, '_').replace(/=/g, '');
+    }
+  </script>
+  ` : '';
 
   return `
 <!DOCTYPE html>
@@ -185,6 +337,8 @@ export function loginPage(uid, clientId, error = null) {
 
     ${error ? `<div class="error">${escapeHtml(error)}</div>` : ''}
 
+    ${passkeySection}
+
     <form method="POST" action="/idp/interaction/${uid}/login">
       <label for="username">Username</label>
       <input type="text" id="username" name="username" required autofocus placeholder="Your username">
@@ -203,6 +357,7 @@ export function loginPage(uid, clientId, error = null) {
       Don't have an account? <a href="/idp/register?uid=${uid}" style="color: #0066cc;">Register</a>
     </p>
   </div>
+  ${passkeyScript}
 </body>
 </html>
   `;
@@ -349,6 +504,162 @@ export function registerPage(uid = null, error = null, success = null, inviteOnl
   `;
 }
 
+/**
+ * Passkey prompt page - shown after password login to encourage passkey setup
+ */
+export function passkeyPromptPage(uid, accountId) {
+  const safeUid = escapeJs(uid);
+  const safeAccountId = escapeJs(accountId);
+  // Pre-escape the SVG for innerHTML assignment (no user data, just static SVG)
+  const passkeyIconEscaped = passkeyIcon.replace(/'/g, "\\'").replace(/\n/g, '');
+
+  return `
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Add a Passkey - Solid IdP</title>
+  <style>${styles}</style>
+</head>
+<body>
+  <div class="container">
+    <div class="logo">${solidLogo}</div>
+    <h1>Add a Passkey?</h1>
+    <p class="subtitle">Sign in faster next time</p>
+
+    <div class="client-info">
+      <div class="client-name">Passkeys are more secure</div>
+      <div class="client-uri">Use Touch ID, Face ID, or a security key instead of your password</div>
+    </div>
+
+    <button type="button" class="btn btn-passkey" onclick="registerPasskey()" id="addBtn">
+      ${passkeyIcon}
+      Add Passkey
+    </button>
+
+    <form method="GET" action="/idp/interaction/${escapeHtml(uid)}/passkey-skip">
+      <button type="submit" class="btn btn-secondary">Skip for now</button>
+    </form>
+  </div>
+
+  <script>
+    var INTERACTION_UID = '${safeUid}';
+    var ACCOUNT_ID = '${safeAccountId}';
+    var PASSKEY_ICON = '${passkeyIconEscaped}';
+
+    async function registerPasskey() {
+      const btn = document.getElementById('addBtn');
+      btn.disabled = true;
+      btn.textContent = 'Setting up...';
+
+      try {
+        // Get registration options
+        const optionsRes = await fetch('/idp/passkey/register/options', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ accountId: ACCOUNT_ID })
+        });
+        const options = await optionsRes.json();
+        if (options.error) {
+          alert('Error: ' + options.error);
+          btn.disabled = false;
+          btn.innerHTML = PASSKEY_ICON + ' Add Passkey';
+          return;
+        }
+
+        // Save challengeKey for verification
+        const challengeKey = options.challengeKey;
+
+        // Convert base64url to ArrayBuffer
+        options.challenge = base64urlToBuffer(options.challenge);
+        options.user.id = base64urlToBuffer(options.user.id);
+        if (options.excludeCredentials) {
+          options.excludeCredentials = options.excludeCredentials.map(c => ({
+            ...c,
+            id: base64urlToBuffer(c.id)
+          }));
+        }
+
+        // Prompt user to create passkey
+        const credential = await navigator.credentials.create({ publicKey: options });
+
+        // Send response to server
+        const verifyRes = await fetch('/idp/passkey/register/verify', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({
+            accountId: ACCOUNT_ID,
+            challengeKey: challengeKey,
+            credential: {
+              id: credential.id,
+              rawId: bufferToBase64url(credential.rawId),
+              type: credential.type,
+              response: {
+                clientDataJSON: bufferToBase64url(credential.response.clientDataJSON),
+                attestationObject: bufferToBase64url(credential.response.attestationObject),
+                transports: credential.response.getTransports ? credential.response.getTransports() : []
+              }
+            },
+            name: detectDeviceName()
+          })
+        });
+
+        const result = await verifyRes.json();
+        if (result.success) {
+          // Passkey added, continue to app - build URL safely
+          const redirectUrl = '/idp/interaction/' + encodeURIComponent(INTERACTION_UID) + '/passkey-complete?accountId=' + encodeURIComponent(ACCOUNT_ID);
+          window.location.href = redirectUrl;
+        } else {
+          alert('Failed to add passkey: ' + (result.error || 'Unknown error'));
+          btn.disabled = false;
+          btn.innerHTML = PASSKEY_ICON + ' Add Passkey';
+        }
+      } catch (err) {
+        if (err.name === 'NotAllowedError') {
+          // User cancelled
+        } else {
+          console.error('Passkey error:', err);
+          alert('Failed to add passkey: ' + err.message);
+        }
+        btn.disabled = false;
+        btn.innerHTML = PASSKEY_ICON + ' Add Passkey';
+      }
+    }
+
+    function detectDeviceName() {
+      const ua = navigator.userAgent;
+      if (/iPhone/.test(ua)) return 'iPhone';
+      if (/iPad/.test(ua)) return 'iPad';
+      if (/Mac/.test(ua)) return 'Mac';
+      if (/Android/.test(ua)) return 'Android';
+      if (/Windows/.test(ua)) return 'Windows';
+      if (/Linux/.test(ua)) return 'Linux';
+      return 'Security Key';
+    }
+
+    function base64urlToBuffer(base64url) {
+      const base64 = base64url.replace(/-/g, '+').replace(/_/g, '/');
+      const padLen = (4 - base64.length % 4) % 4;
+      const padded = base64 + '='.repeat(padLen);
+      const binary = atob(padded);
+      const bytes = new Uint8Array(binary.length);
+      for (let i = 0; i < binary.length; i++) bytes[i] = binary.charCodeAt(i);
+      return bytes.buffer;
+    }
+
+    function bufferToBase64url(buffer) {
+      const bytes = new Uint8Array(buffer);
+      let binary = '';
+      for (let i = 0; i < bytes.length; i++) binary += String.fromCharCode(bytes[i]);
+      return btoa(binary).replace(/[+]/g, '-').replace(/[/]/g, '_').replace(/=/g, '');
+    }
+  </script>
+</body>
+</html>
+  `;
+}
+
 /**
  * Escape HTML to prevent XSS
  */

package/src/ldp/headers.js

@@ -56,6 +56,7 @@ export function getResponseHeaders({ isContainer = false, etag = null, contentTy
   const headers = {
     'Link': getLinkHeader(isContainer, aclUrl),
     'Accept-Patch': 'text/n3, application/sparql-update',
+    'Accept-Ranges': isContainer ? 'none' : 'bytes',
     'Allow': 'GET, HEAD, PUT, DELETE, PATCH, OPTIONS' + (isContainer ? ', POST' : ''),
     'Vary': connegEnabled ? 'Accept, Authorization, Origin' : 'Authorization, Origin'
   };
@@ -94,8 +95,8 @@ export function getCorsHeaders(origin) {
   return {
     'Access-Control-Allow-Origin': origin || '*',
     'Access-Control-Allow-Methods': 'GET, HEAD, POST, PUT, DELETE, PATCH, OPTIONS',
-    'Access-Control-Allow-Headers': 'Accept, Authorization, Content-Type, DPoP, If-Match, If-None-Match, Link, Slug, Origin',
-    'Access-Control-Expose-Headers': 'Accept-Patch, Accept-Post, Allow, Content-Type, ETag, Link, Location, Updates-Via, WAC-Allow',
+    'Access-Control-Allow-Headers': 'Accept, Authorization, Content-Type, DPoP, If-Match, If-None-Match, Link, Range, Slug, Origin',
+    'Access-Control-Expose-Headers': 'Accept-Patch, Accept-Post, Accept-Ranges, Allow, Content-Length, Content-Range, Content-Type, ETag, Link, Location, Updates-Via, WAC-Allow',
     'Access-Control-Allow-Credentials': 'true',
     'Access-Control-Max-Age': '86400'
   };

package/src/mashlib/index.js

@@ -94,6 +94,113 @@ export function shouldServeMashlib(request, mashlibEnabled, contentType) {
   return rdfTypes.includes(baseType);
 }
 
+/**
+ * Generate SolidOS UI HTML (modern Nextcloud-style interface)
+ * Uses mashlib for data layer but solidos-ui for the UI shell
+ *
+ * @returns {string} HTML content
+ */
+export function generateSolidosUiHtml() {
+  return `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8"/>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>SolidOS - Modern UI</title>
+  <!-- SolidOS UI Styles -->
+  <link rel="stylesheet" href="/solidos-ui/styles/variables.css">
+  <link rel="stylesheet" href="/solidos-ui/styles/shell.css">
+  <link rel="stylesheet" href="/solidos-ui/styles/components.css">
+  <link rel="stylesheet" href="/solidos-ui/styles/responsive.css">
+  <!-- View-specific styles -->
+  <link rel="stylesheet" href="/solidos-ui/views/profile/profile.css">
+  <link rel="stylesheet" href="/solidos-ui/views/contacts/contacts.css">
+  <link rel="stylesheet" href="/solidos-ui/views/sharing/sharing.css">
+  <link rel="stylesheet" href="/solidos-ui/views/settings/settings.css">
+  <!-- Bundled styles (contains all component styles) -->
+  <link rel="stylesheet" href="/solidos-ui/style.css">
+  <style>
+    * { margin: 0; padding: 0; box-sizing: border-box; }
+    html, body { height: 100%; }
+    #app { height: 100%; }
+  </style>
+</head>
+<body>
+  <div id="app"></div>
+
+  <script>
+    // Load mashlib first, then solidos-ui
+    (function() {
+      var mashScript = document.createElement('script');
+      mashScript.src = '/mashlib.min.js';
+      mashScript.onload = function() {
+        // Now load solidos-ui
+        import('/solidos-ui/solidos-ui.js').then(function(module) {
+          var initSolidOSSkin = module.initSolidOSSkin;
+          var SolidLogic = window.SolidLogic;
+          var panes = window.panes;
+          var store = SolidLogic.store;
+
+          initSolidOSSkin('#app', {
+            store: store,
+            fetcher: store.fetcher,
+            paneRegistry: panes,
+            authn: SolidLogic.authn,
+            logic: SolidLogic.solidLogicSingleton,
+          }, {
+            onNavigate: function(uri) {
+              if (uri) {
+                // Use path-based navigation - update URL to match resource
+                try {
+                  var url = new URL(uri);
+                  // Always use the path from the URI, regardless of origin
+                  // (URIs may use internal hostname like jss:4000 vs localhost:4000)
+                  var newPath = url.pathname;
+                  if (newPath !== window.location.pathname) {
+                    window.history.pushState({ uri: uri }, '', newPath);
+                  }
+                } catch (e) {
+                  console.warn('Invalid URI for navigation:', uri);
+                }
+              }
+            },
+            onLogout: function() {
+              window.location.reload();
+            },
+          }).then(function(skin) {
+            // Handle browser back/forward
+            window.addEventListener('popstate', function(event) {
+              // Use the current URL as the resource (not hash-based)
+              var resourceUrl = window.location.origin + window.location.pathname;
+              skin.goto(resourceUrl);
+            });
+
+            // Navigate to the current URL's resource
+            // The URL path IS the resource in JSS (not hash-based routing)
+            var currentPath = window.location.pathname;
+            if (currentPath && currentPath !== '/') {
+              var resourceUrl = window.location.origin + currentPath;
+              skin.goto(resourceUrl);
+            }
+
+            // Expose for debugging
+            window.solidosSkin = skin;
+          });
+        }).catch(function(err) {
+          console.error('Failed to load solidos-ui:', err);
+          document.body.innerHTML = '<p>Failed to load SolidOS UI</p>';
+        });
+      };
+      mashScript.onerror = function() {
+        document.body.innerHTML = '<p>Failed to load Mashlib</p>';
+      };
+      document.head.appendChild(mashScript);
+    })();
+  </script>
+</body>
+</html>`;
+}
+
 /**
  * Escape HTML special characters
  */

package/src/server.js

@@ -55,6 +55,8 @@ export function createServer(options = {}) {
   const mashlibEnabled = options.mashlib ?? false;
   const mashlibCdn = options.mashlibCdn ?? false;
   const mashlibVersion = options.mashlibVersion ?? '2.0.0';
+  // SolidOS UI (modern Nextcloud-style interface) - requires mashlib
+  const solidosUiEnabled = options.solidosUi ?? false;
   // Git HTTP backend is OFF by default - enables clone/push via git protocol
   const gitEnabled = options.git ?? false;
   // Nostr relay is OFF by default
@@ -127,6 +129,7 @@ export function createServer(options = {}) {
   fastify.decorateRequest('mashlibEnabled', null);
   fastify.decorateRequest('mashlibCdn', null);
   fastify.decorateRequest('mashlibVersion', null);
+  fastify.decorateRequest('solidosUiEnabled', null);
   fastify.decorateRequest('defaultQuota', null);
   fastify.addHook('onRequest', async (request) => {
     request.connegEnabled = connegEnabled;
@@ -137,6 +140,7 @@ export function createServer(options = {}) {
     request.mashlibEnabled = mashlibEnabled;
     request.mashlibCdn = mashlibCdn;
     request.mashlibVersion = mashlibVersion;
+    request.solidosUiEnabled = solidosUiEnabled;
     request.defaultQuota = defaultQuota;
 
     // Extract pod name from subdomain if enabled
@@ -296,7 +300,7 @@ export function createServer(options = {}) {
   // Authorization hook - check WAC permissions
   // Skip for pod creation endpoint (needs special handling)
   fastify.addHook('preHandler', async (request, reply) => {
-    // Skip auth for pod creation, OPTIONS, IdP routes, mashlib, well-known, notifications, nostr, git, and AP
+    // Skip auth for pod creation, OPTIONS, IdP routes, mashlib, solidos-ui, well-known, notifications, nostr, git, and AP
     const mashlibPaths = ['/mashlib.min.js', '/mash.css', '/841.mashlib.min.js'];
     const apPaths = ['/inbox', '/profile/card/inbox', '/profile/card/outbox', '/profile/card/followers', '/profile/card/following'];
     // Check if request wants ActivityPub content for profile
@@ -308,6 +312,7 @@ export function createServer(options = {}) {
         request.method === 'OPTIONS' ||
         request.url.startsWith('/idp/') ||
         request.url.startsWith('/.well-known/') ||
+        request.url.startsWith('/solidos-ui/') ||
         (nostrEnabled && request.url.startsWith(nostrPath)) ||
         (gitEnabled && isGitRequest(request.url)) ||
         (activitypubEnabled && apPaths.some(p => request.url === p || request.url.startsWith(p + '?'))) ||
@@ -381,6 +386,37 @@ export function createServer(options = {}) {
     }
   }
 
+  // SolidOS UI static files (modern Nextcloud-style interface)
+  // Serves from /solidos-ui/* - requires mashlib to be enabled as well
+  if (solidosUiEnabled && mashlibEnabled) {
+    const solidosUiDir = join(__dirname, 'mashlib-local', 'dist', 'solidos-ui');
+
+    // Serve all files under /solidos-ui/* path
+    fastify.get('/solidos-ui/*', async (request, reply) => {
+      try {
+        // Get the path after /solidos-ui/
+        const filePath = request.url.replace('/solidos-ui/', '').split('?')[0];
+        const fullPath = join(solidosUiDir, filePath);
+
+        // Determine content type based on extension
+        const ext = filePath.split('.').pop()?.toLowerCase();
+        const contentTypes = {
+          'js': 'application/javascript',
+          'css': 'text/css',
+          'map': 'application/json',
+          'html': 'text/html'
+        };
+        const contentType = contentTypes[ext] || 'application/octet-stream';
+
+        const content = await readFile(fullPath);
+        return reply.type(contentType).send(content);
+      } catch (err) {
+        request.log.error(err, 'Failed to serve solidos-ui file');
+        return reply.code(404).send({ error: 'Not Found' });
+      }
+    });
+  }
+
   // Rate limit configuration for write operations
   // Protects against resource exhaustion and abuse
   const writeRateLimit = {

package/src/storage/filesystem.js

@@ -51,6 +51,28 @@ export async function read(urlPath) {
   }
 }
 
+/**
+ * Create a readable stream for a resource (supports range requests)
+ * @param {string} urlPath
+ * @param {object} options - { start, end } byte range options
+ * @returns {{ stream: ReadStream, filePath: string } | null}
+ */
+export function createReadStream(urlPath, options = {}) {
+  const filePath = urlToPath(urlPath);
+
+  // Check file exists before creating stream (createReadStream doesn't throw sync)
+  if (!fs.pathExistsSync(filePath)) {
+    return null;
+  }
+
+  try {
+    const stream = fs.createReadStream(filePath, options);
+    return { stream, filePath };
+  } catch {
+    return null;
+  }
+}
+
 /**
  * Write resource content
  * @param {string} urlPath