sessions: Preserve background layouts per color scheme

src/vs/sessions/contrib/chat/browser/chat.contribution.ts

@@ -54,7 +54,7 @@ import { ISessionsChatViewStateService, SessionsChatViewStateService } from './c
 import { SessionsChatResponseFileChangesService } from './sessionTurnChanges.js';
 import { IChatResponseFileChangesService } from '../../../../workbench/contrib/chat/browser/chatResponseFileChangesService.js';
 import { SessionsChatPetAchievementContribution } from './chatPetAchievements.js';
-import { AGENT_SESSIONS_CHAT_BACKGROUND_CODICONS_PRESET, AGENT_SESSIONS_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING, AGENT_SESSIONS_PREFERRED_DARK_CHAT_BACKGROUND_IMAGE_SETTING, AGENT_SESSIONS_PREFERRED_LIGHT_CHAT_BACKGROUND_IMAGE_SETTING, chatBackgroundImageLayoutValues, ChatBackgroundImageLayout, ISessionsChatBackgroundService, SessionsChatBackgroundService } from '../../../services/chatBackground/browser/chatBackgroundService.js';
+import { AGENT_SESSIONS_CHAT_BACKGROUND_CODICONS_PRESET, AGENT_SESSIONS_PREFERRED_DARK_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING, AGENT_SESSIONS_PREFERRED_DARK_CHAT_BACKGROUND_IMAGE_SETTING, AGENT_SESSIONS_PREFERRED_LIGHT_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING, AGENT_SESSIONS_PREFERRED_LIGHT_CHAT_BACKGROUND_IMAGE_SETTING, chatBackgroundImageLayoutValues, ChatBackgroundImageLayout, ISessionsChatBackgroundService, SessionsChatBackgroundService } from '../../../services/chatBackground/browser/chatBackgroundService.js';
 
 const CHANGE_AGENT_SESSIONS_CHAT_BACKGROUND_COMMAND_ID = 'workbench.action.chat.changeAgentSessionsBackground';
 const CHANGE_AGENT_SESSIONS_CHAT_BACKGROUND_LAYOUT_COMMAND_ID = 'workbench.action.chat.changeAgentSessionsBackgroundLayout';
@@ -140,6 +140,12 @@ const chatBackgroundImageLayoutItems = chatBackgroundImageLayoutValues.map(layou
 	...chatBackgroundImageLayoutMetadata[layout],
 }));
 
+const chatBackgroundImageLayoutEnumConfiguration = {
+	enum: [...chatBackgroundImageLayoutValues],
+	enumItemLabels: chatBackgroundImageLayoutItems.map(item => item.label),
+	enumDescriptions: chatBackgroundImageLayoutItems.map(item => item.detail),
+};
+
 class NewChatInSessionsWindowAction extends Action2 {
 
 	constructor() {
@@ -392,15 +398,23 @@ Registry.as<IConfigurationRegistry>(ConfigurationExtensions.Configuration).regis
 			tags: ['experimental'],
 			ignoreSync: true,
 		},
-		[AGENT_SESSIONS_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING]: {
+		[AGENT_SESSIONS_PREFERRED_DARK_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING]: {
 			type: 'string',
-			enum: [...chatBackgroundImageLayoutValues],
-			enumItemLabels: chatBackgroundImageLayoutItems.map(item => item.label),
-			enumDescriptions: chatBackgroundImageLayoutItems.map(item => item.detail),
+			...chatBackgroundImageLayoutEnumConfiguration,
 			default: 'repeat',
-			scope: ConfigurationScope.APPLICATION,
-			markdownDescription: localize('chat.agentSessions.backgroundImageLayout', "Controls how the dark and light chat background images are laid out in the Agents Window."),
+			scope: ConfigurationScope.MACHINE,
+			markdownDescription: localize('chat.agentSessions.preferredDarkBackgroundImageLayout', "Controls how the chat background image is laid out in the Agents Window when using a dark color theme."),
 			tags: ['experimental'],
+			ignoreSync: true,
+		},
+		[AGENT_SESSIONS_PREFERRED_LIGHT_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING]: {
+			type: 'string',
+			...chatBackgroundImageLayoutEnumConfiguration,
+			default: 'repeat',
+			scope: ConfigurationScope.MACHINE,
+			markdownDescription: localize('chat.agentSessions.preferredLightBackgroundImageLayout', "Controls how the chat background image is laid out in the Agents Window when using a light color theme."),
+			tags: ['experimental'],
+			ignoreSync: true,
 		},
 	},
 });

src/vs/sessions/contrib/chat/browser/sessionsChatAccessibilityHelp.ts

@@ -51,7 +51,7 @@ export class SessionsChatAccessibilityHelp implements IAccessibleViewImplementat
 		content.push(localize('sessionsChat.quickChat', "To start a workspace-less quick chat, use the New Quick Chat command{0} or the plus button on the Chats section in the sessions list. A quick chat has no workspace, so the workspace picker does not apply and the Toggle Side Panel command is disabled.", '<keybinding:sessionsView.newQuickChat>'));
 		content.push(localize('sessionsChat.mobileConfig', "On mobile, the mode and model pickers appear as tappable chips below the input. Tap a chip to open a bottom sheet where you can change the selection."));
 		content.push(localize('sessionsChat.history', "Use up and down arrows to navigate your request history in the input box."));
-		content.push(localize('sessionsChat.background', "Outside high contrast themes, use Set Background to choose no background, the built-in theme-aware Codicons pattern, a new image, or one of the five most recently selected images. Use Change Background Layout to choose whether an image repeats, stretches, or appears at an edge or corner. Moving through the layout picker previews each option; select one to save it, or press Escape to restore the previous layout. Both commands are available from the Command Palette and by right-clicking empty chat space. Change Background Layout is shown only for images. Background customization is unavailable while a high contrast theme is active."));
+		content.push(localize('sessionsChat.background', "Outside high contrast themes, use Set Background to choose no background, the built-in theme-aware Codicons pattern, a new image, or one of the five most recently selected images. Use Change Background Layout to choose whether an image repeats, stretches, or appears at an edge or corner for the current color theme. Moving through the layout picker previews each option; select one to save it, or press Escape to restore the previous layout. Both commands are available from the Command Palette and by right-clicking empty chat space. Change Background Layout is shown only for images. Background customization is unavailable while a high contrast theme is active."));
 		content.push(localize('sessionsChat.vscodePet', "Use the checked Pet item in the new-session view context menu, or type /vscode-pet, to show or hide the VS Code pet above the input. Drag it horizontally to reposition it, or use Tab to focus it and the left and right arrow keys to move it. Press Enter or Space to show it some love."));
 		content.push(localize('sessionsChat.vscodePetAchievements', "When the pet is enabled, the user account menu lists unlocked achievement badges before locked badges and provides a View Achievements button. A gold star on the pet announces a newly unlocked achievement; activate the pet while the star is visible to open Achievements."));
 		content.push(localize('sessionsChat.aquariumAction', "To show or hide the aquarium action on the new-session view, use the checked Aquarium item in the context menu outside the composer, or run the Toggle Aquarium Action Visibility command."));

src/vs/sessions/services/chatBackground/browser/chatBackgroundService.ts

@@ -20,7 +20,8 @@ import { SessionsChatBackgroundAvailableContext, SessionsChatBackgroundConfigure
 
 export const AGENT_SESSIONS_PREFERRED_DARK_CHAT_BACKGROUND_IMAGE_SETTING = 'chat.agentSessions.preferredDarkBackgroundImage';
 export const AGENT_SESSIONS_PREFERRED_LIGHT_CHAT_BACKGROUND_IMAGE_SETTING = 'chat.agentSessions.preferredLightBackgroundImage';
-export const AGENT_SESSIONS_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING = 'chat.agentSessions.backgroundImageLayout';
+export const AGENT_SESSIONS_PREFERRED_DARK_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING = 'chat.agentSessions.preferredDarkBackgroundImageLayout';
+export const AGENT_SESSIONS_PREFERRED_LIGHT_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING = 'chat.agentSessions.preferredLightBackgroundImageLayout';
 export const AGENT_SESSIONS_CHAT_BACKGROUND_CODICONS_PRESET = 'codicons';
 export type SessionsChatBackgroundPreset = typeof AGENT_SESSIONS_CHAT_BACKGROUND_CODICONS_PRESET;
 const RECENT_BACKGROUND_IMAGES_STORAGE_KEY = 'chat.agentSessions.recentBackgroundImages';
@@ -102,7 +103,8 @@ export class SessionsChatBackgroundService extends Disposable implements ISessio
 		this._register(this.configurationService.onDidChangeConfiguration(event => {
 			const backgroundImageChanged = event.affectsConfiguration(AGENT_SESSIONS_PREFERRED_DARK_CHAT_BACKGROUND_IMAGE_SETTING)
 				|| event.affectsConfiguration(AGENT_SESSIONS_PREFERRED_LIGHT_CHAT_BACKGROUND_IMAGE_SETTING);
-			const backgroundImageLayoutChanged = event.affectsConfiguration(AGENT_SESSIONS_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING);
+			const backgroundImageLayoutChanged = event.affectsConfiguration(AGENT_SESSIONS_PREFERRED_DARK_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING)
+				|| event.affectsConfiguration(AGENT_SESSIONS_PREFERRED_LIGHT_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING);
 			let backgroundChanged = backgroundImageChanged;
 			if (backgroundImageChanged) {
 				updateContextKeys();
@@ -119,6 +121,7 @@ export class SessionsChatBackgroundService extends Disposable implements ISessio
 			}
 		}));
 		this._register(this.themeService.onDidColorThemeChange(() => {
+			this.backgroundImageLayout = this.readConfiguredBackgroundImageLayout();
 			updateContextKeys();
 			this._onDidChangeBackground.fire();
 		}));
@@ -171,13 +174,14 @@ export class SessionsChatBackgroundService extends Disposable implements ISessio
 	}
 
 	async setBackgroundImageLayout(layout: ChatBackgroundImageLayout, persist = true): Promise<void> {
+		const setting = this.getBackgroundImageLayoutSetting(this.themeService.getColorTheme().type);
 		if (layout !== this.backgroundImageLayout) {
 			this.backgroundImageLayout = layout;
 			this._onDidChangeBackground.fire();
 		}
 		if (persist) {
 			try {
-				await this.configurationService.updateValue(AGENT_SESSIONS_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING, layout, ConfigurationTarget.APPLICATION);
+				await this.configurationService.updateValue(setting, layout, ConfigurationTarget.USER);
 			} catch (error) {
 				const configuredLayout = this.readConfiguredBackgroundImageLayout();
 				if (configuredLayout !== this.backgroundImageLayout) {
@@ -190,7 +194,8 @@ export class SessionsChatBackgroundService extends Disposable implements ISessio
 	}
 
 	private readConfiguredBackgroundImageLayout(): ChatBackgroundImageLayout {
-		const value = this.configurationService.getValue<string>(AGENT_SESSIONS_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING);
+		const colorSchemeSetting = this.getBackgroundImageLayoutSetting(this.themeService.getColorTheme().type);
+		const value = this.configurationService.getValue<string>(colorSchemeSetting);
 		return chatBackgroundImageLayoutValues.includes(value as ChatBackgroundImageLayout)
 			? value as ChatBackgroundImageLayout
 			: 'repeat';
@@ -202,6 +207,12 @@ export class SessionsChatBackgroundService extends Disposable implements ISessio
 			: AGENT_SESSIONS_PREFERRED_LIGHT_CHAT_BACKGROUND_IMAGE_SETTING;
 	}
 
+	private getBackgroundImageLayoutSetting(colorScheme: ColorScheme): string {
+		return isDark(colorScheme)
+			? AGENT_SESSIONS_PREFERRED_DARK_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING
+			: AGENT_SESSIONS_PREFERRED_LIGHT_CHAT_BACKGROUND_IMAGE_LAYOUT_SETTING;
+	}
+
 	private getConfiguredBackground(): { readonly kind: 'codicons' } | { readonly kind: 'image'; readonly image: URI } | undefined {
 		const setting = this.getBackgroundImageSetting(this.themeService.getColorTheme().type);
 		const value = this.configurationService.getValue<string>(setting);