From c0dcaaf6fdd3127131a5add6f3bb06867317e73b Mon Sep 17 00:00:00 2001
From: Titani <tlabaj@redhat.com>
Date: Mon, 12 Aug 2024 15:01:36 -0400
Subject: [PATCH] update demos

---
 .../src/components/demos/FormDemo/FormDemo.tsx            | 4 ++--
 .../src/components/demos/PageDemo/PageDemo.tsx            | 4 ++--
 .../src/components/demos/TableDemo/TableEditableDemo.tsx  | 8 +++++---
 3 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/packages/react-integration/demo-app-ts/src/components/demos/FormDemo/FormDemo.tsx b/packages/react-integration/demo-app-ts/src/components/demos/FormDemo/FormDemo.tsx
index 2a7326f4856..b77d1fcc994 100644
--- a/packages/react-integration/demo-app-ts/src/components/demos/FormDemo/FormDemo.tsx
+++ b/packages/react-integration/demo-app-ts/src/components/demos/FormDemo/FormDemo.tsx
@@ -75,7 +75,7 @@ export class FormDemo extends Component<FormProps, FormState> {
   }
 
   labelHelpRef: React.RefObject<HTMLSpanElement> = React.createRef();
-  textInputRef: React.useRef<HTMLInputElement> = React.createRef();
+  textInputRef: React.RefObject<HTMLInputElement> = React.createRef();
 
   handleTextInputChange = (_event: React.FormEvent<HTMLInputElement>, value: string) => {
     this.setState({ value, isValid: /^\d+$/.test(value) });
@@ -112,7 +112,7 @@ export class FormDemo extends Component<FormProps, FormState> {
     });
   };
 
-  onSelect = (_event: React.MouseEvent<Element, MouseEvent> | undefined, selection: string | number | undefined) => {
+  onSelect = (_ev: any, selection: string | number | undefined) => {
     const { selected } = this.state;
     if (selection) {
       if (selected.includes(selection.toString())) {
diff --git a/packages/react-integration/demo-app-ts/src/components/demos/PageDemo/PageDemo.tsx b/packages/react-integration/demo-app-ts/src/components/demos/PageDemo/PageDemo.tsx
index 78644e7da52..91e8d09867c 100644
--- a/packages/react-integration/demo-app-ts/src/components/demos/PageDemo/PageDemo.tsx
+++ b/packages/react-integration/demo-app-ts/src/components/demos/PageDemo/PageDemo.tsx
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import { Component } from 'react';
 import {
   Page,
   PageSidebar,
@@ -25,7 +25,7 @@ export class PageDemo extends Component {
     isKebabDropdownOpen: false
   };
 
-  onNavToggle = (_event: React.MouseEvent) => {
+  onNavToggle = () => {
     this.setState({
       isNavOpen: !this.state.isNavOpen
     });
diff --git a/packages/react-integration/demo-app-ts/src/components/demos/TableDemo/TableEditableDemo.tsx b/packages/react-integration/demo-app-ts/src/components/demos/TableDemo/TableEditableDemo.tsx
index 5db5067adb5..84ba30c288c 100644
--- a/packages/react-integration/demo-app-ts/src/components/demos/TableDemo/TableEditableDemo.tsx
+++ b/packages/react-integration/demo-app-ts/src/components/demos/TableDemo/TableEditableDemo.tsx
@@ -377,7 +377,7 @@ export class TableEditableDemo extends React.Component<TableProps, TableState> {
   };
 
   // set open state if component closes menu on click (e.g. when you click outside of the menu)
-  onOpenChange = (isOpen: boolean, rowIndex: string | number | undefined, cellIndex: string | number | undefined) => {
+  onOpenChange = (isOpen: boolean, rowIndex: number, cellIndex: number) => {
     const newRows = Array.from(this.state.rows);
     newRows[rowIndex as number].cells[cellIndex].props.isSelectOpen = isOpen;
     this.setState({
@@ -387,8 +387,10 @@ export class TableEditableDemo extends React.Component<TableProps, TableState> {
 
   onToggle = (rowIndex: string | number | undefined, cellIndex: string | number | undefined) => {
     const newRows = Array.from(this.state.rows);
-    newRows[rowIndex as number].cells[cellIndex].props.isSelectOpen =
-      !newRows[rowIndex as number].cells[cellIndex].props.isSelectOpen;
+    if (typeof rowIndex !== 'undefined' && typeof rowIndex !== 'undefined') {
+      newRows[rowIndex as number].cells[cellIndex as number].props.isSelectOpen =
+        !newRows[rowIndex as number].cells[cellIndex as number].props.isSelectOpen;
+    }
     this.setState({
       rows: newRows
     });