Visual Console Client: added new items

Former-commit-id: 8c611d9b5dfdc4d111b6529f87f693aaa624f4cb

visual_console/src/items/Group.spec.ts

@@ -0,0 +1,53 @@
+import Group, { groupPropsDecoder } from "./Group";
+
+const genericRawProps = {
+  id: 1,
+  type: 11, // Group item = 11
+  label: null,
+  isLinkEnabled: false,
+  isOnTop: false,
+  parentId: null,
+  aclGroupId: null
+};
+
+const positionRawProps = {
+  x: 100,
+  y: 50
+};
+
+const sizeRawProps = {
+  width: 100,
+  height: 100
+};
+
+const groupRawProps = {
+  imageSrc:
+    "https://brutus.artica.lan:8081/uploads/-/system/project/avatar/1/1.png",
+  groupId: 1
+};
+
+describe("Group item", () => {
+  const groupInstance = new Group(
+    groupPropsDecoder({
+      ...genericRawProps,
+      ...positionRawProps,
+      ...sizeRawProps,
+      ...groupRawProps
+    })
+  );
+
+  it("should have the group class", () => {
+    expect(
+      groupInstance.elementRef.getElementsByClassName("group").length
+    ).toBeGreaterThan(0);
+  });
+
+  it("should have the required size", () => {
+    expect(groupInstance.elementRef.style.width).toBe(
+      `${sizeRawProps.width}px`
+    );
+    expect(groupInstance.elementRef.style.height).toBe(
+      `${sizeRawProps.height}px`
+    );
+  });
+});

visual_console/src/items/Group.ts

@@ -0,0 +1,52 @@
+import { LinkedVisualConsoleProps, UnknownObject } from "../types";
+
+import { linkedVCPropsDecoder, parseIntOr } from "../lib";
+
+import VisualConsoleItem, {
+  VisualConsoleItemProps,
+  itemBasePropsDecoder,
+  VisualConsoleItemType
+} from "../VisualConsoleItem";
+
+export type GroupProps = {
+  type: VisualConsoleItemType.GROUP_ITEM;
+  imageSrc: string; // URL?
+  groupId: number;
+} & VisualConsoleItemProps &
+  LinkedVisualConsoleProps;
+
+/**
+ * Build a valid typed object from a raw object.
+ * This will allow us to ensure the type safety.
+ *
+ * @param data Raw object.
+ * @return An object representing the group props.
+ * @throws Will throw a TypeError if some property
+ * is missing from the raw object or have an invalid type.
+ */
+export function groupPropsDecoder(data: UnknownObject): GroupProps | never {
+  if (typeof data.imageSrc !== "string" || data.imageSrc.length === 0) {
+    throw new TypeError("invalid image src.");
+  }
+  if (parseIntOr(data.groupId, null) === null) {
+    throw new TypeError("invalid group Id.");
+  }
+
+  return {
+    ...itemBasePropsDecoder(data), // Object spread. It will merge the properties of the two objects.
+    type: VisualConsoleItemType.GROUP_ITEM,
+    imageSrc: data.imageSrc,
+    groupId: parseInt(data.groupId),
+    ...linkedVCPropsDecoder(data) // Object spread. It will merge the properties of the two objects.
+  };
+}
+
+export default class Group extends VisualConsoleItem<GroupProps> {
+  createDomElement(): HTMLElement {
+    const img: HTMLImageElement = document.createElement("img");
+    img.className = "group";
+    img.src = this.props.imageSrc;
+
+    return img;
+  }
+}

visual_console/src/items/Icon.ts

@@ -0,0 +1,47 @@
+import { LinkedVisualConsoleProps, UnknownObject } from "../types";
+
+import { linkedVCPropsDecoder } from "../lib";
+
+import VisualConsoleItem, {
+  VisualConsoleItemProps,
+  itemBasePropsDecoder,
+  VisualConsoleItemType
+} from "../VisualConsoleItem";
+
+export type IconProps = {
+  type: VisualConsoleItemType.ICON;
+  imageSrc: string; // URL?
+} & VisualConsoleItemProps &
+  LinkedVisualConsoleProps;
+
+/**
+ * Build a valid typed object from a raw object.
+ * This will allow us to ensure the type safety.
+ *
+ * @param data Raw object.
+ * @return An object representing the icon props.
+ * @throws Will throw a TypeError if some property
+ * is missing from the raw object or have an invalid type.
+ */
+export function iconPropsDecoder(data: UnknownObject): IconProps | never {
+  if (typeof data.imageSrc !== "string" || data.imageSrc.length === 0) {
+    throw new TypeError("invalid image src.");
+  }
+
+  return {
+    ...itemBasePropsDecoder(data), // Object spread. It will merge the properties of the two objects.
+    type: VisualConsoleItemType.ICON,
+    imageSrc: data.imageSrc,
+    ...linkedVCPropsDecoder(data) // Object spread. It will merge the properties of the two objects.
+  };
+}
+
+export default class Icon extends VisualConsoleItem<IconProps> {
+  createDomElement(): HTMLElement {
+    const img: HTMLImageElement = document.createElement("img");
+    img.className = "icon";
+    img.src = this.props.imageSrc;
+
+    return img;
+  }
+}