systemview 1.1.2 → 1.3.2

package/src/molecules/ValidationInput/ValidationOptions.js

@@ -1,113 +0,0 @@
-const string = {
-  options: [
-    "Equals:",
-    "Min Length:",
-    "Max Length:",
-    "Length Equals:",
-    "Is Like:",
-    "Is One Of:",
-  ],
-  values: ["strEquals", "minLength", "maxLength", "lengthEquals", "isLike", "isOneOf"],
-  inputs: ["text", "number", "number", "number", "text", "text"],
-};
-const number = {
-  options: ["Equals:", "Min:", "Max:", "Is One Of:"],
-  values: ["numEquals", "min", "max", "isOneOf"],
-  inputs: ["number", "number", "number", "text"],
-};
-const array = {
-  options: ["Min Length:", "Max Length:", "Length Equals:", "Includes:"],
-  values: ["minLength", "maxLength", "lengthEquals", "includes"],
-  inputs: ["number", "number", "number", "text"],
-};
-const date = {
-  options: ["Equals:", "Min:", "Max:"],
-  values: ["dateEquals", "minDate", "maxDate"],
-  inputs: ["datetime-local", "datetime-local", "datetime-local"],
-};
-const boolean = { options: ["Equals:"], values: ["boolEquals"], inputs: ["checkbox"] };
-const object = { options: [], values: [], inputs: [] };
-const target = {
-  options: [
-    //string
-    "Equals (str):",
-    "Min Length (str):",
-    "Max Length (str):",
-    "Length Equals (str):",
-    "Is Like:",
-    "Is One Of (str):",
-    //number
-    "Equals (num):",
-    "Min (num):",
-    "Max (num):",
-    "Is One Of (num):",
-    //array
-    "Min Length (arr):",
-    "Max Length (arr):",
-    "Length Equals (arr):",
-    "Includes:",
-    //date
-    "Date Equals:",
-    "Min Date:",
-    "Max Date:",
-    //boolean
-    "Equals (bool)",
-  ],
-  values: [
-    //string
-    "strEquals",
-    "minLength",
-    "maxLength",
-    "lengthEquals",
-    "isLike",
-    "isOneOf",
-    //number
-    "numEquals",
-    "min",
-    "max",
-    "isOneOf",
-    //array
-    "minLength",
-    "maxLength",
-    "lengthEquals",
-    "includes",
-    //date
-    "dateEquals",
-    "minDate",
-    "maxDate",
-    //boolean
-    "boolEquals",
-  ],
-  inputs: [
-    //string
-    "text",
-    "number",
-    "number",
-    "number",
-    //number
-    "text",
-    "text",
-    "number",
-    "number",
-    "number",
-    "text",
-    //array
-    "number",
-    "number",
-    "number",
-    "text",
-    //date
-    "datetime-local",
-    "datetime-local",
-    "datetime-local",
-    "checkbox",
-  ],
-};
-const options = { array, number, date, boolean, string, object, target };
-export default options;
-export const inputToTypes = {
-  text: "string",
-  number: "number",
-  "datetime-local": "date",
-  checkbox: "boolean",
-};

package/src/molecules/ValidationInput/styles.scss

@@ -1,74 +0,0 @@
-.error-message {
-  padding: 4px 25px;
-  color: #ff5722;
-  word-break: break-word;
-  font-family: monospace;
-  &__message-container {
-    background: #ededed;
-  }
-  &__message {
-    padding: 6px 23px;
-    background: #ededed;
-    border-radius: 5px;
-  }
-  &__namespace {
-    color: #b136c6;
-    font-weight: 600;
-  }
-  &__expected {
-    color: #0b8b22;
-    font-weight: 700;
-  }
-}
-
-.validation-input {
-  margin: 3px 0;
-  display: flex;
-  &__input,
-  &__selector {
-    background: none;
-    border: none;
-    font-family: monospace;
-    font-size: 14px;
-  }
-  &__selector {
-    padding: 3px;
-    outline: none;
-    border-right: none;
-    appearance: none;
-    cursor: pointer;
-    font-weight: bold;
-    color: #009688;
-    text-indent: 5px;
-    &:hover {
-      background: #b3c1e8;
-      border-radius: 33px;
-      // color: #f1f1f1;
-    }
-  }
-
-  &__input {
-    padding: 4px;
-    outline: none;
-    color: #0d8065;
-  }
-  &__value {
-    &--boolean {
-      &--true {
-        color: #207844;
-      }
-      &--false {
-        color: #cf1515;
-      }
-      position: relative;
-      top: 7px;
-      font-weight: bold;
-    }
-  }
-}
-input:-webkit-autofill {
-  border: 3px solid blue;
-}
-input:autofill {
-  border: 3px solid blue;
-}

package/src/molecules/ValidationInput/validator.js

@@ -1,244 +0,0 @@
-import moment from "moment";
-import {
-  arr,
-  obj,
-  parseIndex,
-  mapNamespace,
-  replaceLastIndex,
-  switchArrayIndices,
-} from "../../organisms/TestPanel/components/test-helpers";
-
-export function evaluate(value, namespace, savedEval = {}, shouldSave) {
-  const type = getType(value);
-  const validations = savedEval.validations || [];
-  const expected_type = savedEval.expected_type || type;
-  const save = shouldSave || !!savedEval.save;
-  const indexed = savedEval.indexed;
-  const errors = getErrors({ type, value, validations, expected_type });
-  return {
-    namespace,
-    expected_type,
-    validations,
-    save,
-    indexed,
-    type,
-    value,
-    errors,
-  };
-}
-
-export function validateResults() {
-  const { results, response_type, savedEvaluations, editMode } = this;
-  const savedEvalClone = [...savedEvaluations];
-  const shouldSave = !savedEvaluations.length;
-  const evaluations = [];
-  const errors = [];
-
-  function getSavedIndices(data, nsp) {
-    const randomIndex = () => {
-      // get all matching indices and rename them
-      // so they can be found later during getSavedEval
-      const index = arr(data).randomIndex();
-      const new_nsp = replaceLastIndex(nsp, index);
-      savedEvalClone.forEach((e) => {
-        if (!e.indexed) e.namespace = switchArrayIndices(e.namespace, new_nsp);
-      });
-      return index;
-    };
-    const savedIndices = savedEvalClone
-      .filter(({ namespace }) => {
-        return replaceLastIndex(namespace) === nsp;
-      })
-      .map((e) => {
-        if (e.indexed) {
-          return parseIndex(e.namespace);
-        } else {
-          return randomIndex();
-        }
-      });
-    return savedIndices.length ? savedIndices : [randomIndex()];
-  }
-  const getSavedEval = (nsp) => {
-    const i = savedEvalClone.findIndex(({ namespace }) => {
-      return replaceLastIndex(namespace) === replaceLastIndex(nsp);
-    });
-    return i > -1 ? savedEvalClone.splice(i, 1)[0] : {};
-  };
-  const addEvaluation = (evaluation) => {
-    evaluation.errors.forEach(
-      (e) => evaluation.save && errors.push({ ...e, namespace: evaluation.namespace })
-    );
-    evaluations.push(evaluation);
-  };
-
-  //evaluate based on the result only in edit mode
-  if (editMode)
-    (function recursiveEval(data, namespace) {
-      const evaluation = evaluate(data, namespace, getSavedEval(namespace), shouldSave);
-      addEvaluation(evaluation);
-      if (evaluation.type === "object") {
-        Object.getOwnPropertyNames(data).forEach((prop) => {
-          recursiveEval(data[prop], `${namespace}.${prop}`);
-        });
-      } else if (evaluation.type === "array") {
-        const indices = getSavedIndices(data, `${namespace}[0]`);
-        indices.forEach((index) => recursiveEval(data[index], `${namespace}[${index}]`));
-      }
-    })(results, response_type);
-
-  //evaluate based on the saved evaluations
-
-  // if (!editMode) {
-  const objParser = new obj({ [response_type]: results });
-  savedEvalClone.forEach(({ namespace, ...e }) => {
-    const value = objParser.valueAtNsp(namespace);
-    if (e.save) addEvaluation(evaluate(value, namespace, e));
-  });
-  // }
-
-  Object.assign(this, {
-    evaluations: evaluations.sort((e1, e2) => e1.namespace.localeCompare(e2.namespace)),
-    errors,
-  });
-}
-
-export function getErrors({ type, value, validations, expected_type }) {
-  if (type !== expected_type && expected_type !== "mixed")
-    return [{ name: "typeError", expected: expected_type, received: type }];
-
-  switch (type) {
-    case "number":
-      return validateNumber(value, validations);
-    case "date":
-      return validateDate(value, validations);
-    case "string":
-      return validateString(value, validations);
-    case "array":
-      return validateArray(value, validations);
-    case "boolean":
-      return validateBoolean(value, validations);
-    case "null":
-    case "undefined":
-    default:
-      return [];
-  }
-}
-
-export function getType(value) {
-  switch (true) {
-    case typeof value === "object":
-      if (!value) return "null";
-      else if (Array.isArray(value)) return "array";
-      else return "object";
-    case typeof value === "string":
-      if (moment(value).isValid()) return "date";
-      else return "string";
-    case typeof value === "number":
-      return "number";
-    case typeof value === "boolean":
-      return "boolean";
-    case typeof value === "undefined":
-      return "undefined";
-    default:
-      return "?";
-  }
-}
-
-export const defaultValue = (data_type) => {
-  switch (data_type) {
-    case "string":
-      return "";
-    case "number":
-      return 0;
-    case "date":
-      return moment().toJSON();
-    case "boolean":
-      return false;
-    case "array":
-      return [];
-    case "object":
-      return {};
-    case "null":
-      return null;
-    case "target":
-      return "";
-    case "undefined":
-    default:
-      return undefined;
-  }
-};
-
-const validateLength = (item, validations) =>
-  validations.reduce((errors, { name, value }) => {
-    if (name === "lengthEquals" && item.length !== value)
-      return errors.concat({ name, expected: value, received: item.length });
-    if (name === "maxLength" && item.length > value)
-      return errors.concat({ name, expected: value, received: item.length });
-    if (name === "minLength" && item.length < value)
-      return errors.concat({ name, expected: value, received: item.length });
-    return errors;
-  }, []);
-
-const validateArray = (arr, validations) =>
-  validations.reduce((errors, { name, value }) => {
-    if (name === "includes" && !arr.includes(value))
-      return errors.concat({ name, expected: value, received: arr });
-    return errors;
-  }, validateLength(arr, validations));
-
-const validateString = (str, validations) =>
-  validations.reduce((errors, { name, value }) => {
-    if (name === "strEquals" && str !== value)
-      return errors.concat({ name, expected: value, received: str });
-    //str.match() returns null when there is no match
-    if ((name === "isLike") & !str.match(new RegExp(value, "gi")))
-      return errors.concat({ name, expected: value, received: str });
-    if (
-      name === "isOneOf" &&
-      typeof value === "string" &&
-      !value
-        .split(",")
-        .map((v) => v.trim())
-        .includes(str)
-    )
-      return errors.concat({ name, expected: value, received: str });
-    return errors;
-  }, validateLength(str, validations));
-
-const validateNumber = (num, validations) =>
-  validations.reduce((errors, { name, value }) => {
-    if (name === "numEquals" && num !== value)
-      return errors.concat({ name, expected: value, received: num });
-    if (name === "max" && num > value)
-      return errors.concat({ name, expected: value, received: num });
-    if (name === "min" && num < value)
-      return errors.concat({ name, expected: value, received: num });
-    if (
-      name === "isOneOf" &&
-      typeof value === "string" &&
-      !value
-        .split(",")
-        .map((v) => parseInt(v))
-        .includes(num)
-    )
-      return errors.concat({ name, expected: value, received: num });
-    return errors;
-  }, []);
-
-const validateBoolean = (bool, validations) =>
-  validations.reduce((errors, { name, value }) => {
-    if (name === "boolEquals" && bool !== value)
-      return errors.concat({ name, expected: value, received: bool });
-    return errors;
-  }, []);
-
-const validateDate = (datetime, validations) =>
-  validations.reduce((errors, { name, value }) => {
-    if (name === "dateEquals" && !moment(datetime).isSame(value))
-      return errors.concat({ name, expected: value, received: datetime });
-    if (name === "maxDate" && moment(datetime).isAfter(value))
-      return errors.concat({ name, expected: value, received: datetime });
-    if (name === "minDate" && moment(datetime).isBefore(value))
-      return errors.concat({ name, expected: value, received: datetime });
-    return errors;
-  }, []);

package/src/organisms/Documentation/Documentation.js

@@ -1,128 +0,0 @@
-import React, { useState, useContext, useEffect } from "react";
-import "./styles.scss";
-import DescriptionBox from "../../atoms/DescriptionBox/DescriptionBox";
-import EditBox from "../../molecules/EditBox/EditBox";
-import Title from "../../atoms/Title/Title";
-import Markdown from "../../atoms/Markdown/Markdown";
-import ServiceContext from "../../ServiceContext";
-import { Client } from "systemlynx";
-
-export default function Documentation({
-  projectCode,
-  serviceId,
-  moduleName,
-  methodName,
-}) {
-  const { connectedServices } = useContext(ServiceContext);
-
-  const service = connectedServices.find(
-    (service) => service.serviceId === serviceId && service.projectCode === projectCode
-  );
-  const { Plugin } = service ? Client.createService(service.system.connectionData) : {};
-
-  const [doc, setDocument] = useState({
-    documentation: "",
-    namespace: { serviceId, moduleName, methodName },
-  });
-
-  const fetchDocument = async (Plugin) => {
-    setDocument({
-      documentation: "",
-      namespace: { serviceId, moduleName, methodName },
-    });
-    try {
-      if (Plugin) {
-        const results = await Plugin.getDoc({
-          serviceId,
-          moduleName,
-          methodName,
-        });
-        setDocument(results);
-      }
-    } catch (error) {
-      console.error(error);
-    }
-  };
-
-  useEffect(() => {
-    fetchDocument(Plugin);
-  }, [methodName, moduleName, serviceId, Plugin]);
-
-  useEffect(() => {
-    // if (Plugin) Plugin.on(`reconnect`, fetchDocument.bind({}, Plugin));
-  }, [Plugin]);
-  return (
-    <section className="documentation">
-      <div className="documentation-view">
-        <div className="row">
-          <DocTitle
-            serviceId={serviceId}
-            moduleName={moduleName}
-            methodName={methodName}
-          />
-        </div>
-        <div className="row documentation-view__data-table">
-          <DocDescription doc={doc} setDocument={setDocument} Plugin={Plugin} />
-        </div>
-      </div>
-    </section>
-  );
-}
-
-const DocTitle = ({ serviceId, moduleName, methodName, variable_name = "..." }) => {
-  return (
-    <Title
-      style={{ marginBottom: "5px" }}
-      text={
-        <span className="documentation-view__title">
-          {methodName && moduleName && serviceId ? (
-            <>
-              {`${serviceId}.${moduleName}.${methodName}`}
-              <span className="documentation-view__parentheses">(</span>
-              <span className="documentation-view__parameter btn">{variable_name}</span>
-              <span className="documentation-view__parentheses">)</span>
-            </>
-          ) : moduleName && serviceId ? (
-            <>{`${serviceId}.${moduleName}`}</>
-          ) : (
-            serviceId && <>{`${serviceId}`}</>
-          )}
-        </span>
-      }
-    />
-  );
-};
-
-const DocDescription = ({ doc, setDocument, Plugin }) => {
-  const { serviceId, methodName, moduleName } = doc;
-  const [text, setText] = useState(doc.documentation);
-  const saveDocument = async (setFormDisplay) => {
-    if (Plugin) {
-      try {
-        const results = await Plugin.saveDoc({ ...doc, documentation: text });
-        setDocument(results);
-        setFormDisplay(false);
-      } catch (error) {
-        console.error(error);
-      }
-    }
-  };
-
-  const updateDoc = (documentation) => setText(documentation);
-  const cancel = () => setText(doc.documentation);
-
-  useEffect(() => {
-    setText(doc.documentation);
-  }, [doc]);
-  return (
-    <EditBox
-      mainObject={
-        <Markdown children={text || "Use markdown to create your documentation here"} />
-      }
-      hiddenForm={<DescriptionBox text={text || ""} setValue={updateDoc} />}
-      formSubmit={saveDocument}
-      stateChange={[serviceId, methodName, moduleName]}
-      onCancel={cancel}
-    />
-  );
-};

package/src/organisms/Documentation/styles.scss

@@ -1,22 +0,0 @@
-.documentation-view {
-  padding-top: 2rem;
-  color: black;
-
-  &__parameter {
-    color: #3dceac;
-    font-weight: bold;
-  }
-
-  &__data-table {
-    margin-bottom: 30px;
-  }
-  &__title {
-    color: #454c69;
-    display: flex;
-    align-items: flex-start;
-    margin-left: 4px;
-  }
-  &__parentheses {
-    font-size: 26px;
-  }
-}

package/src/organisms/MultiTestSection/MultiTestSection.js

@@ -1,85 +0,0 @@
-import React, { useState } from "react";
-import ExpandableSection from "../../molecules/ExpandableSection/ExpandableSection";
-import TestCaption from "../../molecules/TestCaption/TestCaption";
-import TestContainer from "../TestContainer/TestContainer";
-import Argument from "../TestPanel/components/Argument.class";
-
-import "./styles.scss";
-import Count from "../../atoms/Count";
-
-const MultiTestSection = ({
-  caption,
-  TestController,
-  TestSection,
-  dynamic,
-  namespace,
-  arg = {},
-  staticArguments,
-}) => {
-  const className = "multi-test-section";
-  const [open, setOpen] = useState(false);
-
-  const toggleExpansion = () => {
-    setOpen((state) => !state);
-  };
-
-  const addTest = () => {
-    TestController.addTest(
-      namespace,
-      arg.name && [new Argument(arg.name, arg.FullTest, arg.input_type)]
-    );
-    TestSection.length === 1 && setOpen(true);
-  };
-  return (
-    <section className={className}>
-      <ExpandableSection
-        toggleExpansion={toggleExpansion}
-        open={open}
-        title={
-          <>
-            <TestCaption
-              caption={
-                <span>
-                  {caption}{" "}
-                  {TestSection.length > 0 && <Count count={TestSection.length} />}
-                </span>
-              }
-            />
-            <AddButton onClick={addTest} className={className} />
-          </>
-        }
-        title_color="#0d8065"
-      >
-        <div className={`${className}__test-data`}>
-          {TestSection.length > 0 ? (
-            TestSection.map((test, i) => (
-              <TestContainer
-                key={i}
-                TestController={TestController}
-                test={test}
-                testIndex={i}
-                title={`${i + 1}:`}
-                title_color={"#4b53b3"}
-                dynamic={dynamic}
-                open={true}
-                staticArguments={staticArguments}
-                multiTest
-              />
-            ))
-          ) : (
-            <span>no actions</span>
-          )}
-        </div>
-      </ExpandableSection>
-    </section>
-  );
-};
-
-const AddButton = ({ onClick, className }) => {
-  return (
-    <span className={`${className}__add-btn btn`} onClick={onClick}>
-      +
-    </span>
-  );
-};
-export default MultiTestSection;

package/src/organisms/MultiTestSection/styles.scss

@@ -1,22 +0,0 @@
-.multi-test-section {
-  width: 100%;
-  &__test-data {
-    background: #dadada;
-    padding: 12px 15px;
-    width: 100%;
-    border-radius: 5px;
-  }
-  &__add-btn {
-    padding: 0px 4px;
-    border-radius: 21px;
-    font-weight: bold;
-    color: #5960b6;
-    font-size: 16px;
-    background: #cecee3;
-    font-family: monospace;
-  }
-}
-
-.react-json-view {
-  font-size: 14px;
-}