This commit is contained in:
crusader 2017-07-21 14:57:12 +09:00
parent 7fa9c30e6d
commit 64178717b4
12 changed files with 178 additions and 45 deletions

View File

@ -30,6 +30,7 @@
"@types/react-redux": "^4.4.46",
"@types/react-router": "^4.0.14",
"@types/react-router-dom": "^4.0.7",
"@types/react-router-redux": "^5.0.3",
"@types/react-tap-event-plugin": "^0.0.30",
"@types/redux": "^3.6.0",
"awesome-typescript-loader": "^3.1.3",

View File

@ -21,14 +21,14 @@ import appConfig, { Config } from './config';
import sagas from './redux/saga';
// import routes from './router';
import {Layout} from './views/layout/Layout';
import App from './views/App';
injectTapEventPlugin();
const rpcURL = 'ws://127.0.0.1:18081/rpc';
class App {
class Application {
private config: Config;
private container: HTMLElement;
private context: AppContext;
@ -41,6 +41,7 @@ class App {
this.config = appConfig;
this.sagaMiddleware = sagaMiddleware;
this.store = store;
this.history = history;
}
public async start(): Promise<void> {
@ -56,6 +57,7 @@ class App {
this.displayApp();
} catch (e) {
console.error(e);
this.displayError(e);
}
}
@ -129,13 +131,13 @@ class App {
private displayApp(): void {
ReactDOM.render(
<div><Layout /></div>,
<App store={this.store} history={this.history} />,
this.container,
);
}
}
let app = new App();
app.start();
let application = new Application();
application.start();

View File

@ -1,8 +1,8 @@
import { applyMiddleware, compose, createStore, Store } from 'redux';
import { routerMiddleware } from 'react-router-redux';
import createSagaMiddleware, { SagaMiddleware } from 'redux-saga';
import { History } from 'history';
import { createHashHistory } from 'history';
import { createHashHistory, History } from 'history';
import reducer from './reducer';
import State from './state';

View File

@ -0,0 +1,38 @@
import * as React from 'react';
import { History } from 'history';
import { Provider, Store } from 'react-redux';
import { Route, Switch } from 'react-router-dom';
import { ConnectedRouter } from 'react-router-redux';
import AccountLayout from './layout/AccountLayout';
import AppLayout from './layout/AppLayout';
export interface Props {
store: Store<any>;
history: History;
}
export interface State {
}
class App extends React.Component<Props, State> {
constructor(props: Props, context: State) {
super(props, context);
}
public render(): JSX.Element {
return (
<Provider store={this.props.store}>
<ConnectedRouter history={this.props.history}>
<Switch>
<Route path='/account' component={AccountLayout}/>
<Route path='/' component={AppLayout}/>
</Switch>
</ConnectedRouter>
</Provider>
);
}
}
export default App;

View File

@ -0,0 +1,35 @@
import * as React from 'react';
import { RouteComponentProps, RouteProps, Route } from 'react-router-dom';
import SignIn from '../member/SignIn';
import SignUp from '../member/SignUp';
import EmailConfirm from '../member/EmailConfirm';
import ForgotPassword from '../member/ForgotPassword';
export interface Props extends RouteComponentProps<any> {
}
export interface State {
}
class AccountLayout extends React.Component<Props, State> {
public constructor(props?: Props, context?: State) {
super(props, context);
}
public render(): JSX.Element {
return (
<div>
<Route path={`${this.props.match.url}/signin`} component={SignIn}/>
<Route path={`${this.props.match.url}/signup`} component={SignUp}/>
<Route path={`${this.props.match.url}/check_email`} component={EmailConfirm}/>
<Route path={`${this.props.match.url}/forgot_password`} component={ForgotPassword}/>
</div>
);
}
}
export default AccountLayout;

View File

@ -0,0 +1,47 @@
import * as React from 'react';
import { RouteComponentProps, RouteProps, Route } from 'react-router-dom';
import { Container, Menu, Sidebar, Segment, Icon, Breadcrumb, Grid, Dropdown } from 'semantic-ui-react';
import { Header } from './Header';
import { Footer } from './Footer';
import { LeftMenu } from './LeftMenu';
import Home from '../Home';
export interface Props extends RouteComponentProps<any> {
}
export interface State {
sidebar_visible: boolean;
notification_visible: boolean;
}
export class AppLayout extends React.Component<Props, State> {
constructor(props: Props, context: State) {
super(props, context);
this.state = {
sidebar_visible: true,
notification_visible: false,
};
}
public onSidebar = () => {
this.setState({ notification_visible: !this.state.notification_visible, sidebar_visible: !this.state.sidebar_visible });
}
public render(): JSX.Element {
return (
<Container fluid>
<LeftMenu />
<Segment vertical style={{ margin: '0 0 0 210px', padding: '0' }}>
<Header />
<Route path={`${this.props.match.url}`} component={Home}/>
<Footer />
</Segment>
</Container >
);
}
}
export default AppLayout;

View File

@ -0,0 +1,24 @@
import * as React from 'react';
import { RouteComponentProps } from 'react-router';
import PWChangeContainer from '@overflow/member/react/PWChange';
export interface Props {
}
export interface State {
}
class EmailConfirm extends React.Component<RouteComponentProps<Props>, State> {
public constructor(props?: RouteComponentProps<Props>, context?: State) {
super(props, context);
}
public render(): JSX.Element {
return (
<PWChangeContainer/>
);
}
}
export default EmailConfirm;

View File

@ -1,18 +1,16 @@
import * as React from 'react';
import { RouteComponentProps } from 'react-router';
import PWChangeContainer from '@overflow/member/react/PWChange';
import WebSocketRPC from '@overflow/commons/websocket/WebSocketRPC';
import AppContext from '@overflow/commons/context';
import inject from '@overflow/commons/context/decorator/inject';
class PWChange extends React.Component<RouteComponentProps<object>, object> {
@inject()
private client: WebSocketRPC;
export interface Props {
}
export interface State {
}
public constructor(props?: RouteComponentProps<object>, context?: object) {
class ForgotPassword extends React.Component<RouteComponentProps<Props>, State> {
public constructor(props?: RouteComponentProps<Props>, context?: State) {
super(props, context);
let con = AppContext.get<WebSocketRPC>();
}
public render(): JSX.Element {
@ -20,11 +18,7 @@ class PWChange extends React.Component<RouteComponentProps<object>, object> {
<PWChangeContainer/>
);
}
private test(@inject() c: WebSocketRPC): void {
console.log('');
}
}
export default PWChange;
export default ForgotPassword;

View File

@ -1,18 +1,17 @@
import * as React from 'react';
import { RouteComponentProps } from 'react-router';
import SignInContainer from '@overflow/member/react/SignIn';
import WebSocketRPC from '@overflow/commons/websocket/WebSocketRPC';
import AppContext from '@overflow/commons/context';
import inject from '@overflow/commons/context/decorator/inject';
class Signin extends React.Component<RouteComponentProps<object>, object> {
@inject()
private client: WebSocketRPC;
export interface Props {
}
export interface State {
}
public constructor(props?: RouteComponentProps<object>, context?: object) {
class Signin extends React.Component<RouteComponentProps<Props>, object> {
public constructor(props?: RouteComponentProps<Props>, context?: State) {
super(props, context);
let con = AppContext.get<WebSocketRPC>();
}
public render(): JSX.Element {
@ -21,9 +20,6 @@ class Signin extends React.Component<RouteComponentProps<object>, object> {
);
}
private test(@inject() c: WebSocketRPC): void {
console.log('');
}
}

View File

@ -1,18 +1,18 @@
import * as React from 'react';
import { RouteComponentProps } from 'react-router';
import SignUpContainer from '@overflow/member/react/SignUp';
import WebSocketRPC from '@overflow/commons/websocket/WebSocketRPC';
import AppContext from '@overflow/commons/context';
import inject from '@overflow/commons/context/decorator/inject';
class SignIUp extends React.Component<RouteComponentProps<object>, object> {
@inject()
private client: WebSocketRPC;
export interface Props {
}
export interface State {
}
public constructor(props?: RouteComponentProps<object>, context?: object) {
class SignIUp extends React.Component<RouteComponentProps<Props>, State> {
public constructor(props?: RouteComponentProps<Props>, context?: State) {
super(props, context);
let con = AppContext.get<WebSocketRPC>();
}
public render(): JSX.Element {
@ -21,9 +21,6 @@ class SignIUp extends React.Component<RouteComponentProps<object>, object> {
);
}
private test(@inject() c: WebSocketRPC): void {
console.log('');
}
}

View File

@ -25,8 +25,7 @@
"reflect-metadata"
],
"typeRoots": [
"node_modules/@types",
"types"
"node_modules/@types"
]
},