[EDT-1515] Expose date format properties configuration and locale

packages/sdk/src/README.md

@@ -6,11 +6,11 @@ So on these pages you'll find some very technical but super handy descriptions o
 
 ## Next
 
-The 'Next' section of the SDK provides a glimpse of what’s to come. We’ll include the latest and most cutting-edge features in this section, allowing you to prepare for upcoming changes. 
+The 'Next' section of the SDK provides a glimpse of what’s to come. We’ll include the latest and most cutting-edge features in this section, allowing you to prepare for upcoming changes.
 
-By doing this, we can introduce breaking changes without disrupting your integration when you update. Our goal is to maintain stability for the major version while still allowing flexibility for innovation. When a major update occurs, the functions and additions from this section will be moved to the main part of the SDK. 
+By doing this, we can introduce breaking changes without disrupting your integration when you update. Our goal is to maintain stability for the major version while still allowing flexibility for innovation. When a major update occurs, the functions and additions from this section will be moved to the main part of the SDK.
 
-If you’re using the next controller, consider importing the typings from the next types as well. These (breaking) typings are accessible in your application by referencing @chili-publish/studio-sdk/lib/src/next, for example: 
+If you’re using the next controller, consider importing the typings from the next types as well. These (breaking) typings are accessible in your application by referencing @chili-publish/studio-sdk/lib/src/next, for example:
 
 ```ts
 import type { ListVariable } from '@chili-publish/studio-sdk/lib/src/next';

packages/sdk/src/controllers/VariableController.ts

@@ -1,6 +1,15 @@
 import { EditorAPI, Id } from '../types/CommonTypes';
 import { ConnectorRegistration } from '../types/ConnectorTypes';
-import { ListVariable, ListVariableItem, Variable, VariableType } from '../types/VariableTypes';
+import {
+    DateRestriction,
+    DateVariablePropertiesDeltaUpdate,
+    Day,
+    ListVariable,
+    ListVariableItem,
+    Locale,
+    Variable,
+    VariableType,
+} from '../types/VariableTypes';
 import { getEditorResponseData } from '../utils/EditorResponseData';
 
 /**
@@ -280,6 +289,56 @@ export class VariableController {
             .then((result) => getEditorResponseData<Id>(result));
     };
 
+    /**
+     * @experimental This method sets the display format for a date variable.
+     * @param id The id of the date variable to update
+     * @param displayFormat The display format for the date variable
+     */
+    setDateVariableDisplayFormat = async (id: string, displayFormat: string) => {
+        const update = { displayFormat: { value: displayFormat } };
+        this.applyDateVariablePropertiesUpdate(id, update);
+    };
+
+    /**
+     * @experimental This method sets the locale for a date variable.
+     * @param id The id of the date variable to update
+     * @param locale The locale for the date variable
+     */
+    setDateVariableLocale = async (id: string, locale: Locale) => {
+        const update = { locale: { value: locale } };
+        this.applyDateVariablePropertiesUpdate(id, update);
+    };
+
+    /**
+     * @experimental This method sets or clears the start date for a date variable.
+     * @param id The id of the date variable to update
+     * @param date The start date for the date variable
+     */
+    setDateVariableStartDate = async (id: string, date: DateRestriction | null) => {
+        const update = { startDate: { value: date } };
+        this.applyDateVariablePropertiesUpdate(id, update);
+    };
+
+    /**
+     * @experimental This method sets or clears the end date for a date variable.
+     * @param id The id of the date variable to update
+     * @param date The end date for the date variable
+     */
+    setDateVariableEndDate = async (id: string, date: DateRestriction | null) => {
+        const update = { endDate: { value: date } };
+        this.applyDateVariablePropertiesUpdate(id, update);
+    };
+
+    /**
+     * @experimental This method sets or clears the excluded days for a date variable.
+     * @param id The id of the date variable to update
+     * @param excludedDays The excluded days for the date variable
+     */
+    setDateVariableExcludedDays = async (id: string, excludedDays: Day[] | null) => {
+        const update = { excludedDays: { value: excludedDays } };
+        this.applyDateVariablePropertiesUpdate(id, update);
+    };
+
     /**
      * @deprecated use `setValue` instead and pass `null` as the value argument.
      *
@@ -317,4 +376,10 @@ export class VariableController {
 
         return updated;
     }
+
+    private async applyDateVariablePropertiesUpdate(id: string, update: DateVariablePropertiesDeltaUpdate) {
+        const res = await this.#editorAPI;
+        const result = await res.updateDateVariableProperties(id, JSON.stringify(update));
+        return getEditorResponseData<null>(result);
+    }
 }

packages/sdk/src/index.ts

@@ -63,7 +63,7 @@ export type {
     RelativeDate,
     AbsoluteDate,
 } from './types/VariableTypes';
-export { VariableType, Day } from './types/VariableTypes';
+export { VariableType, Day, Locale } from './types/VariableTypes';
 
 export type { Color, DocumentColor, ColorUpdate } from './types/ColorStyleTypes';
 

packages/sdk/src/tests/controllers/VariableController.test.ts

@@ -1,5 +1,13 @@
 import { VariableController } from '../../controllers/VariableController';
-import { ImageVariable, ListVariable, ListVariableItem, Variable, VariableType } from '../../types/VariableTypes';
+import {
+    Day,
+    ImageVariable,
+    ListVariable,
+    ListVariableItem,
+    Locale,
+    Variable,
+    VariableType,
+} from '../../types/VariableTypes';
 import { EditorAPI } from '../../types/CommonTypes';
 import { getEditorResponseData, castToEditorResponse } from '../../utils/EditorResponseData';
 import { ConnectorRegistration, ConnectorRegistrationSource } from '../../types/ConnectorTypes';
@@ -69,6 +77,7 @@ describe('VariableController', () => {
         setVariableSource: async () => getEditorResponseData(castToEditorResponse(null)),
         getImageVariableConnectorId: async () => getEditorResponseData(castToEditorResponse('connectorId')),
         setImageVariableConnector: async () => getEditorResponseData(castToEditorResponse('newConnectorId')),
+        updateDateVariableProperties: async () => getEditorResponseData(castToEditorResponse(null)),
     };
 
     beforeEach(() => {
@@ -94,6 +103,7 @@ describe('VariableController', () => {
         jest.spyOn(mockEditorApi, 'setVariableSource');
         jest.spyOn(mockEditorApi, 'getImageVariableConnectorId');
         jest.spyOn(mockEditorApi, 'setImageVariableConnector');
+        jest.spyOn(mockEditorApi, 'updateDateVariableProperties');
     });
 
     it('get variable by id', async () => {
@@ -255,4 +265,45 @@ describe('VariableController', () => {
         expect(mockEditorApi.setVariableValue).toHaveBeenCalledTimes(1);
         expect(mockEditorApi.setVariableValue).toHaveBeenCalledWith(varId, null);
     });
+
+    it('updates the date start date', async () => {
+        await mockedVariableController.setDateVariableStartDate('1', { offset: 4, type: 'relative' });
+        expect(mockEditorApi.updateDateVariableProperties).toHaveBeenCalledTimes(1);
+        expect(mockEditorApi.updateDateVariableProperties).toHaveBeenCalledWith(
+            '1',
+            JSON.stringify({ startDate: { value: { offset: 4, type: 'relative' } } }),
+        );
+    });
+    it('updates the date end date', async () => {
+        await mockedVariableController.setDateVariableEndDate('1', { value: '2022-12-13', type: 'absolute' });
+        expect(mockEditorApi.updateDateVariableProperties).toHaveBeenCalledTimes(1);
+        expect(mockEditorApi.updateDateVariableProperties).toHaveBeenCalledWith(
+            '1',
+            JSON.stringify({ endDate: { value: { value: '2022-12-13', type: 'absolute' } } }),
+        );
+    });
+    it('updates the date excluded days', async () => {
+        await mockedVariableController.setDateVariableExcludedDays('1', [Day.Monday, Day.Friday]);
+        expect(mockEditorApi.updateDateVariableProperties).toHaveBeenCalledTimes(1);
+        expect(mockEditorApi.updateDateVariableProperties).toHaveBeenCalledWith(
+            '1',
+            JSON.stringify({ excludedDays: { value: [Day.Monday, Day.Friday] } }),
+        );
+    });
+    it('updates the date locale', async () => {
+        await mockedVariableController.setDateVariableLocale('1', Locale.es_ES);
+        expect(mockEditorApi.updateDateVariableProperties).toHaveBeenCalledTimes(1);
+        expect(mockEditorApi.updateDateVariableProperties).toHaveBeenCalledWith(
+            '1',
+            JSON.stringify({ locale: { value: Locale.es_ES } }),
+        );
+    });
+    it('updates the date format', async () => {
+        await mockedVariableController.setDateVariableDisplayFormat('1', 'yyyy-MM-dd');
+        expect(mockEditorApi.updateDateVariableProperties).toHaveBeenCalledTimes(1);
+        expect(mockEditorApi.updateDateVariableProperties).toHaveBeenCalledWith(
+            '1',
+            JSON.stringify({ displayFormat: { value: 'yyyy-MM-dd' } }),
+        );
+    });
 });

packages/sdk/src/types/VariableTypes.ts

@@ -85,6 +85,7 @@ export interface DateVariable extends Variable {
     startDate?: DateRestriction;
     endDate?: DateRestriction;
     excludedDays: Day[];
+    locale: Locale;
 }
 
 export type LongTextVariable = ShortTextVariable;
@@ -111,4 +112,38 @@ export enum Day {
     Friday = 'friday',
     Saturday = 'saturday',
     Sunday = 'sunday',
-}
+}
+
+export enum Locale {
+    en_US = 'en_US',
+    cs = 'cs',
+    da = 'da',
+    nl = 'nl',
+    fi = 'fi',
+    fr = 'fr',
+    de = 'de',
+    it = 'it',
+    no = 'no',
+    pl = 'pl',
+    pt_PT = 'pt_PT',
+    es_ES = 'es_ES',
+    sv = 'sv',
+}
+
+export interface DateVariablePropertiesDeltaUpdate {
+    startDate?: {
+        value: DateRestriction | null;
+    };
+    endDate?: {
+        value: DateRestriction | null;
+    };
+    excludedDays?: {
+        value: Day[] | null;
+    };
+    locale?: {
+        value: Locale;
+    };
+    displayFormat?: {
+        value: string;
+    };
+}