diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000..459b484 Binary files /dev/null and b/public/favicon.ico differ diff --git a/src/app/app.config.ts b/src/app/app.config.ts index 00fc11a..5763c2d 100644 --- a/src/app/app.config.ts +++ b/src/app/app.config.ts @@ -43,6 +43,11 @@ export const appConfig: ApplicationConfig = { useFactory: (tenantResolver: TenantResolverService): MarketplacesAuthConfig => ({ apiUrl: environment.authApiUrl, marketplaceDomain: () => tenantResolver.getBaseDomain(), + // Admin login/password contract per docs/backend/BACKEND-INTEGRATION.md §1.2. + // Not live yet - backend endpoint doesn't exist, so every call here 404s + // until it ships. That's fine: the UI treats any failure as "something + // went wrong, try Telegram instead" and never surfaces the raw error. + credentialsPath: '/api/identity/v1/session', }), deps: [TenantResolverService] }, diff --git a/src/app/components/telegram-login/telegram-login.component.html b/src/app/components/telegram-login/telegram-login.component.html index 2cbef88..bf21ee8 100644 --- a/src/app/components/telegram-login/telegram-login.component.html +++ b/src/app/components/telegram-login/telegram-login.component.html @@ -64,6 +64,38 @@ } + @if (mode === 'admin') { + @if (!credentialsVisible()) { + + } @else { +
+ } + } +{{ (mode === 'admin' ? 'auth.adminLoginNote' : 'auth.loginNote') | translate }}
} diff --git a/src/app/components/telegram-login/telegram-login.component.scss b/src/app/components/telegram-login/telegram-login.component.scss index 8162c1e..88afb64 100644 --- a/src/app/components/telegram-login/telegram-login.component.scss +++ b/src/app/components/telegram-login/telegram-login.component.scss @@ -195,6 +195,91 @@ h2 { } } +.credentials-toggle { + display: block; + width: 100%; + margin-top: 16px; + padding: 10px; + border: none; + background: none; + color: var(--accent-color, #497671); + font-size: var(--font-size-sm, 0.8125rem); + cursor: pointer; + + &:hover { + text-decoration: underline; + } +} + +.credentials-form { + margin-top: 16px; + text-align: left; + + label { + display: block; + margin-bottom: 12px; + font-size: var(--font-size-sm, 0.8125rem); + color: var(--text-secondary, #666); + + input { + display: block; + width: 100%; + margin-top: 6px; + padding: 10px 12px; + border: 1px solid #e0e0e0; + border-radius: var(--radius-md, 12px); + font-size: var(--font-size-base, 0.875rem); + color: var(--text-primary, #1a1a1a); + background: var(--bg-card, #fff); + + &:focus { + outline: none; + border-color: var(--accent-color, #497671); + } + } + } + + .credentials-error { + margin: 0 0 12px; + font-size: var(--font-size-xs, 0.75rem); + color: #d32f2f; + line-height: 1.4; + } + + .credentials-actions { + display: flex; + gap: 10px; + } + + .credentials-submit { + flex: 1; + padding: 12px 20px; + border: none; + border-radius: var(--radius-md, 12px); + background: var(--accent-color, #497671); + color: #fff; + font-size: var(--font-size-base, 0.875rem); + font-weight: var(--font-weight-semibold, 600); + cursor: pointer; + transition: opacity 0.2s ease; + + &:disabled { + opacity: 0.6; + cursor: wait; + } + } + + .credentials-back { + padding: 12px 16px; + border: 1px solid #e0e0e0; + border-radius: var(--radius-md, 12px); + background: none; + color: var(--text-secondary, #666); + font-size: var(--font-size-base, 0.875rem); + cursor: pointer; + } +} + .login-note { margin: 16px 0 0; font-size: var(--font-size-xs, 0.75rem); diff --git a/src/app/components/telegram-login/telegram-login.component.ts b/src/app/components/telegram-login/telegram-login.component.ts index 02e624b..02f8697 100644 --- a/src/app/components/telegram-login/telegram-login.component.ts +++ b/src/app/components/telegram-login/telegram-login.component.ts @@ -1,6 +1,6 @@ -import { Component, ChangeDetectionStrategy, Input, Injector, Signal, inject, effect, OnDestroy, OnInit } from '@angular/core'; +import { Component, ChangeDetectionStrategy, Input, Injector, Signal, signal, inject, effect, OnDestroy, OnInit } from '@angular/core'; import { Router } from '@angular/router'; -import { AuthService, AdminAuthService, AuthSession } from '@marketplaces/auth'; +import { AuthService, AdminAuthService, AuthSession, MARKETPLACES_AUTH_GATEWAY } from '@marketplaces/auth'; import { LanguageService } from '../../services/language.service'; import { TranslatePipe } from '../../i18n/translate.pipe'; import { QrLoginEngine } from '../../shared/qr-login/qr-login.engine'; @@ -27,6 +27,7 @@ export class TelegramLoginComponent implements OnInit, OnDestroy { private readonly customerAuth = inject(AuthService); private readonly adminAuth = inject(AdminAuthService); + private readonly authGateway = inject(MARKETPLACES_AUTH_GATEWAY); private readonly injector = inject(Injector); private readonly router = inject(Router); private readonly languageService = inject(LanguageService); @@ -41,6 +42,17 @@ export class TelegramLoginComponent implements OnInit, OnDestroy { qrStatus!: Signal