Themes: a Day theme's gradient that starts at white keeps its wallpaper

The check for the plain white the server gives a cloud theme's Day base (#752)
read only the first stop, so a wallPaperNoFile gradient from white to another
colour was taken for it too and gave way to the Classic wallpaper. It now asks
for a white alone, with the trailing 0 stops getWallPaperColors drops as no
colour, which is how the server sends that white.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

Author: morethanwords

src/config/themePresets.ts

@@ -11,7 +11,7 @@
  */
 
 import type {BaseTheme, Theme, ThemeSettings, WallPaper} from '@layer';
-import {hsvToRgb, rgbToHsv} from '@helpers/color';
+import {getColorsFromWallPaper, hsvToRgb, rgbToHsv} from '@helpers/color';
 
 export type AccentPresetWallpaper = {
   intensity: number,            // 1..100; sign is derived from `dark`
@@ -146,12 +146,13 @@ export function tintedBaseWallpaperFor(baseColor: BaseColorName): AccentPresetWa
 
 // The server gives the Day base of its cloud themes a plain white instead of a wallpaper; the theme's
 // own wallpaper is on its Classic base, which is a light one too. A white picked by the user is
-// kept on the AppTheme and never comes through here.
+// kept on the AppTheme and never comes through here. Only a white alone gives way (its trailing 0
+// stop is no colour, see getWallPaperColors): a gradient that starts at white is a wallpaper.
 export function getCloudThemeWallpaper(theme: Theme, themeSettings: ThemeSettings): WallPaper {
   const wallPaper = themeSettings.wallpaper;
   const isPlainDay = themeSettings.base_theme._ === 'baseThemeDay' &&
     wallPaper?._ === 'wallPaperNoFile' &&
-    wallPaper.settings?.background_color === 0xffffff;
+    getColorsFromWallPaper(wallPaper) === '#ffffff';
   return isPlainDay ? theme.settings.find((s) => s.base_theme._ === 'baseThemeClassic')?.wallpaper ?? wallPaper : wallPaper;
 }
 

src/tests/themeWallpaperFallback.test.ts

@@ -17,7 +17,8 @@ const makeTheme = (wallpaper?: Theme['settings'][number]['wallpaper']) => ({
 } as Theme);
 
 describe('the plain white the server gives the Day base of a cloud theme', () => {
-  const white = {_: 'wallPaperNoFile', id: 1, pFlags: {}, settings: {_: 'wallPaperSettings', pFlags: {}, background_color: 0xffffff}} as const;
+  // as the server sends it: a 0 in a later stop is no colour
+  const white = {_: 'wallPaperNoFile', id: 1, pFlags: {}, settings: {_: 'wallPaperSettings', pFlags: {}, background_color: 0xffffff, second_background_color: 0}} as const;
   const classic = {...factoryWallpaper, slug: 'classic'};
   const make = (base: 'baseThemeDay' | 'baseThemeNight', wallpaper: any) => {
     const entry = {_: 'themeSettings', pFlags: {}, base_theme: {_: base}, accent_color: 0, wallpaper} as any;
@@ -29,10 +30,13 @@ describe('the plain white the server gives the Day base of a cloud theme', () =>
     expect(getCloudThemeWallpaper(theme, theme.settings[0])).toBe(classic);
   });
 
-  test('another colour, or another base, stays', () => {
+  test('another colour, a gradient from white, or another base, stays', () => {
     const colored = {...white, settings: {...white.settings, background_color: 0xff0000}};
     const day = make('baseThemeDay', colored);
     expect(getCloudThemeWallpaper(day, day.settings[0])).toBe(colored);
+    const gradient = {...white, settings: {...white.settings, second_background_color: 0x2d7ed5}};
+    const gradientDay = make('baseThemeDay', gradient);
+    expect(getCloudThemeWallpaper(gradientDay, gradientDay.settings[0])).toBe(gradient);
     const night = make('baseThemeNight', white);
     expect(getCloudThemeWallpaper(night, night.settings[0])).toBe(white);
   });