Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Add comprehensive login page customization options #7374

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 15 commits into
base: main
Choose a base branch
from

Conversation

strickvl
Copy link

@strickvl strickvl commented Jun 12, 2025

This PR introduces a unified, scalable approach for customizing code-server's login page UI through a single --i18n flag that leverages the existing internationalization system. The implementation has evolved from multiple specific CLI flags to a clean, file-based configuration system that supports comprehensive UI customization while maintaining simplicity and predictability.

Core Features

  • Single --i18n flag that accepts JSON file paths for UI customization
  • Leverages existing i18n infrastructure for robust string management and placeholder support
  • File-based configuration following Unix conventions for clarity and maintainability
  • Comprehensive error handling with clear, actionable error messages
  • Full documentation with practical examples and migration guidance

Usage

# Create custom strings file
echo '{
  "WELCOME": "Welcome to {{app}}",
  "LOGIN_TITLE": "{{app}} Access Portal", 
  "LOGIN_BELOW": "Please log in to continue",
  "PASSWORD_PLACEHOLDER": "Enter Password"
}' > custom-strings.json

# Use with code-server
code-server --i18n ./custom-strings.json

Technical Implementation

Core Changes

  • src/node/i18n/index.ts: Enhanced loadCustomStrings() with file-only approach and comprehensive error handling
  • src/node/cli.ts: Added --i18n flag with clear description
  • src/node/main.ts: Integrated custom string loading into server startup
  • src/node/routes/login.ts: Updated to use i18n system for all UI strings

Documentation

  • Complete documentation in docs/guide.md with practical examples
  • Migration guide from deprecated --welcome-text flag
  • Integration examples showing --app-name + --i18n usage
  • Available keys reference pointing to source files

Migration Path

From Deprecated Flags

# Old (deprecated)
code-server --welcome-text "Welcome to development"

# New
echo '{"WELCOME": "Welcome to development"}' > strings.json
code-server --i18n ./strings.json

Backward Compatibility

  • Existing --app-name flag continues to work and provides {{app}} placeholder
  • Deprecated --welcome-text continues to work but shows deprecation warning

Files Changed

Core Implementation

  • src/node/i18n/index.ts - Enhanced custom string loading
  • src/node/cli.ts - Added --i18n flag
  • src/node/main.ts - Integrated custom string loading
  • src/node/routes/login.ts - Updated to use i18n system

Testing & Documentation

  • test/unit/node/i18n.test.ts - Comprehensive test suite (new)
  • test/unit/node/cli.test.ts - Updated CLI tests
  • docs/guide.md - Complete documentation with examples

Add CLI arguments and environment variables to customize all login page elements:

- Login title, subtitle, and welcome text
- Password field placeholder and submit button text
- Password instruction messages (config file, env var, hashed)
- Error messages (rate limit, missing/incorrect password)

New CLI options:
  --login-title, --login-below, --password-placeholder, --submit-text
  --login-password-msg, --login-env-password-msg, --login-hashed-password-msg
  --login-rate-limit-msg, --missing-password-msg, --incorrect-password-msg

New environment variables:
  CS_LOGIN_TITLE, CS_LOGIN_BELOW, CS_PASSWORD_PLACEHOLDER, CS_SUBMIT_TEXT
  CS_LOGIN_PASSWORD_MSG, CS_LOGIN_ENV_PASSWORD_MSG, CS_LOGIN_HASHED_PASSWORD_MSG
  CS_LOGIN_RATE_LIMIT_MSG, CS_MISSING_PASSWORD_MSG, CS_INCORRECT_PASSWORD_MSG

Features:
- Full backwards compatibility with existing --app-name/--welcome-text
- HTML escaping for security (prevents XSS)
- Config file support (YAML)
- Priority: CLI args > env vars > config file > defaults
- Internationalization preserved for non-customized messages

Perfect for Docker deployments and corporate branding.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
@strickvl strickvl requested a review from a team as a code owner June 12, 2025 17:19
@code-asher
Copy link
Member

code-asher commented Jun 13, 2025

Thank you for the contribution!

Thinking out loud, my first impression is that the flags are not scaling well. Since we have this concept of language files that we can use for strings in the app, I wonder if we can re-use this for user-provided strings as well? Maybe we have a flag that accepts a json file (or accepts raw json itself) and then we can pass that to the i18n library (merged with the default language file).

Then, all strings, including future ones, will automatically be available for configuration. What do you think?

We could then also deprecate --welcome-msg and --app-name.

@strickvl
Copy link
Author

Sounds good. I'll work on that change.

strickvl and others added 5 commits June 17, 2025 12:53
Replace non-scalable individual flags (--login-title, --login-below, etc.)
with a unified --custom-strings flag that accepts JSON file paths or inline
JSON for UI customization. This leverages the existing i18n system for
better scalability and maintainability.

Changes:
- Add --custom-strings flag with JSON validation
- Extend i18n system to merge custom strings with defaults
- Remove newly-added individual login/UI flags
- Deprecate legacy --app-name and --welcome-text flags
- Update login route to use unified i18n system
- Add comprehensive tests for new functionality
- Update documentation with migration guide and examples

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Remove migration examples for flags that were never released.
Only --app-name and --welcome-text were in the original codebase
and might be used by existing users.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Replace outdated CS_* environment variable examples with the new
--custom-strings flag approach. Include both inline JSON and
mounted file examples for Docker users.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
@strickvl
Copy link
Author

@code-asher is this in line with what you were thinking?

@strickvl strickvl closed this Jun 21, 2025
@strickvl strickvl reopened this Jun 21, 2025
Copy link
Member

@code-asher code-asher left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes this is exactly along the line I was thinking! Thank you, this is really great.

strickvl and others added 9 commits June 24, 2025 19:09
Remove login page customization sections from FAQ.md and install.md as they were too specific for those documents. Move customization reference to guide.md where it's more appropriate.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Remove duplicate validation in cli.ts since comprehensive validation already exists in loadCustomStrings(). Also eliminate unnecessary customStrings global variable by using customStringsData directly.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
…dling

Make customStringsArg parameter required since caller already checks existence. Remove redundant try-catch block in main.ts to avoid duplicate error logging since loadCustomStrings already provides descriptive error messages.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Remove tests for legacy individual flags (--login-title, --password-placeholder, --submit-text, etc.) that have been replaced by the unified --custom-strings flag. Also remove cleanup of non-existent environment variables in CLI tests.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Replace manual resource merging and re-initialization with i18next's built-in addResourceBundle API. This is more efficient, cleaner, and the idiomatic way to add custom translations dynamically.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Change "custom UI strings" to "custom translations" to better reflect that this feature uses the i18n system and could be used for more than just UI elements, making it more accurate and future-proof.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Remove deprecation from --app-name since it serves a valuable purpose for the {{app}} placeholder in custom strings, especially useful for internationalization. Update documentation to show how --app-name works with --custom-strings and clarify that only --welcome-text is deprecated.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Change CLI flag from --custom-strings to --i18n to use standard internationalization terminology. This is more accurate since the feature leverages the i18next system and follows industry conventions. Update all documentation, tests, and code references.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Replace login-specific customization.md with generic internationalization section in guide.md. This approach is more maintainable, reduces file sprawl, points to source files as truth, and encourages community contributions. Removes repetitive examples that could get out of sync.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
@strickvl strickvl requested a review from code-asher June 24, 2025 20:36
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants