From 9685e768fa9eb7a366a7b115c4712aa4b654da9d Mon Sep 17 00:00:00 2001
From: vaidankarswapnil <swapnil.v@zen3tech.com>
Date: Mon, 19 Jul 2021 11:17:17 +0530
Subject: [PATCH] Fixed DirectoryPickerPanel and NotificationConsoleComponent

---
 .../NotificationConsoleComponent.tsx              | 15 ++++++++-------
 .../Hosted/Components/DirectoryPickerPanel.tsx    |  8 ++++----
 tsconfig.strict.json                              |  4 +++-
 3 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx b/src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx
index c715159ca..d10dbff9d 100644
--- a/src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx
+++ b/src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx
@@ -27,7 +27,7 @@ export interface NotificationConsoleComponentProps {
 }
 
 interface NotificationConsoleComponentState {
-  headerStatus: string;
+  headerStatus: string | undefined;
   selectedFilter: string;
   allConsoleData: ConsoleData[];
 }
@@ -44,7 +44,7 @@ export class NotificationConsoleComponent extends React.Component<
     { key: "Error", text: "Error" },
   ];
   private headerTimeoutId?: number;
-  private prevHeaderStatus: string;
+  private prevHeaderStatus: string | undefined;
   private consoleHeaderElement?: HTMLElement;
 
   constructor(props: NotificationConsoleComponentProps) {
@@ -99,7 +99,7 @@ export class NotificationConsoleComponent extends React.Component<
         <div
           className="notificationConsoleHeader"
           id="notificationConsoleHeader"
-          ref={this.setElememntRef}
+          ref={this.setElememntRef as React.LegacyRef<HTMLDivElement>}
           onClick={() => this.expandCollapseConsole()}
           onKeyDown={(event: React.KeyboardEvent<HTMLDivElement>) => this.onExpandCollapseKeyPress(event)}
           tabIndex={0}
@@ -150,7 +150,7 @@ export class NotificationConsoleComponent extends React.Component<
                 role="combobox"
                 selectedKey={this.state.selectedFilter}
                 options={NotificationConsoleComponent.FilterOptions}
-                onChange={this.onFilterSelected.bind(this)}
+                onChange={() => this.onFilterSelected.bind(this)}
                 aria-labelledby="consoleFilterLabel"
                 aria-label={this.state.selectedFilter}
               />
@@ -210,12 +210,12 @@ export class NotificationConsoleComponent extends React.Component<
     ));
   }
 
-  private onFilterSelected = (event: React.ChangeEvent<HTMLSelectElement>, option: IDropdownOption): void => {
+  private onFilterSelected = (option: IDropdownOption): void => {
     this.setState({ selectedFilter: String(option.key) });
   };
 
   private getFilteredConsoleData(): ConsoleData[] {
-    let filterType: ConsoleDataType;
+    let filterType: ConsoleDataType | undefined;
 
     switch (this.state.selectedFilter) {
       case "In Progress":
@@ -308,7 +308,8 @@ const PrPreview = (props: { pr: string }) => {
 export const NotificationConsole: React.FC = () => {
   const setIsExpanded = useNotificationConsole((state) => state.setIsExpanded);
   const isExpanded = useNotificationConsole((state) => state.isExpanded);
-  const consoleData = useNotificationConsole((state) => state.consoleData);
+  //eslint-disable-next-line
+  const consoleData = useNotificationConsole((state) => state.consoleData!);
   const inProgressConsoleDataIdToBeDeleted = useNotificationConsole(
     (state) => state.inProgressConsoleDataIdToBeDeleted
   );
diff --git a/src/Platform/Hosted/Components/DirectoryPickerPanel.tsx b/src/Platform/Hosted/Components/DirectoryPickerPanel.tsx
index 451639914..164cfc6c9 100644
--- a/src/Platform/Hosted/Components/DirectoryPickerPanel.tsx
+++ b/src/Platform/Hosted/Components/DirectoryPickerPanel.tsx
@@ -1,4 +1,4 @@
-import { Panel, PanelType, ChoiceGroup } from "@fluentui/react";
+import { ChoiceGroup, Panel, PanelType } from "@fluentui/react";
 import * as React from "react";
 import { useDirectories } from "../../../hooks/useDirectories";
 
@@ -7,7 +7,7 @@ interface Props {
   dismissPanel: () => void;
   tenantId: string;
   armToken: string;
-  switchTenant: (tenantId: string) => void;
+  switchTenant: (tenantId: string | undefined) => void;
 }
 
 export const DirectoryPickerPanel: React.FunctionComponent<Props> = ({
@@ -29,8 +29,8 @@ export const DirectoryPickerPanel: React.FunctionComponent<Props> = ({
       <ChoiceGroup
         options={directories.map((dir) => ({ key: dir.tenantId, text: `${dir.displayName} (${dir.tenantId})` }))}
         selectedKey={tenantId}
-        onChange={(event, option) => {
-          switchTenant(option.key);
+        onChange={(_event, option) => {
+          switchTenant(option?.key);
           dismissPanel();
         }}
       />
diff --git a/tsconfig.strict.json b/tsconfig.strict.json
index a385c5b7d..d92cb1b89 100644
--- a/tsconfig.strict.json
+++ b/tsconfig.strict.json
@@ -134,7 +134,9 @@
     "./src/quickstart.ts",
     "./src/setupTests.ts",
     "./src/userContext.test.ts",
-    "src/Common/EntityValue.tsx"
+    "src/Common/EntityValue.tsx",
+    "./src/Platform/Hosted/Components/DirectoryPickerPanel.tsx",
+    "./src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx"
   ],
   "include": [
     "src/CellOutputViewer/transforms/**/*",