All files / src/pages/flowsheet-page/flowsheet/PropertiesSidebar/PropertyPanel/InputFields/VariableWithUnit ReplaceInfo.tsx

91.3% Statements 21/23
87.5% Branches 14/16
71.42% Functions 5/7
91.3% Lines 21/23

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111                    6583x 6583x 6583x 74x 6509x 71x   6438x           73x 73x 73x     73x       73x 2x         73x                                                           76x 76x 76x     76x       76x 2x         76x                                                      
import {
    PropertyValueRead,
    useCoreControlvaluesDestroyMutation
} from "@/api/apiStore.gen";
import { X } from "lucide-react";
import { useSearchParams } from "react-router-dom";
import { ToolTipCover } from "../../../../../../../ahuora-design-system/ui/tooltip";
import { ReverseReplace } from "../../../../../../../assets/ReverseReplace";
 
export function ReplaceInfo({ value, displayName }: { value: PropertyValueRead, displayName: string }) {
  const isControlManipulated = value.controlManipulated;
  const isControlSetPoint = value.controlSetPoint;
  if (isControlManipulated) {
    return <ReplacedByInfo value={value} displayName={displayName} />;
  } else if (isControlSetPoint) {
    return <ReplacingInfo value={value} displayName={displayName} />;
  } else {
    return null;
  }
}
 
// When this property is replacing another property
function ReplacingInfo({ value, displayName }: { value: PropertyValueRead, displayName: string }) {
  const [searchParams, setSearchParams] = useSearchParams();
  const [deleteControl] = useCoreControlvaluesDestroyMutation();
  const objectId = +(searchParams.get("object") || 0);
 
 
  const handleControlSetPointObjectClick = () => {
    setSearchParams({ object: value.controlSetPointId });
  };
 
  const handleRemoveControl = () => {
    deleteControl({
      id: value.controlSetPoint!,
    });
  };
 
  return (
    <div className="flex flex-row text-success">
      <div className="flex flex-row gap-2 flex-grow text-success">
        <ReverseReplace size={14} fill="hsl(var(--muted-foreground))" />
        <small className="font-light">
          Replacing {value.controlSetPointName}
          {value.controlSetPointId != objectId && <small> at:</small>}
        </small>
        {value.controlSetPointId != objectId && (
          <small
            onClick={handleControlSetPointObjectClick}
            style={{ cursor: "pointer", textDecoration: "underline" }}
          >
            {value.controlSetPointObject}
          </small>
        )}
      </div>
      <ToolTipCover content="Click to remove parameter replacement.">
        <X
          color="hsl(var(--muted-foreground))"
          onClick={handleRemoveControl}
          aria-label={`setpoint-${displayName}`}
        ></X>
      </ToolTipCover>
    </div>
  );
}
 
// When this property is replaced by another property
function ReplacedByInfo({ value, displayName }: { value: PropertyValueRead, displayName: string }) {
  const [searchParams, setSearchParams] = useSearchParams();
  const [deleteControl] = useCoreControlvaluesDestroyMutation();
  const objectId = +(searchParams.get("object") || 0);
 
 
  const handleControlManipulatedObjectClick = () => {
    setSearchParams({ object: value.controlManipulatedId });
  };
 
  const handleRemoveControl = () => {
    deleteControl({
      id: value.controlManipulated!,
    });
  };
 
  return (
    <div className="flex flex-row text-success">
      <div className="flex flex-row gap-2 flex-grow text-success">
        <small className="font-light">
          {" "}
          Replaced by {value.controlManipulatedName}
          {value.controlManipulatedId != objectId && <small> at:</small>}
        </small>
        {value.controlManipulatedId != objectId && (
          <small
            onClick={handleControlManipulatedObjectClick}
            style={{ cursor: "pointer", textDecoration: "underline" }}
          >
            {value.controlManipulatedObject}
          </small>
        )}
      </div>
      <ToolTipCover content="Click to remove replacement.">
        <X
          color="hsl(var(--muted-foreground))"
          onClick={handleRemoveControl}
          aria-label={`controlled-${displayName}`}
        ></X>
      </ToolTipCover>
    </div>
  );
}