Skip to content

optimize login page#434

Merged
Oceania2018 merged 1 commit intoSciSharp:mainfrom
hchen2020:main
Mar 19, 2026
Merged

optimize login page#434
Oceania2018 merged 1 commit intoSciSharp:mainfrom
hchen2020:main

Conversation

@hchen2020
Copy link
Contributor

No description provided.

@qodo-code-review
Copy link

Review Summary by Qodo

Modernize login page UI with enhanced styling and simplified auth flow

✨ Enhancement

Grey Divider

Walkthroughs

Description
• Removed tenant selection logic and multi-tenant support from login flow
• Redesigned login UI with modern gradient header, improved form styling, and animations
• Added comprehensive CSS styling with dark mode support and responsive design
• Enhanced form inputs with icons, better visual hierarchy, and improved accessibility
• Simplified authentication flow by removing tenant options management
Diagram
flowchart LR
  A["Old Login Page"] -->|Remove tenant logic| B["Simplified Auth Flow"]
  A -->|Replace styling| C["Modern UI Design"]
  C -->|Add| D["Gradient Header"]
  C -->|Add| E["Icon-based Inputs"]
  C -->|Add| F["CSS Animations"]
  C -->|Add| G["Dark Mode Support"]
  B --> H["Updated Login Component"]
  D --> H
  E --> H
  F --> H
  G --> H
Loading

Grey Divider

File Changes

1. src/routes/(authentication)/login/+page.svelte ✨ Enhancement +775/-286

Modernize login UI with simplified auth and comprehensive styling

• Removed getTenantOptions import and all tenant selection UI components and logic
• Simplified onSubmit function by removing tenant validation and tenant name management
• Removed tenantId and tenantOptions state variables and related reactive logic
• Refactored form inputs with icon wrappers, improved placeholder text, and modern styling classes
• Added comprehensive <style> block with 800+ lines of modern CSS including gradients, animations,
 dark mode support, and responsive design
• Restructured HTML layout with new semantic sections: auth-header, auth-form-section, auth-footer
 with improved visual hierarchy
• Enhanced password toggle button styling and social login buttons with individual brand colors
• Added form options section with remember-me checkbox and forgot password link in single row layout

src/routes/(authentication)/login/+page.svelte


Grey Divider

Qodo Logo

@qodo-code-review
Copy link

qodo-code-review bot commented Mar 19, 2026

Code Review by Qodo

🐞 Bugs (3) 📘 Rule violations (0) 📎 Requirement gaps (0) 📐 Spec deviations (0)

Grey Divider


Action required

1. Tenant context always cleared 🐞 Bug ✓ Correctness
Description
The login page now always calls getToken with an empty tenantId, so the auth request never includes
the __tenant header and login clears any existing tenantId/tenantName. This removes any ability to
log into a specific tenant and causes subsequent API calls to omit __tenant, breaking tenant-scoped
behavior.
Code

src/routes/(authentication)/login/+page.svelte[65]

+    await getToken(username, password, '', () => {
Evidence
The login page hardcodes tenantId to '' when calling getToken, and auth-service only attaches
__tenant + persists tenantId when tenantId is truthy; otherwise it clears tenant state. The HTTP
interceptor also only adds __tenant when a tenantId exists, and the layout header listens for
tenantChanged/tenantName, indicating tenant context is part of normal app behavior.

src/routes/(authentication)/login/+page.svelte[60-77]
src/lib/services/auth-service.js[12-50]
src/lib/helpers/http.js[106-121]
src/routes/VerticalLayout/Header.svelte[25-35]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

### Issue description
Multi-tenant login is effectively disabled because the login page always passes an empty `tenantId` to `getToken()`, which prevents `__tenant` from being sent and clears tenant state.

### Issue Context
`getToken()` only sets the `__tenant` header (and persists tenant id/name) when `tenantId` is non-empty; the axios interceptor also only attaches `__tenant` when a tenant id exists.

### Fix Focus Areas
- src/routes/(authentication)/login/+page.svelte[16-89]
- src/lib/services/auth-service.js[12-50]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


2. Unvalidated redirect parameter 🐞 Bug ⛨ Security
Description
After successful login, the page navigates to the redirect query parameter by assigning it
directly to window.location.href without any validation. This enables an attacker-controlled open
redirect (and can allow navigation to dangerous URL schemes).
Code

src/routes/(authentication)/login/+page.svelte[R69-74]

+      const redirectUrl = $page.url.searchParams.get('redirect');
+      isSubmitting = false;
+      resetStorage();
+      if (redirectUrl) {
+        window.location.href = decodeURIComponent(redirectUrl);
+      } else {
Evidence
The login success callback reads redirect from the URL query string and assigns it to
window.location.href after decodeURIComponent, without restricting to same-origin or safe
relative paths.

src/routes/(authentication)/login/+page.svelte[69-76]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

### Issue description
The login page performs a post-auth redirect to a user-controlled query parameter (`redirect`) without validation, enabling open redirect attacks.

### Issue Context
Current code uses `window.location.href = decodeURIComponent(redirectUrl)` directly.

### Fix Focus Areas
- src/routes/(authentication)/login/+page.svelte[69-76]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


3. Admin password shipped client 🐞 Bug ⛨ Security
Description
The login form is pre-populated from PUBLIC_ADMIN_USERNAME/PUBLIC_ADMIN_PASSWORD, which are
public build-time variables exposed to every browser. The repo .env defines concrete values, so
default credentials are shipped to clients and shown in the UI.
Code

src/routes/(authentication)/login/+page.svelte[R36-37]

+  let username = PUBLIC_ADMIN_USERNAME;
+  let password = PUBLIC_ADMIN_PASSWORD;
Evidence
The login page initializes username/password from $env/static/public variables. The repository
.env sets these variables to a real email and a simple password, meaning those credentials are
embedded in the client bundle and rendered into the password field by default.

src/routes/(authentication)/login/+page.svelte[20-42]
.env[16-19]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

### Issue description
Default admin credentials are exposed to all users because the login page pre-fills the form from `PUBLIC_ADMIN_USERNAME` and `PUBLIC_ADMIN_PASSWORD`.

### Issue Context
Anything under `$env/static/public` is intended for client-side exposure; secrets/passwords must not be placed there.

### Fix Focus Areas
- src/routes/(authentication)/login/+page.svelte[20-42]
- .env[16-19]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


Grey Divider

ⓘ The new review experience is currently in Beta. Learn more

Grey Divider

Qodo Logo

@Oceania2018 Oceania2018 merged commit e51cd55 into SciSharp:main Mar 19, 2026
    isSubmitting = true;
    handleRememberMe();
    e.preventDefault();
    await getToken(username, password, '', () => {

Choose a reason for hiding this comment

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

Action required

1. Tenant context always cleared 🐞 Bug ✓ Correctness

The login page now always calls getToken with an empty tenantId, so the auth request never includes
the __tenant header and login clears any existing tenantId/tenantName. This removes any ability to
log into a specific tenant and causes subsequent API calls to omit __tenant, breaking tenant-scoped
behavior.
Agent Prompt
### Issue description
Multi-tenant login is effectively disabled because the login page always passes an empty `tenantId` to `getToken()`, which prevents `__tenant` from being sent and clears tenant state.

### Issue Context
`getToken()` only sets the `__tenant` header (and persists tenant id/name) when `tenantId` is non-empty; the axios interceptor also only attaches `__tenant` when a tenant id exists.

### Fix Focus Areas
- src/routes/(authentication)/login/+page.svelte[16-89]
- src/lib/services/auth-service.js[12-50]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

Comment on lines +69 to +74
      const redirectUrl = $page.url.searchParams.get('redirect');
      isSubmitting = false;
      resetStorage();
      if (redirectUrl) {
        window.location.href = decodeURIComponent(redirectUrl);
      } else {

Choose a reason for hiding this comment

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

Action required

2. Unvalidated redirect parameter 🐞 Bug ⛨ Security

After successful login, the page navigates to the redirect query parameter by assigning it
directly to window.location.href without any validation. This enables an attacker-controlled open
redirect (and can allow navigation to dangerous URL schemes).
Agent Prompt
### Issue description
The login page performs a post-auth redirect to a user-controlled query parameter (`redirect`) without validation, enabling open redirect attacks.

### Issue Context
Current code uses `window.location.href = decodeURIComponent(redirectUrl)` directly.

### Fix Focus Areas
- src/routes/(authentication)/login/+page.svelte[69-76]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

Comment on lines +36 to +37
  let username = PUBLIC_ADMIN_USERNAME;
  let password = PUBLIC_ADMIN_PASSWORD;

Choose a reason for hiding this comment

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

Action required

3. Admin password shipped client 🐞 Bug ⛨ Security

The login form is pre-populated from PUBLIC_ADMIN_USERNAME/PUBLIC_ADMIN_PASSWORD, which are
public build-time variables exposed to every browser. The repo .env defines concrete values, so
default credentials are shipped to clients and shown in the UI.
Agent Prompt
### Issue description
Default admin credentials are exposed to all users because the login page pre-fills the form from `PUBLIC_ADMIN_USERNAME` and `PUBLIC_ADMIN_PASSWORD`.

### Issue Context
Anything under `$env/static/public` is intended for client-side exposure; secrets/passwords must not be placed there.

### Fix Focus Areas
- src/routes/(authentication)/login/+page.svelte[20-42]
- .env[16-19]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

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