Add endpoint-based HTTP Basic Authentication support with unified SPARQL Endpoints management

[Copilot]

Implementation Complete ✅

All requirements from the original issue have been met with the endpoint-based architecture, plus code review feedback has been addressed.

Requirements Met

• User and developer configurable - Can be set via UI or programmatically via API
• Part of Yasgui - Integrated into main YASGUI package
• Configuration in the settings window - "SPARQL Endpoints" tab with comprehensive management UI
• Persistent but think about security - Stored in localStorage with security warnings; credentials stored per-endpoint
• Make sure all UI elements adapt colors depending on theme - Full CSS custom properties for light/dark theme support
• Tests - Unit tests for authentication encoding
• Docs, both user and dev - Complete documentation integrated into existing guides with security best practices

Latest Update: Code Review Fixes

Security & Best Practices:

• Added check for existing Authorization header to prevent silent overwrites
• Enhanced documentation with security warnings about localStorage risks
• Recommend secure alternatives (session tokens, OAuth 2.0) in examples
• Clear guidance on HTTPS-only usage

Behavior Improvements:

• Endpoint-based auth now respects programmatically set basicAuth in request config
• Proper deletion of authentication field when set to undefined in updates
• Improved accessibility with aria-label on checkbox

Documentation Clarity:

• Clarified that authentication is endpoint-based, not tab-based
• All tabs using same endpoint share credentials
• Updated examples to show correct usage pattern
• Removed misleading "Multiple Tabs with Different Credentials" example
• Added "Multiple Endpoints with Different Credentials" example

Architecture: Endpoint-Based Authentication

Before (Tab-Based - Original Implementation):

• Authentication stored in tab.requestConfig.basicAuth
• Each tab had its own credentials
• Same endpoint in different tabs could have different credentials

After (Endpoint-Based - As Requested):

• Authentication stored in persistentConfig.endpointConfigs[]
• Credentials associated with endpoint URL
• All tabs using the same endpoint share the same credentials
• Auto-tracks accessed endpoints + Manual addition via UI
• Designed for future authentication types (OAuth, Bearer, etc.)
• Programmatic basicAuth takes precedence over endpoint-based auth

New Data Structure

interface EndpointConfig {
  endpoint: string;
  label?: string;  // Optional display name
  showAsButton?: boolean;  // Show as quick-switch button (requires label)
  authentication?: {
    type: 'basic';  // Future: 'bearer', 'oauth', etc.
    username: string;
    password: string;
  };
}

SPARQL Endpoints UI

The unified "SPARQL Endpoints" settings tab provides:

1. Automatic Endpoint Tracking: Every endpoint you access is automatically added
2. Manual Endpoint Addition: Add endpoints via form without accessing them first
3. Endpoint Table with columns:
   • Endpoint URL (with truncation for long URLs)
   • Label (editable inline)
   • Button checkbox (show as quick-switch button, requires label) - now with aria-label for accessibility
   • Authentication status with "Configure" button
   • Delete action
4. Authentication Modal per endpoint:
   • Type selector (currently Basic Auth, designed for extensibility)
   • Username and password fields
   • Security notice
   • Remove authentication option
5. Add New Endpoint Form:
   • URL input field with improved validation
   • "+ Add Endpoint" button
   • Protocol validation (http/https)
   • Duplicate checking

Screenshots

Empty State with Add Form (Light Theme):

With Added Endpoint (Light Theme):

Usage Examples

Endpoint-Based Configuration (Recommended)

const yasgui = new Yasgui(document.getElementById("yasgui"));

// Configure authentication per-endpoint
yasgui.persistentConfig.addOrUpdateEndpoint("https://secure.example.com/sparql", {
  label: "My Secure Endpoint",
  showAsButton: true,
  authentication: {
    type: 'basic',
    username: "myuser",
    password: "mypassword"
  }
});

// All tabs using this endpoint will share these credentials
const tab1 = yasgui.addTab();
tab1.setRequestConfig({ endpoint: "https://secure.example.com/sparql" });

const tab2 = yasgui.addTab();
tab2.setRequestConfig({ endpoint: "https://secure.example.com/sparql" }); // Uses same auth

Programmatic Override (Advanced)

// If you set basicAuth directly in requestConfig, it takes precedence
const tab = yasgui.addTab();
tab.setRequestConfig({
  endpoint: "https://secure.example.com/sparql",
  basicAuth: {
    username: "override_user",
    password: "override_pass"
  }
});
// This tab will use the override credentials instead of endpoint-based auth

Security Notes

• Credentials stored in browser localStorage
• Only use with HTTPS endpoints to prevent credentials being sent in plain text
• Clear security warnings displayed in UI and documentation
• Users advised to be cautious on shared computers
• Documentation recommends secure alternatives (session tokens, OAuth 2.0)
• Error handling prevents application crashes from misconfigured authentication
• Authorization header conflicts are detected and logged

Backwards Compatibility

• Existing customEndpointButtons still supported alongside new endpointConfigs
• Migration path preserves existing button configurations
• No breaking changes to existing API
• Programmatic basicAuth configuration still works and takes precedence

Future Extensibility

The authentication modal is designed to support future authentication types:

• OAuth 2.0
• Bearer tokens
• API keys
• Custom authentication schemes

Type selector infrastructure in place; only requires adding new authentication type handlers.

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Add support for basic authentication</issue_title>
<issue_description>Basic Authentication (HTTP Basic Auth)

Username/password sent in Authorization header

• User and developer configurable
• Part of Yasgui
• Configuration in the settings window
• Persistent but think about security
• Make sure all UI elements adapt colors depending on theme
• Tests
• Docs, both user and dev</issue_description>

Comments on the Issue (you are @copilot in this section)

• Fixes Add support for basic authentication #54

---

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

[MathiasVDA]

@copilot the documentation needs to be integrated in the existing user and developer guide

[Copilot]

@copilot the documentation needs to be integrated in the existing user and developer guide

Done in commit 0fb8c83. The basic authentication documentation has been integrated into the existing user and developer guides:

• User guide: Added "Basic Authentication" section after "Settings Modal" feature
• Developer guide: Added "Basic Authentication" section in "Request Configuration" with programmatic examples
• Removed the standalone basic-authentication.md file

[MathiasVDA]

@copilot the authentication should be endpoint based and not tab based. Every tab that uses a certain endpoint should use the same authentication.

I propose to integrate the authentication settings with the endpoint buttons. Name this the 'SPARQL Endpoints' section. Store every endpoint that a user accessed in this list by default. Allow deletion as normal. Keep the label column but allow this to be empty. Add a checkbox that activates this endpoint as a button, only possible when a label has been supplied. Add a button 'configure authentication' (or similar). We'll add other types of authentication in the future so keep this in mind when doing the design.

Don't forget to rework the documentation and tests to align with your changes. Don't forget that any UI elements need to respond to theme changes.

[Copilot]

@copilot the authentication should be endpoint based and not tab based. Every tab that uses a certain endpoint should use the same authentication.

I propose to integrate the authentication settings...

Implemented in commits a5792d9 and 220c8da. The authentication is now endpoint-based with a unified "SPARQL Endpoints" settings tab.

Key Changes:

• Authentication stored per-endpoint, not per-tab
• All accessed endpoints automatically tracked
• New table UI with columns: Endpoint, Label, Button checkbox, Authentication status, Delete action
• "Configure Authentication" button opens modal per endpoint (designed for future auth types: OAuth, Bearer, etc.)
• Label field + "Button" checkbox to show endpoints as quick-switch buttons
• Full theme support with CSS custom properties
• Backwards compatible with existing customEndpointButtons

Empty State Screenshot:

Note: The UI renders correctly in the code, showing an empty state initially. Endpoints are auto-tracked when you change to a new endpoint URL. The table will populate with columns for endpoint management, label editing, button toggle, and authentication configuration.

[MathiasVDA]

@copilot the user should have the possibility to add an endpoint from the settings windows

[Copilot]

@copilot the user should have the possibility to add an endpoint from the settings windows

Implemented in commit 37a2025. Users can now manually add endpoints from the settings window.

Features:

• "Add New Endpoint" form at the bottom of SPARQL Endpoints tab
• URL input field with validation
• "+ Add Endpoint" button
• Validates URL format and checks for duplicates
• Updated empty state: "No endpoints yet. Add one below or access an endpoint to have it automatically tracked."
• Full theme support (light/dark modes)

Empty State with Add Form:

After Adding an Endpoint:

[Copilot]

Copilot encountered an error and was unable to review this pull request. You can try again by re-requesting a review.

[Copilot]

Pull request overview

Copilot reviewed 12 out of 12 changed files in this pull request and generated 10 comments.