diff --git a/ui-ngx/src/app/core/http/mobile-app.service.ts b/ui-ngx/src/app/core/http/mobile-app.service.ts index ded753f39c..7b108e487c 100644 --- a/ui-ngx/src/app/core/http/mobile-app.service.ts +++ b/ui-ngx/src/app/core/http/mobile-app.service.ts @@ -18,7 +18,7 @@ import { HttpClient } from '@angular/common/http'; import { Injectable } from '@angular/core'; import { defaultHttpOptionsFromConfig, RequestConfig } from '@core/http/http-utils'; import { Observable } from 'rxjs'; -import { MobileAppSettings, MobileAppStoreLinks } from '@shared/models/mobile-app.models'; +import { MobileAppSettings } from '@shared/models/mobile-app.models'; @Injectable({ providedIn: 'root' @@ -42,8 +42,4 @@ export class MobileAppService { return this.http.get(`/api/mobile/deepLink`, defaultHttpOptionsFromConfig(config)); } - public getMobileAppStoreLinks(config?: RequestConfig): Observable { - return this.http.get('/api/mobile/app/storeLinks', defaultHttpOptionsFromConfig(config)); - } - } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/mobile-app-qrcode-widget.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/mobile-app-qrcode-widget.component.html index a682e26c1d..b526cfd079 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/mobile-app-qrcode-widget.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/mobile-app-qrcode-widget.component.html @@ -26,14 +26,17 @@ [class.row]="mobileAppSettings?.qrCodeConfig.badgePosition === badgePosition.RIGHT" [class.row-reverse]="mobileAppSettings?.qrCodeConfig.badgePosition === badgePosition.LEFT">
-
- - +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/mobile-app-qrcode-widget.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/mobile-app-qrcode-widget.component.scss index fd51d8af4a..1447e5cf61 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/mobile-app-qrcode-widget.component.scss +++ b/ui-ngx/src/app/modules/home/components/widget/lib/mobile-app-qrcode-widget.component.scss @@ -68,17 +68,22 @@ flex-direction: column; flex: 0.44; gap: 8px; - img { - cursor: pointer; + &.tb-no-interaction { + pointer-events: none; + } + a { + display: contents; + border-bottom: none; + &:hover { + border-bottom: none; + } } } } :host ::ng-deep { - .tb-mobile-app-qrcode-panel { - > div.tb-widget-title { - padding: 0; - z-index: 1; - } + .tb-mobile-app-qrcode-panel .tb-widget-title { + padding: 0; + z-index: 1; } } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/mobile-app-qrcode-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/mobile-app-qrcode-widget.component.ts index 4a49cfd6b8..b484b9eed1 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/mobile-app-qrcode-widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/mobile-app-qrcode-widget.component.ts @@ -90,6 +90,13 @@ export class MobileAppQrcodeWidgetComponent extends PageComponent implements OnI if (!this.mobileAppSettings) { this.mobileAppService.getMobileAppSettings().subscribe((settings => { this.mobileAppSettings = settings; + + const useDefaultApp = this.mobileAppSettings.useDefaultApp; + this.appStoreLink = useDefaultApp ? this.mobileAppSettings.defaultAppStoreLink : + this.mobileAppSettings.iosConfig.storeLink; + this.googlePlayLink = useDefaultApp ? this.mobileAppSettings.defaultGooglePlayLink : + this.mobileAppSettings.androidConfig.storeLink; + if (isDefinedAndNotNull(this.ctx.settings.useSystemSettings) && !this.ctx.settings.useSystemSettings) { this.mobileAppSettings = mergeDeep(this.mobileAppSettings, this.ctx.settings); } @@ -111,10 +118,6 @@ export class MobileAppQrcodeWidgetComponent extends PageComponent implements OnI } else { this.previewMode = true; } - this.mobileAppService.getMobileAppStoreLinks().subscribe(storeLinks => { - this.googlePlayLink = storeLinks.googlePlayLink; - this.appStoreLink = storeLinks.appStoreLink; - }); this.initMobileAppQRCode(); } @@ -137,13 +140,6 @@ export class MobileAppQrcodeWidgetComponent extends PageComponent implements OnI } } - navigateByStoreLink($event, storeLink: string) { - if ($event) { - $event.stopPropagation(); - } - window.open(storeLink, '_blank'); - } - private initMobileAppQRCode() { if (this.deepLinkTTLTimeoutID) { clearTimeout(this.deepLinkTTLTimeoutID); diff --git a/ui-ngx/src/app/modules/home/pages/admin/mobile-app-settings.component.html b/ui-ngx/src/app/modules/home/pages/admin/mobile-app-settings.component.html index 4b82f17a5f..51e7c6f43d 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/mobile-app-settings.component.html +++ b/ui-ngx/src/app/modules/home/pages/admin/mobile-app-settings.component.html @@ -82,6 +82,15 @@
{{ 'admin.mobile-app.google-play-link' | translate }}
+ + warning +
@@ -116,6 +125,15 @@
{{ 'admin.mobile-app.app-store-link' | translate }}
+ + warning + diff --git a/ui-ngx/src/app/modules/home/pages/admin/mobile-app-settings.component.ts b/ui-ngx/src/app/modules/home/pages/admin/mobile-app-settings.component.ts index 250db94267..0f2527d833 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/mobile-app-settings.component.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/mobile-app-settings.component.ts @@ -57,14 +57,18 @@ export class MobileAppSettingsComponent extends PageComponent implements HasConf if (value) { this.mobileAppSettingsForm.get('androidConfig.appPackage').disable({emitEvent: false}); this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').disable({emitEvent: false}); + this.mobileAppSettingsForm.get('androidConfig.storeLink').disable({emitEvent: false}); this.mobileAppSettingsForm.get('iosConfig.appId').disable({emitEvent: false}); + this.mobileAppSettingsForm.get('iosConfig.storeLink').disable({emitEvent: false}); } else { if (this.mobileAppSettingsForm.get('androidConfig.enabled').value) { this.mobileAppSettingsForm.get('androidConfig.appPackage').enable({emitEvent: false}); this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').enable({emitEvent: false}); + this.mobileAppSettingsForm.get('androidConfig.storeLink').enable({emitEvent: false}); } if (this.mobileAppSettingsForm.get('iosConfig.enabled').value) { this.mobileAppSettingsForm.get('iosConfig.appId').enable({emitEvent: false}); + this.mobileAppSettingsForm.get('iosConfig.storeLink').enable({emitEvent: false}); } } }); @@ -129,12 +133,12 @@ export class MobileAppSettingsComponent extends PageComponent implements HasConf enabled: [true], appPackage: [{value: '', disabled: true}, [Validators.required]], sha256CertFingerprints: [{value: '', disabled: true}, [Validators.required]], - storeLink: [''] + storeLink: ['', [Validators.required]] }), iosConfig: this.fb.group({ enabled: [true], appId: [{value: '', disabled: true}, [Validators.required]], - storeLink: [''] + storeLink: ['', [Validators.required]] }), qrCodeConfig: this.fb.group({ showOnHomePage: [true], @@ -156,10 +160,12 @@ export class MobileAppSettingsComponent extends PageComponent implements HasConf if (!this.mobileAppSettingsForm.get('useDefaultApp').value) { this.mobileAppSettingsForm.get('androidConfig.appPackage').enable({emitEvent: false}); this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').enable({emitEvent: false}); + this.mobileAppSettingsForm.get('androidConfig.storeLink').enable({emitEvent: false}); } } else { this.mobileAppSettingsForm.get('androidConfig.appPackage').disable({emitEvent: false}); this.mobileAppSettingsForm.get('androidConfig.sha256CertFingerprints').disable({emitEvent: false}); + this.mobileAppSettingsForm.get('androidConfig.storeLink').disable({emitEvent: false}); } this.mobileAppSettingsForm.get('qrCodeConfig.badgeEnabled').updateValueAndValidity({onlySelf: true}); } @@ -168,9 +174,11 @@ export class MobileAppSettingsComponent extends PageComponent implements HasConf if (value) { if (!this.mobileAppSettingsForm.get('useDefaultApp').value) { this.mobileAppSettingsForm.get('iosConfig.appId').enable({emitEvent: false}); + this.mobileAppSettingsForm.get('iosConfig.storeLink').enable({emitEvent: false}); } } else { this.mobileAppSettingsForm.get('iosConfig.appId').disable({emitEvent: false}); + this.mobileAppSettingsForm.get('iosConfig.storeLink').disable({emitEvent: false}); } this.mobileAppSettingsForm.get('qrCodeConfig.badgeEnabled').updateValueAndValidity({onlySelf: true}); } diff --git a/ui-ngx/src/app/shared/models/mobile-app.models.ts b/ui-ngx/src/app/shared/models/mobile-app.models.ts index 5ce28802cf..b879a9eb45 100644 --- a/ui-ngx/src/app/shared/models/mobile-app.models.ts +++ b/ui-ngx/src/app/shared/models/mobile-app.models.ts @@ -21,6 +21,8 @@ export interface MobileAppSettings extends HasTenantId { androidConfig: AndroidConfig; iosConfig: IosConfig; qrCodeConfig: QRCodeConfig; + defaultGooglePlayLink: string; + defaultAppStoreLink: string; } export interface AndroidConfig { @@ -54,11 +56,6 @@ export enum BadgePosition { LEFT = 'LEFT' } -export interface MobileAppStoreLinks { - googlePlayLink: string; - appStoreLink: string; -} - export const badgePositionTranslationsMap = new Map([ [BadgePosition.RIGHT, 'admin.mobile-app.right'], [BadgePosition.LEFT, 'admin.mobile-app.left'] diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json index 90e455b925..e852ffbc3c 100644 --- a/ui-ngx/src/assets/locale/locale.constant-en_US.json +++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json @@ -438,7 +438,9 @@ "app-id": "App ID", "app-id-required": "App ID is required", "google-play-link": "Google Play link", + "google-play-link-required": "Google Play link is required", "app-store-link": "App Store link", + "app-store-link-required": "App Store link is required", "appearance": "Appearance", "appearance-on-home-page": "Appearance on Home page", "enabled": "Enabled", @@ -5567,7 +5569,9 @@ }, "widgets": { "mobile-app-qr-code": { - "configuration-hint": "The configuration depends on the Mobile app QR code widget in platform main settings" + "configuration-hint": "The configuration depends on the Mobile app QR code widget in platform main settings", + "get-it-on-google-play": "Get it on Google Play", + "download-on-the-app-store": "Download on the App Store" }, "action-button": { "behavior": "Behavior",