@servicetitan/dte-pdf-editor 1.87.0 → 1.89.0

package/src/components/field-config-panel/field-config-panel.tsx

@@ -1,7 +1,8 @@
-import { Button, Checkbox, Combobox, Flex, Textarea, TextField } from '@servicetitan/anvil2';
+import { Button, Checkbox, Flex, SelectFieldSync, Textarea, TextField } from '@servicetitan/anvil2';
 import { FC, useMemo } from 'react';
-import { E_SIGN_FIELD_TYPE_OPTIONS, FIELD_FONT_SIZE_OPTIONS } from '../../constants';
+import { FIELD_FONT_SIZE_OPTIONS } from '../../constants';
 import {
+    ESignDateSignedOffsetSettings,
     ESignFieldType,
     FieldTypeEnum,
     type FormFieldsByFormIdI,
@@ -19,6 +20,7 @@ import {
     supportsFieldFontSize,
 } from '../../utils';
 import { DisplayCondition } from '../display-conditions/display-condition';
+import { ESignOptionsModal } from './e-sign-options-modal';
 import { FormulaGenerator } from './formula-generator';
 import { TableConfigs } from './table-configs';
 
@@ -56,39 +58,53 @@ export const FieldConfigPanel: FC<FieldConfigPanelProps> = ({
 }) => {
     const recipientOptions = useMemo(
         () =>
-            field.type === FieldTypeEnum.fillable
+            (field.type === FieldTypeEnum.fillable
                 ? getFillableFieldsRecipients(recipients)
-                : recipients,
+                : recipients
+            ).map(recipient => ({ id: recipient.name, label: recipient.displayName })),
         [recipients, field.type],
     );
 
     const selectedRecipient = useMemo(
-        () => recipientOptions.find(recipient => recipient.name === field.recipient) ?? null,
+        () => recipientOptions.find(option => option.id === field.recipient) ?? null,
         [recipientOptions, field.recipient],
     );
 
     const isRadioGroupSibling = (documentField: PdfField) =>
         documentField.subType === 'radio' && documentField.path === field.path;
 
-    const handleRecipientChange = (item: RecipientInfo | null) => {
+    const isDateSignedOffsetSibling = (documentField: PdfField) =>
+        documentField.type === FieldTypeEnum.eSign &&
+        documentField.subType === ESignFieldType.dateSignedOffset;
+
+    const handleDateSignedOffsetSave = (data: ESignDateSignedOffsetSettings) => {
+        if (onMatchingFieldsConfigChange) {
+            onMatchingFieldsConfigChange(isDateSignedOffsetSibling, { data });
+            return;
+        }
+
+        onFieldConfigChange({ data });
+    };
+
+    const handleRecipientChange = (item: { id: string; label: string } | null) => {
         if (!item) {
             return;
         }
 
         let path = field.path;
         if (field.type === FieldTypeEnum.eSign) {
-            path = generateESignPath(item.name, field.subType as ESignFieldType);
+            path = generateESignPath(item.id, field.subType as ESignFieldType);
         }
         if (field.type === FieldTypeEnum.fillable) {
             const pathName =
                 field.subType === 'radio' && field.path
                     ? parseFillablePathName(field.path)
                     : field.id;
-            path = generateFillablePath(item.name, pathName);
+            path = generateFillablePath(item.id, pathName);
         }
 
         const updates = {
-            recipient: item.name,
+            recipient: item.id,
             path,
         };
 
@@ -105,31 +121,25 @@ export const FieldConfigPanel: FC<FieldConfigPanelProps> = ({
         onFieldConfigChange(updates);
     };
 
-    const selectedESignFieldType = useMemo(
-        () => E_SIGN_FIELD_TYPE_OPTIONS.find(option => option.id === field.subType) ?? null,
-        [field],
-    );
+    const showFontSizeControl = supportsFieldFontSize(field);
 
-    const handleESignFieldTypeChange = (item: { id: ESignFieldType; name: string } | null) => {
-        if (item) {
-            onFieldConfigChange({
-                subType: item.id,
-                path: generateESignPath(field.recipient!, item.id),
-            });
-        }
-    };
+    const fontSizeOptions = useMemo(
+        () => FIELD_FONT_SIZE_OPTIONS.map(size => ({ id: size, label: size.toString() })),
+        [],
+    );
 
-    const showFontSizeControl = supportsFieldFontSize(field);
+    const selectedFontSize = useMemo(
+        () => fontSizeOptions.find(option => option.id === getFieldFontSize(field)) ?? null,
+        [fontSizeOptions, field],
+    );
 
-    const handleFontSizeChange = (item: number | null) => {
-        if (item) {
-            onFieldConfigChange({
-                styles: {
-                    ...field.styles,
-                    fontSize: item,
-                },
-            });
-        }
+    const handleFontSizeChange = (item: { id: number; label: string }) => {
+        onFieldConfigChange({
+            styles: {
+                ...field.styles,
+                fontSize: item.id,
+            },
+        });
     };
 
     const handleRadioGroupNameChange = (groupName: string) => {
@@ -184,47 +194,14 @@ export const FieldConfigPanel: FC<FieldConfigPanelProps> = ({
                 />
             )}
             {(field.type === FieldTypeEnum.fillable || field.type === FieldTypeEnum.eSign) && (
-                <Combobox
-                    items={recipientOptions}
-                    itemToString={item => item?.displayName ?? ''}
-                    onChange={handleRecipientChange}
-                    selectedItem={selectedRecipient}
-                    filterOptions={{ keys: ['displayName'] }}
-                >
-                    <Combobox.SearchField placeholder="" label="Recipient" />
-                    <Combobox.Content>
-                        {({ items }) => (
-                            <Combobox.List>
-                                {items.map((item, i) => (
-                                    <Combobox.Item key={item.name} item={item} index={i}>
-                                        {item.displayName}
-                                    </Combobox.Item>
-                                ))}
-                            </Combobox.List>
-                        )}
-                    </Combobox.Content>
-                </Combobox>
-            )}
-            {field.type === FieldTypeEnum.eSign && (
-                <Combobox
-                    items={E_SIGN_FIELD_TYPE_OPTIONS}
-                    itemToString={item => item?.name ?? ''}
-                    onChange={handleESignFieldTypeChange}
-                    selectedItem={selectedESignFieldType}
-                >
-                    <Combobox.SearchField label="Field Type" />
-                    <Combobox.Content>
-                        {({ items }) => (
-                            <Combobox.List>
-                                {items.map((item, i) => (
-                                    <Combobox.Item key={item.id} item={item} index={i}>
-                                        {item.name}
-                                    </Combobox.Item>
-                                ))}
-                            </Combobox.List>
-                        )}
-                    </Combobox.Content>
-                </Combobox>
+                <SelectFieldSync
+                    label="Recipient"
+                    disableClearButton
+                    options={recipientOptions}
+                    value={selectedRecipient}
+                    onSelectedOptionChange={handleRecipientChange}
+                    filter={{ keys: ['label'] }}
+                />
             )}
             {field.type !== FieldTypeEnum.generic && (
                 <TextField label="Data Path" value={field.path} disabled />
@@ -271,31 +248,33 @@ export const FieldConfigPanel: FC<FieldConfigPanelProps> = ({
             )}
 
             {showFontSizeControl && (
-                <Combobox
-                    items={FIELD_FONT_SIZE_OPTIONS}
-                    itemToString={item => item?.toString() ?? ''}
-                    onChange={handleFontSizeChange}
-                    selectedItem={getFieldFontSize(field)}
-                >
-                    <Combobox.SearchField label="Font Size" />
-                    <Combobox.Content>
-                        {({ items }) => (
-                            <Combobox.List>
-                                {items.map((item, i) => (
-                                    <Combobox.Item key={item} item={item} index={i}>
-                                        {item}
-                                    </Combobox.Item>
-                                ))}
-                            </Combobox.List>
-                        )}
-                    </Combobox.Content>
-                </Combobox>
+                <SelectFieldSync
+                    label="Font Size"
+                    disableClearButton
+                    options={fontSizeOptions}
+                    value={selectedFontSize}
+                    onSelectedOptionChange={handleFontSizeChange}
+                />
             )}
 
             {field.type === FieldTypeEnum.generic && field.subType === 'table' && (
                 <TableConfigs field={field} onFieldConfigChange={onFieldConfigChange} />
             )}
 
+            {field.type === FieldTypeEnum.eSign &&
+                field.subType === ESignFieldType.dateSignedOffset && (
+                    <ESignOptionsModal
+                        initialState={field.data as ESignDateSignedOffsetSettings}
+                        onSave={handleDateSignedOffsetSave}
+                        documentFields={documentFields}
+                        formFieldsByFormId={formFieldsByFormId}
+                        formFieldsLoadingFormId={formulaLoadingFormId}
+                        forms={forms}
+                        onRequestFormFields={onRequestFormFields}
+                        schema={dataModel}
+                    />
+                )}
+
             {!hideConditionalLogic && (
                 <DisplayCondition
                     onSave={onFieldConfigChange}

package/src/components/field-sidebar/e-sign-field-type-list.tsx

@@ -1,4 +1,4 @@
-import { FC, Fragment } from 'react';
+import { FC } from 'react';
 import { E_SIGN_FIELD_TYPES } from '../../constants';
 import { type FieldTypeOption } from '../../interface/types';
 import { FieldType } from './field-type';
@@ -10,18 +10,15 @@ interface ESignFieldTypeListProps {
 
 export const ESignFieldTypeList: FC<ESignFieldTypeListProps> = ({ onDragEnd, onDragStart }) => {
     return (
-        <Fragment>
-            {E_SIGN_FIELD_TYPES.map(fieldOption => {
-                const key = `${fieldOption.type}-${fieldOption.path ?? fieldOption.label}`;
-                return (
-                    <FieldType
-                        key={key}
-                        label={fieldOption.label}
-                        onDragEnd={onDragEnd}
-                        onDragStart={() => onDragStart(fieldOption)}
-                    />
-                );
-            })}
-        </Fragment>
+        <div className="dte-field-type-items-wrapper">
+            {E_SIGN_FIELD_TYPES.map(fieldOption => (
+                <FieldType
+                    key={fieldOption.subType}
+                    label={fieldOption.label}
+                    onDragEnd={onDragEnd}
+                    onDragStart={() => onDragStart(fieldOption)}
+                />
+            ))}
+        </div>
     );
 };

package/src/constants/field.constants.ts

@@ -43,13 +43,6 @@ export const GENERIC_FIELD_DEFAULT_SIZES = {
     table: { width: BASE_PAGE_WIDTH - 10, height: 2 * GENERIC_FIELD_TABLE_ROW_HEIGHT },
 } as Record<PdfFieldSubType, { width: number; height: number }>;
 
-export const E_SIGN_FIELD_TYPE_OPTIONS: { name: string; id: ESignFieldType }[] = [
-    { name: 'Signature', id: ESignFieldType.signature },
-    { name: 'Initials', id: ESignFieldType.initials },
-    { name: 'Date Signed', id: ESignFieldType.dateSigned },
-    { name: 'Full Name', id: ESignFieldType.fullName },
-];
-
 export const FILLABLE_FIELD_TYPES: FieldTypeOption[] = [
     { label: 'Text Field', type: FieldTypeEnum.fillable, subType: 'text' },
     { label: 'Number Field', type: FieldTypeEnum.fillable, subType: 'number' },
@@ -60,10 +53,30 @@ export const FILLABLE_FIELD_TYPES: FieldTypeOption[] = [
 
 export const E_SIGN_FIELD_TYPES: FieldTypeOption[] = [
     {
-        label: 'E-Sign',
+        label: 'Signature',
         type: FieldTypeEnum.eSign,
         subType: ESignFieldType.signature,
     },
+    {
+        label: 'Initials',
+        type: FieldTypeEnum.eSign,
+        subType: ESignFieldType.initials,
+    },
+    {
+        label: 'Date Signed',
+        type: FieldTypeEnum.eSign,
+        subType: ESignFieldType.dateSigned,
+    },
+    {
+        label: 'Date Signed Offset',
+        type: FieldTypeEnum.eSign,
+        subType: ESignFieldType.dateSignedOffset,
+    },
+    {
+        label: 'Full Name',
+        type: FieldTypeEnum.eSign,
+        subType: ESignFieldType.fullName,
+    },
 ];
 
 export const CALCULATED_FIELD_TYPES: FieldTypeOption[] = [

package/src/hooks/usePdfFieldDnD.ts

@@ -29,19 +29,33 @@ type InitializeDroppedField = (
     baseField: PdfField,
     option: FieldTypeOption,
     recipients: RecipientInfo[],
+    fields: PdfField[],
 ) => PdfField;
 
 const initializeDroppedFieldByType: Record<FieldTypeEnum, InitializeDroppedField> = {
-    [FieldTypeEnum.eSign]: (base, option, recipients) => {
+    [FieldTypeEnum.eSign]: (base, option, recipients, fields) => {
         const recipientName = recipients[0]?.name ?? '';
-        return {
+        const field = {
             ...base,
             recipient: recipientName,
             path: generateESignPath(recipientName, option.subType as ESignFieldType),
         };
+
+        if (field.subType === ESignFieldType.dateSignedOffset) {
+            const existingDateSignedOffsetField = fields.find(
+                existingField =>
+                    existingField.type === FieldTypeEnum.eSign &&
+                    existingField.subType === ESignFieldType.dateSignedOffset,
+            );
+            field.data = existingDateSignedOffsetField?.data ?? {
+                rules: [{ days: 0 }],
+            };
+        }
+        return field;
     },
     [FieldTypeEnum.fillable]: (base, option, recipients) => {
         const recipientName = getFillableFieldsRecipients(recipients)[0]?.name ?? '';
+
         const defaultSize = FILLABLE_FIELD_DEFAULT_SIZES[base.subType!];
         return {
             ...base,
@@ -216,6 +230,7 @@ export const usePdfFieldDnD = ({
             baseField,
             draggedFieldOption,
             recipients,
+            fields,
         );
 
         onFieldsChange([...fields, newField]);

package/src/interface/types.ts

@@ -11,6 +11,7 @@ export enum ESignFieldType {
     signature = 'signature',
     initials = 'initials',
     dateSigned = 'dateSigned',
+    dateSignedOffset = 'dateSignedOffset',
     fullName = 'fullName',
 }
 
@@ -56,7 +57,39 @@ export interface GenericFieldTextDataType {
     value: string;
 }
 
-export type FieldDataType = GenericFieldTableDataType | GenericFieldTextDataType;
+export interface ESignDateSignedOffsetSettingsRule {
+    days: number;
+    condition: DisplayConditionState;
+}
+
+export interface ESignDateSignedOffsetSettingsFinalRule {
+    days: number;
+    condition?: never;
+}
+
+/**
+ * Ordered "if/else if/.../else" chain of day-offset rules for an e-sign `dateSignedOffset` field.
+ * Rules are evaluated in array order; the first rule whose `condition` matches applies its `days`.
+ *
+ * The tuple shape encodes two invariants the UI and evaluator both rely on:
+ * - The last element is always the trailing else case: no `condition`, so it always matches.
+ * - Every element before it is a normal, conditioned rule (`ESignDateSignedOffsetSettingsRule`).
+ *
+ * `rules` therefore always has at least one entry (just the else rule) and never has a
+ * condition-less rule anywhere but last. `ESignOptionsModal` is the only place that splits this
+ * tuple apart (the else row is edited inline; the conditioned rules are edited in
+ * `ESignDateSignedOffsetModal`) and reassembles it before saving.
+ */
+export interface ESignDateSignedOffsetSettings {
+    rules:
+        | [ESignDateSignedOffsetSettingsFinalRule]
+        | [...ESignDateSignedOffsetSettingsRule[], ESignDateSignedOffsetSettingsFinalRule];
+}
+
+export type FieldDataType =
+    | GenericFieldTableDataType
+    | GenericFieldTextDataType
+    | ESignDateSignedOffsetSettings;
 
 export interface DisplayConditionState {
     behavior: 'show' | 'hide';

package/src/styles/field-config-panel.css

@@ -0,0 +1,11 @@
+.dte-rule-card {
+    padding: 12px;
+    background: var(--color-neutral-30, #f7f7f7);
+    border: 1px solid var(--border-color);
+    border-radius: var(--radius-2);
+
+    &.--active {
+        border-color: var(--border-color-active, #2270ee);
+        background: var(--bg-color-secondary-active, #fafcff);
+    }
+}

package/src/styles/field-type.css

@@ -15,3 +15,15 @@
 .dte-field-type-item:hover {
     box-shadow: 0 0 2px 0 var(--border-color-active);
 }
+
+.dte-field-type-items-wrapper {
+    &.--grid-2 {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        gap: var(--spacing-1, 8px);
+
+        .dte-field-type-item {
+            margin-top: var(--spacing-0, 0);
+        }
+    }
+}

package/src/styles/index.css

@@ -10,3 +10,4 @@
 @import './field-type.css';
 @import './pdf-document-renderer.css';
 @import './inline-editable.css';
+@import './field-config-panel.css';

package/src/styles/variables.css

@@ -28,11 +28,13 @@
     --color-neutral-70: var(--color-neutral-70, #737475);
     --color-neutral-200: var(--color-neutral-200, #6c6d70);
     --color-neutral-300: var(--color-neutral-300, #2d2e31);
+    --color-blue-100: var(--color-blue-100, #fafcff);
 
     /* Background colors */
     --bg-color-light: var(--color-neutral-0, #ffffff);
     --bg-color-main: var(--color-neutral-20, #fafafa);
     --bg-color-secondary: var(--color-neutral-50, #eeeeee);
+    --bg-color-secondary-active: var(--color-blue-100, #fafcff);
     --bg-color: var(--color-neutral-200, #f5f5f5);
     --bg-color-hover: #eaeaea;
 

package/src/utils/conditions/__tests__/condition-match-type.utils.test.ts

@@ -0,0 +1,104 @@
+import type { DisplayConditionSingle, DisplayConditionState } from '../../../interface/types';
+import {
+    applyConditionMatchType,
+    deriveConditionMatchType,
+    isValidConditionGroups,
+} from '../condition-match-type.utils';
+
+const buildCondition = (overrides: Partial<DisplayConditionSingle> = {}): DisplayConditionSingle => ({
+    id: 'c1',
+    dataPointKey: '',
+    operator: 'is_equal_to',
+    value: '',
+    ...overrides,
+});
+
+describe('deriveConditionMatchType', () => {
+    test('defaults to "and" with a single condition', () => {
+        const state: DisplayConditionState = {
+            behavior: 'show',
+            groups: [{ id: 'g1', conditions: [buildCondition()] }],
+        };
+        expect(deriveConditionMatchType(state)).toBe('and');
+    });
+
+    test('returns "or" when a later condition in the group carries an "or" join', () => {
+        const state: DisplayConditionState = {
+            behavior: 'show',
+            groups: [
+                {
+                    id: 'g1',
+                    conditions: [buildCondition(), buildCondition({ id: 'c2', logicalOperator: 'or' })],
+                },
+            ],
+        };
+        expect(deriveConditionMatchType(state)).toBe('or');
+    });
+
+    test('returns "or" when a later group carries an "or" join', () => {
+        const state: DisplayConditionState = {
+            behavior: 'show',
+            groups: [
+                { id: 'g1', conditions: [buildCondition()] },
+                { id: 'g2', logicalOperator: 'or', conditions: [buildCondition({ id: 'c2' })] },
+            ],
+        };
+        expect(deriveConditionMatchType(state)).toBe('or');
+    });
+});
+
+describe('applyConditionMatchType', () => {
+    test('stamps the match type onto every condition after the first, and every group after the first', () => {
+        const state: DisplayConditionState = {
+            behavior: 'show',
+            groups: [
+                {
+                    id: 'g1',
+                    conditions: [buildCondition(), buildCondition({ id: 'c2' })],
+                },
+                { id: 'g2', conditions: [buildCondition({ id: 'c3' })] },
+            ],
+        };
+        const next = applyConditionMatchType(state, 'or');
+        expect(next.groups[0].conditions[0].logicalOperator).toBeUndefined();
+        expect(next.groups[0].conditions[1].logicalOperator).toBe('or');
+        expect(next.groups[1].logicalOperator).toBe('or');
+    });
+});
+
+describe('isValidConditionGroups', () => {
+    const deps = { fillableOptions: [], formFieldsByFormId: {}, mergeTagOptions: [] };
+
+    test('is false when there are no groups', () => {
+        expect(isValidConditionGroups([], deps)).toBe(false);
+    });
+
+    test('is false when a condition has no data point selected', () => {
+        const groups = [{ id: 'g1', conditions: [buildCondition({ dataPointKey: '' })] }];
+        expect(isValidConditionGroups(groups, deps)).toBe(false);
+    });
+
+    test('is false when a value-requiring condition has a blank value', () => {
+        const groups = [
+            { id: 'g1', conditions: [buildCondition({ dataPointKey: 'name', value: '  ' })] },
+        ];
+        expect(isValidConditionGroups(groups, deps)).toBe(false);
+    });
+
+    test('is true for a value-less operator with no value', () => {
+        const groups = [
+            {
+                id: 'g1',
+                conditions: [buildCondition({ dataPointKey: 'name', operator: 'is_empty', value: '' })],
+            },
+        ];
+        expect(isValidConditionGroups(groups, deps)).toBe(true);
+    });
+
+    test('is true when the data point and value are both present', () => {
+        const groups = [
+            { id: 'g1', conditions: [buildCondition({ dataPointKey: 'name', value: 'Acme' })] },
+        ];
+        expect(isValidConditionGroups(groups, deps)).toBe(true);
+    });
+});

package/src/utils/conditions/__tests__/e-sign-offset-rules.utils.test.ts

@@ -0,0 +1,109 @@
+import type { ESignDateSignedOffsetSettingsRule } from '../../../interface/types';
+import {
+    addESignOffsetRule,
+    canAddESignOffsetRule,
+    createClearedESignOffsetSettings,
+    createESignOffsetRule,
+    createInitialESignOffsetRules,
+    getESignOffsetRulesForSave,
+    MAX_ESIGN_OFFSET_RULES,
+    removeESignOffsetRule,
+    updateESignOffsetRule,
+} from '../e-sign-offset-rules.utils';
+
+describe('createESignOffsetRule', () => {
+    test('creates a normal rule with a single default condition group', () => {
+        const rule = createESignOffsetRule();
+        expect(rule.days).toBe(0);
+        expect(rule.condition.behavior).toBe('show');
+        expect(rule.condition.groups).toHaveLength(1);
+        expect(rule.condition.groups[0].conditions).toHaveLength(1);
+    });
+});
+
+describe('createInitialESignOffsetRules', () => {
+    test('returns the same single blank rule as first opening Set Date Rule', () => {
+        const rules = createInitialESignOffsetRules();
+        const initialRule = createESignOffsetRule();
+        expect(rules).toHaveLength(1);
+        expect(rules[0].days).toBe(initialRule.days);
+        expect(rules[0].condition.behavior).toBe(initialRule.condition.behavior);
+        expect(rules[0].condition.groups).toHaveLength(1);
+        expect(rules[0].condition.groups[0].conditions).toHaveLength(1);
+    });
+});
+
+describe('addESignOffsetRule', () => {
+    test('appends a new rule after any existing rules, preserving their order', () => {
+        const first = createESignOffsetRule();
+        const withSecond = addESignOffsetRule([first]);
+        expect(withSecond).toHaveLength(2);
+        expect(withSecond[0]).toBe(first);
+
+        const withThird = addESignOffsetRule(withSecond);
+        expect(withThird).toHaveLength(3);
+        expect(withThird[0]).toBe(first);
+        expect(withThird[1]).toBe(withSecond[1]);
+    });
+
+    test('is a no-op once the max rule count is reached', () => {
+        let rules: ESignDateSignedOffsetSettingsRule[] = [];
+        for (let i = 0; i < MAX_ESIGN_OFFSET_RULES + 3; i++) {
+            rules = addESignOffsetRule(rules);
+        }
+        expect(rules).toHaveLength(MAX_ESIGN_OFFSET_RULES - 1);
+        expect(canAddESignOffsetRule(rules)).toBe(false);
+    });
+});
+
+describe('updateESignOffsetRule', () => {
+    test('replaces the rule at the given index without mutating the input array', () => {
+        const rules = [createESignOffsetRule(), createESignOffsetRule()];
+        const updated: ESignDateSignedOffsetSettingsRule = { ...rules[1], days: 7 };
+        const next = updateESignOffsetRule(rules, 1, updated);
+        expect(next[1].days).toBe(7);
+        expect(rules[1].days).toBe(0);
+    });
+});
+
+describe('removeESignOffsetRule', () => {
+    test('removes the rule at the given index without mutating the input array', () => {
+        const first = createESignOffsetRule();
+        const second = createESignOffsetRule();
+        const rules = [first, second];
+        const next = removeESignOffsetRule(rules, 0);
+        expect(next).toEqual([second]);
+        expect(rules).toHaveLength(2);
+    });
+
+    test('returns an empty array when the last conditioned rule is removed', () => {
+        const next = removeESignOffsetRule([createESignOffsetRule()], 0);
+        expect(next).toEqual([]);
+    });
+});
+
+describe('getESignOffsetRulesForSave', () => {
+    test('saves an empty conditioned-rule list after clear when no rule is configured', () => {
+        const blankRules = createInitialESignOffsetRules();
+        const subject = () => getESignOffsetRulesForSave(blankRules, true, false);
+
+        expect(subject()).toEqual([]);
+    });
+
+    test('saves the configured rules when a rule is added after clear', () => {
+        const configured = [{ ...createESignOffsetRule(), days: 3 }];
+        const subject = () => getESignOffsetRulesForSave(configured, true, true);
+
+        expect(subject()).toBe(configured);
+    });
+});
+
+describe('createClearedESignOffsetSettings', () => {
+    test('keeps only a zero-day else rule so a cleared date rule can be saved', () => {
+        const subject = () => createClearedESignOffsetSettings();
+
+        expect(subject()).toEqual({
+            rules: [{ days: 0 }],
+        });
+    });
+});