add test
This commit is contained in:
snoop
parent
895b113359
commit
5491e58898
@ -20,46 +20,36 @@ import { TargetList } from './containers/target/TargetList';
|
||||
import { TargetDetail } from './containers/target/TargetDetail';
|
||||
import { DiscoveryResult } from './containers/discovery/DiscoveryResult';
|
||||
|
||||
import { NewRes } from './containers/NewRes';
|
||||
|
||||
import {DropDownTest} from './containers/test/Sementic001';
|
||||
import {Page8} from './containers/test/Page8';
|
||||
import {SignIn} from './containers/test/Page9';
|
||||
import {PWChange} from './containers/test/Page11';
|
||||
import {ProbeDown} from './containers/test/Page17';
|
||||
|
||||
export class Routes extends React.Component<any, any> {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<h1>React Redux sample</h1>
|
||||
<li><Link to='/' >Home</Link></li>
|
||||
<li><Link to='/member/regist' >Member Regist</Link></li>
|
||||
<li><Link to='/member/login' >Member Login</Link></li>
|
||||
|
||||
<li><Link to='/member/result' >MemberRegistResult</Link></li>
|
||||
<li><Link to='/member/emailconfirm' >MemberEmailConfirm</Link></li>
|
||||
<li><Link to='/agent/waitauth' >WaitForAuth</Link></li>
|
||||
<li><Link to='/agent/waitauthDetail' >WaitForAuthDetail</Link></li>
|
||||
|
||||
<li><Link to='/config/sensorconfig' >SensorConfig</Link></li>
|
||||
<li><Link to='/prove/download' >ProveDownload</Link></li>
|
||||
<li><Link to='/agent/agents' >Agents</Link></li>
|
||||
<li><Link to='/agent/agentDetail' >AgentDetail</Link></li>
|
||||
<li><Link to='/target/targetList' >TargetList</Link></li>
|
||||
<li><Link to='/target/targetDetail' >TargetDetail</Link></li>
|
||||
<li><Link to='/discovery/DiscoveryResult' >DiscoveryResult</Link></li>
|
||||
<li><Link to='/test' >Test</Link></li>
|
||||
<li><Link to='/test2' >Test2</Link></li>
|
||||
<li><Link to='/test3' >SignIn</Link></li>
|
||||
<li><Link to='/test4' >PWChange</Link></li>
|
||||
<li><Link to='/test5' >ProbeDown</Link></li>
|
||||
|
||||
|
||||
|
||||
<Switch>
|
||||
<Route exact path='/' component={Main} />
|
||||
<Route exact path='/member/regist' component={MemberRegist} />
|
||||
<Route exact path='/member/login' component={MemberLogin} />
|
||||
<Route exact path='/member/result' component={MemberRegistResult} />
|
||||
<Route exact path='/member/emailconfirm' component={MemberEmailConfirm} />
|
||||
|
||||
<Route exact path='/agent/waitauth' component={WaitForAuth} />
|
||||
<Route exact path='/agent/waitauthDetail' component={WaitForAuthDetail} />
|
||||
<Route exact path='/config/sensorconfig' component={SensorConfig} />
|
||||
<Route exact path='/prove/download' component={ProveDownload} />
|
||||
<Route exact path='/agent/agents' component={Agents} />
|
||||
<Route exact path='/agent/agentDetail' component={AgentDetail} />
|
||||
|
||||
<Route exact path='/target/targetList' component={TargetList} />
|
||||
<Route exact path='/target/targetDetail' component={TargetDetail} />
|
||||
<Route exact path='/discovery/DiscoveryResult' component={DiscoveryResult} />
|
||||
<Route exact path='/test' component={DropDownTest} />
|
||||
<Route exact path='/test2' component={Page8} />
|
||||
<Route exact path='/test3' component={SignIn} />
|
||||
<Route exact path='/test4' component={PWChange} />
|
||||
<Route exact path='/test5' component={ProbeDown} />
|
||||
|
||||
|
||||
<Route component={NotFound} />
|
||||
</Switch>
|
||||
|
||||
@ -2,7 +2,7 @@ import * as React from 'react';
|
||||
import RaisedButton from 'material-ui/RaisedButton';
|
||||
import Dialog from 'material-ui/Dialog';
|
||||
import FlatButton from 'material-ui/FlatButton';
|
||||
|
||||
// import {client} from 'websocket'
|
||||
|
||||
const styles = {
|
||||
container: {
|
||||
@ -15,6 +15,45 @@ interface MainState {
|
||||
open: boolean;
|
||||
}
|
||||
|
||||
interface Person {
|
||||
name: string;
|
||||
age: number;
|
||||
}
|
||||
|
||||
let es = new WebSocket("ws://192.168.1.209:8000/echo");
|
||||
|
||||
es.onopen = function (event: any) {
|
||||
console.log("open websocket")
|
||||
let dat: any;
|
||||
dat = {
|
||||
"test": "fffff",
|
||||
"echo": "ehochoc",
|
||||
};
|
||||
|
||||
let mm :any;
|
||||
|
||||
mm = {
|
||||
"message" : dat
|
||||
};
|
||||
|
||||
es.send(JSON.stringify(mm));
|
||||
};
|
||||
|
||||
es.onmessage = function (event:any) {
|
||||
console.log(event.data);
|
||||
}
|
||||
|
||||
var hello = (person: Person) => {
|
||||
console.log(`안녕하세요! ${person.name} 입니다.`);
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
export class Main extends React.Component<any, any> {
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
@ -22,6 +61,13 @@ export class Main extends React.Component<any, any> {
|
||||
this.handleRequestClose = this.handleRequestClose.bind(this);
|
||||
this.handleTouchTap = this.handleTouchTap.bind(this);
|
||||
|
||||
const p: Person = {
|
||||
name: 'Mark',
|
||||
age: 35
|
||||
};
|
||||
|
||||
hello(p); // 안녕하세요! Mark 입니다.
|
||||
|
||||
this.state = {
|
||||
open: false,
|
||||
} as MainState;
|
||||
@ -49,23 +95,13 @@ export class Main extends React.Component<any, any> {
|
||||
) as any;
|
||||
|
||||
return (
|
||||
<div style={styles.container}>
|
||||
<Dialog
|
||||
open={this.state.open}
|
||||
title="Super Secret Password"
|
||||
actions={standardActions}
|
||||
onRequestClose={this.handleRequestClose}
|
||||
>
|
||||
1-2-3-4-5
|
||||
</Dialog>
|
||||
<h1>Material-UI</h1>
|
||||
<h2>example project</h2>
|
||||
<RaisedButton
|
||||
label="Super Secret Password"
|
||||
secondary={true}
|
||||
onTouchTap={this.handleTouchTap}
|
||||
/>
|
||||
</div>
|
||||
<div></div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
169
src/ts/containers/NewRes.tsx
Normal file
169
src/ts/containers/NewRes.tsx
Normal file
@ -0,0 +1,169 @@
|
||||
import * as React from 'react';
|
||||
import RaisedButton from 'material-ui/RaisedButton';
|
||||
import Popover, { PopoverAnimationVertical } from 'material-ui/Popover';
|
||||
import Menu from 'material-ui/Menu';
|
||||
import MenuItem from 'material-ui/MenuItem';
|
||||
|
||||
import {
|
||||
Table,
|
||||
TableBody,
|
||||
TableHeader,
|
||||
TableHeaderColumn,
|
||||
TableRow,
|
||||
TableRowColumn,
|
||||
} from 'material-ui/Table';
|
||||
|
||||
import Badge from 'material-ui/Badge';
|
||||
import IconButton from 'material-ui/IconButton';
|
||||
import NotificationsIcon from 'material-ui/svg-icons/social/notifications';
|
||||
import PersonIcon from 'material-ui/svg-icons/social/person';
|
||||
import SettingsIcon from 'material-ui/svg-icons/action/settings';
|
||||
|
||||
|
||||
|
||||
import FontIcon from 'material-ui/FontIcon';
|
||||
import ActionHome from 'material-ui/svg-icons/action/home';
|
||||
|
||||
|
||||
export class NewRes extends React.Component<any, any> {
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
|
||||
|
||||
|
||||
this.state = {
|
||||
open_monitor: false,
|
||||
open_infra: false,
|
||||
};
|
||||
}
|
||||
|
||||
handleTouchTap = (event: any, state: any) => {
|
||||
// This prevents ghost click.
|
||||
event.preventDefault();
|
||||
// console.log(event.target.outerText)
|
||||
state.anchorEl = event.currentTarget;
|
||||
this.setState(state);
|
||||
};
|
||||
|
||||
handleRequestClose = () => {
|
||||
this.setState({
|
||||
open: false,
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
render() {
|
||||
|
||||
|
||||
return (
|
||||
<div>
|
||||
|
||||
<RaisedButton
|
||||
label="Home"
|
||||
/>
|
||||
|
||||
<RaisedButton
|
||||
|
||||
onMouseEnter={(event: any) => {
|
||||
this.handleTouchTap(event, {
|
||||
open_infra: false,
|
||||
open_monitor: true,
|
||||
})
|
||||
}}
|
||||
|
||||
label="Monitoring"
|
||||
/>
|
||||
|
||||
<RaisedButton
|
||||
onMouseEnter={(event: any) => {
|
||||
this.handleTouchTap(event, {
|
||||
open_infra: true,
|
||||
open_monitor: false,
|
||||
})
|
||||
}}
|
||||
label="Infrastructure"
|
||||
/>
|
||||
|
||||
<RaisedButton
|
||||
label="Dashboard"
|
||||
/>
|
||||
|
||||
<RaisedButton
|
||||
label="Metric"
|
||||
/>
|
||||
|
||||
<RaisedButton
|
||||
label="Alert"
|
||||
/>
|
||||
|
||||
<RaisedButton
|
||||
label="History"
|
||||
/>
|
||||
|
||||
<Popover
|
||||
open={this.state.open_monitor}
|
||||
anchorEl={this.state.anchorEl}
|
||||
anchorOrigin={{ horizontal: 'left', vertical: 'bottom' }}
|
||||
targetOrigin={{ horizontal: 'left', vertical: 'top' }}
|
||||
onRequestClose={(event: any) => {
|
||||
this.setState({
|
||||
open_monitor: false,
|
||||
});
|
||||
}}
|
||||
animation={PopoverAnimationVertical}
|
||||
>
|
||||
<Menu>
|
||||
<MenuItem primaryText="Probe" />
|
||||
<MenuItem primaryText="Sensors" />
|
||||
</Menu>
|
||||
</Popover>
|
||||
|
||||
<Popover
|
||||
open={this.state.open_infra}
|
||||
anchorEl={this.state.anchorEl}
|
||||
anchorOrigin={{ horizontal: 'left', vertical: 'bottom' }}
|
||||
targetOrigin={{ horizontal: 'left', vertical: 'top' }}
|
||||
onRequestClose={(event: any) => {
|
||||
this.setState({ open_infra: false });
|
||||
}}
|
||||
animation={PopoverAnimationVertical}
|
||||
>
|
||||
<Menu>
|
||||
<MenuItem primaryText="Maps" />
|
||||
<MenuItem primaryText="Targets" />
|
||||
</Menu>
|
||||
</Popover>
|
||||
|
||||
<IconButton tooltip="settings">
|
||||
<SettingsIcon />
|
||||
</IconButton>
|
||||
|
||||
|
||||
|
||||
<Badge
|
||||
badgeContent={4}
|
||||
secondary={true}
|
||||
badgeStyle={{top: 12, right: 12}}
|
||||
>
|
||||
<IconButton tooltip="notification">
|
||||
<NotificationsIcon />
|
||||
</IconButton>
|
||||
|
||||
</Badge>
|
||||
|
||||
|
||||
<IconButton tooltip="avatar">
|
||||
<PersonIcon />
|
||||
</IconButton>
|
||||
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
48
src/ts/containers/test/Page11.tsx
Normal file
48
src/ts/containers/test/Page11.tsx
Normal file
@ -0,0 +1,48 @@
|
||||
import *as React from 'react'
|
||||
import {
|
||||
Icon, Label, Input,
|
||||
Select, Button
|
||||
} from 'semantic-ui-react'
|
||||
|
||||
|
||||
export interface State {
|
||||
|
||||
}
|
||||
export interface Props {
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
export class PWChange extends React.Component<any, any> {
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
render() {
|
||||
|
||||
|
||||
return (
|
||||
<div>
|
||||
|
||||
<Label> Password </Label>
|
||||
<Input placeholder='Password' type='password' />
|
||||
<br />
|
||||
<Label> Password Confirm </Label>
|
||||
<Input placeholder='Password Confirm' type='password' />
|
||||
<br />
|
||||
|
||||
|
||||
<Button> Submit </Button>
|
||||
<Button> Cancel </Button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
58
src/ts/containers/test/Page17.tsx
Normal file
58
src/ts/containers/test/Page17.tsx
Normal file
@ -0,0 +1,58 @@
|
||||
import *as React from 'react'
|
||||
import {
|
||||
Grid, Menu, Segment, MenuItemProps
|
||||
} from 'semantic-ui-react'
|
||||
|
||||
|
||||
export interface State {
|
||||
|
||||
}
|
||||
export interface Props {
|
||||
|
||||
}
|
||||
|
||||
const osNames = ["Windows","Debian","Ubuntu","Fedora"];
|
||||
|
||||
export class ProbeDown extends React.Component<any, any> {
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
|
||||
this.state = { activeItem: 'Windows' }
|
||||
|
||||
|
||||
}
|
||||
handleItemClick = (event: React.SyntheticEvent<HTMLAnchorElement>, data: MenuItemProps) => {
|
||||
this.setState({ activeItem: data.name })
|
||||
|
||||
console.log(data.name);
|
||||
}
|
||||
|
||||
render() {
|
||||
|
||||
const { activeItem } = this.state
|
||||
return (
|
||||
<div>
|
||||
<Grid>
|
||||
<Grid.Column width={4}>
|
||||
<Menu fluid vertical tabular>
|
||||
<Menu.Item name='Windows' active={activeItem === 'Windows'} onClick={this.handleItemClick} />
|
||||
<Menu.Item name='Debian' active={activeItem === 'Debian'} onClick={this.handleItemClick} />
|
||||
<Menu.Item name='Ubuntu' active={activeItem === 'Ubuntu'} onClick={this.handleItemClick} />
|
||||
<Menu.Item name='Fedora' active={activeItem === 'Fedora'} onClick={this.handleItemClick} />
|
||||
</Menu>
|
||||
</Grid.Column>
|
||||
|
||||
<Grid.Column stretched width={12}>
|
||||
<Segment>
|
||||
{this.state.activeItem} Download Page
|
||||
</Segment>
|
||||
</Grid.Column>
|
||||
</Grid>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
64
src/ts/containers/test/Page8.tsx
Normal file
64
src/ts/containers/test/Page8.tsx
Normal file
@ -0,0 +1,64 @@
|
||||
import *as React from 'react'
|
||||
import {
|
||||
Icon, Label, Input,
|
||||
Select, Button
|
||||
} from 'semantic-ui-react'
|
||||
|
||||
|
||||
export interface State {
|
||||
|
||||
}
|
||||
export interface Props {
|
||||
|
||||
}
|
||||
|
||||
const options = [{ key: 'southkorea', value: '82', text: 'South Korea(82)' },
|
||||
{ key: 'unitedstates', value: '1', text: 'United States(1)' }]
|
||||
|
||||
|
||||
export class Page8 extends React.Component<any, any> {
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
render() {
|
||||
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Label> Email </Label>
|
||||
<Input placeholder='Email' />
|
||||
<br/>
|
||||
<Label> User Name </Label>
|
||||
<Input placeholder='Name' />
|
||||
<br/>
|
||||
<Label> Password </Label>
|
||||
<Input placeholder='Password' type='password' />
|
||||
<br/>
|
||||
<Label> Password Confirm </Label>
|
||||
<Input placeholder='Password Confirm' type='password' />
|
||||
<br/>
|
||||
<Label> Company Name </Label>
|
||||
<Input placeholder='Company' />
|
||||
<br/>
|
||||
<Label> Phone </Label>
|
||||
<Select placeholder='Select your country' options={options} />
|
||||
<Input placeholder='Phone' />
|
||||
<br/>
|
||||
<Button>
|
||||
Sign Up
|
||||
</Button>
|
||||
<Button>
|
||||
Cancel
|
||||
</Button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
64
src/ts/containers/test/Page9.tsx
Normal file
64
src/ts/containers/test/Page9.tsx
Normal file
@ -0,0 +1,64 @@
|
||||
import *as React from 'react'
|
||||
import {
|
||||
Icon, Label, Input,
|
||||
Select, Button, Header, Modal
|
||||
} from 'semantic-ui-react'
|
||||
|
||||
|
||||
|
||||
|
||||
const options = [{ key: 'southkorea', value: '82', text: 'South Korea(82)' },
|
||||
{ key: 'unitedstates', value: '1', text: 'United States(1)' }]
|
||||
|
||||
|
||||
export class SignIn extends React.Component<any, any> {
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
|
||||
this.state = {
|
||||
forgotPopup: false,
|
||||
};
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
render() {
|
||||
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Label> Email </Label>
|
||||
<Input placeholder='Email' />
|
||||
<br />
|
||||
|
||||
<Label> Password </Label>
|
||||
<Input placeholder='Password' type='password' />
|
||||
<br />
|
||||
<Modal trigger={<Button>Forgot Password</Button>}>
|
||||
<Modal.Header>Change your password Enter email address.</Modal.Header>
|
||||
<Modal.Content >
|
||||
<Label> Email </Label>
|
||||
<Input placeholder='Email' />
|
||||
|
||||
</Modal.Content>
|
||||
<Modal.Actions>
|
||||
<Button basic color='blue' > Submit </Button>
|
||||
<Button > Cancel </Button>
|
||||
</Modal.Actions>
|
||||
</Modal>
|
||||
<br />
|
||||
|
||||
<Button> Sign In </Button>
|
||||
<Button> Sign Up </Button>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
145
src/ts/containers/test/Sementic001.tsx
Normal file
145
src/ts/containers/test/Sementic001.tsx
Normal file
@ -0,0 +1,145 @@
|
||||
import *as React from 'react'
|
||||
import {
|
||||
Dropdown, Icon, Menu, Label,
|
||||
|
||||
Sidebar, Segment, Button, Image, Header,
|
||||
} from 'semantic-ui-react'
|
||||
|
||||
|
||||
|
||||
const options = [
|
||||
{ key: 'angular', text: 'Angular', value: 'angular' },
|
||||
{ key: 'css', text: 'CSS', value: 'css' },
|
||||
{ key: 'design', text: 'Graphic Design', value: 'design' },
|
||||
{ key: 'ember', text: 'Ember', value: 'ember' },
|
||||
{ key: 'html', text: 'HTML', value: 'html' },
|
||||
{ key: 'ia', text: 'Information Architecture', value: 'ia' },
|
||||
{ key: 'javascript', text: 'Javascript', value: 'javascript' },
|
||||
{ key: 'mech', text: 'Mechanical Engineering', value: 'mech' },
|
||||
{ key: 'meteor', text: 'Meteor', value: 'meteor' },
|
||||
{ key: 'node', text: 'NodeJS', value: 'node' },
|
||||
{ key: 'plumbing', text: 'Plumbing', value: 'plumbing' },
|
||||
{ key: 'python', text: 'Python', value: 'python' },
|
||||
{ key: 'rails', text: 'Rails', value: 'rails' },
|
||||
{ key: 'react', text: 'React', value: 'react' },
|
||||
{ key: 'repair', text: 'Kitchen Repair', value: 'repair' },
|
||||
{ key: 'ruby', text: 'Ruby', value: 'ruby' },
|
||||
{ key: 'ui', text: 'UI Design', value: 'ui' },
|
||||
{ key: 'ux', text: 'User Experience', value: 'ux' },
|
||||
]
|
||||
|
||||
|
||||
export class DropDownTest extends React.Component<any, any> {
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
|
||||
this.state = {
|
||||
notification_visible: false,
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
|
||||
render() {
|
||||
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Menu>
|
||||
<Menu.Item> Home </Menu.Item>
|
||||
<Dropdown text='Monitoring' pointing className='link item'>
|
||||
<Dropdown.Menu>
|
||||
<Dropdown.Header>Monitoring</Dropdown.Header>
|
||||
<Dropdown.Item>
|
||||
<Icon name='dropdown' />
|
||||
<span className='text'>Probe</span>
|
||||
<Dropdown.Menu>
|
||||
<Dropdown.Header>Mens</Dropdown.Header>
|
||||
<Dropdown.Item>Shirts</Dropdown.Item>
|
||||
<Dropdown.Item>Pants</Dropdown.Item>
|
||||
<Dropdown.Item>Jeans</Dropdown.Item>
|
||||
<Dropdown.Item>Shoes</Dropdown.Item>
|
||||
<Dropdown.Divider />
|
||||
<Dropdown.Header>Womens</Dropdown.Header>
|
||||
<Dropdown.Item>Dresses</Dropdown.Item>
|
||||
<Dropdown.Item>Shoes</Dropdown.Item>
|
||||
<Dropdown.Item>Bags</Dropdown.Item>
|
||||
</Dropdown.Menu>
|
||||
</Dropdown.Item>
|
||||
<Dropdown.Item>Sensors</Dropdown.Item>
|
||||
|
||||
</Dropdown.Menu>
|
||||
</Dropdown>
|
||||
<Menu.Item> Infrastructure </Menu.Item>
|
||||
<Menu.Item> Dashboard </Menu.Item>
|
||||
<Menu.Item> Metrics </Menu.Item>
|
||||
<Menu.Item> Alert </Menu.Item>
|
||||
<Menu.Item> History </Menu.Item>
|
||||
|
||||
<Menu.Item position='right'>
|
||||
<Icon name='setting' />
|
||||
</Menu.Item>
|
||||
<Menu.Item onClick={() => {
|
||||
this.setState({ notification_visible: !this.state.notification_visible })
|
||||
}}>
|
||||
<Icon name='alarm' />
|
||||
<Label color='red' floating>22</Label>
|
||||
</Menu.Item>
|
||||
<Menu.Item>
|
||||
<Dropdown icon='user' className='ui pointing dropdown top right'>
|
||||
<Dropdown.Menu >
|
||||
<Dropdown.Item text='Log out' />
|
||||
<Dropdown.Divider />
|
||||
<Dropdown.Item text='Settings' />
|
||||
<Dropdown.Item text='- Profile' />
|
||||
<Dropdown.Item text='- Preferences' />
|
||||
<Dropdown.Item text='- Change Password' />
|
||||
<Dropdown.Divider />
|
||||
<Dropdown.Item text='Help' />
|
||||
</Dropdown.Menu>
|
||||
</Dropdown>
|
||||
</Menu.Item>
|
||||
|
||||
|
||||
</Menu>
|
||||
|
||||
|
||||
<Sidebar.Pushable as={Segment} >
|
||||
<Sidebar
|
||||
as={Menu}
|
||||
animation='overlay'
|
||||
width='thin'
|
||||
direction='right'
|
||||
visible={this.state.notification_visible}
|
||||
icon='labeled'
|
||||
vertical
|
||||
inverted
|
||||
|
||||
>
|
||||
<Menu.Item name='home'>
|
||||
<Icon name='home' />
|
||||
Home
|
||||
</Menu.Item>
|
||||
<Menu.Item name='gamepad'>
|
||||
<Icon name='gamepad' />
|
||||
Games
|
||||
</Menu.Item>
|
||||
<Menu.Item name='camera'>
|
||||
<Icon name='camera' />
|
||||
Channels
|
||||
</Menu.Item>
|
||||
</Sidebar>
|
||||
<Sidebar.Pusher >
|
||||
<Segment basic >
|
||||
|
||||
</Segment>
|
||||
</Sidebar.Pusher>
|
||||
</Sidebar.Pushable>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user