From 5e67b9ba8bafd0625033c487556e161d763e6efc Mon Sep 17 00:00:00 2001 From: Charlie Drage Date: Tue, 3 Oct 2023 10:11:46 -0400 Subject: [PATCH] feat: add when functionality for setting properties (#4159) ### What does this PR do? Adds the ability to use "when" statements for setting properties. For example, if you want to only show certain settings for certain operating systems by using `"when": "isLinux"`. ### Screenshot/screencast of this PR ### What issues does this PR fix or reference? Closes https://github.com/containers/podman-desktop/issues/4141 ### How to test this PR? Edit `extensions/podman/package.json` configuration for binary path to: ```json "podman.binary.path": { "type": "string", "format": "file", "default": "", "description": "Custom path to Podman binary (Default is blank)", "when": "isLinux" }, ``` When you check your preferences, it will now only show the binary path if you are running Linux. Signed-off-by: Charlie Drage --- ...ferencesConnectionCreationRendering.svelte | 10 +--- .../preferences/PreferencesRendering.spec.ts | 58 +++++++++++++++++++ .../preferences/PreferencesRendering.svelte | 26 ++++++++- .../renderer/src/lib/preferences/Util.spec.ts | 28 ++++++++- packages/renderer/src/lib/preferences/Util.ts | 15 +++++ 5 files changed, 125 insertions(+), 12 deletions(-) diff --git a/packages/renderer/src/lib/preferences/PreferencesConnectionCreationRendering.svelte b/packages/renderer/src/lib/preferences/PreferencesConnectionCreationRendering.svelte index 3cd50959989c..da61fa8410f4 100644 --- a/packages/renderer/src/lib/preferences/PreferencesConnectionCreationRendering.svelte +++ b/packages/renderer/src/lib/preferences/PreferencesConnectionCreationRendering.svelte @@ -3,7 +3,7 @@ import type { IConfigurationPropertyRecordedSchema } from '../../../../main/src/ import type { ProviderInfo } from '../../../../main/src/plugin/api/provider-info'; import PreferencesRenderingItemFormat from './PreferencesRenderingItemFormat.svelte'; import TerminalWindow from '../ui/TerminalWindow.svelte'; -import { getNormalizedDefaultNumberValue, writeToTerminal } from './Util'; +import { getNormalizedDefaultNumberValue, writeToTerminal, isPropertyValidInContext } from './Util'; import ErrorMessage from '../ui/ErrorMessage.svelte'; import { clearCreateTask, @@ -31,7 +31,6 @@ import EmptyScreen from '../ui/EmptyScreen.svelte'; import { faCubes } from '@fortawesome/free-solid-svg-icons'; import Button from '../ui/Button.svelte'; import type { ContextUI } from '/@/lib/context/context'; -import { ContextKeyExpr } from '/@/lib/context/contextKey'; import { context } from '/@/stores/context'; export let properties: IConfigurationPropertyRecordedSchema[] = []; @@ -94,11 +93,6 @@ $: if (logsTerminal && loggerHandlerKey) { } } -function isPropertyValidInContext(when: string, context: ContextUI) { - const expr = ContextKeyExpr.deserialize(when); - return expr?.evaluate(context); -} - onMount(async () => { osMemory = await window.getOsMemory(); osCpu = await window.getOsCpu(); @@ -107,7 +101,7 @@ onMount(async () => { configurationKeys = properties .filter(property => property.scope === propertyScope) .filter(property => property.id?.startsWith(providerInfo.id)) - .filter(property => !property.when || isPropertyValidInContext(property.when, globalContext)) + .filter(property => isPropertyValidInContext(property.when, globalContext)) .map(property => { switch (property.maximum) { case 'HOST_TOTAL_DISKSIZE': { diff --git a/packages/renderer/src/lib/preferences/PreferencesRendering.spec.ts b/packages/renderer/src/lib/preferences/PreferencesRendering.spec.ts index 3570c0fb007d..7ddbd4b36074 100644 --- a/packages/renderer/src/lib/preferences/PreferencesRendering.spec.ts +++ b/packages/renderer/src/lib/preferences/PreferencesRendering.spec.ts @@ -26,6 +26,16 @@ import { render, screen } from '@testing-library/svelte'; import type { IConfigurationPropertyRecordedSchema } from '../../../../main/src/plugin/configuration-registry'; import PreferencesRendering from './PreferencesRendering.svelte'; import { CONFIGURATION_DEFAULT_SCOPE } from '../../../../main/src/plugin/configuration-registry-constants'; +import { ContextUI } from '../context/context'; +import { context } from '/@/stores/context'; + +async function waitRender(customProperties: any): Promise { + const result = render(PreferencesRendering, { ...customProperties }); + // wait that result.component.$$.ctx[0] is set + while (result.component.$$.ctx[0] === undefined) { + await new Promise(resolve => setTimeout(resolve, 100)); + } +} beforeAll(() => { (window as any).getConfigurationValue = vi.fn().mockResolvedValue(true); @@ -77,3 +87,51 @@ test('Expect extension title used a section name', async () => { const sectionName = screen.getAllByText('my boolean property'); expect(sectionName.length > 0).toBe(true); }); + +test('Expect example when property to be missing if when statement is not satisfied from context', async () => { + const contextConfig = new ContextUI(); + context.set(contextConfig); + contextConfig.setValue('config.test', true); + expect(contextConfig.getValue('config.test')).toBe(true); + + const whenProperty: IConfigurationPropertyRecordedSchema = { + title: 'example when property', + id: 'foobar', + parentId: 'key', + type: 'boolean', + default: true, + when: '!config.test', + markdownDescription: 'foobar', + scope: CONFIGURATION_DEFAULT_SCOPE, + }; + + waitRender({ properties: [whenProperty], key: 'key' }); + + // Expect "example when property" to NOT be found when running getByLabelText + const exampleWhenProperty = screen.queryByLabelText('example when property'); + expect(exampleWhenProperty).not.toBeInTheDocument(); +}); + +test('Expect example when property to show if when statement is satisfied from context', async () => { + const contextConfig = new ContextUI(); + context.set(contextConfig); + contextConfig.setValue('config.test', true); + expect(contextConfig.getValue('config.test')).toBe(true); + + const whenProperty: IConfigurationPropertyRecordedSchema = { + title: 'example when property', + id: 'foobar', + parentId: 'key', + type: 'boolean', + default: true, + when: 'config.test', // If config.test is false, this will be shown in the render + markdownDescription: 'foobar', + scope: CONFIGURATION_DEFAULT_SCOPE, + }; + + waitRender({ properties: [whenProperty], key: 'key' }); + + // Expect "example when property" to be found when running getByLabelText + const exampleWhenProperty = screen.queryByLabelText('example when property'); + expect(exampleWhenProperty).not.toBeInTheDocument(); +}); diff --git a/packages/renderer/src/lib/preferences/PreferencesRendering.svelte b/packages/renderer/src/lib/preferences/PreferencesRendering.svelte index 982e1a8af5d0..9681cf95ca23 100644 --- a/packages/renderer/src/lib/preferences/PreferencesRendering.svelte +++ b/packages/renderer/src/lib/preferences/PreferencesRendering.svelte @@ -4,19 +4,27 @@ import type { IConfigurationPropertyRecordedSchema } from '../../../../main/src/ import PreferencesRenderingItem from './PreferencesRenderingItem.svelte'; import SettingsPage from './SettingsPage.svelte'; import Route from '../../Route.svelte'; -import { isDefaultScope } from './Util'; +import { isDefaultScope, isPropertyValidInContext } from './Util'; +import type { ContextUI } from '../context/context'; +import { context } from '/@/stores/context'; +import { onDestroy, onMount } from 'svelte'; +import { type Unsubscriber } from 'svelte/store'; export let properties: IConfigurationPropertyRecordedSchema[] = []; export let key: string; -let updateSearchValueTimeout: NodeJS.Timeout; +// Context variables +let contextsUnsubscribe: Unsubscriber; +let globalContext: ContextUI; +// Search and matching records +let updateSearchValueTimeout: NodeJS.Timeout; let matchingRecords: Map; export let searchValue = ''; $: searchValue; - $: matchingRecords = properties .filter(property => property.parentId.startsWith(key) && isDefaultScope(property.scope) && !property.hidden) + .filter(property => isPropertyValidInContext(property.when, globalContext)) .filter( property => !searchValue || @@ -32,6 +40,18 @@ $: matchingRecords = properties return map; }, new Map()); +onMount(async () => { + contextsUnsubscribe = context.subscribe(value => { + globalContext = value; + }); +}); + +onDestroy(() => { + if (contextsUnsubscribe) { + contextsUnsubscribe(); + } +}); + function matchValue(text: string, searchValue: string): boolean { if (!text) { return false; diff --git a/packages/renderer/src/lib/preferences/Util.spec.ts b/packages/renderer/src/lib/preferences/Util.spec.ts index d12b0bf85f13..5e819e67c2c7 100644 --- a/packages/renderer/src/lib/preferences/Util.spec.ts +++ b/packages/renderer/src/lib/preferences/Util.spec.ts @@ -17,8 +17,9 @@ ***********************************************************************/ import { test, expect, vi, afterEach } from 'vitest'; -import { getNormalizedDefaultNumberValue, isTargetScope, writeToTerminal } from './Util'; +import { getNormalizedDefaultNumberValue, isPropertyValidInContext, isTargetScope, writeToTerminal } from './Util'; import type { IConfigurationPropertyRecordedSchema } from '../../../../main/src/plugin/configuration-registry'; +import { ContextUI } from '../context/context'; const xtermMock = { write: vi.fn(), @@ -147,3 +148,28 @@ test('return true if scope is a string and it is equal to targetScope', () => { const result = isTargetScope('DEFAULT', 'DEFAULT'); expect(result).toBe(true); }); + +test('test isPropertyValidInContext returns true if when is undefined', () => { + const contextMock = new ContextUI(); + const result = isPropertyValidInContext(undefined, contextMock); + expect(result).toBe(true); +}); + +test('test isPropertyValidInContext returns false if when is defined but context is empty / undefined', () => { + const result = isPropertyValidInContext('config.test', new ContextUI()); + expect(result).toBe(false); +}); + +test('test isPropertyValidInContext with valid when statements', () => { + const contextMock = new ContextUI(); + contextMock.setValue('config.test', false); + + // Test with single when statements + expect(isPropertyValidInContext('config.test', contextMock)).toBe(false); + expect(isPropertyValidInContext('!config.test', contextMock)).toBe(true); + + // Test with multiple when statements + contextMock.setValue('config.test2', true); + expect(isPropertyValidInContext('config.test && config.test2', contextMock)).toBe(false); + expect(isPropertyValidInContext('config.test && !config.test2', contextMock)).toBe(false); +}); diff --git a/packages/renderer/src/lib/preferences/Util.ts b/packages/renderer/src/lib/preferences/Util.ts index a04e16510123..d6170fe399b3 100644 --- a/packages/renderer/src/lib/preferences/Util.ts +++ b/packages/renderer/src/lib/preferences/Util.ts @@ -24,6 +24,8 @@ import type { } from '../../../../main/src/plugin/api/provider-info'; import type { IConfigurationPropertyRecordedSchema } from '../../../../main/src/plugin/configuration-registry'; import { CONFIGURATION_DEFAULT_SCOPE } from '../../../../main/src/plugin/configuration-registry-constants'; +import { ContextKeyExpr } from '../context/contextKey'; +import type { ContextUI } from '../context/context'; export interface IProviderConnectionConfigurationPropertyRecorded extends IConfigurationPropertyRecordedSchema { // eslint-disable-next-line @typescript-eslint/no-explicit-any @@ -107,3 +109,16 @@ export function isTargetScope( } return scope === targetScope; } + +export function isPropertyValidInContext(when: string | undefined, context: ContextUI): boolean { + if (!when) { + return true; + } + const expr = ContextKeyExpr.deserialize(when); + + // Only evaluate if context is not undefined + if (expr && context !== undefined) { + return expr.evaluate(context); + } + return false; +}