forked/topola-viewer
1
0
Fork 0
mirror of https://github.com/PeWu/topola-viewer.git synced 2026-05-27 07:36:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fixed referencing input field after semantic ui upgrade

Browse Source
This commit is contained in:
Przemek Wiech
2021-05-01 21:11:34 +02:00
parent 005a4387fe
commit 2a60896857
1 changed files with 11 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/menu/wikitree_menu.tsx
View File

@@ -6,7 +6,7 @@ import {FormattedMessage, injectIntl, WrappedComponentProps} from 'react-intl';
import {getLoggedInUserName} from '../datasource/wikitree'; import {getLoggedInUserName} from '../datasource/wikitree';
import {MenuItem, MenuType} from './menu_item'; import {MenuItem, MenuType} from './menu_item';
import {RouteComponentProps} from 'react-router-dom'; import {RouteComponentProps} from 'react-router-dom';
import {Header, Button, Modal, Input, Form} from 'semantic-ui-react'; import {Header, Button, Modal, Input, Form, Ref} from 'semantic-ui-react';
enum WikiTreeLoginState { enum WikiTreeLoginState {
UNKNOWN, UNKNOWN,
@@ -32,11 +32,11 @@ export class WikiTreeMenu extends React.Component<
dialogOpen: false, dialogOpen: false,
}; };
inputRef: React.RefObject<Input> = React.createRef(); inputRef: React.RefObject<HTMLElement> = React.createRef();
private openDialog() { private openDialog() {
this.setState(Object.assign({}, this.state, {dialogOpen: true}), () => this.setState(Object.assign({}, this.state, {dialogOpen: true}), () =>
this.inputRef.current!.focus(), (this.inputRef.current!.firstChild as HTMLInputElement).focus(),
); );
} }
@@ -83,11 +83,9 @@ export class WikiTreeMenu extends React.Component<
private enterId(event: React.MouseEvent, id: string) { private enterId(event: React.MouseEvent, id: string) {
event.preventDefault(); // Do not follow link in href. event.preventDefault(); // Do not follow link in href.
((this.inputRef.current as unknown) as { (this.inputRef.current!.firstChild as HTMLInputElement).value = id;
inputRef: HTMLInputElement;
}).inputRef.value = id;
this.handleIdChange(id); this.handleIdChange(id);
this.inputRef.current!.focus(); (this.inputRef.current!.firstChild as HTMLInputElement).focus();
} }
private wikiTreeIdModal() { private wikiTreeIdModal() {
@@ -145,11 +143,12 @@ export class WikiTreeMenu extends React.Component<
}} }}
/> />
</p> </p>
<Input <Ref innerRef={this.inputRef}>
fluid <Input
onChange={(e, data) => this.handleIdChange(data.value)} fluid
ref={this.inputRef} onChange={(e, data) => this.handleIdChange(data.value)}
/> />
</Ref>
</Form> </Form>
</Modal.Content> </Modal.Content>
<Modal.Actions> <Modal.Actions>