@beinformed/ui 1.59.2 → 1.59.4

package/lib/utils/datetime/__tests__/DateTimeFormat.spec.js.flow

@@ -0,0 +1,146 @@
+import { TimestampUtil } from "../DateTimeUtil";
+import { INCLUDE_TIME_OFFSET, setSettings } from "../../../constants";
+
+const timestamp = "2023-06-07T07:04:01.010+02:00";
+
+describe("date time format conversion", () => {
+  beforeEach(() => {
+    TimestampUtil.setTimeZone("Europe/Amsterdam");
+    setSettings({ [INCLUDE_TIME_OFFSET]: true });
+  });
+
+  test("Year", () => {
+    expect(TimestampUtil.toFormat(timestamp, "yy")).toBe("23");
+    expect(TimestampUtil.toFormat(timestamp, "yyyy")).toBe("2023");
+  });
+
+  test("Month", () => {
+    expect(TimestampUtil.toFormat(timestamp, "M")).toBe("6");
+    expect(TimestampUtil.toFormat(timestamp, "MM")).toBe("06");
+    expect(TimestampUtil.toFormat(timestamp, "MMM")).toBe("Jun");
+    expect(TimestampUtil.toFormat(timestamp, "MMMM")).toBe("June");
+    expect(TimestampUtil.toFormat(timestamp, "MMMMM")).toBe("J");
+
+    expect(TimestampUtil.toFormat(timestamp, "L")).toBe("6");
+    expect(TimestampUtil.toFormat(timestamp, "LL")).toBe("06");
+    expect(TimestampUtil.toFormat(timestamp, "LLL")).toBe("Jun");
+    expect(TimestampUtil.toFormat(timestamp, "LLLL")).toBe("June");
+    expect(TimestampUtil.toFormat(timestamp, "LLLLL")).toBe("J");
+  });
+
+  test("Day", () => {
+    expect(TimestampUtil.toFormat(timestamp, "d")).toBe("7");
+    expect(TimestampUtil.toFormat(timestamp, "dd")).toBe("07");
+  });
+
+  test("Quarter", () => {
+    expect(TimestampUtil.toFormat(timestamp, "Q")).toBe("2");
+    expect(TimestampUtil.toFormat(timestamp, "QQ")).toBe("02");
+    expect(TimestampUtil.toFormat(timestamp, "QQQ")).toBe("Q2");
+    expect(TimestampUtil.toFormat(timestamp, "QQQQ")).toBe("2nd quarter");
+  });
+
+  test.skip("Day of Year", () => {
+    expect(TimestampUtil.toFormat(timestamp, "D")).toBe("7");
+    expect(TimestampUtil.toFormat(timestamp, "DD")).toBe("07");
+    expect(TimestampUtil.toFormat(timestamp, "DDD")).toBe("07");
+  });
+
+  test("Day of Week", () => {
+    expect(TimestampUtil.toFormat(timestamp, "E")).toBe("Wed");
+    expect(TimestampUtil.toFormat(timestamp, "EEEE")).toBe("Wednesday");
+    expect(TimestampUtil.toFormat(timestamp, "EEEEE")).toBe("W");
+
+    expect(TimestampUtil.toFormat(timestamp, "e")).toBe("3");
+    expect(TimestampUtil.toFormat(timestamp, "ee")).toBe("03");
+    expect(TimestampUtil.toFormat(timestamp, "eee")).toBe("Wed");
+    expect(TimestampUtil.toFormat(timestamp, "eeee")).toBe("Wednesday");
+    expect(TimestampUtil.toFormat(timestamp, "eeeee")).toBe("W");
+  });
+
+  test("Week", () => {
+    expect(TimestampUtil.toFormat(timestamp, "w")).toBe("23");
+    // expect(TimestampUtil.toFormat(timestamp, "W")).toBe("23");
+    // expect(TimestampUtil.toFormat(timestamp, "F")).toBe("W");
+  });
+
+  test("Hour", () => {
+    expect(TimestampUtil.toFormat(timestamp, "H")).toBe("7");
+    expect(TimestampUtil.toFormat(timestamp, "HH")).toBe("07");
+    expect(TimestampUtil.toFormat(timestamp, "h")).toBe("7");
+    expect(TimestampUtil.toFormat(timestamp, "hh")).toBe("07");
+
+    expect(TimestampUtil.toFormat(timestamp, "a")).toBe("AM");
+    expect(TimestampUtil.toFormat(timestamp, "aa")).toBe("AM");
+    expect(TimestampUtil.toFormat(timestamp, "aaa")).toBe("am");
+    expect(TimestampUtil.toFormat(timestamp, "aaaa")).toBe("a.m.");
+    expect(TimestampUtil.toFormat(timestamp, "aaaaa")).toBe("a");
+
+    expect(TimestampUtil.toFormat(timestamp, "K")).toBe("7");
+    expect(TimestampUtil.toFormat(timestamp, "k")).toBe("7");
+  });
+
+  test("Minute", () => {
+    expect(TimestampUtil.toFormat(timestamp, "m")).toBe("4");
+    expect(TimestampUtil.toFormat(timestamp, "mm")).toBe("04");
+  });
+
+  test("Seconds", () => {
+    expect(TimestampUtil.toFormat(timestamp, "s")).toBe("1");
+    expect(TimestampUtil.toFormat(timestamp, "ss")).toBe("01");
+  });
+
+  test("Milliseconds", () => {
+    expect(TimestampUtil.toFormat(timestamp, "SSS")).toBe("010");
+  });
+
+  test("Zone / offset", () => {
+    expect(TimestampUtil.toFormat(timestamp, "z")).toBe("GMT+2");
+    expect(TimestampUtil.toFormat(timestamp, "zz")).toBe("GMT+2");
+    expect(TimestampUtil.toFormat(timestamp, "zzz")).toBe("GMT+2");
+    expect(TimestampUtil.toFormat(timestamp, "zzzz")).toBe("GMT+02:00");
+    expect(TimestampUtil.toFormat(timestamp, "zzzzz")).toBe("GMT+02:00");
+
+    expect(TimestampUtil.toFormat(timestamp, "X")).toBe("+02");
+    expect(TimestampUtil.toFormat(timestamp, "XX")).toBe("+0200");
+    expect(TimestampUtil.toFormat(timestamp, "XXX")).toBe("+02:00");
+
+    expect(TimestampUtil.toFormat(timestamp, "x")).toBe("+02");
+    expect(TimestampUtil.toFormat(timestamp, "xx")).toBe("+0200");
+    expect(TimestampUtil.toFormat(timestamp, "xxx")).toBe("+02:00");
+
+    expect(TimestampUtil.toFormat(timestamp, "O")).toBe("GMT+2");
+    expect(TimestampUtil.toFormat(timestamp, "OOOO")).toBe("GMT+02:00");
+
+    // expect(TimestampUtil.toFormat(timestamp, "VV")).toBe("GMT+02:00");
+    // expect(TimestampUtil.toFormat(timestamp, "V")).toBe("Europe/Amsterdam");
+    // expect(TimestampUtil.toFormat(timestamp, "Z")).toBe("+02:00");
+    // expect(TimestampUtil.toFormat(timestamp, "ZZZZ")).toBe("+02:00");
+  });
+
+  test("Era and Chronology", () => {
+    expect(TimestampUtil.toFormat(timestamp, "G")).toBe("AD");
+    expect(TimestampUtil.toFormat(timestamp, "GGGG")).toBe("Anno Domini");
+    expect(TimestampUtil.toFormat(timestamp, "GGGGG")).toBe("A");
+
+    expect(TimestampUtil.toFormat(timestamp, "u")).toBe("2023");
+  });
+
+  test("Converted", () => {
+    const ZZZ = TimestampUtil.convertFormat("ZZZ");
+    expect(TimestampUtil.toFormat(timestamp, ZZZ)).toBe("+02:00");
+
+    const ZZ = TimestampUtil.convertFormat("ZZ");
+    expect(TimestampUtil.toFormat(timestamp, ZZ)).toBe("+0200");
+
+    const Z = TimestampUtil.convertFormat("Z");
+    expect(TimestampUtil.toFormat(timestamp, Z)).toBe("+02");
+
+    const fullDateTime = TimestampUtil.convertFormat(
+      "EEE MMM dd, yyyy h:mma ZZ",
+    );
+    expect(TimestampUtil.toFormat(timestamp, fullDateTime)).toBe(
+      "Wed Jun 07, 2023 7:04AM +0200",
+    );
+  });
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@beinformed/ui",
-  "version": "1.59.2",
+  "version": "1.59.4",
   "description": "Toolbox for be informed javascript layouts",
   "license": "SEE LICENSE IN LICENSE.md",
   "bugs": "http://support.beinformed.com",

package/src/models/attributes/DatetimeAttributeModel.js

@@ -34,6 +34,9 @@ import type { OffsetInfo } from "../../utils/datetime/DateTimeUtil";
 /**
  */
 class DatetimeAttributeModel extends StringAttributeModel {
+  _dateInputFormat: ?string;
+  _timeInputFormat: ?string;
+
   /**
    */
   constructor(
@@ -269,9 +272,27 @@ class DatetimeAttributeModel extends StringAttributeModel {
       return "";
     }
 
-    return this.hasTime
-      ? this.format.replace(this.timeInputFormat, "").trim()
-      : this.format;
+    if (this._dateInputFormat) {
+      return this._dateInputFormat;
+    }
+
+    // remove time and offset tokens
+    const charsToRemove = "HhaKmsSzXxO:";
+
+    let inputFormat = "";
+    let isInQuotes = false;
+    for (let i = 0; i < this.format.length; i++) {
+      const char = this.format[i];
+      if (char === "'") {
+        isInQuotes = !isInQuotes;
+      }
+      if (isInQuotes || !charsToRemove.includes(char)) {
+        inputFormat += char;
+      }
+    }
+
+    this._dateInputFormat = inputFormat.trim();
+    return this._dateInputFormat;
   }
 
   /**
@@ -318,6 +339,10 @@ class DatetimeAttributeModel extends StringAttributeModel {
       return "";
     }
 
+    if (this._timeInputFormat) {
+      return this._timeInputFormat;
+    }
+
     const format = this.format;
 
     let timeFormatParts = [];
@@ -338,9 +363,11 @@ class DatetimeAttributeModel extends StringAttributeModel {
       timeFormat = `${timeFormat}.SSS`;
     }
     if (format.includes("a")) {
-      return `${timeFormat} a`;
+      timeFormat = `${timeFormat} a`;
     }
-    return timeFormat;
+
+    this._timeInputFormat = timeFormat;
+    return this._timeInputFormat;
   }
 
   /**
@@ -385,15 +412,6 @@ class DatetimeAttributeModel extends StringAttributeModel {
       return DateUtil.toFormat(value, this.dateReadonlyFormat);
     }
 
-    if (this.hasDate && this.hasTime) {
-      const dateTimeReadonlyFormat = `${this.dateReadonlyFormat} ${this.timeReadonlyFormat}`;
-      return this.formatUtil.toFormat(value, dateTimeReadonlyFormat);
-    }
-
-    if (this.type === "date") {
-      return this.formatUtil.toFormat(value, this.dateReadonlyFormat);
-    }
-
     return this.formatUtil.toFormat(value, this.format);
   }
 

package/src/models/attributes/__tests__/DatetimeAttributeModel.spec.js

@@ -153,6 +153,35 @@ describe("datetimeAttributeModel", () => {
     expect(attribute.readonlyvalue).toBe("21-12-2031 17:41");
   });
 
+  it("can handle custom format", () => {
+    const attribute = new DatetimeAttributeModel(
+      { value: "2031-12-21T17:41:21" },
+      {
+        type: "datetime",
+        format: "dd-MM-yyyy HH:mm xxx",
+      },
+    );
+    expect(attribute.readonlyvalue).toBe("21-12-2031 17:41 +01:00");
+
+    const attribute2 = new DatetimeAttributeModel(
+      { value: "2031-12-21T17:41:21" },
+      {
+        type: "datetime",
+        format: "dd-MM-yyyy HH:mm Z",
+      },
+    );
+    expect(attribute2.readonlyvalue).toBe("21-12-2031 17:41 +01");
+
+    const attribute3 = new DatetimeAttributeModel(
+      { value: "2031-12-21T17:41:21" },
+      {
+        type: "datetime",
+        format: "EEE MMM dd, yyyy h:mma ZZ",
+      },
+    );
+    expect(attribute3.readonlyvalue).toBe("Sun Dec 21, 2031 5:41PM +0100");
+  });
+
   it("returns date part of formatlabel as placeholder if attribute has date and time", () => {
     const attribute = new DatetimeAttributeModel(
       {},

package/src/models/attributes/__tests__/DatetimeAttributeModel_offset.spec.js

@@ -303,4 +303,21 @@ describe("datetimeAttributeModel with offset on", () => {
       value: "+02:00",
     });
   });
+
+  it("Date format with offset info", () => {
+    const attribute = new DatetimeAttributeModel(
+      { key: "datetime", value: "1969-09-23T12:34:00+00:00" },
+      {
+        type: "datetime",
+        label: "Start date and time at company",
+        mandatory: false,
+        formatlabel: "dd-mm-yyyy hh:mm",
+        assistant: "The date and time of the first working day",
+        format: "dd-MM-yyyy HH:mm X",
+      },
+    );
+
+    expect(attribute.format).toBe("dd-MM-yyyy HH:mm X");
+    expect(attribute.errorCollection.isEmpty).toBe(true);
+  });
 });

package/src/utils/datetime/DateTimeUtil.js

@@ -99,8 +99,32 @@ class BaseDateTimeUtil {
 
   /**
    */
-  convertFormat(sourceFormat: string): string {
-    return sourceFormat ? sourceFormat : this.getIsoFormat();
+  convertFormat(javaFormat: string): string {
+    if (!javaFormat) {
+      return this.getIsoFormat();
+    }
+
+    const javaToUTS35Map = {
+      ZZZ: "xxx",
+      ZZ: "xx",
+      Z: "x",
+    };
+
+    // Replace Java pattern tokens with UTS #35 tokens
+    let uts35Format = javaFormat;
+
+    // Sort keys by length (descending) to handle multi-character tokens first
+    const sortedKeys = Object.keys(javaToUTS35Map).sort(
+      (a, b) => b.length - a.length,
+    );
+
+    for (const javaToken of sortedKeys) {
+      const uts35Token = javaToUTS35Map[javaToken];
+      const regex = new RegExp(javaToken, "g"); // Match all occurrences
+      uts35Format = uts35Format.replace(regex, uts35Token);
+    }
+
+    return uts35Format;
   }
 
   /**

package/src/utils/datetime/__tests__/DateTime.spec.js

@@ -613,6 +613,13 @@ describe("asserts for date/time utilities", () => {
       expect(TimestampUtil.convertFormat("yyyy-MM-dd HH:mm:ss.SSS")).toBe(
         "yyyy-MM-dd HH:mm:ss.SSS",
       );
+      expect(TimestampUtil.convertFormat("dd-MM-yyyy HH:mm Z")).toBe(
+        "dd-MM-yyyy HH:mm x",
+      );
+
+      expect(TimestampUtil.convertFormat("dd-MM-yyyy HH:mm zzzz")).toBe(
+        "dd-MM-yyyy HH:mm zzzz",
+      );
     });
 
     it("should render iso timestamp to specified format", () => {

package/src/utils/datetime/__tests__/DateTimeFormat.spec.js

@@ -0,0 +1,146 @@
+import { TimestampUtil } from "../DateTimeUtil";
+import { INCLUDE_TIME_OFFSET, setSettings } from "../../../constants";
+
+const timestamp = "2023-06-07T07:04:01.010+02:00";
+
+describe("date time format conversion", () => {
+  beforeEach(() => {
+    TimestampUtil.setTimeZone("Europe/Amsterdam");
+    setSettings({ [INCLUDE_TIME_OFFSET]: true });
+  });
+
+  test("Year", () => {
+    expect(TimestampUtil.toFormat(timestamp, "yy")).toBe("23");
+    expect(TimestampUtil.toFormat(timestamp, "yyyy")).toBe("2023");
+  });
+
+  test("Month", () => {
+    expect(TimestampUtil.toFormat(timestamp, "M")).toBe("6");
+    expect(TimestampUtil.toFormat(timestamp, "MM")).toBe("06");
+    expect(TimestampUtil.toFormat(timestamp, "MMM")).toBe("Jun");
+    expect(TimestampUtil.toFormat(timestamp, "MMMM")).toBe("June");
+    expect(TimestampUtil.toFormat(timestamp, "MMMMM")).toBe("J");
+
+    expect(TimestampUtil.toFormat(timestamp, "L")).toBe("6");
+    expect(TimestampUtil.toFormat(timestamp, "LL")).toBe("06");
+    expect(TimestampUtil.toFormat(timestamp, "LLL")).toBe("Jun");
+    expect(TimestampUtil.toFormat(timestamp, "LLLL")).toBe("June");
+    expect(TimestampUtil.toFormat(timestamp, "LLLLL")).toBe("J");
+  });
+
+  test("Day", () => {
+    expect(TimestampUtil.toFormat(timestamp, "d")).toBe("7");
+    expect(TimestampUtil.toFormat(timestamp, "dd")).toBe("07");
+  });
+
+  test("Quarter", () => {
+    expect(TimestampUtil.toFormat(timestamp, "Q")).toBe("2");
+    expect(TimestampUtil.toFormat(timestamp, "QQ")).toBe("02");
+    expect(TimestampUtil.toFormat(timestamp, "QQQ")).toBe("Q2");
+    expect(TimestampUtil.toFormat(timestamp, "QQQQ")).toBe("2nd quarter");
+  });
+
+  test.skip("Day of Year", () => {
+    expect(TimestampUtil.toFormat(timestamp, "D")).toBe("7");
+    expect(TimestampUtil.toFormat(timestamp, "DD")).toBe("07");
+    expect(TimestampUtil.toFormat(timestamp, "DDD")).toBe("07");
+  });
+
+  test("Day of Week", () => {
+    expect(TimestampUtil.toFormat(timestamp, "E")).toBe("Wed");
+    expect(TimestampUtil.toFormat(timestamp, "EEEE")).toBe("Wednesday");
+    expect(TimestampUtil.toFormat(timestamp, "EEEEE")).toBe("W");
+
+    expect(TimestampUtil.toFormat(timestamp, "e")).toBe("3");
+    expect(TimestampUtil.toFormat(timestamp, "ee")).toBe("03");
+    expect(TimestampUtil.toFormat(timestamp, "eee")).toBe("Wed");
+    expect(TimestampUtil.toFormat(timestamp, "eeee")).toBe("Wednesday");
+    expect(TimestampUtil.toFormat(timestamp, "eeeee")).toBe("W");
+  });
+
+  test("Week", () => {
+    expect(TimestampUtil.toFormat(timestamp, "w")).toBe("23");
+    // expect(TimestampUtil.toFormat(timestamp, "W")).toBe("23");
+    // expect(TimestampUtil.toFormat(timestamp, "F")).toBe("W");
+  });
+
+  test("Hour", () => {
+    expect(TimestampUtil.toFormat(timestamp, "H")).toBe("7");
+    expect(TimestampUtil.toFormat(timestamp, "HH")).toBe("07");
+    expect(TimestampUtil.toFormat(timestamp, "h")).toBe("7");
+    expect(TimestampUtil.toFormat(timestamp, "hh")).toBe("07");
+
+    expect(TimestampUtil.toFormat(timestamp, "a")).toBe("AM");
+    expect(TimestampUtil.toFormat(timestamp, "aa")).toBe("AM");
+    expect(TimestampUtil.toFormat(timestamp, "aaa")).toBe("am");
+    expect(TimestampUtil.toFormat(timestamp, "aaaa")).toBe("a.m.");
+    expect(TimestampUtil.toFormat(timestamp, "aaaaa")).toBe("a");
+
+    expect(TimestampUtil.toFormat(timestamp, "K")).toBe("7");
+    expect(TimestampUtil.toFormat(timestamp, "k")).toBe("7");
+  });
+
+  test("Minute", () => {
+    expect(TimestampUtil.toFormat(timestamp, "m")).toBe("4");
+    expect(TimestampUtil.toFormat(timestamp, "mm")).toBe("04");
+  });
+
+  test("Seconds", () => {
+    expect(TimestampUtil.toFormat(timestamp, "s")).toBe("1");
+    expect(TimestampUtil.toFormat(timestamp, "ss")).toBe("01");
+  });
+
+  test("Milliseconds", () => {
+    expect(TimestampUtil.toFormat(timestamp, "SSS")).toBe("010");
+  });
+
+  test("Zone / offset", () => {
+    expect(TimestampUtil.toFormat(timestamp, "z")).toBe("GMT+2");
+    expect(TimestampUtil.toFormat(timestamp, "zz")).toBe("GMT+2");
+    expect(TimestampUtil.toFormat(timestamp, "zzz")).toBe("GMT+2");
+    expect(TimestampUtil.toFormat(timestamp, "zzzz")).toBe("GMT+02:00");
+    expect(TimestampUtil.toFormat(timestamp, "zzzzz")).toBe("GMT+02:00");
+
+    expect(TimestampUtil.toFormat(timestamp, "X")).toBe("+02");
+    expect(TimestampUtil.toFormat(timestamp, "XX")).toBe("+0200");
+    expect(TimestampUtil.toFormat(timestamp, "XXX")).toBe("+02:00");
+
+    expect(TimestampUtil.toFormat(timestamp, "x")).toBe("+02");
+    expect(TimestampUtil.toFormat(timestamp, "xx")).toBe("+0200");
+    expect(TimestampUtil.toFormat(timestamp, "xxx")).toBe("+02:00");
+
+    expect(TimestampUtil.toFormat(timestamp, "O")).toBe("GMT+2");
+    expect(TimestampUtil.toFormat(timestamp, "OOOO")).toBe("GMT+02:00");
+
+    // expect(TimestampUtil.toFormat(timestamp, "VV")).toBe("GMT+02:00");
+    // expect(TimestampUtil.toFormat(timestamp, "V")).toBe("Europe/Amsterdam");
+    // expect(TimestampUtil.toFormat(timestamp, "Z")).toBe("+02:00");
+    // expect(TimestampUtil.toFormat(timestamp, "ZZZZ")).toBe("+02:00");
+  });
+
+  test("Era and Chronology", () => {
+    expect(TimestampUtil.toFormat(timestamp, "G")).toBe("AD");
+    expect(TimestampUtil.toFormat(timestamp, "GGGG")).toBe("Anno Domini");
+    expect(TimestampUtil.toFormat(timestamp, "GGGGG")).toBe("A");
+
+    expect(TimestampUtil.toFormat(timestamp, "u")).toBe("2023");
+  });
+
+  test("Converted", () => {
+    const ZZZ = TimestampUtil.convertFormat("ZZZ");
+    expect(TimestampUtil.toFormat(timestamp, ZZZ)).toBe("+02:00");
+
+    const ZZ = TimestampUtil.convertFormat("ZZ");
+    expect(TimestampUtil.toFormat(timestamp, ZZ)).toBe("+0200");
+
+    const Z = TimestampUtil.convertFormat("Z");
+    expect(TimestampUtil.toFormat(timestamp, Z)).toBe("+02");
+
+    const fullDateTime = TimestampUtil.convertFormat(
+      "EEE MMM dd, yyyy h:mma ZZ",
+    );
+    expect(TimestampUtil.toFormat(timestamp, fullDateTime)).toBe(
+      "Wed Jun 07, 2023 7:04AM +0200",
+    );
+  });
+});