Feature/separate Google OAuth and token authentication (#5915)

* Separate Google OAuth and token authentication

* Update changelog

CHANGELOG.md

@@ -11,9 +11,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Refactored the get holding functionality in the portfolio service
 - Changed the user data loading in the user detail dialog of the admin control panel’s users section to fetch data on demand
+- Exposed the authentication with access token as an environment variable (`ENABLE_FEATURE_AUTH_TOKEN`)
 - Improved the language localization for German (`de`)
 - Upgraded `prisma` from version `6.18.0` to `6.19.0`
 
+### Todo
+
+- Rename the environment variable from `ENABLE_FEATURE_SOCIAL_LOGIN` to `ENABLE_FEATURE_AUTH_GOOGLE`
+
 ## 2.216.0 - 2025-11-10
 
 ### Changed

apps/api/src/app/info/info.service.ts

@@ -51,6 +51,14 @@ export class InfoService {
 
     const globalPermissions: string[] = [];
 
+    if (this.configurationService.get('ENABLE_FEATURE_AUTH_GOOGLE')) {
+      globalPermissions.push(permissions.enableAuthGoogle);
+    }
+
+    if (this.configurationService.get('ENABLE_FEATURE_AUTH_TOKEN')) {
+      globalPermissions.push(permissions.enableAuthToken);
+    }
+
     if (this.configurationService.get('ENABLE_FEATURE_FEAR_AND_GREED_INDEX')) {
       if (this.configurationService.get('ENABLE_FEATURE_SUBSCRIPTION')) {
         info.fearAndGreedDataSource = encodeDataSource(
@@ -70,10 +78,6 @@ export class InfoService {
       );
     }
 
-    if (this.configurationService.get('ENABLE_FEATURE_SOCIAL_LOGIN')) {
-      globalPermissions.push(permissions.enableSocialLogin);
-    }
-
     if (this.configurationService.get('ENABLE_FEATURE_STATISTICS')) {
       globalPermissions.push(permissions.enableStatistics);
     }

apps/api/src/services/configuration/configuration.service.ts

@@ -40,9 +40,10 @@ export class ConfigurationService {
       DATA_SOURCES_GHOSTFOLIO_DATA_PROVIDER: json({
         default: []
       }),
+      ENABLE_FEATURE_AUTH_GOOGLE: bool({ default: false }),
+      ENABLE_FEATURE_AUTH_TOKEN: bool({ default: true }),
       ENABLE_FEATURE_FEAR_AND_GREED_INDEX: bool({ default: false }),
       ENABLE_FEATURE_READ_ONLY_MODE: bool({ default: false }),
-      ENABLE_FEATURE_SOCIAL_LOGIN: bool({ default: false }),
       ENABLE_FEATURE_STATISTICS: bool({ default: false }),
       ENABLE_FEATURE_SUBSCRIPTION: bool({ default: false }),
       ENABLE_FEATURE_SYSTEM_MESSAGE: bool({ default: false }),

apps/api/src/services/interfaces/environment.interface.ts

@@ -16,9 +16,10 @@ export interface Environment extends CleanedEnvAccessors {
   DATA_SOURCE_IMPORT: string;
   DATA_SOURCES: string[];
   DATA_SOURCES_GHOSTFOLIO_DATA_PROVIDER: string[];
+  ENABLE_FEATURE_AUTH_GOOGLE: boolean;
+  ENABLE_FEATURE_AUTH_TOKEN: boolean;
   ENABLE_FEATURE_FEAR_AND_GREED_INDEX: boolean;
   ENABLE_FEATURE_READ_ONLY_MODE: boolean;
-  ENABLE_FEATURE_SOCIAL_LOGIN: boolean;
   ENABLE_FEATURE_STATISTICS: boolean;
   ENABLE_FEATURE_SUBSCRIPTION: boolean;
   ENABLE_FEATURE_SYSTEM_MESSAGE: boolean;

apps/client/src/app/components/header/header.component.ts

@@ -105,7 +105,8 @@ export class GfHeaderComponent implements OnChanges {
 
   public hasFilters: boolean;
   public hasImpersonationId: boolean;
-  public hasPermissionForSocialLogin: boolean;
+  public hasPermissionForAuthGoogle: boolean;
+  public hasPermissionForAuthToken: boolean;
   public hasPermissionForSubscription: boolean;
   public hasPermissionToAccessAdminControl: boolean;
   public hasPermissionToAccessAssistant: boolean;
@@ -165,9 +166,14 @@ export class GfHeaderComponent implements OnChanges {
   public ngOnChanges() {
     this.hasFilters = this.userService.hasFilters();
 
-    this.hasPermissionForSocialLogin = hasPermission(
+    this.hasPermissionForAuthGoogle = hasPermission(
       this.info?.globalPermissions,
-      permissions.enableSocialLogin
+      permissions.enableAuthGoogle
+    );
+
+    this.hasPermissionForAuthToken = hasPermission(
+      this.info?.globalPermissions,
+      permissions.enableAuthToken
     );
 
     this.hasPermissionForSubscription = hasPermission(
@@ -280,7 +286,8 @@ export class GfHeaderComponent implements OnChanges {
       autoFocus: false,
       data: {
         accessToken: '',
-        hasPermissionToUseSocialLogin: this.hasPermissionForSocialLogin,
+        hasPermissionToUseAuthGoogle: this.hasPermissionForAuthGoogle,
+        hasPermissionToUseAuthToken: this.hasPermissionForAuthToken,
         title: $localize`Sign in`
       },
       width: '30rem'

apps/client/src/app/components/login-with-access-token-dialog/interfaces/interfaces.ts

@@ -1,5 +1,6 @@
 export interface LoginWithAccessTokenDialogParams {
   accessToken: string;
-  hasPermissionToUseSocialLogin: boolean;
+  hasPermissionToUseAuthGoogle: boolean;
+  hasPermissionToUseAuthToken: boolean;
   title: string;
 }

apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.html

@@ -3,6 +3,7 @@
 <div class="py-3" mat-dialog-content>
   <div class="align-items-center d-flex flex-column">
     <form class="w-100">
+      @if (data.hasPermissionToUseAuthToken) {
         <mat-form-field appearance="outline" class="without-hint w-100">
           <mat-label i18n>Security Token</mat-label>
           <input
@@ -22,9 +23,15 @@
             />
           </button>
         </mat-form-field>
+      }
 
-      @if (data.hasPermissionToUseSocialLogin) {
+      @if (
+        data.hasPermissionToUseAuthGoogle && data.hasPermissionToUseAuthToken
+      ) {
         <div class="my-3 text-center text-muted" i18n>or</div>
+      }
+
+      @if (data.hasPermissionToUseAuthGoogle) {
         <div class="d-flex flex-column">
           <a
             class="px-4 rounded-pill"
@@ -49,6 +56,7 @@
     >
   </div>
   <div>
+    @if (data.hasPermissionToUseAuthToken) {
       <button
         color="primary"
         mat-flat-button
@@ -59,5 +67,6 @@
       >
         <ng-container i18n>Sign in</ng-container>
       </button>
+    }
   </div>
 </div>

apps/client/src/app/pages/features/features-page.component.ts

@@ -25,6 +25,7 @@ import { Subject, takeUntil } from 'rxjs';
 })
 export class GfFeaturesPageComponent implements OnDestroy {
   public hasPermissionForSubscription: boolean;
+  public hasPermissionToCreateUser: boolean;
   public info: InfoItem;
   public routerLinkRegister = publicRoutes.register.routerLink;
   public routerLinkResources = publicRoutes.resources.routerLink;
@@ -55,6 +56,11 @@ export class GfFeaturesPageComponent implements OnDestroy {
       this.info?.globalPermissions,
       permissions.enableSubscription
     );
+
+    this.hasPermissionToCreateUser = hasPermission(
+      this.info?.globalPermissions,
+      permissions.createUserAccount
+    );
   }
 
   public ngOnDestroy() {

apps/client/src/app/pages/features/features-page.html

@@ -309,7 +309,7 @@
       </div>
     </div>
   </div>
-  @if (!user) {
+  @if (hasPermissionToCreateUser && !user) {
     <div class="row">
       <div class="col mt-3 text-center">
         <a

apps/client/src/app/pages/landing/landing-page.component.ts

@@ -127,6 +127,7 @@ export class GfLandingPageComponent implements OnDestroy, OnInit {
     }
 
     this.hasPermissionForDemo = !!demoAuthToken;
+
     this.hasPermissionForStatistics = hasPermission(
       globalPermissions,
       permissions.enableStatistics

apps/client/src/app/pages/pricing/pricing-page.component.ts

@@ -52,6 +52,7 @@ export class GfPricingPageComponent implements OnDestroy, OnInit {
   public coupon: number;
   public couponId: string;
   public durationExtension: StringValue;
+  public hasPermissionToCreateUser: boolean;
   public hasPermissionToUpdateUserSettings: boolean;
   public importAndExportTooltipBasic = translate(
     'DATA_IMPORT_AND_EXPORT_TOOLTIP_BASIC'
@@ -100,11 +101,18 @@ export class GfPricingPageComponent implements OnDestroy, OnInit {
   }
 
   public ngOnInit() {
-    const { baseCurrency, subscriptionOffer } = this.dataService.fetchInfo();
-    this.baseCurrency = baseCurrency;
+    const { baseCurrency, globalPermissions, subscriptionOffer } =
+      this.dataService.fetchInfo();
 
+    this.baseCurrency = baseCurrency;
     this.coupon = subscriptionOffer?.coupon;
     this.durationExtension = subscriptionOffer?.durationExtension;
+
+    this.hasPermissionToCreateUser = hasPermission(
+      globalPermissions,
+      permissions.createUserAccount
+    );
+
     this.label = subscriptionOffer?.label;
     this.price = subscriptionOffer?.price;
 

apps/client/src/app/pages/pricing/pricing-page.html

@@ -367,7 +367,7 @@
         </p>
       </div>
     </div>
-  } @else if (!user) {
+  } @else if (hasPermissionToCreateUser && !user) {
     <div class="row">
       <div class="col mt-3 text-center">
         <a

apps/client/src/app/pages/register/register-page.component.ts

@@ -30,7 +30,8 @@ import { GfUserAccountRegistrationDialogComponent } from './user-account-registr
 })
 export class GfRegisterPageComponent implements OnDestroy, OnInit {
   public deviceType: string;
-  public hasPermissionForSocialLogin: boolean;
+  public hasPermissionForAuthGoogle: boolean;
+  public hasPermissionForAuthToken: boolean;
   public hasPermissionForSubscription: boolean;
   public hasPermissionToCreateUser: boolean;
   public historicalDataItems: LineChartItem[];
@@ -55,9 +56,14 @@ export class GfRegisterPageComponent implements OnDestroy, OnInit {
 
     this.deviceType = this.deviceService.getDeviceInfo().deviceType;
 
-    this.hasPermissionForSocialLogin = hasPermission(
+    this.hasPermissionForAuthGoogle = hasPermission(
       globalPermissions,
-      permissions.enableSocialLogin
+      permissions.enableAuthGoogle
+    );
+
+    this.hasPermissionForAuthToken = hasPermission(
+      globalPermissions,
+      permissions.enableAuthToken
     );
 
     this.hasPermissionForSubscription = hasPermission(

apps/client/src/app/pages/register/register-page.html

@@ -18,6 +18,7 @@
     <div class="button-container row">
       <div class="align-items-center col d-flex justify-content-center">
         <div class="py-5 text-center">
+          @if (hasPermissionForAuthToken) {
             <button
               class="d-inline-block"
               color="primary"
@@ -26,8 +27,11 @@
             >
               <ng-container i18n>Create Account</ng-container>
             </button>
-          @if (hasPermissionForSocialLogin) {
+          }
+          @if (hasPermissionForAuthToken && hasPermissionForAuthGoogle) {
             <div class="my-3 text-muted" i18n>or</div>
+          }
+          @if (hasPermissionForAuthGoogle) {
             <a
               class="px-4 rounded-pill w-100"
               href="../api/v1/auth/google"

libs/common/src/lib/permissions.ts

@@ -28,11 +28,12 @@ export const permissions = {
   deleteTag: 'deleteTag',
   deleteUser: 'deleteUser',
   deleteWatchlistItem: 'deleteWatchlistItem',
+  enableAuthGoogle: 'enableAuthGoogle',
+  enableAuthToken: 'enableAuthToken',
   enableDataProviderGhostfolio: 'enableDataProviderGhostfolio',
   enableFearAndGreedIndex: 'enableFearAndGreedIndex',
   enableImport: 'enableImport',
   enableBlog: 'enableBlog',
-  enableSocialLogin: 'enableSocialLogin',
   enableStatistics: 'enableStatistics',
   enableSubscription: 'enableSubscription',
   enableSubscriptionInterstitial: 'enableSubscriptionInterstitial',
@@ -157,7 +158,7 @@ export function filterGlobalPermissions(
   if (aUtmSource === 'ios') {
     return globalPermissions.filter((permission) => {
       return (
-        permission !== permissions.enableSocialLogin &&
+        permission !== permissions.enableAuthGoogle &&
         permission !== permissions.enableSubscription
       );
     });