mirror of
https://github.com/Azure/cosmos-explorer.git
synced 2026-06-13 16:07:26 +01:00
Fix typescript strict issues for Upload andnd CommandButtonComponent
This commit is contained in:
@@ -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">
|
||||||
|
|||||||
@@ -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/**/*",
|
||||||
|
|||||||
Reference in New Issue
Block a user