fix(web): fix Theme Custom CSS endpoint requiring the user to be logged in as the server admin (#4633)

* fix custom css requiring the user to be the admin and logged in

* move theme api to custom endpoint

* add e2e test

server/immich-openapi-specs.json

@@ -4126,6 +4126,27 @@
         ]
       }
     },
+    "/server-info/theme": {
+      "get": {
+        "operationId": "getTheme",
+        "parameters": [],
+        "responses": {
+          "200": {
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/ServerThemeDto"
+                }
+              }
+            },
+            "description": ""
+          }
+        },
+        "tags": [
+          "Server Info"
+        ]
+      }
+    },
     "/server-info/version": {
       "get": {
         "operationId": "getServerVersion",
@@ -7812,6 +7833,17 @@
         ],
         "type": "object"
       },
+      "ServerThemeDto": {
+        "properties": {
+          "theme": {
+            "$ref": "#/components/schemas/SystemConfigThemeDto"
+          }
+        },
+        "required": [
+          "theme"
+        ],
+        "type": "object"
+      },
       "ServerVersionResponseDto": {
         "properties": {
           "major": {

server/src/domain/server-info/server-info.dto.ts

@@ -1,5 +1,6 @@
 import { FeatureFlags, IServerVersion } from '@app/domain';
 import { ApiProperty, ApiResponseProperty } from '@nestjs/swagger';
+import { SystemConfigThemeDto } from '../system-config/dto/system-config-theme.dto';
 
 export class ServerPingResponse {
   @ApiResponseProperty({ type: String, example: 'pong' })
@@ -79,6 +80,10 @@ export class ServerMediaTypesResponseDto {
   sidecar!: string[];
 }
 
+export class ServerThemeDto {
+  theme!: SystemConfigThemeDto;
+}
+
 export class ServerConfigDto {
   oauthButtonText!: string;
   loginPageMessage!: string;

server/src/domain/server-info/server-info.service.ts

@@ -70,6 +70,11 @@ export class ServerInfoService {
     return this.configCore.getFeatures();
   }
 
+  async getTheme() {
+    const { theme } = await this.configCore.getConfig();
+    return { theme };
+  }
+
   async getConfig(): Promise<ServerConfigDto> {
     const config = await this.configCore.getConfig();
 

server/src/domain/system-config/system-config.service.spec.ts

@@ -298,4 +298,10 @@ describe(SystemConfigService.name, () => {
       subscription.unsubscribe();
     });
   });
+
+  describe('getTheme', () => {
+    it('should return the default theme', async () => {
+      await expect(sut.getTheme()).resolves.toEqual(defaults.theme);
+    });
+  });
 });

server/src/domain/system-config/system-config.service.ts

@@ -1,6 +1,7 @@
 import { Inject, Injectable } from '@nestjs/common';
 import { JobName } from '../job';
 import { CommunicationEvent, ICommunicationRepository, IJobRepository, ISystemConfigRepository } from '../repositories';
+import { SystemConfigThemeDto } from './dto/system-config-theme.dto';
 import { SystemConfigDto, mapConfig } from './dto/system-config.dto';
 import { SystemConfigTemplateStorageOptionDto } from './response-dto/system-config-template-storage-option.dto';
 import {
@@ -30,6 +31,11 @@ export class SystemConfigService {
     return this.core.config$;
   }
 
+  async getTheme(): Promise<SystemConfigThemeDto> {
+    const { theme } = await this.core.getConfig();
+    return theme;
+  }
+
   async getConfig(): Promise<SystemConfigDto> {
     const config = await this.core.getConfig();
     return mapConfig(config);

server/src/immich/controllers/server-info.controller.ts

@@ -6,6 +6,7 @@ import {
   ServerMediaTypesResponseDto,
   ServerPingResponse,
   ServerStatsResponseDto,
+  ServerThemeDto,
   ServerVersionResponseDto,
 } from '@app/domain';
 import { Controller, Get } from '@nestjs/common';
@@ -43,6 +44,12 @@ export class ServerInfoController {
     return this.service.getFeatures();
   }
 
+  @PublicRoute()
+  @Get('theme')
+  getTheme(): Promise<ServerThemeDto> {
+    return this.service.getTheme();
+  }
+
   @PublicRoute()
   @Get('config')
   getServerConfig(): Promise<ServerConfigDto> {

server/test/e2e/server-info.e2e-spec.ts

@@ -155,4 +155,16 @@ describe(`${ServerInfoController.name} (e2e)`, () => {
       });
     });
   });
+
+  describe('GET /server-info/theme', () => {
+    it('should respond with the server theme', async () => {
+      const { status, body } = await request(server).get('/server-info/theme');
+      expect(status).toBe(200);
+      expect(body).toEqual({
+        theme: {
+          customCss: '',
+        },
+      });
+    });
+  });
 });