From 87b7151c023869abfbd6d35324c956f43998a51e Mon Sep 17 00:00:00 2001
From: Cee Chen <549407+cee-chen@users.noreply.github.com>
Date: Tue, 9 Jan 2024 10:57:32 -0800
Subject: [PATCH] [EuiTreeView] JSX Typescript error (#7452)

---
 changelogs/upcoming/7452.md            | 3 +++
 src/components/tree_view/tree_view.tsx | 8 ++++++--
 2 files changed, 9 insertions(+), 2 deletions(-)
 create mode 100644 changelogs/upcoming/7452.md

diff --git a/changelogs/upcoming/7452.md b/changelogs/upcoming/7452.md
new file mode 100644
index 00000000000..943edf8e223
--- /dev/null
+++ b/changelogs/upcoming/7452.md
@@ -0,0 +1,3 @@
+**Bug fixes**
+
+- Fixed an `EuiTreeView` JSX Typescript error
diff --git a/src/components/tree_view/tree_view.tsx b/src/components/tree_view/tree_view.tsx
index 772e121984d..d866bd7eb11 100644
--- a/src/components/tree_view/tree_view.tsx
+++ b/src/components/tree_view/tree_view.tsx
@@ -31,7 +31,7 @@ function hasAriaLabel(
 
 function getTreeId(
   propId: string | undefined,
-  contextId: string,
+  contextId: string = '',
   idGenerator: Function
 ) {
   return propId ?? (contextId === '' ? idGenerator() : contextId);
@@ -123,8 +123,12 @@ export class EuiTreeView extends Component<EuiTreeViewProps, EuiTreeViewState> {
 
   constructor(
     props: EuiTreeViewProps,
-    context: ContextType<typeof EuiTreeViewContext>
+    // Without the optional ? typing, TS will throw errors on JSX component errors
+    // @see https://github.com/facebook/react/issues/13944#issuecomment-1183693239
+    context?: ContextType<typeof EuiTreeViewContext>
   ) {
+    // TODO: context in constructor has been deprecated.
+    // We should likely convert this to a function component
     super(props, context);
 
     this.isNested = !!this.context;