- nuke visible from the face of the earth with fire.

Signed-off-by: Dave Richer <dave@imexsystems.ca>
2024-01-12 17:25:25 -05:00
parent 7d6e61043e
commit ba32a71786
58 changed files with 227 additions and 229 deletions
--- a/client/licenses.txt
+++ b/client/licenses.txt
@@ -8872,13 +8872,13 @@
 │  ├─ email: luis@luisrudge.net
 │  ├─ path: /Users/pfic/Documents/Development/bodyshop/client/node_modules/postcss-flexbugs-fixes
 │  └─ licenseFile: /Users/pfic/Documents/Development/bodyshop/client/node_modules/postcss-flexbugs-fixes/LICENSE
-├─ postcss-focus-visible@4.0.0
+├─ postcss-focus-open@4.0.0
 │  ├─ licenses: CC0-1.0
-│  ├─ repository: https://github.com/jonathantneal/postcss-focus-visible
+│  ├─ repository: https://github.com/jonathantneal/postcss-focus-open
 │  ├─ publisher: Jonathan Neal
 │  ├─ email: jonathantneal@hotmail.com
-│  ├─ path: /Users/pfic/Documents/Development/bodyshop/client/node_modules/postcss-focus-visible
-│  └─ licenseFile: /Users/pfic/Documents/Development/bodyshop/client/node_modules/postcss-focus-visible/LICENSE.md
+│  ├─ path: /Users/pfic/Documents/Development/bodyshop/client/node_modules/postcss-focus-open
+│  └─ licenseFile: /Users/pfic/Documents/Development/bodyshop/client/node_modules/postcss-focus-open/LICENSE.md
 ├─ postcss-focus-within@3.0.0
 │  ├─ licenses: CC0-1.0
 │  ├─ repository: https://github.com/jonathantneal/postcss-focus-within
--- a/client/public/3rdparty-api.txt
+++ b/client/public/3rdparty-api.txt
@@ -190,7 +190,7 @@ This package contains the following license and notice below:
 # @firebase/logger

 This package serves as the base of all logging in the JS SDK. Any logging that
-is intended to be visible to Firebase end developers should go through this
+is intended to be open to Firebase end developers should go through this
 module.

 ## Basic Usage
@@ -9375,7 +9375,7 @@ parties to make or receive copies.  Mere interaction with a user through
 a computer network, with no transfer of a copy, is not conveying.

  An interactive user interface displays "Appropriate Legal Notices"
-to the extent that it includes a convenient and prominently visible
+to the extent that it includes a convenient and prominently open
 feature that (1) displays an appropriate copyright notice, and (2)
 tells the user that there is no warranty for the work (except to the
 extent that warranties are provided), that licensees may convey the
--- a/client/public/3rdparty-app.txt
+++ b/client/public/3rdparty-app.txt
@@ -1029,7 +1029,7 @@ The following NPM packages may be included in this product:
 - postcss-dir-pseudo-class@5.0.0
 - postcss-double-position-gradients@1.0.0
 - postcss-env-function@2.0.2
- - postcss-focus-visible@4.0.0
+ - postcss-focus-open@4.0.0
 - postcss-focus-within@3.0.0
 - postcss-gap-properties@2.0.0
 - postcss-image-set-function@3.0.1
@@ -1699,7 +1699,7 @@ This package contains the following license and notice below:
 # @firebase/logger

 This package serves as the base of all logging in the JS SDK. Any logging that
-is intended to be visible to Firebase end developers should go through this
+is intended to be open to Firebase end developers should go through this
 module.

 ## Basic Usage
@@ -24029,7 +24029,7 @@ parties to make or receive copies.  Mere interaction with a user through
 a computer network, with no transfer of a copy, is not conveying.

  An interactive user interface displays "Appropriate Legal Notices"
-to the extent that it includes a convenient and prominently visible
+to the extent that it includes a convenient and prominently open
 feature that (1) displays an appropriate copyright notice, and (2)
 tells the user that there is no warranty for the work (except to the
 extent that warranties are provided), that licensees may convey the
--- a/client/src/components/bill-detail-edit/bill-detail-edit-component.jsx
+++ b/client/src/components/bill-detail-edit/bill-detail-edit-component.jsx
@@ -48,7 +48,7 @@ export function BillDetailEditcontainer({setPartsOrderContext, insertAuditTrail,

    const {t} = useTranslation();
    const [form] = Form.useForm();
-    const [visible, setVisible] = useState(false);
+    const [open, setOpen] = useState(false);
    const [updateLoading, setUpdateLoading] = useState(false);
    const [update_bill] = useMutation(UPDATE_BILL);
    const [insertBillLine] = useMutation(INSERT_NEW_BILL_LINES);
@@ -71,7 +71,7 @@ export function BillDetailEditcontainer({setPartsOrderContext, insertAuditTrail,
            form.getFieldValue("billlines").filter((b) => b.deductedfromlbr).length >
            0
        )
-            setVisible(true);
+            setOpen(true);
        else {
            form.submit();
        }
@@ -154,7 +154,7 @@ export function BillDetailEditcontainer({setPartsOrderContext, insertAuditTrail,
        await refetch();
        form.setFieldsValue(transformData(data));
        form.resetFields();
-        setVisible(false);
+        setOpen(false);
        setUpdateLoading(false);
    };

@@ -178,9 +178,9 @@ export function BillDetailEditcontainer({setPartsOrderContext, insertAuditTrail,
                <BillDetailEditReturn data={data} />
                <BillPrintButton billid={search.billid} />
                <Popconfirm
-                  open={visible}
+                  open={open}
                  onConfirm={() => form.submit()}
-                  onCancel={() => setVisible(false)}
+                  onCancel={() => setOpen(false)}
                  okButtonProps={{ loading: updateLoading }}
                  title={t("bills.labels.editadjwarning")}
                >
--- a/client/src/components/bill-detail-edit/bill-detail-edit-return.component.jsx
+++ b/client/src/components/bill-detail-edit/bill-detail-edit-return.component.jsx
@@ -36,7 +36,7 @@ export function BillDetailEditReturn({
  const history = useNavigate();
  const { t } = useTranslation();
  const [form] = Form.useForm();
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);

  const handleFinish = ({ billlines }) => {
    const selectedLines = billlines.filter((l) => l.selected).map((l) => l.id);
@@ -68,17 +68,17 @@ export function BillDetailEditReturn({
    delete search.billid;

    history({ search: queryString.stringify(search) });
-    setVisible(false);
+    setOpen(false);
  };
  useEffect(() => {
-    if (visible === false) form.resetFields();
-  }, [visible, form]);
+    if (open === false) form.resetFields();
+  }, [open, form]);

  return (
    <>
      <Modal
-        open={visible}
-        onCancel={() => setVisible(false)}
+        open={open}
+        onCancel={() => setOpen(false)}
        destroyOnClose
        title={t("bills.actions.return")}
        onOk={() => form.submit()}
@@ -175,7 +175,7 @@ export function BillDetailEditReturn({
      <Button
        disabled={data.bills_by_pk.is_credit_memo || disabled}
        onClick={() => {
-          setVisible(true);
+          setOpen(true);
        }}
      >
        {t("bills.actions.return")}
--- a/client/src/components/bill-enter-modal/bill-enter-modal.container.jsx
+++ b/client/src/components/bill-enter-modal/bill-enter-modal.container.jsx
@@ -346,18 +346,18 @@ function BillEnterModalContainer({
  }, [enterAgain, form]);

  useEffect(() => {
-    if (billEnterModal.visible) {
+    if (billEnterModal.open) {
      form.setFieldsValue(formValues);
    } else {
      form.resetFields();
    }
-  }, [billEnterModal.visible, form, formValues]);
+  }, [billEnterModal.open, form, formValues]);

  return (
    <Modal
      title={t("bills.labels.new")}
      width={"98%"}
-      open={billEnterModal.visible}
+      open={billEnterModal.open}
      okText={t("general.actions.save")}
      keyboard="false"
      onOk={() => form.submit()}
--- a/client/src/components/ca-bc-etf-table-modal/ca-bc-etf-table-modal.container.jsx
+++ b/client/src/components/ca-bc-etf-table-modal/ca-bc-etf-table-modal.container.jsx
@@ -25,7 +25,7 @@ export function ContractsFindModalContainer({
 }) {
  const { t } = useTranslation();

-  const { visible } = caBcEtfTableModal;
+  const { open } = caBcEtfTableModal;
  const [loading, setLoading] = useState(false);
  const [form] = Form.useForm();
  const EtfTemplate = TemplateList("special").ca_bc_etf_table;
@@ -63,14 +63,14 @@ export function ContractsFindModalContainer({
  };

  useEffect(() => {
-    if (visible) {
+    if (open) {
      form.resetFields();
    }
-  }, [visible, form]);
+  }, [open, form]);

  return (
    <Modal
-      open={visible}
+      open={open}
      width="70%"
      title={t("payments.labels.findermodal")}
      onCancel={() => toggleModalVisible()}
--- a/client/src/components/card-payment-modal/card-payment-modal.container..jsx
+++ b/client/src/components/card-payment-modal/card-payment-modal.container..jsx
@@ -22,7 +22,7 @@ function CardPaymentModalContainer({
  toggleModalVisible,
  bodyshop,
 }) {
-  const { visible } = cardPaymentModal;
+  const { open } = cardPaymentModal;
  const { t } = useTranslation();

  const handleCancel = () => {
@@ -35,7 +35,7 @@ function CardPaymentModalContainer({

  return (
    <Modal
-      open={visible}
+      open={open}
      onOk={handleOK}
      onCancel={handleCancel}
      footer={[
--- a/client/src/components/chat-media-selector/chat-media-selector.component.jsx
+++ b/client/src/components/chat-media-selector/chat-media-selector.component.jsx
@@ -27,7 +27,7 @@ export function ChatMediaSelector({
  conversation,
 }) {
  const { t } = useTranslation();
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);

  const { loading, error, data } = useQuery(GET_DOCUMENTS_BY_JOB, {
    fetchPolicy: "network-only",
@@ -39,13 +39,13 @@ export function ChatMediaSelector({
    },

    skip:
-      !visible ||
+      !open ||
      !conversation.job_conversations ||
      conversation.job_conversations.length === 0,
  });

-  const handleVisibleChange = (visible) => {
-    setVisible(visible);
+  const handleVisibleChange = (change) => {
+    setOpen(change);
  };

  useEffect(() => {
@@ -65,7 +65,7 @@ export function ChatMediaSelector({
          externalMediaState={[selectedMedia, setSelectedMedia]}
        />
      )}
-      {bodyshop.uselocalmediaserver && visible && (
+      {bodyshop.uselocalmediaserver && open && (
        <JobDocumentsLocalGalleryExternal
          externalMediaState={[selectedMedia, setSelectedMedia]}
          jobId={
@@ -88,7 +88,7 @@ export function ChatMediaSelector({
      }
      title={t("messaging.labels.selectmedia")}
      trigger="click"
-      open={visible}
+      open={open}
      onOpenChange={handleVisibleChange}
    >
      <Badge count={selectedMedia.filter((s) => s.isSelected).length}>
--- a/client/src/components/chat-tag-ro/chat-tag-ro.component.jsx
+++ b/client/src/components/chat-tag-ro/chat-tag-ro.component.jsx
@@ -9,7 +9,7 @@ export default function ChatTagRoComponent({
  loading,
  handleSearch,
  handleInsertTag,
-  setVisible,
+  setOpen,
 }) {
  const { t } = useTranslation();

@@ -38,7 +38,7 @@ export default function ChatTagRoComponent({
      {loading ? (
        <LoadingOutlined />
      ) : (
-        <CloseCircleOutlined onClick={() => setVisible(false)} />
+        <CloseCircleOutlined onClick={() => setOpen(false)} />
      )}
    </Space>
  );
--- a/client/src/components/chat-tag-ro/chat-tag-ro.container.jsx
+++ b/client/src/components/chat-tag-ro/chat-tag-ro.container.jsx
@@ -11,7 +11,7 @@ import ChatTagRo from "./chat-tag-ro.component";

 export default function ChatTagRoContainer({ conversation }) {
  const { t } = useTranslation();
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);

  const [loadRo, { loading, data }] = useLazyQuery(SEARCH_FOR_JOBS);

@@ -33,7 +33,7 @@ export default function ChatTagRoContainer({ conversation }) {
  const handleInsertTag = (value, option) => {
    logImEXEvent("messaging_add_job_tag");
    insertTag({ variables: { jobId: option.key } });
-    setVisible(false);
+    setOpen(false);
  };

  const existingJobTags =
@@ -47,16 +47,16 @@ export default function ChatTagRoContainer({ conversation }) {

  return (
    <div>
-      {visible ? (
+      {open ? (
        <ChatTagRo
          loading={loading}
          roOptions={roOptions}
          handleSearch={handleSearch}
          handleInsertTag={handleInsertTag}
-          setVisible={setVisible}
+          setOpen={setOpen}
        />
      ) : (
-        <Tag onClick={() => setVisible(true)}>
+        <Tag onClick={() => setOpen(true)}>
          <PlusOutlined />
          {t("messaging.actions.link")}
        </Tag>
--- a/client/src/components/contract-convert-to-ro/contract-convert-to-ro.component.jsx
+++ b/client/src/components/contract-convert-to-ro/contract-convert-to-ro.component.jsx
@@ -38,7 +38,7 @@ export function ContractConvertToRo({
  disabled,
 }) {
  const { t } = useTranslation();
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const [loading, setLoading] = useState(false);
  const [insertJob] = useMutation(INSERT_NEW_JOB);
  const history = useNavigate();
@@ -306,7 +306,7 @@ export function ContractConvertToRo({
      });
    }

-    setVisible(false);
+    setOpen(false);
    setLoading(false);
  };

@@ -380,7 +380,7 @@ export function ContractConvertToRo({
          <Button type="primary" htmlType="submit" loading={loading}>
            {t("contracts.actions.convertoro")}
          </Button>
-          <Button onClick={() => setVisible(false)}>
+          <Button onClick={() => setOpen(false)}>
            {t("general.actions.close")}
          </Button>
        </Space>
@@ -390,9 +390,9 @@ export function ContractConvertToRo({

  return (
    <div>
-      <Popover content={popContent} open={visible}>
+      <Popover content={popContent} open={open}>
        <Button
-          onClick={() => setVisible(true)}
+          onClick={() => setOpen(true)}
          loading={loading}
          disabled={!contract.dailyrate || !contract.actualreturn || disabled}
        >
--- a/client/src/components/contracts-find-modal/contracts-find-modal.container.jsx
+++ b/client/src/components/contracts-find-modal/contracts-find-modal.container.jsx
@@ -31,7 +31,7 @@ export function ContractsFindModalContainer({
 }) {
  const { t } = useTranslation();

-  const { visible } = contractFinderModal;
+  const { open } = contractFinderModal;

  const [form] = Form.useForm();

@@ -52,14 +52,14 @@ export function ContractsFindModalContainer({
  };

  useEffect(() => {
-    if (visible) {
+    if (open) {
      form.resetFields();
    }
-  }, [visible, form]);
+  }, [open, form]);

  return (
    <Modal
-      open={visible}
+      open={open}
      width="70%"
      title={t("contracts.labels.findermodal")}
      onCancel={() => toggleModalVisible()}
--- a/client/src/components/courtesy-car-return-modal/courtesy-car-return-modal.container.jsx
+++ b/client/src/components/courtesy-car-return-modal/courtesy-car-return-modal.container.jsx
@@ -26,7 +26,7 @@ export function CCReturnModalContainer({
  bodyshop,
 }) {
  const [loading, setLoading] = useState(false);
-  const { visible, context, actions } = courtesyCarReturnModal;
+  const { open, context, actions } = courtesyCarReturnModal;
  const { t } = useTranslation();
  const [form] = Form.useForm();
  const [updateContract] = useMutation(RETURN_CONTRACT);
@@ -64,7 +64,7 @@ export function CCReturnModalContainer({
  return (
    <Modal
      title={t("courtesycars.labels.return")}
-      open={visible}
+      open={open}
      onCancel={() => toggleModalVisible()}
      width={"90%"}
      okText={t("general.actions.save")}
--- a/client/src/components/data-label/data-label.component.jsx
+++ b/client/src/components/data-label/data-label.component.jsx
@@ -6,13 +6,13 @@ export default function DataLabel({
  hideIfNull,
  children,
  vertical,
-  visible = true,
+  open = true,
  valueStyle = {},
  valueClassName,
  onValueClick,
  ...props
 }) {
-  if (!visible || (hideIfNull && !!!children)) return null;
+  if (!open || (hideIfNull && !!!children)) return null;

  return (
    <div {...props} style={{ display: "flex" }}>
--- a/client/src/components/dms-cdk-makes/dms-cdk-makes.component.jsx
+++ b/client/src/components/dms-cdk-makes/dms-cdk-makes.component.jsx
@@ -18,7 +18,7 @@ const mapDispatchToProps = (dispatch) => ({
 export default connect(mapStateToProps, mapDispatchToProps)(DmsCdkVehicles);

 export function DmsCdkVehicles({ bodyshop, form, socket, job }) {
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const [selectedModel, setSelectedModel] = useState(null);
  const { t } = useTranslation();

@@ -51,14 +51,14 @@ export function DmsCdkVehicles({ bodyshop, form, socket, job }) {
    <>
      <Modal
        width={"90%"}
-        open={visible}
-        onCancel={() => setVisible(false)}
+        open={open}
+        onCancel={() => setOpen(false)}
        onOk={() => {
          form.setFieldsValue({
            dms_make: selectedModel.makecode,
            dms_model: selectedModel.modelcode,
          });
-          setVisible(false);
+          setOpen(false);
        }}
      >
        {error && <AlertComponent error={error.message} />}
@@ -90,7 +90,7 @@ export function DmsCdkVehicles({ bodyshop, form, socket, job }) {
      </Modal>
      <Button
        onClick={() => {
-          setVisible(true);
+          setOpen(true);
          callSearch({
            variables: {
              search: job && job.v_model_desc && job.v_model_desc.substr(0, 3),
--- a/client/src/components/dms-customer-selector/dms-customer-selector.component.jsx
+++ b/client/src/components/dms-customer-selector/dms-customer-selector.component.jsx
@@ -21,29 +21,29 @@ export default connect(
 export function DmsCustomerSelector({ bodyshop }) {
  const { t } = useTranslation();
  const [customerList, setcustomerList] = useState([]);
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const [selectedCustomer, setSelectedCustomer] = useState(null);
  const [dmsType, setDmsType] = useState("cdk");

  socket.on("cdk-select-customer", (customerList, callback) => {
-    setVisible(true);
+    setOpen(true);
    setDmsType("cdk");
    setcustomerList(customerList);
  });
  socket.on("pbs-select-customer", (customerList, callback) => {
-    setVisible(true);
+    setOpen(true);
    setDmsType("pbs");
    setcustomerList(customerList);
  });

  const onUseSelected = () => {
-    setVisible(false);
+    setOpen(false);
    socket.emit(`${dmsType}-selected-customer`, selectedCustomer);
    setSelectedCustomer(null);
  };

  const onUseGeneric = () => {
-    setVisible(false);
+    setOpen(false);
    socket.emit(
      `${dmsType}-selected-customer`,
      bodyshop.cdk_configuration.generic_customer_number
@@ -52,7 +52,7 @@ export function DmsCustomerSelector({ bodyshop }) {
  };

  const onCreateNew = () => {
-    setVisible(false);
+    setOpen(false);
    socket.emit(`${dmsType}-selected-customer`, null);
    setSelectedCustomer(null);
  };
@@ -114,7 +114,7 @@ export function DmsCustomerSelector({ bodyshop }) {
    },
  ];

-  if (!visible) return null;
+  if (!open) return null;
  return (
    <Col span={24}>
      <Table
--- a/client/src/components/inventory-upsert-modal/inventory-upsert-modal.container.jsx
+++ b/client/src/components/inventory-upsert-modal/inventory-upsert-modal.container.jsx
@@ -36,7 +36,7 @@ export function InventoryUpsertModalContainer({
  const [insertInventory] = useMutation(INSERT_INVENTORY_LINE);
  const [updateInventoryLine] = useMutation(UPDATE_INVENTORY_LINE);

-  const { visible, context, actions } = inventoryUpsertModal;
+  const { open, context, actions } = inventoryUpsertModal;
  const { existingInventory } = context;
  const { refetch } = actions;

@@ -44,12 +44,12 @@ export function InventoryUpsertModalContainer({

  useEffect(() => {
    //Required to prevent infinite looping.
-    if (existingInventory && visible) {
+    if (existingInventory && open) {
      form.setFieldsValue(existingInventory);
-    } else if (!existingInventory && visible) {
+    } else if (!existingInventory && open) {
      form.resetFields();
    }
-  }, [existingInventory, form, visible]);
+  }, [existingInventory, form, open]);

  const handleFinish = async (formValues) => {
    const values = formValues;
@@ -103,7 +103,7 @@ export function InventoryUpsertModalContainer({
          ? t("inventory.actions.edit")
          : t("inventory.actions.new")
      }
-      open={visible}
+      open={open}
      okText={t("general.actions.save")}
      onOk={() => {
        form.submit();
--- a/client/src/components/job-at-change/schedule-event.component.jsx
+++ b/client/src/components/job-at-change/schedule-event.component.jsx
@@ -57,7 +57,7 @@ export function ScheduleEventComponent({
  setScheduleContext,
 }) {
  const { t } = useTranslation();
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const history = useNavigate();
  const searchParams = queryString.parse(useLocation().search);
  const [updateAppointment] = useMutation(UPDATE_APPOINTMENT);
@@ -223,7 +223,7 @@ export function ScheduleEventComponent({
                                        time: dayjs(event.start).format("HH:mm a"),
                                    })
                                );
-                                setVisible(false);
+                                setOpen(false);
                            } else {
                                notification["error"]({
                                    message: t("messaging.error.invalidphone"),
@@ -290,7 +290,7 @@ export function ScheduleEventComponent({
          <Button
            disabled={event.arrived}
            onClick={() => {
-              setVisible(false);
+              setOpen(false);
              setScheduleContext({
                actions: { refetch: refetch },
                context: {
@@ -366,8 +366,8 @@ export function ScheduleEventComponent({

  return (
    <Popover
-      open={visible}
-      onOpenChange={(vis) => !event.vacation && setVisible(vis)}
+      open={open}
+      onOpenChange={(vis) => !event.vacation && setOpen(vis)}
      trigger="click"
      content={event.block ? blockContent : popoverContent}
      style={{
--- a/client/src/components/job-costing-modal/job-costing-modal.container.jsx
+++ b/client/src/components/job-costing-modal/job-costing-modal.container.jsx
@@ -23,23 +23,23 @@ export function JobCostingModalContainer({
 }) {
  const { t } = useTranslation();
  const [costingData, setCostingData] = useState(null);
-  const { visible, context } = jobCostingModal;
+  const { open, context } = jobCostingModal;
  const { jobId } = context;

  useEffect(() => {
    async function getData() {
-      if (jobId && visible) {
+      if (jobId && open) {
        const { data } = await axios.post("/job/costing", { jobid: jobId });

        setCostingData(data);
      }
    }
    getData();
-  }, [jobId, visible]);
+  }, [jobId, open]);

  return (
    <Modal
-      open={visible}
+      open={open}
      title={t("jobs.labels.jobcosting")}
      onOk={() => {
        toggleModalVisible();
--- a/client/src/components/job-detail-cards/job-detail-cards.insurance.component.jsx
+++ b/client/src/components/job-detail-cards/job-detail-cards.insurance.component.jsx
@@ -17,7 +17,7 @@ export default function JobDetailCardsInsuranceComponent({ loading, data }) {
          </DataLabel>
          <DataLabel
            label={t("jobs.labels.cards.filehandler")}
-            visible={data.ins_ct_fn && data.ins_ct_ln}>
+            open={data.ins_ct_fn && data.ins_ct_ln}>
            {data.ins_ea ? (
              <a href={`mailto:${data.ins_ea}`}>
                <div>{`${data.ins_ct_fn || ""} ${data.ins_ct_ln || ""}`}</div>
@@ -28,7 +28,7 @@ export default function JobDetailCardsInsuranceComponent({ loading, data }) {
          </DataLabel>
          <DataLabel
            label={t("jobs.labels.cards.estimator")}
-            visible={data.est_ct_fn && data.est_ct_ln}>
+            open={data.est_ct_fn && data.est_ct_ln}>
            {data.ins_ea ? (
              <a href={`mailto:${data.est_ea}`}>
                <div>{`${data.est_ct_fn || ""} ${data.est_ct_ln || ""}`}</div>
--- a/client/src/components/job-lines-upsert-modal/job-lines-upsert-modal.component.jsx
+++ b/client/src/components/job-lines-upsert-modal/job-lines-upsert-modal.component.jsx
@@ -22,7 +22,7 @@ export default connect(

 export function JobLinesUpsertModalComponent({
  bodyshop,
-  visible,
+  open,
  jobLine,
  handleCancel,
  handleFinish,
@@ -33,7 +33,7 @@ export function JobLinesUpsertModalComponent({

  useEffect(() => {
    form.resetFields();
-  }, [visible, form]);
+  }, [open, form]);


  const { treatments: {Allow_Negative_Jobline_Price, Autohouse_Detail_line} } = useSplitTreatments({
@@ -50,7 +50,7 @@ export function JobLinesUpsertModalComponent({
          : t("joblines.labels.new")
      }
      forceRender
-      open={visible}
+      open={open}
      width="60%"
      okText={t("general.actions.save")}
      onOk={() => form.submit()}
--- a/client/src/components/job-lines-upsert-modal/job-lines-upsert-modal.container.jsx
+++ b/client/src/components/job-lines-upsert-modal/job-lines-upsert-modal.container.jsx
@@ -133,7 +133,7 @@ function JobLinesUpsertModalContainer({

  return (
    <JobLinesUpdsertModal
-      visible={jobLineEditModal.visible}
+      open={jobLineEditModal.open}
      jobLine={jobLineEditModal.context}
      handleFinish={handleFinish}
      handleCancel={handleCancel}
--- a/client/src/components/job-reconciliation-modal/job-reconciliation.modal.container.jsx
+++ b/client/src/components/job-reconciliation-modal/job-reconciliation.modal.container.jsx
@@ -24,12 +24,12 @@ function JobReconciliationModalContainer({
  toggleModalVisible,
 }) {
  const { t } = useTranslation();
-  const { context, visible } = reconciliationModal;
+  const { context, open } = reconciliationModal;
  const { job } = context;

  const { loading, error, data } = useQuery(GET_JOB_RECONCILIATION_BY_PK, {
    variables: { id: job && job.id },
-    skip: !(job && job.id) || !visible,
+    skip: !(job && job.id) || !open,
    fetchPolicy: "network-only",
    nextFetchPolicy: "network-only",
  });
@@ -42,7 +42,7 @@ function JobReconciliationModalContainer({
    <Modal
      title={t("jobs.labels.reconciliationheader")}
      width={"95%"}
-      open={visible}
+      open={open}
      okText={t("general.actions.close")}
      onOk={handleCancel}
      onCancel={handleCancel}
--- a/client/src/components/jobs-available-table/jobs-available-table.container.jsx
+++ b/client/src/components/jobs-available-table/jobs-available-table.container.jsx
@@ -379,7 +379,7 @@ export function JobsAvailableContainer({bodyshop, currentUser, insertAuditTrail,
        setPartsQueueToggle={setPartsQueueToggle}
        selectedOwner={selectedOwner}
        setSelectedOwner={setSelectedOwner}
-        visible={ownerModalVisible}
+        open={ownerModalVisible}
        onOk={onOwnerFindModalOk}
        onCancel={onOwnerModalCancel}

@@ -390,7 +390,7 @@ export function JobsAvailableContainer({bodyshop, currentUser, insertAuditTrail,
        selectedJob={selectedJob}
        setSelectedJob={setSelectedJob}
        importOptionsState={importOptionsState}
-        visible={jobModalVisible}
+        open={jobModalVisible}
        onOk={onJobFindModalOk}
        onCancel={onJobModalCancel}
        modalSearchState={modalSearchState}
--- a/client/src/components/jobs-convert-button/jobs-convert-button.component.jsx
+++ b/client/src/components/jobs-convert-button/jobs-convert-button.component.jsx
@@ -37,7 +37,7 @@ export function JobsConvertButton({
  insertAuditTrail,
  parentFormIsFieldsTouched,
 }) {
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const [loading, setLoading] = useState(false);
  const [mutationConvertJob] = useMutation(CONVERT_JOB_TO_RO);
  const { t } = useTranslation();
@@ -80,7 +80,7 @@ export function JobsConvertButton({
        ),
      });

-      setVisible(false);
+      setOpen(false);
    }
    setLoading(false);
  };
@@ -246,7 +246,7 @@ export function JobsConvertButton({
          <Button type="primary" danger onClick={() => form.submit()} loading={loading}>
            {t("jobs.actions.convert")}
          </Button>
-          <Button onClick={() => setVisible(false)}>
+          <Button onClick={() => setOpen(false)}>
            {t("general.actions.close")}
          </Button>
        </Space>
@@ -257,7 +257,7 @@ export function JobsConvertButton({
  if (job.converted) return <></>;

  return (
-    <Popover open={visible} content={popMenu}>
+    <Popover open={open} content={popMenu}>
      <Button
        key="convert"
        type="primary"
@@ -266,7 +266,7 @@ export function JobsConvertButton({
        disabled={job.converted || jobRO}
        loading={loading}
        onClick={() => {
-          setVisible(true);
+          setOpen(true);
          form.setFieldsValue({
            driveable: true,
            towin: false,
--- a/client/src/components/jobs-documents-gallery/jobs-document-gallery.reassign.component.jsx
+++ b/client/src/components/jobs-documents-gallery/jobs-document-gallery.reassign.component.jsx
@@ -35,7 +35,7 @@ export function JobsDocumentsGalleryReassign({
    ];
  }, [galleryImages]);
  const client = useApolloClient();
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const [loading, setLoading] = useState(false);

  // const updateImage = async (i, jobid) => {
@@ -126,7 +126,7 @@ export function JobsDocumentsGalleryReassign({
        message: t("documents.successes.updated"),
      });
    }
-    setVisible(false);
+    setOpen(false);
    setLoading(false);
  };

@@ -151,7 +151,7 @@ export function JobsDocumentsGalleryReassign({
        <Button type="primary" onClick={() => form.submit()}>
          {t("general.actions.submit")}
        </Button>
-        <Button onClick={() => setVisible(false)}>
+        <Button onClick={() => setOpen(false)}>
          {t("general.actions.cancel")}
        </Button>
      </Space>
@@ -159,10 +159,10 @@ export function JobsDocumentsGalleryReassign({
  );

  return (
-    <Popover content={popContent} open={visible}>
+    <Popover content={popContent} open={open}>
      <Button
        disabled={selectedImages.length < 1}
-        onClick={() => setVisible(true)}
+        onClick={() => setOpen(true)}
        loading={loading}
      >
        {t("documents.actions.reassign")}
--- a/client/src/components/jobs-documents-local-gallery/jobs-documents-local-gallery.reassign.component.jsx
+++ b/client/src/components/jobs-documents-local-gallery/jobs-documents-local-gallery.reassign.component.jsx
@@ -32,7 +32,7 @@ export function JobsDocumentsLocalGalleryReassign({
  const { t } = useTranslation();
  const [form] = Form.useForm();

-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const [loading, setLoading] = useState(false);

  const handleFinish = async ({ jobid: newJobid }) => {
@@ -50,7 +50,7 @@ export function JobsDocumentsLocalGalleryReassign({
    );

    getJobMedia(jobid);
-    setVisible(false);
+    setOpen(false);
    setLoading(false);
  };

@@ -75,7 +75,7 @@ export function JobsDocumentsLocalGalleryReassign({
        <Button type="primary" onClick={() => form.submit()}>
          {t("general.actions.submit")}
        </Button>
-        <Button onClick={() => setVisible(false)}>
+        <Button onClick={() => setOpen(false)}>
          {t("general.actions.cancel")}
        </Button>
      </Space>
@@ -83,10 +83,10 @@ export function JobsDocumentsLocalGalleryReassign({
  );

  return (
-    <Popover content={popContent} open={visible}>
+    <Popover content={popContent} open={open}>
      <Button
        //disabled={selectedImages.length < 1}
-        onClick={() => setVisible(true)}
+        onClick={() => setOpen(true)}
        loading={loading}
      >
        {t("documents.actions.reassign")}
--- a/client/src/components/jobs-find-modal/jobs-find-modal.container.jsx
+++ b/client/src/components/jobs-find-modal/jobs-find-modal.container.jsx
@@ -34,7 +34,7 @@ export default connect(
    variables: {
      statuses: bodyshop.md_ro_statuses.active_statuses || ["Open"],
    },
-    skip: !modalProps.visible,
+    skip: !modalProps.open,
    fetchPolicy: "network-only",
    nextFetchPolicy: "network-only",
  });
--- a/client/src/components/labor-allocations-adjustment-edit/labor-allocations-adjustment-edit.component.jsx
+++ b/client/src/components/labor-allocations-adjustment-edit/labor-allocations-adjustment-edit.component.jsx
@@ -37,7 +37,7 @@ export function LaborAllocationsAdjustmentEdit({
  refetchQueryNames,
 }) {
  const [loading, setLoading] = useState(false);
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const [updateAdjustments] = useMutation(UPDATE_JOB);
  const [form] = Form.useForm();

@@ -79,7 +79,7 @@ export function LaborAllocationsAdjustmentEdit({
      });
    }
    setLoading(false);
-    setVisible(false);
+    setOpen(false);
  };

  const overlay = (
@@ -171,8 +171,8 @@ export function LaborAllocationsAdjustmentEdit({

  return (
    <Popover
-      open={visible}
-      onOpenChange={(vis) => setVisible(vis)}
+      open={open}
+      onOpenChange={(vis) => setOpen(vis)}
      content={overlay}
      trigger="click"
    >
--- a/client/src/components/note-upsert-modal/note-upsert-modal.container.jsx
+++ b/client/src/components/note-upsert-modal/note-upsert-modal.container.jsx
@@ -33,7 +33,7 @@ export function NoteUpsertModalContainer({
  const [insertNote] = useMutation(INSERT_NEW_NOTE);
  const [updateNote] = useMutation(UPDATE_NOTE);

-  const { visible, context, actions } = noteUpsertModal;
+  const { open, context, actions } = noteUpsertModal;
  const { jobId, existingNote, text } = context;
  const { refetch } = actions;

@@ -41,16 +41,16 @@ export function NoteUpsertModalContainer({

  useEffect(() => {
    //Required to prevent infinite looping.
-    if (existingNote && visible) {
+    if (existingNote && open) {
      form.setFieldsValue(existingNote);
-    } else if (!existingNote && visible) {
+    } else if (!existingNote && open) {
      form.resetFields();

      if (text) {
        form.setFieldValue("text", text);
      }
    }
-  }, [existingNote, form, visible, text]);
+  }, [existingNote, form, open, text]);

  const handleFinish = async (formValues) => {
    const { relatedros, ...values } = formValues;
@@ -122,7 +122,7 @@ export function NoteUpsertModalContainer({
  return (
    <Modal
      title={existingNote ? t("notes.actions.edit") : t("notes.actions.new")}
-      open={visible}
+      open={open}
      okText={t("general.actions.save")}
      onOk={() => {
        form.submit();
--- a/client/src/components/parts-order-modal/parts-order-modal.container.jsx
+++ b/client/src/components/parts-order-modal/parts-order-modal.container.jsx
@@ -50,7 +50,7 @@ export function PartsOrderModalContainer({partsOrderModal,toggleModalVisible,cur
        splitKey: bodyshop.imexshopid,
    });

-    const {visible, context, actions} = partsOrderModal;
+    const {open, context, actions} = partsOrderModal;
    const {
        jobId,
        linesToOrder,
@@ -68,7 +68,7 @@ export function PartsOrderModalContainer({partsOrderModal,toggleModalVisible,cur
    const sendType = sendTypeState[0];

    const {loading, error, data} = useQuery(QUERY_ALL_VENDORS_FOR_ORDER, {
-        skip: !visible,
+        skip: !open,
        variables: {jobId: jobId},
        fetchPolicy: "network-only",
        nextFetchPolicy: "network-only",
@@ -328,14 +328,14 @@ export function PartsOrderModalContainer({partsOrderModal,toggleModalVisible,cur
    };

    useEffect(() => {
-        if (visible && !!linesToOrder) {
+        if (open && !!linesToOrder) {
            form.resetFields();
        }
-    }, [visible, linesToOrder, form]);
+    }, [open, linesToOrder, form]);

    return (
        <Modal
-            open={visible}
+            open={open}
            title={
                isReturn
                    ? `${t("parts_orders.labels.returnpartsorder")} ${invoiceNumber}`
--- a/client/src/components/parts-receive-modal/parts-receive-modal.container.jsx
+++ b/client/src/components/parts-receive-modal/parts-receive-modal.container.jsx
@@ -32,7 +32,7 @@ export function PartsReceiveModalContainer({
 }) {
  const { t } = useTranslation();
  const [loading, setLoading] = useState(false);
-  const { visible, context, actions } = partsReceiveModal;
+  const { open, context, actions } = partsReceiveModal;
  const { partsorderlines } = context;

  const { refetch } = actions;
@@ -85,14 +85,14 @@ export function PartsReceiveModalContainer({
  };

  useEffect(() => {
-    if (visible && !!partsorderlines) {
+    if (open && !!partsorderlines) {
      form.resetFields();
    }
-  }, [visible, partsorderlines, form]);
+  }, [open, partsorderlines, form]);

  return (
    <Modal
-      open={visible}
+      open={open}
      title={t("parts_orders.labels.receive")}
      onCancel={() => toggleModalVisible()}
      onOk={() => form.submit()}
--- a/client/src/components/payable-mark-selected-exported/payable-mark-selected-exported.component.jsx
+++ b/client/src/components/payable-mark-selected-exported/payable-mark-selected-exported.component.jsx
@@ -34,7 +34,7 @@ export function BillMarkSelectedExported({
 }) {
  const { t } = useTranslation();
  const [loading, setLoading] = useState(false);
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const [insertExportLog] = useMutation(INSERT_EXPORT_LOG);
  const [updateBill] = useMutation(gql`
    mutation UPDATE_BILL($billIds: [uuid!]!) {
@@ -85,21 +85,21 @@ export function BillMarkSelectedExported({
    completedCallback && completedCallback([]);
    setLoading(false);
    refetch && refetch();
-    setVisible(false);
+    setOpen(false);
  };

  return (
    <Popconfirm
-      open={visible}
+      open={open}
      title={t("general.labels.areyousure")}
-      onCancel={() => setVisible(false)}
+      onCancel={() => setOpen(false)}
      onConfirm={handleUpdate}
      disabled={disabled}
    >
      <Button
        loading={loading}
        disabled={disabled}
-        onClick={() => setVisible(true)}
+        onClick={() => setOpen(true)}
      >
        {t("bills.labels.markexported")}
      </Button>
--- a/client/src/components/payment-mark-selected-exported/payment-mark-selected-exported.component.jsx
+++ b/client/src/components/payment-mark-selected-exported/payment-mark-selected-exported.component.jsx
@@ -34,7 +34,7 @@ export function PaymentMarkSelectedExported({
 }) {
  const { t } = useTranslation();
  const [loading, setLoading] = useState(false);
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);

  const [insertExportLog] = useMutation(INSERT_EXPORT_LOG);
  const [updatePayments] = useMutation(gql`
@@ -88,21 +88,21 @@ export function PaymentMarkSelectedExported({
    completedCallback && completedCallback([]);
    setLoading(false);
    refetch && refetch();
-    setVisible(false);
+    setOpen(false);
  };

  return (
    <Popconfirm
-      open={visible}
+      open={open}
      title={t("general.labels.areyousure")}
-      onCancel={() => setVisible(false)}
+      onCancel={() => setOpen(false)}
      onConfirm={handleUpdate}
      disabled={disabled}
    >
      <Button
        loading={loading}
        disabled={disabled}
-        onClick={() => setVisible(true)}
+        onClick={() => setOpen(true)}
      >
        {t("bills.labels.markexported")}
      </Button>
--- a/client/src/components/payment-modal/payment-modal.container.jsx
+++ b/client/src/components/payment-modal/payment-modal.container.jsx
@@ -46,7 +46,7 @@ function PaymentModalContainer({
  const [updatePayment] = useMutation(UPDATE_PAYMENT);

  const { t } = useTranslation();
-  const { context, actions, visible } = paymentModal;
+  const { context, actions, open } = paymentModal;

  const [loading, setLoading] = useState(false);

@@ -130,12 +130,12 @@ function PaymentModalContainer({
  };

  useEffect(() => {
-    if (visible) {
+    if (open) {
      form.resetFields();
      form.resetFields();
      form.setFieldsValue(context);
    }
-  }, [visible, form, context]);
+  }, [open, form, context]);

  useEffect(() => {
    if (enterAgain) form.submit();
@@ -148,7 +148,7 @@ function PaymentModalContainer({
          ? t("payments.labels.new")
          : t("payments.labels.edit")
      }
-      open={visible}
+      open={open}
      destroyOnClose
      okText={t("general.actions.save")}
      onOk={() => form.submit()}
--- a/client/src/components/payments-generate-link/payments-generate-link.component.jsx
+++ b/client/src/components/payments-generate-link/payments-generate-link.component.jsx
@@ -36,7 +36,7 @@ export function PaymentsGenerateLink({
  const { t } = useTranslation();
  const [form] = Form.useForm();

-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const [loading, setLoading] = useState(false);
  const [paymentLink, setPaymentLink] = useState(null);

@@ -69,7 +69,7 @@ export function PaymentsGenerateLink({
    //Add in confirmation & errors.
    if (callback) callback();

-    // setVisible(false);
+    // setOpen(false);
    setLoading(false);
  };

@@ -137,7 +137,7 @@ export function PaymentsGenerateLink({
          onClick={() => {
            form.resetFields();
            setPaymentLink(null);
-            setVisible(false);
+            setOpen(false);
          }}
        >
          {t("general.actions.cancel")}
@@ -147,8 +147,8 @@ export function PaymentsGenerateLink({
  );

  return (
-    <Popover content={popContent} open={visible}>
-      <Button onClick={() => setVisible(true)} loading={loading}>
+    <Popover content={popContent} open={open}>
+      <Button onClick={() => setOpen(true)} loading={loading}>
        {t("payments.actions.generatepaymentlink")}
      </Button>
    </Popover>
--- a/client/src/components/print-center-modal/print-center-modal.container.jsx
+++ b/client/src/components/print-center-modal/print-center-modal.container.jsx
@@ -22,13 +22,13 @@ export function PrintCenterModalContainer({
 }) {
  const { t } = useTranslation();

-  const { visible, context } = printCenterModal;
+  const { open, context } = printCenterModal;
  //const { type } = context;
  // const { refetch } = actions;

  return (
    <Modal
-      open={visible}
+      open={open}
      onOk={() => toggleModalVisible()}
      onCancel={() => toggleModalVisible()}
      cancelButtonProps={{ style: { display: "none" } }}
--- a/client/src/components/production-board-kanban/production-board-kanban.card-settings.component.jsx
+++ b/client/src/components/production-board-kanban/production-board-kanban.card-settings.component.jsx
@@ -17,7 +17,7 @@ export default function ProductionBoardKanbanCardSettings({
  associationSettings,
 }) {
  const [form] = Form.useForm();
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const [loading, setLoading] = useState(false);
  const [updateKbSettings] = useMutation(UPDATE_KANBAN_SETTINGS);

@@ -25,7 +25,7 @@ export default function ProductionBoardKanbanCardSettings({
    form.setFieldsValue(
      associationSettings && associationSettings.kanban_settings
    );
-  }, [form, associationSettings, visible]);
+  }, [form, associationSettings, open]);

  const { t } = useTranslation();

@@ -45,7 +45,7 @@ export default function ProductionBoardKanbanCardSettings({
        }),
      });
    }
-    setVisible(false);
+    setOpen(false);
    setLoading(false);
  };

@@ -173,8 +173,8 @@ export default function ProductionBoardKanbanCardSettings({
    </div>
  );
  return (
-    <Popover content={overlay} open={visible} placement="topRight">
-      <Button loading={loading} onClick={() => setVisible(true)}>
+    <Popover content={overlay} open={open} placement="topRight">
+      <Button loading={loading} onClick={() => setOpen(true)}>
        {t("production.labels.cardsettings")}
      </Button>
    </Popover>
--- a/client/src/components/production-list-columns/production-list-columns.comment.component.jsx
+++ b/client/src/components/production-list-columns/production-list-columns.comment.component.jsx
@@ -10,13 +10,13 @@ export default function ProductionListColumnComment({ record }) {

  const [note, setNote] = useState(record.comment || "");

-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);

  const [updateAlert] = useMutation(UPDATE_JOB);

  const handleSaveNote = (e) => {
    e.stopPropagation();
-    setVisible(false);
+    setOpen(false);
    updateAlert({
      variables: {
        jobId: record.id,
@@ -34,15 +34,15 @@ export default function ProductionListColumnComment({ record }) {
    setNote(e.target.value);
  };

-  const handleVisibleChange = (flag) => {
-    setVisible(flag);
+  const handleOpenChange = (flag) => {
+    setOpen(flag);
    if (flag) setNote(record.comment || "");
  };

  return (
    <Popover
-      onOpenChange={handleVisibleChange}
-      open={visible}
+      onOpenChange={handleOpenChange}
+      open={open}
      content={
        <div style={{ width: "30em" }}>
          <Input.TextArea
--- a/client/src/components/production-list-columns/production-list-columns.date.component.jsx
+++ b/client/src/components/production-list-columns/production-list-columns.date.component.jsx
@@ -15,7 +15,7 @@ export default function ProductionListDate({
  pastIndicator,
 }) {
  const [updateAlert] = useMutation(UPDATE_JOB);
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const { t } = useTranslation();

  const handleChange = (date) => {
@@ -41,7 +41,7 @@ export default function ProductionListDate({
    }).then(() => {
      if (record.refetch) record.refetch();
      if (!time) {
-        setVisible(false);
+        setOpen(false);
      }
    });
  };
@@ -59,8 +59,8 @@ export default function ProductionListDate({
  return (
    <Dropdown
      trigger={["click"]}
-      onOpenChange={(v) => setVisible(v)}
-      open={visible}
+      onOpenChange={(v) => setOpen(v)}
+      open={open}
      style={{
        height: "19px",
      }}
@@ -82,14 +82,14 @@ export default function ProductionListDate({
              format="hh:mm a"
            />
          )}
-          <Button onClick={() => setVisible(false)}>
+          <Button onClick={() => setOpen(false)}>
            {t("general.actions.close")}
          </Button>
        </Card>
      }
    >
      <div
-        onClick={() => setVisible(true)}
+        onClick={() => setOpen(true)}
        style={{
          height: "19px",
        }}
--- a/client/src/components/production-list-columns/production-list-columns.lastcontacted.component.jsx
+++ b/client/src/components/production-list-columns/production-list-columns.lastcontacted.component.jsx
@@ -26,7 +26,7 @@ export default connect(
 export function ProductionLastContacted({ currentUser, record }) {
  const [updateAlert] = useMutation(UPDATE_JOB);
  const [insertNote] = useMutation(INSERT_NEW_NOTE);
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const { t } = useTranslation();
  const [form] = Form.useForm();
  const handleFinish = async ({
@@ -76,25 +76,25 @@ export function ProductionLastContacted({ currentUser, record }) {
    }
    if (record.refetch) record.refetch();

-    setVisible(false);
+    setOpen(false);
  };

  useEffect(() => {
-    if (visible) {
+    if (open) {
      form.setFieldsValue({
        note: null,
        date_last_contacted:
          record.date_last_contacted && dayjs(record.date_last_contacted),
      });
    }
-  }, [visible, form, record.date_last_contacted]);
+  }, [open, form, record.date_last_contacted]);

  // TODO - Client Update - Why is this a card?
  return (
    <div>
      <Dropdown
        //trigger={["click"]}
-        open={visible}
+        open={open}
        style={{
          height: "19px",
        }}
@@ -123,7 +123,7 @@ export function ProductionLastContacted({ currentUser, record }) {
                <Button type="primary" htmlType="submit">
                  {t("general.actions.save")}
                </Button>
-                <Button onClick={() => setVisible(false)}>
+                <Button onClick={() => setOpen(false)}>
                  {t("general.actions.close")}
                </Button>
              </Space>
@@ -132,7 +132,7 @@ export function ProductionLastContacted({ currentUser, record }) {
        }
      >
        <div
-          onClick={() => setVisible(true)}
+          onClick={() => setOpen(true)}
          style={{
            height: "19px",
          }}
--- a/client/src/components/production-list-columns/production-list-columns.productionnote.component.jsx
+++ b/client/src/components/production-list-columns/production-list-columns.productionnote.component.jsx
@@ -24,14 +24,14 @@ function ProductionListColumnProductionNote({ record, setNoteUpsertContext }) {
    (record.production_vars && record.production_vars.note) || ""
  );

-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);

  const [updateAlert] = useMutation(UPDATE_JOB);

  const handleSaveNote = (e) => {
    logImEXEvent("production_add_note");
    e.stopPropagation();
-    setVisible(false);
+    setOpen(false);
    updateAlert({
      variables: {
        jobId: record.id,
@@ -52,16 +52,16 @@ function ProductionListColumnProductionNote({ record, setNoteUpsertContext }) {
    setNote(e.target.value);
  };

-  const handleVisibleChange = (flag) => {
-    setVisible(flag);
+  const handleOpenChange = (flag) => {
+    setOpen(flag);
    if (flag)
      setNote((record.production_vars && record.production_vars.note) || "");
  };

  return (
    <Popover
-      onOpenChange={handleVisibleChange}
-      open={visible}
+      onOpenChange={handleOpenChange}
+      open={open}
      content={
        <div style={{ width: "30em" }}>
          <Input.TextArea
@@ -79,7 +79,7 @@ function ProductionListColumnProductionNote({ record, setNoteUpsertContext }) {
            </Button>
            <Button
              onClick={() => {
-                setVisible(false);
+                setOpen(false);
                setNoteUpsertContext({
                  context: {
                    jobId: record.id,
--- a/client/src/components/production-list-save-config-button/production-list-save-config-button.component.jsx
+++ b/client/src/components/production-list-save-config-button/production-list-save-config-button.component.jsx
@@ -23,7 +23,7 @@ export function ProductionListSaveConfigButton({
 }) {
  const [updateShop] = useMutation(UPDATE_SHOP);
  const [loading, setLoading] = useState(false);
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const [form] = Form.useForm();

  const { t } = useTranslation();
@@ -61,7 +61,7 @@ export function ProductionListSaveConfigButton({
      });
    }
    form.resetFields();
-    setVisible(false);
+    setOpen(false);
    setLoading(false);
  };
  const popMenu = (
@@ -79,7 +79,7 @@ export function ProductionListSaveConfigButton({
          <Button type="primary" danger onClick={() => form.submit()} loading={loading}>
            {t("general.actions.save")}
          </Button>
-          <Button onClick={() => setVisible(false)}>
+          <Button onClick={() => setOpen(false)}>
            {t("general.actions.close")}
          </Button>
        </Space>
@@ -88,8 +88,8 @@ export function ProductionListSaveConfigButton({
  );

  return (
-    <Popover open={visible} content={popMenu}>
-      <Button loading={loading} onClick={() => setVisible(true)}>
+    <Popover open={open} content={popMenu}>
+      <Button loading={loading} onClick={() => setOpen(true)}>
        {t("production.actions.saveconfig")}
      </Button>
    </Popover>
--- a/client/src/components/report-center-modal/report-center-modal.component.jsx
+++ b/client/src/components/report-center-modal/report-center-modal.component.jsx
@@ -46,12 +46,12 @@ export function ReportCenterModalComponent({ reportCenterModal }) {
  const ReportsList = Object.keys(Templates).map((key) => {
    return Templates[key];
  });
-  const { visible } = reportCenterModal;
+  const { open } = reportCenterModal;

  const [callVendorQuery, { data: vendorData, called: vendorCalled }] =
    useLazyQuery(QUERY_ALL_VENDORS, {
      skip: !(
-        visible &&
+        open &&
        Templates[form.getFieldValue("key")] &&
        Templates[form.getFieldValue("key")].idtype
      ),
@@ -60,7 +60,7 @@ export function ReportCenterModalComponent({ reportCenterModal }) {
  const [callEmployeeQuery, { data: employeeData, called: employeeCalled }] =
    useLazyQuery(QUERY_ACTIVE_EMPLOYEES, {
      skip: !(
-        visible &&
+        open &&
        Templates[form.getFieldValue("key")] &&
        Templates[form.getFieldValue("key")].idtype
      ),
--- a/client/src/components/report-center-modal/report-center-modal.container.jsx
+++ b/client/src/components/report-center-modal/report-center-modal.container.jsx
@@ -22,11 +22,11 @@ export function ReportCenterModalContainer({
 }) {
  const { t } = useTranslation();

-  const { visible } = reportCenterModal;
+  const { open } = reportCenterModal;

  return (
    <Modal
-      open={visible}
+      open={open}
      title={t("printcenter.labels.reportcentermodal")}
      onOk={() => toggleModalVisible()}
      onCancel={() => toggleModalVisible()}
--- a/client/src/components/schedule-job-modal/schedule-job-modal.container.jsx
+++ b/client/src/components/schedule-job-modal/schedule-job-modal.container.jsx
@@ -45,7 +45,7 @@ export function ScheduleJobModalContainer({
  currentUser,
  insertAuditTrail,
 }) {
-  const { visible, context, actions } = scheduleModal;
+  const { open, context, actions } = scheduleModal;
  const { jobId, job, previousEvent } = context;

  const { refetch } = actions;
@@ -73,7 +73,7 @@ export function ScheduleJobModalContainer({
    variables: { jobid: jobId },
    fetchPolicy: "network-only",
    nextFetchPolicy: "network-only",
-    skip: !visible || !!!jobId,
+    skip: !open || !!!jobId,
  });

  useEffect(() => {
@@ -206,7 +206,7 @@ export function ScheduleJobModalContainer({

  return (
    <Modal
-      open={visible}
+      open={open}
      onCancel={() => toggleModalVisible()}
      onOk={() => form.submit()}
      width={"90%"}
--- a/client/src/components/scoreboard-entry-edit/scoreboard-entry-edit.component.jsx
+++ b/client/src/components/scoreboard-entry-edit/scoreboard-entry-edit.component.jsx
@@ -6,7 +6,7 @@ import { UPDATE_SCOREBOARD_ENTRY } from "../../graphql/scoreboard.queries";
 import FormDatePicker from "../form-date-picker/form-date-picker.component";

 export default function ScoreboardEntryEdit({ entry }) {
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const [loading, setLoading] = useState(false);
  const { t } = useTranslation();
  const [updateScoreboardentry] = useMutation(UPDATE_SCOREBOARD_ENTRY);
@@ -28,7 +28,7 @@ export default function ScoreboardEntryEdit({ entry }) {
      notification["success"]({
        message: t("scoreboard.successes.updated"),
      });
-      setVisible(false);
+      setOpen(false);
    }
    setLoading(false);
  };
@@ -81,7 +81,7 @@ export default function ScoreboardEntryEdit({ entry }) {
        <Button type="primary" loading={loading} htmlType="submit">
          {t("general.actions.save")}
        </Button>
-        <Button onClick={() => setVisible(false)}>
+        <Button onClick={() => setOpen(false)}>
          {t("general.actions.cancel")}
        </Button>
      </Form>
@@ -92,11 +92,11 @@ export default function ScoreboardEntryEdit({ entry }) {

  return (
    <div>
-      <Dropdown open={visible} overlay={popContent}>
+      <Dropdown open={open} overlay={popContent}>
        <Button
          onClick={(e) => {
            e.stopPropagation();
-            setVisible(true);
+            setOpen(true);
          }}
        >
          {t("scoreboard.actions.edit")}
--- a/client/src/components/scoreboard-jobs-list/scoreboard-jobs-list.component.jsx
+++ b/client/src/components/scoreboard-jobs-list/scoreboard-jobs-list.component.jsx
@@ -14,7 +14,7 @@ import {pageLimit} from "../../utils/config";
 export default function ScoreboardJobsList({ scoreBoardlist }) {
  const { t } = useTranslation();
  const [state, setState] = useState({
-    visible: false,
+    open: false,
    search: "",
    current: 1,
    pageSize: pageLimit,
@@ -25,7 +25,7 @@ export default function ScoreboardJobsList({ scoreBoardlist }) {
    {
      fetchPolicy: "network-only",
      nextFetchPolicy: "network-only",
-      skip: !state.visible,
+      skip: !state.open,
      variables: {
        search: state.search !== "" ? `%${state.search}%` : null,
        offset: state.current ? (state.current - 1) * state.pageSize : 0,
@@ -101,14 +101,14 @@ export default function ScoreboardJobsList({ scoreBoardlist }) {
  return (
    <>
      <Modal
-        open={state.visible}
+        open={state.open}
        destroyOnClose
        width="80%"
        cancelButtonProps={{ style: { display: "none" } }}
        onCancel={() =>
          setState((state) => ({
            ...state,
-            visible: false,
+            open: false,
            current: 1,
            search: "",
          }))
@@ -157,7 +157,7 @@ export default function ScoreboardJobsList({ scoreBoardlist }) {
        </Card>
      </Modal>
      <Button
-        onClick={() => setState((state) => ({ ...state, visible: true }))}
+        onClick={() => setState((state) => ({ ...state, open: true }))}
      >
        {t("scoreboard.labels.entries")}
      </Button>
--- a/client/src/components/shop-templates-list/shop-templates-list.container.jsx
+++ b/client/src/components/shop-templates-list/shop-templates-list.container.jsx
@@ -11,8 +11,8 @@ import { TemplateList } from "../../utils/TemplateConstants";
 import ShopTemplateAdd from "../shop-template-add/shop-template-add.component";
 import ShopTemplateDeleteComponent from "../shop-template-delete/shop-template-delete.component";

-export default function ShopTemplatesListContainer({ visibleState }) {
-  const [visible, setVisible] = visibleState;
+export default function ShopTemplatesListContainer({ openState }) {
+  const [open, setOpen] = openState;
  const { loading, error, data, refetch } = useQuery(QUERY_CUSTOM_TEMPLATES, {
    fetchPolicy: "network-only",
    nextFetchPolicy: "network-only",
@@ -38,8 +38,8 @@ export default function ShopTemplatesListContainer({ visibleState }) {
    (<Drawer
      placement="left"
      width="25%"
-      open={visible}
-      onClose={() => setVisible(false)}
+      open={open}
+      onClose={() => setOpen(false)}
    >
      <div>
        <div>{t("bodyshop.labels.customtemplates")}</div>
--- a/client/src/components/shop-users-auth-edit/shop-users-auth-edit.component.jsx
+++ b/client/src/components/shop-users-auth-edit/shop-users-auth-edit.component.jsx
@@ -7,11 +7,11 @@ import { UPDATE_ASSOCIATION } from "../../graphql/user.queries";
 export default function ShopUsersAuthEdit({ association }) {
  const { t } = useTranslation();
  const [updateAssociation] = useMutation(UPDATE_ASSOCIATION);
-  const [visible, setVisible] = useState(false);
+  const [open, setOpen] = useState(false);
  const [value, setValue] = useState(association.authlevel);

  const handleSave = async () => {
-    setVisible(false);
+    setOpen(false);
    const result = await updateAssociation({
      variables: {
        assocId: association.id,
@@ -30,7 +30,7 @@ export default function ShopUsersAuthEdit({ association }) {

  return (
    <div>
-      {visible && (
+      {open && (
        <div>
          <InputNumber
            min={0}
@@ -41,10 +41,8 @@ export default function ShopUsersAuthEdit({ association }) {
          />
        </div>
      )}
-      {!visible && (
-        <div
-          style={{ cursor: "pointer" }} //onClick={() => setVisible(true)}
-        >
+      {!open && (
+        <div style={{ cursor: "pointer" }}>
          {association.authlevel || t("general.labels.na")}
        </div>
      )}
--- a/client/src/components/time-ticket-modal/time-ticket-modal.container.jsx
+++ b/client/src/components/time-ticket-modal/time-ticket-modal.container.jsx
@@ -37,7 +37,7 @@ export function TimeTicketModalContainer({
  const [updateTicket] = useMutation(UPDATE_TIME_TICKET);

  const { data: EmployeeAutoCompleteData } = useQuery(QUERY_ACTIVE_EMPLOYEES, {
-    skip: !timeTicketModal.visible,
+    skip: !timeTicketModal.open,
    fetchPolicy: "network-only",
    nextFetchPolicy: "network-only",
  });
@@ -127,8 +127,8 @@ export function TimeTicketModalContainer({
  }, [enterAgain, form]);

  useEffect(() => {
-    if (timeTicketModal.visible) form.resetFields();
-  }, [timeTicketModal.visible, form]);
+    if (timeTicketModal.open) form.resetFields();
+  }, [timeTicketModal.open, form]);

  const handleFieldsChange = (changedFields, allFields) => {
    if (!!changedFields.employeeid && !!EmployeeAutoCompleteData) {
@@ -169,7 +169,7 @@ export function TimeTicketModalContainer({
          : t("timetickets.labels.new")
      }
      width={"90%"}
-      open={timeTicketModal.visible}
+      open={timeTicketModal.open}
      forceRender
      onCancel={handleCancel}
      afterClose={() => form.resetFields()}
--- a/client/src/pages/shop-templates/shop-templates.container.js
+++ b/client/src/pages/shop-templates/shop-templates.container.js
@@ -42,7 +42,7 @@
 //   return (
 //     <RbacWrapper action="shop:templates">
 //       <div>
-//         <ShopTemplatesListContainer visibleState={drawerVisibility} />
+//         <ShopTemplatesListContainer openState={drawerVisibility} />
 //         <Button onClick={() => drawerVisibility[1](true)}>Show List</Button>
 //         <ShopTemplateEditor />
 //       </div>
--- a/client/src/redux/email/email.reducer.js
+++ b/client/src/redux/email/email.reducer.js
@@ -10,7 +10,7 @@ const INITIAL_STATE = {
    template: { name: null, variables: {} },
  },

-  visible: false,
+  open: false,
  error: null,
 };

@@ -19,13 +19,13 @@ const emailReducer = (state = INITIAL_STATE, action) => {
    case EmailActionTypes.TOGGLE_EMAIL_OVERLAY_VISIBLE:
      return {
        ...state,
-        visible: !state.visible,
+        open: !state.open,
      };
    case EmailActionTypes.SET_EMAIL_OPTIONS:
      return {
        ...state,
        emailConfig: { ...action.payload },
-        visible: true,
+        open: true,
      };
    default:
      return state;
--- a/client/src/redux/email/email.selectors.js
+++ b/client/src/redux/email/email.selectors.js
@@ -4,7 +4,7 @@ const selectEmail = (state) => state.email;

 export const selectEmailVisible = createSelector(
  [selectEmail],
-  (email) => email.visible
+  (email) => email.open
 );

 export const selectEmailConfig = createSelector(
--- a/client/src/redux/messaging/messaging.reducer.js
+++ b/client/src/redux/messaging/messaging.reducer.js
@@ -1,7 +1,7 @@
 import MessagingActionTypes from "./messaging.types";

 const INITIAL_STATE = {
-  visible: false,
+  open: false,
  selectedConversationId: null,
  isSending: false,
  error: null,
@@ -16,7 +16,7 @@ const messagingReducer = (state = INITIAL_STATE, action) => {
    case MessagingActionTypes.TOGGLE_CHAT_VISIBLE:
      return {
        ...state,
-        visible: !state.visible,
+        open: !state.open,
      };
    case MessagingActionTypes.OPEN_CHAT_BY_PHONE:
      return {
@@ -26,7 +26,7 @@ const messagingReducer = (state = INITIAL_STATE, action) => {
    case MessagingActionTypes.SET_SELECTED_CONVERSATION:
      return {
        ...state,
-        visible: true,
+        open: true,
        searchingForConversation: false,
        selectedConversationId: action.payload,
      };
--- a/client/src/redux/messaging/messaging.selectors.js
+++ b/client/src/redux/messaging/messaging.selectors.js
@@ -4,7 +4,7 @@ const selectMessaging = (state) => state.messaging;

 export const selectChatVisible = createSelector(
  [selectMessaging],
-  (messaging) => messaging.visible
+  (messaging) => messaging.open
 );

 export const selectIsSending = createSelector(
--- a/client/src/redux/modals/modals.reducer.js
+++ b/client/src/redux/modals/modals.reducer.js
@@ -1,7 +1,7 @@
 import ModalsActionTypes from "./modals.types";

 const baseModal = {
-  visible: false,
+  open: false,
  context: {},
  actions: {
    refetch: null,
@@ -35,7 +35,7 @@ const modalsReducer = (state = INITIAL_STATE, action) => {
        ...state,
        [action.payload]: {
          ...state[action.payload],
-          visible: !state[action.payload].visible,
+          open: !state[action.payload].open,
        },
      };
    case ModalsActionTypes.SET_MODAL_CONTEXT:
@@ -44,7 +44,7 @@ const modalsReducer = (state = INITIAL_STATE, action) => {
        [action.payload.modal]: {
          ...state[action.payload.modal],
          ...action.payload.context,
-          visible: true,
+          open: true,
        },
      };
    default: