@oneuptime/common 14.0.12 → 14.0.13

package/UI/Components/RuleCriteria/RuleCriteriaModelForm.tsx

@@ -5,16 +5,23 @@ import TableColumnType from "../../../Types/Database/TableColumnType";
 import RuleCriteria, {
   RULE_CRITERIA_LEGACY_NEVER_MATCH_PATTERN,
 } from "../../../Types/Rules/RuleCriteria";
-import { getRuleCriteriaValidationError } from "../../../Utils/Rules/RuleCriteriaMatcher";
+import { isRuleCriteriaConditionRequired } from "../../../Types/Rules/RuleCriteriaFieldRegistry";
 import SelectFormFields from "../../Types/SelectEntityField";
 import React, { ReactElement } from "react";
 import Field, { CustomElementProps } from "../Forms/Types/Field";
 import Fields from "../Forms/Types/Fields";
 import FormFieldSchemaType from "../Forms/Types/FormFieldSchemaType";
 import FormValues from "../Forms/Types/FormValues";
-import RuleCriteriaBuilder, {
+import { translateValidationMessage } from "../Forms/Validation";
+import RuleCriteriaBuilder from "./RuleCriteriaBuilder";
+import {
+  formatRuleCriteriaMessage,
+  getAvailableRuleCriteriaFields,
   getRuleCriteriaFieldName,
-} from "./RuleCriteriaBuilder";
+  getRuleCriteriaFormProblem,
+  RuleCriteriaCopy,
+  RuleCriteriaMessage,
+} from "./RuleCriteriaFields";
 
 export const MATCH_CRITERIA_STEP_ID: string = "match-criteria";
 export const RULE_CRITERIA_FIELD_NAME: string = "criteria";
@@ -152,16 +159,35 @@ export function replaceLegacyRuleCriteriaFields<TEntity extends BaseModel>(
     },
   );
 
+  /*
+   * A rule kind that matches nothing without a condition (and whose API
+   * refuses one with none) says so: the field is not "(Optional)", the empty
+   * builder asks for a condition, and the form asks before it sends. Until
+   * the builder has filled in a value - a create form that never reached this
+   * step - "required" is what stops the form; a rule saved before conditions
+   * existed has none (null) and keeps working from its old columns.
+   */
+  const requiresCondition: boolean = isRuleCriteriaConditionRequired(
+    model.tableName,
+  );
+
   const criteriaField: Field<TEntity> = {
     field: {
       [RULE_CRITERIA_FIELD_NAME]: true,
     } as SelectFormFields<TEntity>,
     title: "Conditions",
-    description:
-      "Add one or more conditions and choose whether every condition or any condition must match.",
+    /*
+     * Said here so the form does not fall back to the criteria column's own
+     * description, which is written for the API.
+     */
+    description: RuleCriteriaCopy.fieldDescription,
     stepId: MATCH_CRITERIA_STEP_ID,
     fieldType: FormFieldSchemaType.CustomComponent,
-    required: false,
+    required: requiresCondition
+      ? (values: FormValues<TEntity>): boolean => {
+          return (values as { criteria?: unknown }).criteria !== null;
+        }
+      : false,
     spanFullRow: true,
     dataTestId: "rule-criteria-field",
     customValidation: (values: FormValues<TEntity>): string | null => {
@@ -171,7 +197,18 @@ export function replaceLegacyRuleCriteriaFields<TEntity extends BaseModel>(
         return null;
       }
 
-      return getRuleCriteriaValidationError(criteria);
+      const problem: RuleCriteriaMessage | null = getRuleCriteriaFormProblem({
+        criteria: criteria,
+        fields: getAvailableRuleCriteriaFields(
+          legacyFields,
+          values as unknown as Record<string, unknown>,
+        ),
+        requiresCondition: requiresCondition,
+      });
+
+      return problem
+        ? formatRuleCriteriaMessage(problem, translateValidationMessage)
+        : null;
     },
     getCustomElement: (
       values: FormValues<TEntity>,
@@ -183,6 +220,7 @@ export function replaceLegacyRuleCriteriaFields<TEntity extends BaseModel>(
           legacyValues={values as unknown as Record<string, unknown>}
           value={(values as { criteria?: RuleCriteria }).criteria}
           error={customElementProps.error}
+          requiresCondition={requiresCondition}
           onChange={(criteria: RuleCriteria): void => {
             customElementProps.onChange?.(criteria);
           }}

package/UI/Components/RuleCriteria/RuleCriteriaModelTable.tsx

@@ -1,13 +1,20 @@
 import BaseModel from "../../../Models/DatabaseModels/DatabaseBaseModel/DatabaseBaseModel";
 import RuleBaseModel from "../../../Models/DatabaseModels/DatabaseBaseModel/RuleBaseModel";
 import Select from "../../../Types/BaseDatabase/Select";
+import { RuleCriteriaOperator } from "../../../Types/Rules/RuleCriteria";
+import { isRuleCriteriaConditionRequired } from "../../../Types/Rules/RuleCriteriaFieldRegistry";
 import React from "react";
 import type { ModelField } from "../Forms/ModelForm";
+import type Field from "../Forms/Types/Field";
 import type Filter from "../ModelFilter/Filter";
 import type Column from "../ModelTable/Column";
 import type Columns from "../ModelTable/Columns";
 import FieldType from "../Types/FieldType";
-import { getRuleCriteriaFieldName } from "./RuleCriteriaBuilder";
+import {
+  getRuleCriteriaFieldName,
+  getRuleCriteriaOperatorsForField,
+  isRuleCriteriaAddressRangeField,
+} from "./RuleCriteriaFields";
 import {
   getLegacyRuleCriteriaFields,
   RULE_CRITERIA_FIELD_NAME,
@@ -29,17 +36,90 @@ export interface RuleCriteriaTableHelpContent {
   markdown: string;
 }
 
-export const RULE_CRITERIA_HELP_SECTION_BODY: string = `Add one or more conditions, then choose how they are combined:
+/*
+ * The help panel's "Match Criteria" section, written for the conditions the
+ * page's fields actually offer. Each line names the operators exactly as the
+ * builder labels them.
+ */
+const HELP_COMBINE_LINES: string = `Add one or more conditions, then choose how they are combined:
+
+- **Match all (AND)** — every condition must be true.
+- **Match any (OR)** — at least one condition must be true.`;
+
+const HELP_OPERATOR_INTRO: string =
+  "Each condition compares one field. Only the operators that fit the field are offered:";
+
+const HELP_EQUALITY_LINE: string = "- **Equality** — Equals or Does not equal.";
+const HELP_TEXT_LINE: string =
+  "- **Text** — Contains, Does not contain, Starts with or Ends with.";
+const HELP_PATTERN_LINE: string =
+  "- **Patterns** — Matches pattern or Does not match pattern. A pattern is a case-insensitive regular expression (`^api-.*`) or a `*` wildcard (`*api*`).";
+const HELP_ADDRESS_RANGE_LINE: string =
+  "- **Address ranges** — Is in or Is not in a CIDR (`10.0.0.0/24`) or an octet range (`10.16-22.0-255.1-254`).";
+const HELP_LIST_LINE: string =
+  "- **Lists** — Has any of, Has all of or Has none of the selected values.";
+
+const HELP_EMPTY_MATCHES_EVERYTHING: string =
+  "A rule with no conditions applies to everything.";
+const HELP_EMPTY_NEEDS_CONDITION: string =
+  "This kind of rule needs at least one condition: with none, it would match nothing.";
+
+export function getRuleCriteriaHelpSectionBody<TEntity>(data: {
+  // The page's match fields; without them every kind of operator is listed.
+  fields?: Array<Field<TEntity>> | undefined;
+  requiresCondition?: boolean | undefined;
+}): string {
+  const fields: Array<Field<TEntity>> = data.fields || [];
+  const listsEverything: boolean = fields.length === 0;
+  const offered: Set<RuleCriteriaOperator> = new Set<RuleCriteriaOperator>();
+  let offersPatterns: boolean = listsEverything;
+  let offersAddressRanges: boolean = listsEverything;
+
+  for (const field of fields) {
+    for (const operator of getRuleCriteriaOperatorsForField(field)) {
+      offered.add(operator);
+
+      if (
+        operator === RuleCriteriaOperator.MatchesPattern ||
+        operator === RuleCriteriaOperator.DoesNotMatchPattern
+      ) {
+        if (isRuleCriteriaAddressRangeField(field)) {
+          offersAddressRanges = true;
+        } else {
+          offersPatterns = true;
+        }
+      }
+    }
+  }
 
-- **Match all (AND)** — every condition must match.
-- **Match any (OR)** — at least one condition must match.
+  const offers: (operator: RuleCriteriaOperator) => boolean = (
+    operator: RuleCriteriaOperator,
+  ): boolean => {
+    return listsEverything || offered.has(operator);
+  };
 
-Choose an operator for each condition. Only operators supported by the selected field are shown; these can include:
+  const operatorLines: Array<string> = [
+    offers(RuleCriteriaOperator.Equals) ? HELP_EQUALITY_LINE : "",
+    offers(RuleCriteriaOperator.Contains) ? HELP_TEXT_LINE : "",
+    offersPatterns ? HELP_PATTERN_LINE : "",
+    offersAddressRanges ? HELP_ADDRESS_RANGE_LINE : "",
+    offers(RuleCriteriaOperator.HasAnyOf) ? HELP_LIST_LINE : "",
+  ].filter((line: string): boolean => {
+    return line.length > 0;
+  });
+
+  return [
+    HELP_COMBINE_LINES,
+    [HELP_OPERATOR_INTRO, "", ...operatorLines].join("\n"),
+    data.requiresCondition
+      ? HELP_EMPTY_NEEDS_CONDITION
+      : HELP_EMPTY_MATCHES_EVERYTHING,
+  ].join("\n\n");
+}
 
-- **Equality** — Equals or Does not equal.
-- **Text matching** — Contains, Does not contain, Starts with, or Ends with.
-- **Pattern matching** — Matches pattern or Does not match pattern. Patterns accept a regular expression or a \`*\` wildcard pattern.
-- **Multi-select matching** — Has any of, Has all of, or Has none of the selected values.`;
+// The section as it reads for a page that offers every kind of operator.
+export const RULE_CRITERIA_HELP_SECTION_BODY: string =
+  getRuleCriteriaHelpSectionBody({});
 
 const RULE_CRITERIA_HELP_HEADING: RegExp =
   /^(#{1,6})[\t ]+Match Criteria(?:[\t ]+\(Filtering\))?[\t ]*$/;
@@ -50,7 +130,10 @@ const MARKDOWN_HEADING: RegExp = /^(#{1,6})[\t ]+/;
  * Other sections are intentionally retained because they describe the action
  * performed by that particular rule type.
  */
-export function replaceRuleCriteriaHelpMarkdown(markdown: string): string {
+export function replaceRuleCriteriaHelpMarkdown(
+  markdown: string,
+  sectionBody: string = RULE_CRITERIA_HELP_SECTION_BODY,
+): string {
   const lines: Array<string> = markdown.split("\n");
   const result: Array<string> = [];
   let sectionWasReplaced: boolean = false;
@@ -69,7 +152,7 @@ export function replaceRuleCriteriaHelpMarkdown(markdown: string): string {
     sectionWasReplaced = true;
     const headingLevel: number = targetHeadingMatch[1]!.length;
 
-    result.push(line, "", RULE_CRITERIA_HELP_SECTION_BODY, "");
+    result.push(line, "", sectionBody, "");
 
     while (index + 1 < lines.length) {
       const nextLine: string = lines[index + 1]!;
@@ -89,6 +172,7 @@ export function replaceRuleCriteriaHelpMarkdown(markdown: string): string {
 
 function replaceRuleCriteriaHelpContent(
   helpContent: RuleCriteriaTableHelpContent | undefined,
+  sectionBody: string,
 ): RuleCriteriaTableHelpContent | undefined {
   if (!helpContent) {
     return undefined;
@@ -96,6 +180,7 @@ function replaceRuleCriteriaHelpContent(
 
   const markdown: string = replaceRuleCriteriaHelpMarkdown(
     helpContent.markdown,
+    sectionBody,
   );
 
   if (markdown === helpContent.markdown) {
@@ -198,7 +283,15 @@ export function getRuleCriteriaTableConfiguration<
       return !fieldName || !legacyFieldNames.has(fieldName);
     }),
     selectMoreFields: selectMoreFields as Select<TEntity>,
-    helpContent: replaceRuleCriteriaHelpContent(data.helpContent),
+    helpContent: replaceRuleCriteriaHelpContent(
+      data.helpContent,
+      getRuleCriteriaHelpSectionBody({
+        fields: legacyFields,
+        requiresCondition: isRuleCriteriaConditionRequired(
+          data.model.tableName,
+        ),
+      }),
+    ),
   };
 }
 

package/UI/Components/RuleCriteria/RuleCriteriaSummary.tsx

@@ -3,41 +3,28 @@ import FilterCondition from "../../../Types/Filter/FilterCondition";
 import RuleCriteria, {
   RuleCriteriaFilter,
 } from "../../../Types/Rules/RuleCriteria";
+import { isRuleCriteriaConditionRequired } from "../../../Types/Rules/RuleCriteriaFieldRegistry";
 import { isValidRuleCriteria } from "../../../Utils/Rules/RuleCriteriaMatcher";
 import React, { ReactElement } from "react";
 import Field from "../Forms/Types/Field";
 import {
   convertLegacyValuesToRuleCriteria,
-  getRuleCriteriaFieldName,
-  RULE_CRITERIA_OPERATOR_LABELS,
-} from "./RuleCriteriaBuilder";
+  findRuleCriteriaField,
+  getRuleCriteriaFieldTitle,
+  getRuleCriteriaOperatorLabel,
+} from "./RuleCriteriaFields";
 
 export interface RuleCriteriaSummaryData<TEntity> {
   fields: Array<Field<TEntity>>;
   item: TEntity;
 }
 
-function titleFromFieldName(fieldName: string): string {
-  return fieldName
-    .replace(/([a-z0-9])([A-Z])/g, "$1 $2")
-    .replace(/[_-]+/g, " ")
-    .replace(/^./, (character: string): string => {
-      return character.toUpperCase();
-    });
-}
-
-function getFieldTitle<TEntity>(
-  fields: Array<Field<TEntity>>,
-  fieldName: string,
-): string {
-  const field: Field<TEntity> | undefined = fields.find(
-    (candidate: Field<TEntity>): boolean => {
-      return getRuleCriteriaFieldName(candidate) === fieldName;
-    },
-  );
-
-  return field?.title || titleFromFieldName(fieldName);
-}
+// What a rule with no conditions does, which depends on the kind of rule.
+export const RULE_CRITERIA_SUMMARY_MATCHES_EVERYTHING: string =
+  "Matches everything (no conditions)";
+export const RULE_CRITERIA_SUMMARY_MATCHES_NOTHING: string =
+  "Matches nothing (no conditions)";
+export const RULE_CRITERIA_SUMMARY_INVALID: string = "Invalid match criteria";
 
 function formatValue(filter: RuleCriteriaFilter): string {
   if (Array.isArray(filter.value)) {
@@ -72,6 +59,17 @@ function getCriteria<TEntity>(
   });
 }
 
+function getEmptySummary<TEntity>(item: TEntity): string {
+  const tableName: unknown = (item as unknown as { tableName?: unknown })
+    .tableName;
+
+  return isRuleCriteriaConditionRequired(
+    typeof tableName === "string" ? tableName : null,
+  )
+    ? RULE_CRITERIA_SUMMARY_MATCHES_NOTHING
+    : RULE_CRITERIA_SUMMARY_MATCHES_EVERYTHING;
+}
+
 export function getRuleCriteriaSummaryText<TEntity>(
   data: RuleCriteriaSummaryData<TEntity>,
 ): string {
@@ -84,21 +82,27 @@ export function getRuleCriteriaSummaryText<TEntity>(
 
   if (!criteria) {
     return configuredCriteria !== undefined && configuredCriteria !== null
-      ? "Invalid match criteria"
-      : "Matches all resources";
+      ? RULE_CRITERIA_SUMMARY_INVALID
+      : getEmptySummary(data.item);
   }
 
   if (criteria.filters.length === 0) {
-    return "Matches all resources";
+    return getEmptySummary(data.item);
   }
 
   const connector: string =
     criteria.filterCondition === FilterCondition.All ? "all" : "any";
   const filters: Array<string> = criteria.filters.map(
     (filter: RuleCriteriaFilter): string => {
-      return `${getFieldTitle(data.fields, filter.field)} ${RULE_CRITERIA_OPERATOR_LABELS[
-        filter.operator
-      ].toLocaleLowerCase()} ${formatValue(filter)}`;
+      const field: Field<TEntity> | undefined = findRuleCriteriaField(
+        data.fields,
+        filter.field,
+      );
+
+      return `${getRuleCriteriaFieldTitle(field, filter.field)} ${getRuleCriteriaOperatorLabel(
+        field,
+        filter.operator,
+      ).toLocaleLowerCase()} ${formatValue(filter)}`;
     },
   );
 

package/UI/Components/RuleRun/RuleDetailFields.tsx

@@ -8,7 +8,13 @@ import FormFieldSchemaType from "../Forms/Types/FormFieldSchemaType";
 import FormValues from "../Forms/Types/FormValues";
 import LabelsElement from "../Label/Labels";
 import Field from "../ModelDetail/Field";
-import { getRuleCriteriaFieldName } from "../RuleCriteria/RuleCriteriaBuilder";
+import { PeopleList } from "../PeoplePicker/PeopleList";
+import {
+  getPeoplePickerKindDefinition,
+  getPeoplePickerOptionsFromModels,
+} from "../PeoplePicker/PeoplePickerKinds";
+import { PeoplePickerFieldKind } from "../PeoplePicker/PeoplePickerTypes";
+import { getRuleCriteriaFieldName } from "../RuleCriteria/RuleCriteriaFields";
 import {
   getLegacyRuleCriteriaFields,
   RULE_CRITERIA_FIELD_NAME,
@@ -16,6 +22,7 @@ import {
 import RuleCriteriaSummary from "../RuleCriteria/RuleCriteriaSummary";
 import FieldType from "../Types/FieldType";
 import React, { ReactElement } from "react";
+import { translateText } from "../../Utils/TranslateTemplate";
 
 /*
  * The fields a rule's view page shows, derived from the form that edits it.
@@ -37,7 +44,7 @@ export interface RuleDetailFields<TBaseModel extends BaseModel> {
 }
 
 function noneElement(): ReactElement {
-  return <span className="text-sm text-gray-500">None</span>;
+  return <span className="text-sm text-gray-500">{translateText("None")}</span>;
 }
 
 function flattenOptions(
@@ -161,6 +168,67 @@ function getRelationField<TBaseModel extends BaseModel>(data: {
   };
 }
 
+/*
+ * A people picker (a rule's Owners: people and teams) is one field in the
+ * form, so it is one field here too: every pick, of every kind, as one list
+ * of avatars and names - not a list per kind. Each kind's column is selected
+ * with what its chip shows.
+ */
+function getPeoplePickerDetailField<TBaseModel extends BaseModel>(data: {
+  model: TBaseModel;
+  formField: ModelField<TBaseModel>;
+}): { field: Field<TBaseModel>; select: Record<string, unknown> } | null {
+  const kinds: Array<PeoplePickerFieldKind> = (
+    data.formField.peoplePicker?.kinds || []
+  ).filter((entry: PeoplePickerFieldKind): boolean => {
+    return data.model.hasColumn(entry.valueKey);
+  });
+
+  if (kinds.length === 0) {
+    return null;
+  }
+
+  const select: Record<string, unknown> = {};
+
+  for (const entry of kinds) {
+    select[entry.valueKey] = {
+      ...getPeoplePickerKindDefinition(entry.kind).relationSelect,
+    };
+  }
+
+  return {
+    select: select,
+    field: {
+      field: select as Select<TBaseModel>,
+      title: data.formField.title || "",
+      fieldType: FieldType.Element,
+      ...(data.formField.showIf
+        ? {
+            showIf: (item: TBaseModel): boolean => {
+              return data.formField.showIf!(
+                item as unknown as FormValues<TBaseModel>,
+              );
+            },
+          }
+        : {}),
+      getElement: (item: TBaseModel): ReactElement => {
+        return (
+          <PeopleList
+            options={getPeoplePickerOptionsFromModels(
+              kinds.map((entry: PeoplePickerFieldKind) => {
+                return {
+                  kind: entry.kind,
+                  models: readValue(item, entry.valueKey),
+                };
+              }),
+            )}
+          />
+        );
+      },
+    },
+  };
+}
+
 function getDetailField<TBaseModel extends BaseModel>(data: {
   model: TBaseModel;
   fieldName: string;
@@ -293,6 +361,26 @@ export function getRuleDetailFields<TBaseModel extends BaseModel>(data: {
   let criteriaSummaryAdded: boolean = false;
 
   for (const formField of data.formFields) {
+    if (
+      formField.fieldType === FormFieldSchemaType.PeoplePicker &&
+      formField.peoplePicker
+    ) {
+      const people: {
+        field: Field<TBaseModel>;
+        select: Record<string, unknown>;
+      } | null = getPeoplePickerDetailField({
+        model: data.model,
+        formField: formField,
+      });
+
+      if (people) {
+        Object.assign(select, people.select);
+        fields.push(people.field);
+      }
+
+      continue;
+    }
+
     const fieldName: string | undefined = Object.keys(formField.field || {})[0];
 
     if (!fieldName) {

package/UI/Components/RuleRun/RuleEnabledField.ts

@@ -0,0 +1,51 @@
+import Field from "../Forms/Types/Field";
+import FormFieldSchemaType from "../Forms/Types/FormFieldSchemaType";
+
+/*
+ * Nobody creates a rule in order to have it switched off.
+ *
+ * A rule starts on: its isEnabled column defaults to true, which is what the
+ * API stores when the field is left out. Asking "Enabled?" on the create form
+ * was one more decision nobody needed to make, and the form even answered it
+ * wrongly - every rule created from the dashboard was saved switched off
+ * (Forms/Utils/CreateFormDefaults says why). So a rule's create form leaves
+ * the switch out, and the rule starts on. The switch stays where it is
+ * useful: on the rule's edit form, and as its table's Status column.
+ *
+ * RuleTable - and LabelRuleTable, which is built on it - does this for every
+ * rule page it draws. A rule page built on ModelTable directly marks its
+ * Enabled field doNotShowWhenCreating itself. CreateFormDefaultsGuard holds
+ * both to it.
+ */
+export const RULE_ENABLED_COLUMN: string = "isEnabled";
+
+const SWITCH_FIELD_TYPES: ReadonlySet<FormFieldSchemaType | undefined> =
+  new Set<FormFieldSchemaType | undefined>([
+    FormFieldSchemaType.Toggle,
+    FormFieldSchemaType.Checkbox,
+  ]);
+
+// The switch a rule is turned on and off with.
+export function isRuleEnabledField<TEntity>(field: Field<TEntity>): boolean {
+  return (
+    !field.overrideFieldKey &&
+    Object.keys(field.field || {})[0] === RULE_ENABLED_COLUMN &&
+    SWITCH_FIELD_TYPES.has(field.fieldType)
+  );
+}
+
+/**
+ * A rule's form fields with its Enabled switch on the edit form only. Every
+ * other field is handed back as it was (the same object).
+ */
+export function withRuleEnabledOnEditOnly<TEntity>(
+  fields: Array<Field<TEntity>>,
+): Array<Field<TEntity>> {
+  return fields.map((field: Field<TEntity>): Field<TEntity> => {
+    if (!isRuleEnabledField(field) || field.doNotShowWhenCreating) {
+      return field;
+    }
+
+    return { ...field, doNotShowWhenCreating: true };
+  });
+}

package/UI/Components/RuleRun/RuleTable.tsx

@@ -16,6 +16,7 @@ import { BulkActionProps } from "../ModelTable/BaseModelTable";
 import ModelTable, {
   ComponentProps as ModelTableComponentProps,
 } from "../ModelTable/ModelTable";
+import { withRuleEnabledOnEditOnly } from "./RuleEnabledField";
 import RuleView from "./RuleView";
 import RunRuleNowModal from "./RunRuleNowModal";
 import getRunRulesBulkAction from "./RunRulesBulkAction";
@@ -51,6 +52,9 @@ function getParentRoute(): Route {
  * A table of rules. For rules that can be run - label, owner, privacy, and
  * status page and SLO monitor rules - it adds "Run Now" to each row and to
  * the bulk actions, and makes each rule viewable on its own page.
+ *
+ * Every rule starts on: the create form leaves out the rule's Enabled
+ * switch, which stays on the edit form and in the table (RuleEnabledField).
  */
 const RuleTable: <TBaseModel extends BaseModel>(
   props: ComponentProps<TBaseModel>,
@@ -144,6 +148,14 @@ const RuleTable: <TBaseModel extends BaseModel>(
     };
   }
 
+  // Every rule starts on: its create form leaves the Enabled switch out.
+  const ruleTableProps: ModelTableComponentProps<TBaseModel> = {
+    ...tableProps,
+    formFields: tableProps.formFields
+      ? withRuleEnabledOnEditOnly<TBaseModel>(tableProps.formFields)
+      : tableProps.formFields,
+  };
+
   const isViewable: boolean =
     props.isViewable ??
     Boolean(ruleType && (getRuleViewRoute || props.viewPageRoute));
@@ -151,7 +163,7 @@ const RuleTable: <TBaseModel extends BaseModel>(
   return (
     <Fragment>
       <ModelTable<TBaseModel>
-        {...tableProps}
+        {...ruleTableProps}
         actionButtons={actionButtons}
         bulkActions={bulkActions}
         isViewable={isViewable}

package/UI/Components/RuleRun/RuleView.tsx

@@ -22,6 +22,13 @@ import FieldType from "../Types/FieldType";
 import { getRuleDetailFields, RuleDetailFields } from "./RuleDetailFields";
 import RunRuleNowModal from "./RunRuleNowModal";
 import React, { Fragment, ReactElement, useMemo, useState } from "react";
+import {
+  translatableTerm,
+  translateNamedAction,
+  Translator,
+  translationKey,
+} from "../../Utils/TranslateTemplate";
+import useTranslator from "../../Utils/UseTranslator";
 
 export interface ComponentProps<TBaseModel extends BaseModel> {
   modelType: { new (): TBaseModel };
@@ -64,7 +71,8 @@ const RuleView: <TBaseModel extends BaseModel>(
     ModelAction.Update,
   );
 
-  const singularName: string = model.singularName || "Rule";
+  const translator: Translator = useTranslator();
+  const singularName: string = model.singularName || translationKey("Rule");
   const ruleValues: Record<string, unknown> = (rule || {}) as unknown as Record<
     string,
     unknown
@@ -76,7 +84,9 @@ const RuleView: <TBaseModel extends BaseModel>(
   const runNowTooltip: string | undefined =
     updateGate.disabledReason ||
     (rule && !isEnabled
-      ? "This rule is disabled. Enable it before running it."
+      ? translator.translateText(
+          "This rule is disabled. Enable it before running it.",
+        )
       : undefined);
 
   return (
@@ -84,8 +94,16 @@ const RuleView: <TBaseModel extends BaseModel>(
       <CardModelDetail<TBaseModel>
         name={`${singularName} Details`}
         cardProps={{
-          title: ruleName || `${singularName} Details`,
-          description: `Here are the details of this ${singularName.toLowerCase()}.`,
+          title:
+            ruleName ||
+            translateNamedAction(translator, {
+              template: "{{itemName}} Details",
+              itemName: singularName,
+            }),
+          description: translator.translateTemplate(
+            "Here are the details of this {{itemName}}.",
+            { itemName: translatableTerm(singularName, { inSentence: true }) },
+          ),
         }}
         isEditable={true}
         formSteps={props.formSteps}

package/UI/Components/RuleRun/RunRuleNowModal.tsx

@@ -17,6 +17,8 @@ import React, {
   useCallback,
   useState,
 } from "react";
+import { translatableTerm, Translator } from "../../Utils/TranslateTemplate";
+import useTranslator from "../../Utils/UseTranslator";
 
 export interface ComponentProps {
   ruleType: RuleRunType;
@@ -37,6 +39,7 @@ export interface ComponentProps {
 const RunRuleNowModal: FunctionComponent<ComponentProps> = (
   props: ComponentProps,
 ): ReactElement => {
+  const translator: Translator = useTranslator();
   const [isRunning, setIsRunning] = useState<boolean>(false);
   const [error, setError] = useState<string>("");
   const [summary, setSummary] = useState<string>("");
@@ -125,7 +128,14 @@ const RunRuleNowModal: FunctionComponent<ComponentProps> = (
         {isOwnerRule ? (
           <CheckboxElement
             title="Notify the owners this run adds"
-            description={`Off by default, and only honoured when the rule itself has Notify Owners turned on. An owner is notified once for every ${meta.resourceSingular} they are added to, which on a large project can be a lot of notifications.`}
+            description={translator.translateTemplate(
+              "Off by default, and only honoured when the rule itself has Notify Owners turned on. An owner is notified once for every {{resource}} they are added to, which on a large project can be a lot of notifications.",
+              {
+                resource: translatableTerm(meta.resourceSingular, {
+                  inSentence: true,
+                }),
+              },
+            )}
             value={notifyOwners}
             dataTestId="run-rule-notify-owners-checkbox"
             onChange={(value: boolean) => {