Fix typescript strict issues for Upload andnd CommandButtonComponent

This commit is contained in:
vaidankarswapnil
2021-08-31 17:06:03 +05:30
parent 39dd293fc1
commit 445068250f
3 changed files with 35 additions and 21 deletions
+9 -7
View File
@@ -23,7 +23,7 @@ export const Upload: FunctionComponent<UploadProps> = ({
}: UploadProps) => { }: UploadProps) => {
const [selectedFilesTitle, setSelectedFilesTitle] = useState<string[]>([]); const [selectedFilesTitle, setSelectedFilesTitle] = useState<string[]>([]);
const fileRef = useRef<HTMLInputElement>(); const fileRef = useRef<HTMLInputElement>() as React.MutableRefObject<HTMLInputElement>;
const onImportLinkKeyPress = (event: KeyboardEvent<HTMLAnchorElement>): void => { const onImportLinkKeyPress = (event: KeyboardEvent<HTMLAnchorElement>): void => {
if (event.keyCode === Constants.KeyCodes.Enter || event.keyCode === Constants.KeyCodes.Space) { if (event.keyCode === Constants.KeyCodes.Enter || event.keyCode === Constants.KeyCodes.Space) {
@@ -39,12 +39,14 @@ export const Upload: FunctionComponent<UploadProps> = ({
const { files } = event.target; const { files } = event.target;
const newFileList = []; const newFileList = [];
for (let i = 0; i < files.length; i++) { if (files) {
newFileList.push(files.item(i).name); for (let i = 0; i < files.length; i++) {
} newFileList.push(files[i].name);
if (newFileList) { }
setSelectedFilesTitle(newFileList); if (newFileList) {
props.onUpload(event); setSelectedFilesTitle(newFileList);
props.onUpload(event);
}
} }
}; };
const title = label + " to upload"; const title = label + " to upload";
@@ -114,8 +114,14 @@ export interface CommandButtonComponentProps {
} }
export class CommandButtonComponent extends React.Component<CommandButtonComponentProps> { export class CommandButtonComponent extends React.Component<CommandButtonComponentProps> {
private dropdownElt: HTMLElement; private dropdownElt: HTMLDivElement | undefined;
private expandButtonElt: HTMLElement; private expandButtonElt: HTMLDivElement | undefined;
constructor(props: CommandButtonComponentProps) {
super(props);
this.dropdownElt = undefined;
this.expandButtonElt = undefined;
}
public componentDidUpdate(): void { public componentDidUpdate(): void {
if (!this.dropdownElt || !this.expandButtonElt) { if (!this.dropdownElt || !this.expandButtonElt) {
@@ -135,15 +141,19 @@ export class CommandButtonComponent extends React.Component<CommandButtonCompone
private onLauncherKeyDown(event: React.KeyboardEvent<HTMLDivElement>): boolean { private onLauncherKeyDown(event: React.KeyboardEvent<HTMLDivElement>): boolean {
if (event.keyCode === KeyCodes.DownArrow) { if (event.keyCode === KeyCodes.DownArrow) {
$(this.dropdownElt).hide(); if (this.dropdownElt) {
$(this.dropdownElt).show().focus(); $(this.dropdownElt).hide();
event.stopPropagation(); $(this.dropdownElt).show().focus();
return false; event.stopPropagation();
return false;
}
} }
if (event.keyCode === KeyCodes.UpArrow) { if (event.keyCode === KeyCodes.UpArrow) {
$(this.dropdownElt).hide(); if (this.dropdownElt) {
event.stopPropagation(); $(this.dropdownElt).hide();
return false; event.stopPropagation();
return false;
}
} }
return true; return true;
} }
@@ -185,8 +195,8 @@ export class CommandButtonComponent extends React.Component<CommandButtonCompone
<div <div
className="commandExpand" className="commandExpand"
tabIndex={0} tabIndex={0}
ref={(ref: HTMLElement) => { ref={(instance: HTMLDivElement) => {
this.expandButtonElt = ref; this.expandButtonElt = instance;
}} }}
onKeyDown={(e: React.KeyboardEvent<HTMLDivElement>) => this.onLauncherKeyDown(e)} onKeyDown={(e: React.KeyboardEvent<HTMLDivElement>) => this.onLauncherKeyDown(e)}
> >
@@ -198,8 +208,8 @@ export class CommandButtonComponent extends React.Component<CommandButtonCompone
</div> </div>
<div <div
className="commandDropdownContainer" className="commandDropdownContainer"
ref={(ref: HTMLElement) => { ref={(instance: HTMLDivElement) => {
this.dropdownElt = ref; this.dropdownElt = instance;
}} }}
> >
<div className="commandDropdown"> <div className="commandDropdown">
+3 -1
View File
@@ -139,7 +139,9 @@
"./src/userContext.test.ts", "./src/userContext.test.ts",
"src/Common/EntityValue.tsx", "src/Common/EntityValue.tsx",
"./src/Platform/Hosted/Components/SwitchAccount.tsx", "./src/Platform/Hosted/Components/SwitchAccount.tsx",
"./src/Platform/Hosted/Components/SwitchSubscription.tsx" "./src/Platform/Hosted/Components/SwitchSubscription.tsx",
"./src/Common/Upload/Upload.tsx"
], ],
"include": [ "include": [
"src/CellOutputViewer/transforms/**/*", "src/CellOutputViewer/transforms/**/*",