feat(api): added theme colors

Author: thorsten

docs/openapi.json

@@ -945,7 +945,7 @@
         }
       }
     },
-    "/api/v4.0/faqs/latest": {
+    "v4.0/faqs/latest": {
       "get": {
         "tags": ["Public Endpoints"],
         "description": "This endpoint returns the latest FAQs for the given language provided by \"Accept-Language\".",
@@ -1901,6 +1901,23 @@
                       "type": "string",
                       "example": "https://localhost/assets/images/logo-transparent.svg"
                     },
+                    "themeColors": {
+                      "type": "object",
+                      "example": {
+                        "light": {
+                          "--bs-primary": "#083c83",
+                          "--bs-body-bg": "#ffffff"
+                        },
+                        "dark": {
+                          "--bs-primary": "#083c83",
+                          "--bs-body-bg": "var(--bs-dark)"
+                        },
+                        "highContrast": {
+                          "--bs-primary": "#ffff00",
+                          "--bs-body-bg": "#000000"
+                        }
+                      }
+                    },
                     "oauthDiscovery": {
                       "type": "object"
                     }

docs/openapi.yaml

@@ -681,7 +681,7 @@ paths:
             application/json:
               schema: {}
               example: []
-  /api/v4.0/faqs/latest:
+  v4.0/faqs/latest:
     get:
       tags:
         - 'Public Endpoints'
@@ -1350,6 +1350,16 @@ paths:
                   availableLanguages: { type: object, example: { de: German, en: English } }
                   enabledFeatures: { type: object }
                   publicLogoUrl: { type: string, example: 'https://localhost/assets/images/logo-transparent.svg' }
+                  themeColors:
+                    {
+                      type: object,
+                      example:
+                        {
+                          light: { '--bs-primary': '#083c83', '--bs-body-bg': '#ffffff' },
+                          dark: { '--bs-primary': '#083c83', '--bs-body-bg': var(--bs-dark) },
+                          highContrast: { '--bs-primary': '#ffff00', '--bs-body-bg': '#000000' },
+                        },
+                    }
                   oauthDiscovery: { type: object }
                 type: object
   /api/v4.0/news:

phpmyfaq/src/phpMyFAQ/Api/MetaService.php

@@ -38,6 +38,7 @@ public function __construct(
      *     availableLanguages: array<string, string>,
      *     enabledFeatures: array<string, bool>,
      *     publicLogoUrl: string,
+     *     themeColors: array<string, array<string, string>>,
      *     oauthDiscovery: array<string, bool|string|string[]>
      * }
      */
@@ -50,6 +51,7 @@ public function getPublicMetadata(): array
             'availableLanguages' => LanguageHelper::getAvailableLanguages(),
             'enabledFeatures' => $this->buildEnabledFeatures(),
             'publicLogoUrl' => $this->buildPublicLogoUrl(),
+            'themeColors' => $this->buildThemeColors(),
             'oauthDiscovery' => $this->oAuthDiscoveryService->getMetaDiscovery(),
         ];
     }
@@ -76,6 +78,61 @@ private function buildPublicLogoUrl(): string
         return rtrim($this->configuration->getDefaultUrl(), characters: '/') . '/assets/images/logo-transparent.svg';
     }
 
+    /**
+     * @return array<string, array<string, string>>
+     */
+    private function buildThemeColors(): array
+    {
+        $themeCssPath = PMF_ROOT_DIR . '/assets/templates/default/theme.css';
+        if (!is_readable($themeCssPath)) {
+            return [
+                'light' => [],
+                'dark' => [],
+                'highContrast' => [],
+            ];
+        }
+
+        $themeCss = file_get_contents($themeCssPath);
+        if ($themeCss === false) {
+            return [
+                'light' => [],
+                'dark' => [],
+                'highContrast' => [],
+            ];
+        }
+
+        return [
+            'light' => $this->extractThemeVariables($themeCss, ":root,\n[data-bs-theme='light']"),
+            'dark' => $this->extractThemeVariables($themeCss, "[data-bs-theme='dark']"),
+            'highContrast' => $this->extractThemeVariables($themeCss, "[data-bs-theme='high-contrast']"),
+        ];
+    }
+
+    /**
+     * @return array<string, string>
+     */
+    private function extractThemeVariables(string $themeCss, string $selector): array
+    {
+        $pattern = sprintf('/%s\s*\{(?P<body>.*?)^\}/ms', preg_quote($selector, delimiter: '/'));
+        if (preg_match($pattern, $themeCss, $matches) !== 1) {
+            return [];
+        }
+
+        preg_match_all(
+            '/(?P<name>--[A-Za-z0-9\-]+)\s*:\s*(?P<value>[^;]+);/',
+            $matches['body'],
+            $variableMatches,
+            PREG_SET_ORDER,
+        );
+
+        $variables = [];
+        foreach ($variableMatches as $variableMatch) {
+            $variables[$variableMatch['name']] = trim($variableMatch['value']);
+        }
+
+        return $variables;
+    }
+
     private function toBool(mixed $value): bool
     {
         return $value === true || $value === 1 || $value === '1' || $value === 'true';

phpmyfaq/src/phpMyFAQ/Controller/Api/MetaController.php

@@ -62,6 +62,20 @@ public function __construct(?MetaService $metaService = null)
                 type: 'string',
                 example: 'https://localhost/assets/images/logo-transparent.svg',
             ),
+            new OA\Property(property: 'themeColors', type: 'object', example: [
+                'light' => [
+                    '--bs-primary' => '#083c83',
+                    '--bs-body-bg' => '#ffffff',
+                ],
+                'dark' => [
+                    '--bs-primary' => '#083c83',
+                    '--bs-body-bg' => 'var(--bs-dark)',
+                ],
+                'highContrast' => [
+                    '--bs-primary' => '#ffff00',
+                    '--bs-body-bg' => '#000000',
+                ],
+            ]),
             new OA\Property(property: 'oauthDiscovery', type: 'object'),
         ]),
     )]

tests/phpMyFAQ/Api/MetaServiceTest.php

@@ -76,6 +76,10 @@ public function testGetPublicMetadataReturnsExpectedPayload(): void
         $this->assertFalse($payload['enabledFeatures']['opensearch']);
         $this->assertFalse($payload['enabledFeatures']['signInWithMicrosoft']);
         $this->assertStringEndsWith('/assets/images/logo-transparent.svg', $payload['publicLogoUrl']);
+        $this->assertSame('#083c83', $payload['themeColors']['light']['--bs-primary']);
+        $this->assertSame('#ffffff', $payload['themeColors']['light']['--bs-body-bg']);
+        $this->assertSame('var(--bs-dark)', $payload['themeColors']['dark']['--bs-body-bg']);
+        $this->assertSame('#ffff00', $payload['themeColors']['highContrast']['--bs-primary']);
         $this->assertTrue($payload['oauthDiscovery']['enabled']);
         $this->assertStringEndsWith('/api', $payload['oauthDiscovery']['issuer']);
         $this->assertStringEndsWith('/api/oauth/authorize', $payload['oauthDiscovery']['authorizationEndpoint']);

tests/phpMyFAQ/Controller/Api/MetaControllerWebTest.php

@@ -78,6 +78,8 @@ public function testMetaEndpointReturnsJsonMetadata(): void
         self::assertSame('application/json', $response->headers->get('Content-Type'));
         self::assertIsArray($payload);
         self::assertStringEndsWith('/assets/images/logo-transparent.svg', $payload['publicLogoUrl']);
+        self::assertSame('#083c83', $payload['themeColors']['light']['--bs-primary']);
+        self::assertSame('#000000', $payload['themeColors']['highContrast']['--bs-body-bg']);
         self::assertTrue($payload['enabledFeatures']['api']);
         self::assertTrue($payload['oauthDiscovery']['enabled']);
         self::assertStringEndsWith('/api/oauth/token', $payload['oauthDiscovery']['tokenEndpoint']);