This commit is contained in:
snoop 2017-07-26 15:22:40 +09:00
commit 45c9b0d5fd

View File

@ -44,8 +44,9 @@ const osNames = [
export class ProbeDown extends React.Component<any, any> { export class ProbeDown extends React.Component<any, any> {
constructor(props: Props, context: State) { constructor(props: Props, context: State) {
super(props, context); super(props, context);
this.state = {
this.state = { activeItem: osNames[0].name }; activeItem: '',
};
} }
public handleItemClick = (event: React.SyntheticEvent<HTMLAnchorElement>, data: MenuItemProps): void => { public handleItemClick = (event: React.SyntheticEvent<HTMLAnchorElement>, data: MenuItemProps): void => {
@ -54,6 +55,9 @@ export class ProbeDown extends React.Component<any, any> {
public ShowContent = (): JSX.Element => { public ShowContent = (): JSX.Element => {
let os = this.state.activeItem; let os = this.state.activeItem;
if(os === '') {
return <div>Instruction page.</div>;
}
switch (os) { switch (os) {
case 'Windows': { case 'Windows': {
return <Windows />; return <Windows />;
@ -74,15 +78,14 @@ export class ProbeDown extends React.Component<any, any> {
} }
public render(): JSX.Element { public render(): JSX.Element {
const { activeItem } = this.state.activeItem;
return ( return (
<Container fluid> <Container fluid>
<Grid> <Grid>
<Grid.Column width={4}> <Grid.Column width={4}>
<Menu fluid vertical icon='labeled'> <Menu fluid vertical icon='labeled' pointing>
{osNames.map((item: any, index: number) => { {osNames.map((item: any, index: number) => {
return ( return (
<Menu.Item key={index} name={item.name} active={activeItem === item.name} onClick={this.handleItemClick} > <Menu.Item key={index} name={item.name} active={this.state.activeItem === item.name} onClick={this.handleItemClick} >
<Icon name={item.icon} /> <Icon name={item.icon} />
{item.name} {item.name}
</Menu.Item> </Menu.Item>