@oneuptime/common 13.0.1 → 13.0.3

package/UI/Components/Forms/ModelForm.tsx

@@ -20,11 +20,17 @@ import {
 import type { DropdownOption } from "../Dropdown/Dropdown";
 import Loader, { LoaderType } from "../Loader/Loader";
 import Pill, { PillSize } from "../Pill/Pill";
+import {
+  addRuleCriteriaToSelect,
+  applyRuleCriteriaLegacySafetyShadow,
+  replaceLegacyRuleCriteriaFields,
+} from "../RuleCriteria/RuleCriteriaModelForm";
 import { FormErrors, FormProps, FormSummaryConfig } from "./BasicForm";
 import BasicModelForm from "./BasicModelForm";
 import Field from "./Types/Field";
 import Fields from "./Types/Fields";
 import { FormStep } from "./Types/FormStep";
+import FormFieldSchemaType from "./Types/FormFieldSchemaType";
 import FormValues from "./Types/FormValues";
 import FormAnalyticsName from "./Utils/FormAnalyticsName";
 import AnalyticsBaseModel from "../../../Models/AnalyticsModels/AnalyticsBaseModel/AnalyticsBaseModel";
@@ -182,7 +188,11 @@ const ModelForm: <TBaseModel extends BaseModel>(
       }
     }
 
-    return select;
+    return addRuleCriteriaToSelect({
+      model: model,
+      fields: props.fields,
+      select: select as Record<string, unknown>,
+    }) as Select<TBaseModel>;
   };
 
   const getRelationSelect: () => Select<TBaseModel> =
@@ -355,6 +365,8 @@ const ModelForm: <TBaseModel extends BaseModel>(
       return;
     }
 
+    fieldsToSet = replaceLegacyRuleCriteriaFields(model, fieldsToSet);
+
     // if there are no fields to set, then show permission error. This is useful when there are no fields to show.
     if (fieldsToSet.length === 0 && props.fields.length > 0) {
       const field: ModelField<TBaseModel> | undefined = props.fields[0];
@@ -877,6 +889,12 @@ const ModelForm: <TBaseModel extends BaseModel>(
         (valuesToSend as any)[key] = values[key];
       }
 
+      applyRuleCriteriaLegacySafetyShadow({
+        model: model,
+        fields: props.fields,
+        values: valuesToSend,
+      });
+
       if (props.formType === FormType.Update && props.modelIdToEdit) {
         (valuesToSend as any)["_id"] = props.modelIdToEdit.toString();
       }
@@ -938,6 +956,67 @@ const ModelForm: <TBaseModel extends BaseModel>(
         }
       }
 
+      /*
+       * A JSON field is EDITED as text - CodeEditor hands the form a string -
+       * but a JSON COLUMN holds real JSON, and nothing converted the one into
+       * the other when saving an existing record.
+       *
+       * TelemetryIngestionKeys converts in onBeforeCreate, and ModelForm only
+       * runs that hook on Create (see below). So editing a browser key's
+       * allowed origins from its detail page sent the string
+       * '["https://app.example.com"]' to a column that holds a list, and
+       * TelemetryIngestionKeyService refused it - "Allowed origins must be a
+       * list of origins". Every JSON column edited through a JSON field had
+       * the same gap on update: the session replay origin, mask and block
+       * selector lists, the LLM provider and data source configs, the
+       * auto-remediation command allowlist.
+       *
+       * Both halves of the condition are load-bearing. Not every JSON editor
+       * is backed by a JSON column: GoogleSecOpsConnection.serviceAccountJson
+       * is VeryLongText, edited as JSON because that is what the customer
+       * pastes, and STORED as the text they pasted - parsing that one would
+       * hand the server an object where it expects the string it decrypts and
+       * parses itself. And not every JSON column is edited as text.
+       *
+       * Only a string is converted, and only when it parses. An untouched
+       * field still holds whatever the fetch loaded (already parsed), and
+       * text that is not JSON cannot reach here because
+       * Validation.validateJSONSyntax blocks the submit.
+       */
+      const jsonEditorFieldNames: Set<string> = new Set<string>(
+        props.fields
+          .filter((field: Field<TBaseModel>) => {
+            return field.fieldType === FormFieldSchemaType.JSON;
+          })
+          .map((field: Field<TBaseModel>) => {
+            return field.overrideFieldKey || Object.keys(field.field || {})[0];
+          })
+          .filter((name: string | undefined): name is string => {
+            return Boolean(name);
+          }),
+      );
+
+      for (const key of jsonEditorFieldNames) {
+        if (typeof valuesToSend[key] !== Typeof.String) {
+          continue;
+        }
+
+        const columnMetadata: TableColumnMetadata =
+          model.getTableColumnMetadata(key);
+
+        if (!columnMetadata || columnMetadata.type !== TableColumnType.JSON) {
+          continue;
+        }
+
+        try {
+          valuesToSend[key] = JSON.parse(
+            valuesToSend[key] as string,
+          ) as JSONObject;
+        } catch {
+          // Not JSON; leave it exactly as the user typed it.
+        }
+      }
+
       let tBaseModel: TBaseModel = BaseModel.fromJSON(
         valuesToSend,
         props.modelType,

package/UI/Components/Icon/Icon.tsx

@@ -390,46 +390,14 @@ const Icon: FunctionComponent<ComponentProps> = ({
     );
   } else if (icon === IconProp.Pencil || icon === IconProp.Edit) {
     /*
-     * Edit is a pencil, and nothing else. It used to be a pencil drawn over a
-     * document outline, which at the 16px this icon is actually rendered at
-     * almost everywhere collapsed into a grey box with a diagonal through it -
-     * legible as "some kind of file thing", not as "change this". The pencil
-     * alone is what everybody already reads as edit, and it survives being
-     * small. IconProp.PencilSquare still draws the composite for the handful of
-     * places that want it.
-     *
-     * DRAWN AT 80% OF THE UPSTREAM HEROICON, and that is the whole point of
-     * this path existing rather than the stock one.
-     *
-     * Every icon here shares a 24x24 box, but the eye does not measure the
-     * box - it measures the ink. Heroicons' pencil is one unbroken diagonal
-     * from corner to corner, so its ink ran 26.8 units end to end: the
-     * longest stroke of any icon in this file, against a median of 21 and
-     * against the 20.5 of the Trash and the 19.9 of the List it sits beside
-     * in a table row. At the 20px a Button renders it at, that is a 22px
-     * stroke inside a 20px box - it overshot the cap height of its own label
-     * and read as a size larger than every button next to it.
-     *
-     * (Those figures are the longest distance across each glyph's drawn ink,
-     * with arcs and curves sampled. Common/Tests/UI/Components/
-     * IconOpticalSize.test.tsx measures the same quantity from the path
-     * VERTICES alone, which under-reads every icon by a fraction of a unit -
-     * so its numbers are smaller than these and its comparison is relative
-     * rather than absolute.)
-     *
-     * Scaling by 0.8 about the centre of the box brings the ink to 21.4 -
-     * between Trash and Copy, at the median - while keeping the glyph
-     * itself untouched: a uniform scale preserves the arc flags, the 45
-     * degree barrel, and the tangency of the nib and eraser arcs. The
-     * numbers stay exact (radii 1.5 and 3.6, tip at 4.2 19.8), and the
-     * stroke width deliberately does NOT scale, so the pencil keeps the same
-     * weight as its neighbours instead of thinning out.
+     * A short, wide barrel keeps the pencil legible beside button labels and
+     * table actions. Keep the shared stroke weight and 24px box for both aliases.
      */
     return getSvgWrapper(
       <path
         strokeLinecap="round"
         strokeLinejoin="round"
-        d="M15.89 5.99l1.35-1.35a1.5 1.5 0 112.122 2.122L7.866 18.256a3.6 3.6 0 01-1.518.904l-2.148.64.64-2.148a3.6 3.6 0 01.904-1.518L15.89 5.99zm0 0L18 8.1"
+        d="M14.5 5.5a2.828 2.828 0 0 1 4 4L10 18l-5 1 1-5 8.5-8.5ZM13 7l4 4"
       />,
     );
   } else if (icon === IconProp.Equals) {

package/UI/Components/ModelTable/ModelTable.tsx

@@ -35,6 +35,10 @@ import Query from "../../../Types/BaseDatabase/Query";
 import GroupBy from "../../../Types/BaseDatabase/GroupBy";
 import Sort from "../../../Types/BaseDatabase/Sort";
 import Select from "../../../Types/BaseDatabase/Select";
+import {
+  getRuleCriteriaTableConfiguration,
+  RuleCriteriaTableConfiguration,
+} from "../RuleCriteria/RuleCriteriaModelTable";
 
 export interface ComponentProps<TBaseModel extends BaseModel>
   extends BaseTableProps<TBaseModel> {
@@ -123,6 +127,15 @@ const ModelTable: <TBaseModel extends BaseModel>(
   let bulkActions: BulkActionProps<TBaseModel> | undefined = props.bulkActions;
   let cardProps: CardComponentProps | undefined = props.cardProps;
   let refreshToggle: string | undefined = props.refreshToggle;
+  const ruleCriteriaTable: RuleCriteriaTableConfiguration<TBaseModel> =
+    getRuleCriteriaTableConfiguration({
+      model: model,
+      formFields: props.formFields,
+      columns: props.columns,
+      filters: props.filters,
+      selectMoreFields: props.selectMoreFields,
+      helpContent: props.helpContent,
+    });
 
   if (props.enableJsonImportExport) {
     bulkActions = {
@@ -182,6 +195,12 @@ const ModelTable: <TBaseModel extends BaseModel>(
       )}
       <BaseModelTable
         {...props}
+        columns={ruleCriteriaTable.columns}
+        filters={ruleCriteriaTable.filters}
+        {...(ruleCriteriaTable.selectMoreFields
+          ? { selectMoreFields: ruleCriteriaTable.selectMoreFields }
+          : {})}
+        helpContent={ruleCriteriaTable.helpContent}
         bulkActions={bulkActions}
         cardProps={cardProps}
         refreshToggle={refreshToggle}

package/UI/Components/Navbar/NavBar.tsx

@@ -292,6 +292,7 @@ const Navbar: FunctionComponent<ComponentProps> = (
           title: item.title,
           icon: item.icon,
           route: item.route,
+          activeRoute: item.activeRoute,
           description: item.description,
         };
       }),