This commit is contained in:
Tommy Parnell
2017-12-31 15:19:21 -05:00
parent a6085f3c28
commit c7416883ec
27 changed files with 517 additions and 462 deletions

View File

@@ -6,7 +6,8 @@
"scripts": { "scripts": {
"test": "echo \"Error: no test specified\" && exit 1", "test": "echo \"Error: no test specified\" && exit 1",
"serve": "webpack-dev-server --output-public-path=dist --history-api-fallback", "serve": "webpack-dev-server --output-public-path=dist --history-api-fallback",
"build": "webpack --optimize-minimize" "build": "npm run lint && webpack --optimize-minimize",
"lint": "tslint --project ./tslint.json src/**/*.ts src/**/*.tsx"
}, },
"author": "", "author": "",
"license": "ISC", "license": "ISC",
@@ -39,6 +40,7 @@
"css-loader": "^0.28.7", "css-loader": "^0.28.7",
"source-map-loader": "^0.2.3", "source-map-loader": "^0.2.3",
"style-loader": "^0.19.1", "style-loader": "^0.19.1",
"tslint": "^5.8.0",
"typescript": "^2.6.2", "typescript": "^2.6.2",
"webpack": "^3.10.0", "webpack": "^3.10.0",
"webpack-dev-server": "^2.9.7" "webpack-dev-server": "^2.9.7"

View File

@@ -1,19 +1,17 @@
import { LoginState } from '../models/LoginState'; import { LoginState } from "../models/LoginState";
import {LOGGED_IN, LOGGED_OUT} from './types' import { MinAction } from "../models/MinAction";
import { MinAction } from '../models/MinAction'; import {LOGGED_IN, LOGGED_OUT} from "./types";
export function login(loginState: LoginState) : MinAction<LoginState>{ export function login(loginState: LoginState): MinAction<LoginState> {
return { return {
type: LOGGED_IN, type: LOGGED_IN,
payload: loginState payload: loginState,
} };
} }
export function logout(): MinAction<LoginState> {
export function logout() : MinAction<LoginState> {
return { return {
type: LOGGED_OUT, type: LOGGED_OUT,
payload: {isLoggedIn: false, displayName: '', uid: ''} payload: {isLoggedIn: false, displayName: "", uid: ""},
} };
} }

View File

@@ -1,2 +1,2 @@
export const LOGGED_IN = "LOGGED_IN" export const LOGGED_IN = "LOGGED_IN";
export const LOGGED_OUT = "LOGGED_OUT" export const LOGGED_OUT = "LOGGED_OUT";

View File

@@ -1,8 +1,8 @@
import * as React from "react"; import * as React from "react";
export class Conditional extends React.Component<{render:boolean}, any>{ export class Conditional extends React.Component<{render: boolean}, any> {
render(){ public render() {
let toRender = this.props.render? this.props.children : null; const toRender = this.props.render ? this.props.children : null;
return <span>{toRender}</span> return <span>{toRender}</span>;
} }
} }

View File

@@ -1,21 +1,21 @@
import { LoginState } from '../models/LoginState'; import * as React from "react";
import { AppState } from '../models/AppState'; import { Col } from "reactstrap";
import * as React from 'react'; import * as _ from "underscore";
import * as _ from 'underscore'; import { AppState } from "../models/AppState";
import fbData from '../startup/firebase' import {Document} from "../models/Document";
import {Document} from '../models/Document' import { LoginState } from "../models/LoginState";
import { Col } from 'reactstrap'; import fbData from "../startup/firebase";
interface EditProps {documentBody: string, onChange?: (doc:string)=>void} interface EditProps {documentBody: string; onChange?: (doc: string) => void; }
export class Editor extends React.Component<EditProps, {}>{ export class Editor extends React.Component<EditProps, {}> {
updateDocument(docBody: string){ public updateDocument(docBody: string) {
if(this.props.onChange) this.props.onChange(docBody); if (this.props.onChange) { this.props.onChange(docBody); }
} }
render(){ public render() {
return( return(
<Col sm="12"> <Col sm="12">
<textarea className="form-control" style={{height: "70vh"}} value={this.props.documentBody || ""} onChange={(event)=>this.updateDocument(event.target.value)}></textarea> <textarea className="form-control" style={{height: "70vh"}} value={this.props.documentBody || ""} onChange={(event) => this.updateDocument(event.target.value)}></textarea>
</Col> </Col>
); );
} }

View File

@@ -1,7 +1,7 @@
import * as React from "react"; import * as React from "react";
export class ForOhFour extends React.Component<any, any>{ export class ForOhFour extends React.Component<any, any> {
render(){ public render() {
return <h4>404! oh noes</h4>; return <h4>404! oh noes</h4>;
} }
} }

View File

@@ -1,9 +1,9 @@
import { LoginState } from '../models/LoginState'; import * as React from "react";
import * as React from 'react'; import { LoginState } from "../models/LoginState";
export class Home extends React.Component<any,any>{ export class Home extends React.Component<any, any> {
render(){ public render() {
return <h4> Hi, welcome to minbin a simple pastebin. Please login to get started!</h4> return <h4> Hi, welcome to minbin a simple pastebin. Please login to get started!</h4>;
} }
} }

View File

@@ -1,15 +1,15 @@
import { Viewer } from './Viewer'; import * as React from "react";
import { getLanguage } from '../util/doc';
import * as React from 'react';
import {Document} from "../models/Document"
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
export class ListItem extends React.PureComponent<{doc: Document, uid: string, docId: string}>{ import {Document} from "../models/Document";
render(){ import { getLanguage } from "../util/doc";
import { Viewer } from "./Viewer";
export class ListItem extends React.PureComponent<{doc: Document, uid: string, docId: string}> {
public render() {
return <div key={`li_div_${this.props.docId}`}> return <div key={`li_div_${this.props.docId}`}>
<h4> <h4>
<Link to={`/d/${this.props.uid}/${this.props.docId}/edit`}>{this.props.doc.Title || 'Untitled'}</Link> <Link to={`/d/${this.props.uid}/${this.props.docId}/edit`}>{this.props.doc.Title || "Untitled"}</Link>
</h4> </h4>
<Viewer doc={this.props.doc.Body} language={getLanguage(this.props.doc.Title)} maxHeight={"200px"} /> <Viewer doc={this.props.doc.Body} language={getLanguage(this.props.doc.Title)} maxHeight={"200px"} />
</div> </div>;
} }
} }

View File

@@ -1,10 +1,10 @@
import * as React from 'react' import * as firebase from "firebase";
import { Button } from 'reactstrap'; import * as React from "react";
import * as firebase from 'firebase' import { Button } from "reactstrap";
export interface LoginButtonProps { onClick: React.MouseEventHandler<any> } export interface LoginButtonProps { onClick: React.MouseEventHandler<any>; }
export class LoginButton extends React.Component<LoginButtonProps, {}>{ export class LoginButton extends React.Component<LoginButtonProps, {}> {
render(){ public render() {
return <Button href="#" onClick={this.props.onClick} color="primary" outline>Login</Button> return <Button href="#" onClick={this.props.onClick} color="primary" outline>Login</Button>;
} }
} }

View File

@@ -1,8 +1,8 @@
import { LoginState } from '../models/LoginState'; import * as React from "react";
import * as React from 'react'; import { Link } from "react-router-dom";
import { TabContent, TabPane, Nav, NavItem, NavLink, Card, Button, CardTitle, CardText, Row, Col, NavbarBrand, Navbar } from 'reactstrap'; import { Button, Card, CardText, CardTitle, Col, Nav, Navbar, NavbarBrand, NavItem, NavLink, Row, TabContent, TabPane } from "reactstrap";
import { LoginContainer } from '../containers/Login'; import { LoginContainer } from "../containers/Login";
import { Link } from 'react-router-dom'; import { LoginState } from "../models/LoginState";
export class NavBar extends React.Component<{loginState: LoginState}, any> { export class NavBar extends React.Component<{loginState: LoginState}, any> {
constructor(props: any) { constructor(props: any) {
@@ -10,8 +10,8 @@ export class NavBar extends React.Component<{loginState: LoginState}, any> {
} }
render() { public render() {
let newButton = this.props.loginState.isLoggedIn ? ( const newButton = this.props.loginState.isLoggedIn ? (
<NavItem> <NavItem>
<Link to="/d/new" className="btn btn-sm btn-outline-success" >+ New</Link> <Link to="/d/new" className="btn btn-sm btn-outline-success" >+ New</Link>
</NavItem> </NavItem>

View File

@@ -1,20 +1,20 @@
/// <reference path="../react-syntax-highlighter.d.ts" /> /// <reference path="../react-syntax-highlighter.d.ts" />
import * as React from "react"; import * as React from "react";
import { Row, Col, Card, CardText } from "reactstrap"; import SyntaxHighlighter from "react-syntax-highlighter";
import SyntaxHighlighter from 'react-syntax-highlighter';
import googlecode from "react-syntax-highlighter/styles/hljs/googlecode"; import googlecode from "react-syntax-highlighter/styles/hljs/googlecode";
import { Card, CardText, Col, Row } from "reactstrap";
export interface ViewerProps {doc?: string, language?: string, maxHeight?: string} export interface ViewerProps {doc?: string; language?: string; maxHeight?: string; }
export class Viewer extends React.Component<ViewerProps, any>{ export class Viewer extends React.Component<ViewerProps, any> {
render(){ public render() {
let style : React.CSSProperties = { paddingTop: "10px" }; const style: React.CSSProperties = { paddingTop: "10px" };
if(this.props.maxHeight){ if (this.props.maxHeight) {
style.maxHeight = this.props.maxHeight style.maxHeight = this.props.maxHeight;
} }
return( return(
<Card style={style}> <Card style={style}>
<SyntaxHighlighter showLineNumbers={true} language={this.props.language || null} style={googlecode} >{this.props.doc || ''}</SyntaxHighlighter> <SyntaxHighlighter showLineNumbers={true} language={this.props.language || null} style={googlecode} >{this.props.doc || ""}</SyntaxHighlighter>
</Card> </Card>
); );
} }

View File

@@ -1,51 +1,49 @@
import { HomeContainer } from './HomeContainer'; import * as React from "react";
import { LoginState } from '../models/LoginState'; import { connect } from "react-redux";
import { Edit } from './Edit'; import { Redirect, Route, RouteComponentProps, RouteProps, RouterChildContext, Switch } from "react-router";
import { LoginContainer } from './Login'; import { BrowserRouter } from "react-router-dom";
import { NavBar } from '../components/NavBar'; import * as redux from "redux";
import * as React from 'react'; import {Store} from "redux";
import * as redux from 'redux'; import { ForOhFour } from "../components/ForOhFour";
import {Store} from "redux" import { NavBar } from "../components/NavBar";
import { connect } from 'react-redux'; import { AppState } from "../models/AppState";
import { AppState } from '../models/AppState'; import { LoginState } from "../models/LoginState";
import { Route, RouteProps, RouterChildContext, RouteComponentProps, Redirect, Switch } from 'react-router'; import {generateDocId} from "../util/doc";
import { ForOhFour } from '../components/ForOhFour' import { Edit } from "./Edit";
import {generateDocId} from '../util/doc' import { HomeContainer } from "./HomeContainer";
import { BrowserRouter } from 'react-router-dom'; import { LoginContainer } from "./Login";
const mapStateToProps = (state : AppState) : AppState => const mapStateToProps = (state: AppState): AppState => {
{
return state; return state;
}; };
class appContainer extends React.Component<AppState, any>{ class appContainer extends React.Component<AppState, any> {
render(){ public render() {
return <BrowserRouter><div className="app container-fluid"> return <BrowserRouter><div className="app container-fluid">
<NavBar loginState={this.props.login} /> <NavBar loginState={this.props.login} />
<Switch> <Switch>
<Route path="/d/new" render={()=>{ <Route path="/d/new" render={() => {
return <Redirect to={`/d/${this.props.login.uid}/${generateDocId()}`} /> return <Redirect to={`/d/${this.props.login.uid}/${generateDocId()}`} />;
}} /> }} />
<Route path="/d/:uid/:docId/:edit" render={(routeProps: RouteComponentProps<{docId?: string, uid?: string, login: LoginState, edit: string}>)=>{ <Route path="/d/:uid/:docId/:edit" render={(routeProps: RouteComponentProps<{docId?: string, uid?: string, login: LoginState, edit: string}>) => {
let showEdit; let showEdit;
if(routeProps.match.params.edit === "edit"){ if (routeProps.match.params.edit === "edit") {
showEdit = true; showEdit = true;
} } else {
else{
showEdit = false; showEdit = false;
} }
return <Edit login={this.props.login} uid={routeProps.match.params.uid} docId={routeProps.match.params.docId} showEdit={showEdit} /> return <Edit login={this.props.login} uid={routeProps.match.params.uid} docId={routeProps.match.params.docId} showEdit={showEdit} />;
}} /> }} />
<Route path="/d/:uid/:docId" render={(routeProps: RouteComponentProps<{docId?: string, uid?: string, login: LoginState}>)=>{ <Route path="/d/:uid/:docId" render={(routeProps: RouteComponentProps<{docId?: string, uid?: string, login: LoginState}>) => {
return <Redirect to={`/d/${routeProps.match.params.uid}/${routeProps.match.params.docId}/view`} /> return <Redirect to={`/d/${routeProps.match.params.uid}/${routeProps.match.params.docId}/view`} />;
}} /> }} />
<Route path="/" strict={true}> <Route path="/" strict={true}>
<HomeContainer login={this.props.login} /> <HomeContainer login={this.props.login} />
</Route> </Route>
<Route component={ForOhFour} /> <Route component={ForOhFour} />
</Switch> </Switch>
</div></BrowserRouter> </div></BrowserRouter>;
} }
} }
export const AppContainer = connect(mapStateToProps)(appContainer) export const AppContainer = connect(mapStateToProps)(appContainer);

View File

@@ -1,56 +1,57 @@
import { generateDocId, getLanguage } from '../util/doc'; import { ChangeEventHandler } from "react";
import { LoginState } from '../models/LoginState'; import * as React from "react";
import { Editor } from '../components/Editor'; import { Link } from "react-router-dom";
import { Viewer } from '../components/Viewer'; import { Button, Card, CardText, CardTitle, Col, FormText, Input, Nav, NavbarBrand, NavItem, NavLink, Row, TabContent, TabPane } from "reactstrap";
import * as React from 'react'; import { Conditional } from "../components/Conditional";
import fbData from '../startup/firebase' import { Editor } from "../components/Editor";
import {Document} from '../models/Document' import { Viewer } from "../components/Viewer";
import { TabContent, TabPane, Nav, NavItem, NavLink, Card, Button, CardTitle, CardText, Row, Col, NavbarBrand, FormText, Input } from 'reactstrap'; import {Document} from "../models/Document";
import { Link } from 'react-router-dom'; import { LoginState } from "../models/LoginState";
import { Conditional } from '../components/Conditional'; import fbData from "../startup/firebase";
import { ChangeEventHandler } from 'react'; import { generateDocId, getLanguage } from "../util/doc";
export interface EditState {document: Document} export interface EditState {document: Document; }
export interface EditProps {login: LoginState, docId: string, uid: string, showEdit? : Boolean} export interface EditProps {login: LoginState; docId: string; uid: string; showEdit?: boolean; }
export class Edit extends React.Component<EditProps, EditState> { export class Edit extends React.Component<EditProps, EditState> {
public ref: any;
constructor(props: EditProps) { constructor(props: EditProps) {
super(props); super(props);
this.state = { this.state = {
document: { document: {
Title: '', Title: "",
Body: '' Body: "",
} },
}; };
} }
ref: any
componentDidMount() { public componentDidMount() {
this.ref = fbData.rebase.syncState(`docs/${this.props.uid}/${this.props.docId}`, { this.ref = fbData.rebase.syncState(`docs/${this.props.uid}/${this.props.docId}`, {
context: this, context: this,
state: 'document', state: "document",
asArray: false asArray: false,
}); });
} }
componentWillUnmount() { public componentWillUnmount() {
fbData.rebase.removeBinding(this.ref); fbData.rebase.removeBinding(this.ref);
} }
updateTitle(docTitle: string){ public updateTitle(docTitle: string) {
this.setState({document:{Title: docTitle}}); this.setState({document: {Title: docTitle}});
} }
updateDocument(docBody: string){ public updateDocument(docBody: string) {
this.setState({ this.setState({
document: { document: {
Body: docBody Body: docBody,
} },
}); });
} }
render() { public render() {
let tabNumber = this.props.showEdit ? '2': '1' const tabNumber = this.props.showEdit ? "2" : "1";
let displayEdit = this.props.login.isLoggedIn && this.props.login.uid === this.props.uid; const displayEdit = this.props.login.isLoggedIn && this.props.login.uid === this.props.uid;
let displayViewer = tabNumber === '1'; const displayViewer = tabNumber === "1";
// : null; // : null;
return ( return (
@@ -59,7 +60,7 @@ export class Edit extends React.Component<EditProps, EditState> {
<NavItem> <NavItem>
<Link <Link
to="view" to="view"
className={`nav-link ${tabNumber === '1' ? 'active': ''}`} className={`nav-link ${tabNumber === "1" ? "active" : ""}`}
> >
View View
</Link> </Link>
@@ -67,7 +68,7 @@ export class Edit extends React.Component<EditProps, EditState> {
<NavItem> <NavItem>
<Link <Link
to="edit" to="edit"
className={`nav-link ${tabNumber === '2' ? 'active': ''}`} className={`nav-link ${tabNumber === "2" ? "active" : ""}`}
> >
Edit Edit
</Link> </Link>
@@ -75,7 +76,7 @@ export class Edit extends React.Component<EditProps, EditState> {
</Nav> </Nav>
<TabContent activeTab={tabNumber}> <TabContent activeTab={tabNumber}>
<TabPane tabId="1"> <TabPane tabId="1">
<Row style={{height: '100vh'}}> <Row style={{height: "100vh"}}>
<Col sm="12"> <Col sm="12">
<Conditional render={displayViewer}> <Conditional render={displayViewer}>
<br /> <br />
@@ -87,17 +88,17 @@ export class Edit extends React.Component<EditProps, EditState> {
</TabPane> </TabPane>
<TabPane tabId="2"> <TabPane tabId="2">
<Conditional render={displayEdit}> <Conditional render={displayEdit}>
<Row style={{height: '60vh'}}> <Row style={{height: "60vh"}}>
<Col sm="12" style={{height: '100%'}}> <Col sm="12" style={{height: "100%"}}>
<div>Permalink: <Input readOnly type="text" value={`https://minbin.co/d/${this.props.login.uid}/${this.props.docId}`} /></div><br /> <div>Permalink: <Input readOnly type="text" value={`https://minbin.co/d/${this.props.login.uid}/${this.props.docId}`} /></div><br />
<textarea className="form-control" style={{height: "40vh"}} value={this.state.document.Body || ""} onChange={(event)=>this.updateDocument(event.target.value)}></textarea> <textarea className="form-control" style={{height: "40vh"}} value={this.state.document.Body || ""} onChange={(event) => this.updateDocument(event.target.value)}></textarea>
</Col> </Col>
</Row> </Row>
<Row style={{height: '20vh'}} > <Row style={{height: "20vh"}} >
<Col sm="12"> <Col sm="12">
<form style={{paddingLeft: "10px"}} className={'form-inline'}> <form style={{paddingLeft: "10px"}} className={"form-inline"}>
<label htmlFor="title-input">Title: &nbsp;</label> <label htmlFor="title-input">Title: &nbsp;</label>
<input placeholder={"KittensAttack.cpp"} type="text" onChange={(event)=>this.updateTitle(event.target.value)} value={this.state.document.Title} className="form-control" id="title-input" /> <input placeholder={"KittensAttack.cpp"} type="text" onChange={(event) => this.updateTitle(event.target.value)} value={this.state.document.Title} className="form-control" id="title-input" />
</form> </form>
</Col> </Col>
</Row> </Row>

View File

@@ -1,17 +1,17 @@
import { Home } from '../components/Home'; import * as React from "react";
import { LoginState } from '../models/LoginState'; import { Home } from "../components/Home";
import * as React from 'react'; import { LoginState } from "../models/LoginState";
import { ListContainer } from './ListContainer'; import { ListContainer } from "./ListContainer";
export class HomeContainer extends React.Component<{login: LoginState},any>{ export class HomeContainer extends React.Component<{login: LoginState}, any> {
render(){ public render() {
let render = this.props.login.isLoggedIn ? <ListContainer login={this.props.login} /> : <Home /> const render = this.props.login.isLoggedIn ? <ListContainer login={this.props.login} /> : <Home />;
return( return(
<div> <div>
{render} {render}
</div> </div>
) );
} }
} }

View File

@@ -1,50 +1,49 @@
import { ListItem } from '../components/ListItem'; import * as React from "react";
import { Viewer } from '../components/Viewer'; import Progress from "reactstrap/lib/Progress";
import { LoginState } from '../models/LoginState'; import { ListItem } from "../components/ListItem";
import * as React from 'react'; import { Viewer } from "../components/Viewer";
import fbData from '../startup/firebase'; import { DocumentPlusKey } from "../models/Document";
import Progress from 'reactstrap/lib/Progress'; import { LoginState } from "../models/LoginState";
import { DocumentPlusKey } from '../models/Document' import fbData from "../startup/firebase";
import { getLanguage } from '../util/doc'; import { getLanguage } from "../util/doc";
export class ListContainer extends React.Component<{login: LoginState}, {inProgress: Boolean, docs: Array<DocumentPlusKey>, error : Boolean }>{ export class ListContainer extends React.Component<{login: LoginState}, {inProgress: boolean, docs: DocumentPlusKey[], error: boolean }> {
inProgress: Boolean = true; public inProgress: boolean = true;
getPastes(){ constructor(login: {login: LoginState}) {
super(login);
this.state = {inProgress: true, docs: new Array<DocumentPlusKey>(), error: false};
}
public getPastes() {
fbData.rebase.fetch(`/docs/${this.props.login.uid}`, fbData.rebase.fetch(`/docs/${this.props.login.uid}`,
{ {
context: this, context: this,
asArray: true asArray: true,
}) })
.then((data: Array<DocumentPlusKey>)=> .then((data: DocumentPlusKey[]) => {
{
this.setState({docs: data, inProgress: false}); this.setState({docs: data, inProgress: false});
}) })
.catch((err: any)=>{ .catch((err: any) => {
console.error(err); console.error(err);
this.setState({error: true, inProgress: false}); this.setState({error: true, inProgress: false});
}); });
} }
constructor(login: {login: LoginState}){ public componentDidMount() {
super(login) this.getPastes();
this.state = {inProgress: true, docs: new Array<DocumentPlusKey>(), error: false}
} }
componentDidMount(){ public render() {
this.getPastes() if (this.state.inProgress) {
return <div><Progress striped={true} animated={true} max={100} value={100} /></div>;
} }
render(){ if (this.state.error) {
if(this.state.inProgress){ return <h4>Oh No! An error occured</h4>;
return <div><Progress striped={true} animated={true} max={100} value={100} /></div>
} }
if(this.state.error){ if (this.state.docs.length < 1) {
return <h4>Oh No! An error occured</h4> return <h4>No pastes found <small>Press new in the upper right to make a paste!</small></h4>;
} }
if(this.state.docs.length < 1){ const elems = this.state.docs.map((doc) => {
return <h4>No pastes found <small>Press new in the upper right to make a paste!</small></h4> return <ListItem key={`${doc.key}_li`} docId={doc.key} doc={doc} uid={this.props.login.uid} />;
}
let elems =this.state.docs.map(doc => {
return <ListItem key={`${doc.key}_li`} docId={doc.key} doc={doc} uid={this.props.login.uid} />
}); });
return <div>{elems}</div> return <div>{elems}</div>;
} }
} }

View File

@@ -1,38 +1,37 @@
import { Reducer, Action } from 'redux'; import * as firebase from "firebase";
import * as actions from '../actions/loginActions'; import * as React from "react";
import { LoginState } from '../models/LoginState'; import * as reactRedux from "react-redux";
import * as React from 'react'; import { connect, Dispatch } from "react-redux";
import * as firebase from 'firebase'; import { Link } from "react-router-dom";
import { Button } from "reactstrap";
import * as redux from "redux";
import { Action, Reducer } from "redux";
import * as actions from "../actions/loginActions";
import { LoginButton } from "../components/LoginButton"; import { LoginButton } from "../components/LoginButton";
import * as reactRedux from 'react-redux'; import {AppState} from "../models/AppState";
import {AppState} from '../models/AppState'; import { LoginState } from "../models/LoginState";
import { Dispatch, connect } from 'react-redux';
import * as redux from 'redux';
import { Button } from 'reactstrap';
import { Link } from 'react-router-dom';
const mapStateToProps = (state : AppState) : IBaseLoginProps => const mapStateToProps = (state: AppState): IBaseLoginProps => {
{
return {loginState: state.login}; return {loginState: state.login};
}; };
const mapDispatchToProps = (dispatch: (action: Action)=>any) : IBaseLoginDispatches => { const mapDispatchToProps = (dispatch: (action: Action) => any): IBaseLoginDispatches => {
return { return {
onLogin:(loginState: LoginState) => dispatch(actions.login(loginState)), onLogin: (loginState: LoginState) => dispatch(actions.login(loginState)),
onLogOut:() => dispatch(actions.logout()) onLogOut: () => dispatch(actions.logout()),
} };
}; };
interface IBaseLoginProps {loginState: LoginState;} interface IBaseLoginProps {loginState: LoginState; }
interface IBaseLoginDispatches {onLogin: (loginState: LoginState)=>any; onLogOut: ()=>any;} interface IBaseLoginDispatches {onLogin: (loginState: LoginState) => any; onLogOut: () => any; }
interface ILoginProps extends IBaseLoginProps,IBaseLoginDispatches {} interface ILoginProps extends IBaseLoginProps, IBaseLoginDispatches {}
class loginContainer extends React.Component<ILoginProps,{}>{ class loginContainer extends React.Component<ILoginProps, {}> {
constructor(props: ILoginProps){ constructor(props: ILoginProps) {
super(props); super(props);
firebase.auth().onAuthStateChanged((e)=>this.handleLogin(e)); firebase.auth().onAuthStateChanged((e) => this.handleLogin(e));
} }
handleLogin(user: firebase.User){ public handleLogin(user: firebase.User) {
if (user) { if (user) {
this.props.onLogin({isLoggedIn: true, displayName: user.displayName, uid: user.uid}); this.props.onLogin({isLoggedIn: true, displayName: user.displayName, uid: user.uid});
@@ -40,23 +39,22 @@ class loginContainer extends React.Component<ILoginProps,{}>{
this.props.onLogOut(); this.props.onLogOut();
} }
} }
logout(){ public logout() {
firebase.auth().signOut() firebase.auth().signOut()
.then(()=>this.props.onLogOut()); .then(() => this.props.onLogOut());
} }
login(){ public login() {
let provider = new firebase.auth.GoogleAuthProvider(); const provider = new firebase.auth.GoogleAuthProvider();
firebase.auth().setPersistence(firebase.auth.Auth.Persistence.SESSION) firebase.auth().setPersistence(firebase.auth.Auth.Persistence.SESSION)
.then(()=>firebase.auth().signInWithPopup(provider).then(result => {})); .then(() => firebase.auth().signInWithPopup(provider).then((result) => { return; }));
} }
//todo I should seperate the UI layer from the login business logic, redux posting //todo I should seperate the UI layer from the login business logic, redux posting
render(){ public render() {
if(this.props && this.props.loginState && this.props.loginState.isLoggedIn){ if (this.props && this.props.loginState && this.props.loginState.isLoggedIn) {
return <span style={{verticalAlign: 'middle'}}>&nbsp; Hi, {this.props.loginState.displayName} <a href="#" onClick={()=>this.logout()}>Log Out</a> </span>; return <span style={{verticalAlign: "middle"}}>&nbsp; Hi, {this.props.loginState.displayName} <a href="#" onClick={() => this.logout()}>Log Out</a> </span>;
} } else {
else{
return <LoginButton onClick={this.login} />; return <LoginButton onClick={this.login} />;
} }

View File

@@ -1,19 +1,18 @@
import "bootstrap/dist/css/bootstrap.css";
import * as React from "react"; import * as React from "react";
import * as ReactDOM from "react-dom"; import * as ReactDOM from "react-dom";
import 'bootstrap/dist/css/bootstrap.css'; import { Provider } from "react-redux";
import { NavBar } from './components/NavBar'
import rebase from './startup/firebase'
import { LoginContainer } from './containers/Login'
import { createStore } from 'redux'
import {MainReducer} from './reducers/MainReducer'
import { Provider } from 'react-redux'
import { AppContainer } from "./containers/AppContainer";
import { BrowserRouter } from "react-router-dom"; import { BrowserRouter } from "react-router-dom";
let store = createStore(MainReducer) import { createStore } from "redux";
import { NavBar } from "./components/NavBar";
import { AppContainer } from "./containers/AppContainer";
import { LoginContainer } from "./containers/Login";
import {MainReducer} from "./reducers/MainReducer";
import rebase from "./startup/firebase";
const store = createStore(MainReducer);
const App = () => ( const App = () => (
<AppContainer /> <AppContainer />
); );
ReactDOM.render( ReactDOM.render(
@@ -21,5 +20,5 @@ ReactDOM.render(
<App /> <App />
</Provider> </Provider>
, ,
document.getElementById("example") document.getElementById("example"),
); );

View File

@@ -1,4 +1,4 @@
import { LoginState } from './LoginState'; import { LoginState } from "./LoginState";
export interface AppState { export interface AppState {
login:LoginState login: LoginState;
} }

View File

@@ -3,8 +3,8 @@ export enum Theme {
} }
export interface Document { export interface Document {
Title?: string, Title?: string;
Body?: string, Body?: string;
Theme?: Theme Theme?: Theme;
} }
export interface DocumentPlusKey extends Document{key: string} export interface DocumentPlusKey extends Document {key: string; }

View File

@@ -1 +1 @@
export interface LoginState { isLoggedIn: Boolean; displayName: string; uid: string } export interface LoginState { isLoggedIn: boolean; displayName: string; uid: string; }

View File

@@ -1,10 +1,10 @@
import { LoginState } from './LoginState'; import { Action } from "redux";
import { Action } from 'redux'; import { LoginState } from "./LoginState";
// export class MinAction<T> implements Action{ // export class MinAction<T> implements Action{
// constructor(public type: any, public payload : T){ // constructor(public type: any, public payload : T){
// } // }
export interface MinAction<T> extends Action { export interface MinAction<T> extends Action {
payload: T payload: T;
} }

View File

@@ -1,470 +1,464 @@
declare module 'react-syntax-highlighter/dist/hljs/styles' { declare module "react-syntax-highlighter/dist/hljs/styles" {
export { default as agate } from 'react-syntax-highlighter/styles/hljs/agate'; export { default as agate } from "react-syntax-highlighter/styles/hljs/agate";
export { default as androidstudio } from 'react-syntax-highlighter/styles/hljs/androidstudio'; export { default as androidstudio } from "react-syntax-highlighter/styles/hljs/androidstudio";
export { default as arduinoLight } from 'react-syntax-highlighter/styles/hljs/arduino-light'; export { default as arduinoLight } from "react-syntax-highlighter/styles/hljs/arduino-light";
export { default as arta } from 'react-syntax-highlighter/styles/hljs/arta'; export { default as arta } from "react-syntax-highlighter/styles/hljs/arta";
export { default as ascetic } from 'react-syntax-highlighter/styles/hljs/ascetic'; export { default as ascetic } from "react-syntax-highlighter/styles/hljs/ascetic";
export { default as atelierCaveDark } from 'react-syntax-highlighter/styles/hljs/atelier-cave-dark'; export { default as atelierCaveDark } from "react-syntax-highlighter/styles/hljs/atelier-cave-dark";
export { default as atelierCaveLight } from 'react-syntax-highlighter/styles/hljs/atelier-cave-light'; export { default as atelierCaveLight } from "react-syntax-highlighter/styles/hljs/atelier-cave-light";
export { default as atelierDuneDark } from 'react-syntax-highlighter/styles/hljs/atelier-dune-dark'; export { default as atelierDuneDark } from "react-syntax-highlighter/styles/hljs/atelier-dune-dark";
export { default as atelierDuneLight } from 'react-syntax-highlighter/styles/hljs/atelier-dune-light'; export { default as atelierDuneLight } from "react-syntax-highlighter/styles/hljs/atelier-dune-light";
export { default as atelierEstuaryDark } from 'react-syntax-highlighter/styles/hljs/atelier-estuary-dark'; export { default as atelierEstuaryDark } from "react-syntax-highlighter/styles/hljs/atelier-estuary-dark";
export { default as atelierEstuaryLight } from 'react-syntax-highlighter/styles/hljs/atelier-estuary-light'; export { default as atelierEstuaryLight } from "react-syntax-highlighter/styles/hljs/atelier-estuary-light";
export { default as atelierForestDark } from 'react-syntax-highlighter/styles/hljs/atelier-forest-dark'; export { default as atelierForestDark } from "react-syntax-highlighter/styles/hljs/atelier-forest-dark";
export { default as atelierForestLight } from 'react-syntax-highlighter/styles/hljs/atelier-forest-light'; export { default as atelierForestLight } from "react-syntax-highlighter/styles/hljs/atelier-forest-light";
export { default as atelierHeathDark } from 'react-syntax-highlighter/styles/hljs/atelier-heath-dark'; export { default as atelierHeathDark } from "react-syntax-highlighter/styles/hljs/atelier-heath-dark";
export { default as atelierHeathLight } from 'react-syntax-highlighter/styles/hljs/atelier-heath-light'; export { default as atelierHeathLight } from "react-syntax-highlighter/styles/hljs/atelier-heath-light";
export { default as atelierLakesideDark } from 'react-syntax-highlighter/styles/hljs/atelier-lakeside-dark'; export { default as atelierLakesideDark } from "react-syntax-highlighter/styles/hljs/atelier-lakeside-dark";
export { default as atelierLakesideLight } from 'react-syntax-highlighter/styles/hljs/atelier-lakeside-light'; export { default as atelierLakesideLight } from "react-syntax-highlighter/styles/hljs/atelier-lakeside-light";
export { default as atelierPlateauDark } from 'react-syntax-highlighter/styles/hljs/atelier-plateau-dark'; export { default as atelierPlateauDark } from "react-syntax-highlighter/styles/hljs/atelier-plateau-dark";
export { default as atelierPlateauLight } from 'react-syntax-highlighter/styles/hljs/atelier-plateau-light'; export { default as atelierPlateauLight } from "react-syntax-highlighter/styles/hljs/atelier-plateau-light";
export { default as atelierSavannaDark } from 'react-syntax-highlighter/styles/hljs/atelier-savanna-dark'; export { default as atelierSavannaDark } from "react-syntax-highlighter/styles/hljs/atelier-savanna-dark";
export { default as atelierSavannaLight } from 'react-syntax-highlighter/styles/hljs/atelier-savanna-light'; export { default as atelierSavannaLight } from "react-syntax-highlighter/styles/hljs/atelier-savanna-light";
export { default as atelierSeasideDark } from 'react-syntax-highlighter/styles/hljs/atelier-seaside-dark'; export { default as atelierSeasideDark } from "react-syntax-highlighter/styles/hljs/atelier-seaside-dark";
export { default as atelierSeasideLight } from 'react-syntax-highlighter/styles/hljs/atelier-seaside-light'; export { default as atelierSeasideLight } from "react-syntax-highlighter/styles/hljs/atelier-seaside-light";
export { default as atelierSulphurpoolDark } from 'react-syntax-highlighter/styles/hljs/atelier-sulphurpool-dark'; export { default as atelierSulphurpoolDark } from "react-syntax-highlighter/styles/hljs/atelier-sulphurpool-dark";
export { default as atelierSulphurpoolLight } from 'react-syntax-highlighter/styles/hljs/atelier-sulphurpool-light'; export { default as atelierSulphurpoolLight } from "react-syntax-highlighter/styles/hljs/atelier-sulphurpool-light";
export { default as atomOneDark } from 'react-syntax-highlighter/styles/hljs/atom-one-dark'; export { default as atomOneDark } from "react-syntax-highlighter/styles/hljs/atom-one-dark";
export { default as atomOneLight } from 'react-syntax-highlighter/styles/hljs/atom-one-light'; export { default as atomOneLight } from "react-syntax-highlighter/styles/hljs/atom-one-light";
export { default as brownPaper } from 'react-syntax-highlighter/styles/hljs/brown-paper'; export { default as brownPaper } from "react-syntax-highlighter/styles/hljs/brown-paper";
export { default as codepenEmbed } from 'react-syntax-highlighter/styles/hljs/codepen-embed'; export { default as codepenEmbed } from "react-syntax-highlighter/styles/hljs/codepen-embed";
export { default as colorBrewer } from 'react-syntax-highlighter/styles/hljs/color-brewer'; export { default as colorBrewer } from "react-syntax-highlighter/styles/hljs/color-brewer";
export { default as darcula } from 'react-syntax-highlighter/styles/hljs/darcula'; export { default as darcula } from "react-syntax-highlighter/styles/hljs/darcula";
export { default as dark } from 'react-syntax-highlighter/styles/hljs/dark'; export { default as dark } from "react-syntax-highlighter/styles/hljs/dark";
export { default as darkula } from 'react-syntax-highlighter/styles/hljs/darkula'; export { default as darkula } from "react-syntax-highlighter/styles/hljs/darkula";
export { default as defaultStyle } from 'react-syntax-highlighter/styles/hljs/default-style'; export { default as defaultStyle } from "react-syntax-highlighter/styles/hljs/default-style";
export { default as docco } from 'react-syntax-highlighter/styles/hljs/docco'; export { default as docco } from "react-syntax-highlighter/styles/hljs/docco";
export { default as dracula } from 'react-syntax-highlighter/styles/hljs/dracula'; export { default as dracula } from "react-syntax-highlighter/styles/hljs/dracula";
export { default as far } from 'react-syntax-highlighter/styles/hljs/far'; export { default as far } from "react-syntax-highlighter/styles/hljs/far";
export { default as foundation } from 'react-syntax-highlighter/styles/hljs/foundation'; export { default as foundation } from "react-syntax-highlighter/styles/hljs/foundation";
export { default as githubGist } from 'react-syntax-highlighter/styles/hljs/github-gist'; export { default as githubGist } from "react-syntax-highlighter/styles/hljs/github-gist";
export { default as github } from 'react-syntax-highlighter/styles/hljs/github'; export { default as github } from "react-syntax-highlighter/styles/hljs/github";
export { default as googlecode } from 'react-syntax-highlighter/styles/hljs/googlecode'; export { default as googlecode } from "react-syntax-highlighter/styles/hljs/googlecode";
export { default as grayscale } from 'react-syntax-highlighter/styles/hljs/grayscale'; export { default as grayscale } from "react-syntax-highlighter/styles/hljs/grayscale";
export { default as gruvboxDark } from 'react-syntax-highlighter/styles/hljs/gruvbox-dark'; export { default as gruvboxDark } from "react-syntax-highlighter/styles/hljs/gruvbox-dark";
export { default as gruvboxLight } from 'react-syntax-highlighter/styles/hljs/gruvbox-light'; export { default as gruvboxLight } from "react-syntax-highlighter/styles/hljs/gruvbox-light";
export { default as hopscotch } from 'react-syntax-highlighter/styles/hljs/hopscotch'; export { default as hopscotch } from "react-syntax-highlighter/styles/hljs/hopscotch";
export { default as hybrid } from 'react-syntax-highlighter/styles/hljs/hybrid'; export { default as hybrid } from "react-syntax-highlighter/styles/hljs/hybrid";
export { default as idea } from 'react-syntax-highlighter/styles/hljs/idea'; export { default as idea } from "react-syntax-highlighter/styles/hljs/idea";
export { default as irBlack } from 'react-syntax-highlighter/styles/hljs/ir-black'; export { default as irBlack } from "react-syntax-highlighter/styles/hljs/ir-black";
export { default as kimbieDark } from 'react-syntax-highlighter/styles/hljs/kimbie.dark'; export { default as kimbieDark } from "react-syntax-highlighter/styles/hljs/kimbie.dark";
export { default as kimbieLight } from 'react-syntax-highlighter/styles/hljs/kimbie.light'; export { default as kimbieLight } from "react-syntax-highlighter/styles/hljs/kimbie.light";
export { default as magula } from 'react-syntax-highlighter/styles/hljs/magula'; export { default as magula } from "react-syntax-highlighter/styles/hljs/magula";
export { default as monoBlue } from 'react-syntax-highlighter/styles/hljs/mono-blue'; export { default as monoBlue } from "react-syntax-highlighter/styles/hljs/mono-blue";
export { default as monokaiSublime } from 'react-syntax-highlighter/styles/hljs/monokai-sublime'; export { default as monokaiSublime } from "react-syntax-highlighter/styles/hljs/monokai-sublime";
export { default as monokai } from 'react-syntax-highlighter/styles/hljs/monokai'; export { default as monokai } from "react-syntax-highlighter/styles/hljs/monokai";
export { default as obsidian } from 'react-syntax-highlighter/styles/hljs/obsidian'; export { default as obsidian } from "react-syntax-highlighter/styles/hljs/obsidian";
export { default as ocean } from 'react-syntax-highlighter/styles/hljs/ocean'; export { default as ocean } from "react-syntax-highlighter/styles/hljs/ocean";
export { default as paraisoDark } from 'react-syntax-highlighter/styles/hljs/paraiso-dark'; export { default as paraisoDark } from "react-syntax-highlighter/styles/hljs/paraiso-dark";
export { default as paraisoLight } from 'react-syntax-highlighter/styles/hljs/paraiso-light'; export { default as paraisoLight } from "react-syntax-highlighter/styles/hljs/paraiso-light";
export { default as pojoaque } from 'react-syntax-highlighter/styles/hljs/pojoaque'; export { default as pojoaque } from "react-syntax-highlighter/styles/hljs/pojoaque";
export { default as purebasic } from 'react-syntax-highlighter/styles/hljs/purebasic'; export { default as purebasic } from "react-syntax-highlighter/styles/hljs/purebasic";
export { default as qtcreatorDark } from 'react-syntax-highlighter/styles/hljs/qtcreator_dark'; export { default as qtcreatorDark } from "react-syntax-highlighter/styles/hljs/qtcreator_dark";
export { default as qtcreatorLight } from 'react-syntax-highlighter/styles/hljs/qtcreator_light'; export { default as qtcreatorLight } from "react-syntax-highlighter/styles/hljs/qtcreator_light";
export { default as railscasts } from 'react-syntax-highlighter/styles/hljs/railscasts'; export { default as railscasts } from "react-syntax-highlighter/styles/hljs/railscasts";
export { default as rainbow } from 'react-syntax-highlighter/styles/hljs/rainbow'; export { default as rainbow } from "react-syntax-highlighter/styles/hljs/rainbow";
export { default as schoolBook } from 'react-syntax-highlighter/styles/hljs/school-book'; export { default as schoolBook } from "react-syntax-highlighter/styles/hljs/school-book";
export { default as solarizedDark } from 'react-syntax-highlighter/styles/hljs/solarized-dark'; export { default as solarizedDark } from "react-syntax-highlighter/styles/hljs/solarized-dark";
export { default as solarizedLight } from 'react-syntax-highlighter/styles/hljs/solarized-light'; export { default as solarizedLight } from "react-syntax-highlighter/styles/hljs/solarized-light";
export { default as sunburst } from 'react-syntax-highlighter/styles/hljs/sunburst'; export { default as sunburst } from "react-syntax-highlighter/styles/hljs/sunburst";
export { default as tomorrowNightBlue } from 'react-syntax-highlighter/styles/hljs/tomorrow-night-blue'; export { default as tomorrowNightBlue } from "react-syntax-highlighter/styles/hljs/tomorrow-night-blue";
export { default as tomorrowNightBright } from 'react-syntax-highlighter/styles/hljs/tomorrow-night-bright'; export { default as tomorrowNightBright } from "react-syntax-highlighter/styles/hljs/tomorrow-night-bright";
export { default as tomorrowNightEighties } from 'react-syntax-highlighter/styles/hljs/tomorrow-night-eighties'; export { default as tomorrowNightEighties } from "react-syntax-highlighter/styles/hljs/tomorrow-night-eighties";
export { default as tomorrowNight } from 'react-syntax-highlighter/styles/hljs/tomorrow-night'; export { default as tomorrowNight } from "react-syntax-highlighter/styles/hljs/tomorrow-night";
export { default as tomorrow } from 'react-syntax-highlighter/styles/hljs/tomorrow'; export { default as tomorrow } from "react-syntax-highlighter/styles/hljs/tomorrow";
export { default as vs } from 'react-syntax-highlighter/styles/hljs/vs'; export { default as vs } from "react-syntax-highlighter/styles/hljs/vs";
export { default as xcode } from 'react-syntax-highlighter/styles/hljs/xcode'; export { default as xcode } from "react-syntax-highlighter/styles/hljs/xcode";
export { default as xt256 } from 'react-syntax-highlighter/styles/hljs/xt256'; export { default as xt256 } from "react-syntax-highlighter/styles/hljs/xt256";
export { default as zenburn } from 'react-syntax-highlighter/styles/hljs/zenburn'; export { default as zenburn } from "react-syntax-highlighter/styles/hljs/zenburn";
} }
declare module 'react-syntax-highlighter/styles/hljs/agate' { declare module "react-syntax-highlighter/styles/hljs/agate" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/androidstudio' { declare module "react-syntax-highlighter/styles/hljs/androidstudio" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/arduino-light' { declare module "react-syntax-highlighter/styles/hljs/arduino-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/arta' { declare module "react-syntax-highlighter/styles/hljs/arta" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/ascetic' { declare module "react-syntax-highlighter/styles/hljs/ascetic" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-cave-dark' { declare module "react-syntax-highlighter/styles/hljs/atelier-cave-dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-cave-light' { declare module "react-syntax-highlighter/styles/hljs/atelier-cave-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-dune-dark' { declare module "react-syntax-highlighter/styles/hljs/atelier-dune-dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-dune-light' { declare module "react-syntax-highlighter/styles/hljs/atelier-dune-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-estuary-dark' { declare module "react-syntax-highlighter/styles/hljs/atelier-estuary-dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-estuary-light' { declare module "react-syntax-highlighter/styles/hljs/atelier-estuary-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-forest-dark' { declare module "react-syntax-highlighter/styles/hljs/atelier-forest-dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-forest-light' { declare module "react-syntax-highlighter/styles/hljs/atelier-forest-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module "react-syntax-highlighter/styles/hljs/atelier-heath-dark" {
declare module 'react-syntax-highlighter/styles/hljs/atelier-heath-dark' {
const style: any; const style: any;
export default style; export default style;
} }
declare module "react-syntax-highlighter/styles/hljs/atelier-heath-light" {
declare module 'react-syntax-highlighter/styles/hljs/atelier-heath-light' {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-lakeside-dark' { declare module "react-syntax-highlighter/styles/hljs/atelier-lakeside-dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-lakeside-light' { declare module "react-syntax-highlighter/styles/hljs/atelier-lakeside-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-plateau-dark' { declare module "react-syntax-highlighter/styles/hljs/atelier-plateau-dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-plateau-light' { declare module "react-syntax-highlighter/styles/hljs/atelier-plateau-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-savanna-dark' { declare module "react-syntax-highlighter/styles/hljs/atelier-savanna-dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-savanna-light' { declare module "react-syntax-highlighter/styles/hljs/atelier-savanna-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-seaside-dark' { declare module "react-syntax-highlighter/styles/hljs/atelier-seaside-dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-seaside-light' { declare module "react-syntax-highlighter/styles/hljs/atelier-seaside-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-sulphurpool-dark' { declare module "react-syntax-highlighter/styles/hljs/atelier-sulphurpool-dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atelier-sulphurpool-light' { declare module "react-syntax-highlighter/styles/hljs/atelier-sulphurpool-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atom-one-dark' { declare module "react-syntax-highlighter/styles/hljs/atom-one-dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/atom-one-light' { declare module "react-syntax-highlighter/styles/hljs/atom-one-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/brown-paper' { declare module "react-syntax-highlighter/styles/hljs/brown-paper" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/codepen-embed' { declare module "react-syntax-highlighter/styles/hljs/codepen-embed" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/color-brewer' { declare module "react-syntax-highlighter/styles/hljs/color-brewer" {
const style: any; const style: any;
export default style; export default style;
} }
declare module "react-syntax-highlighter/styles/hljs/darcula" {
declare module 'react-syntax-highlighter/styles/hljs/darcula' {
const style: any; const style: any;
export default style; export default style;
} }
declare module "react-syntax-highlighter/styles/hljs/dark" {
declare module 'react-syntax-highlighter/styles/hljs/dark' {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/darkula' { declare module "react-syntax-highlighter/styles/hljs/darkula" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/default-style' { declare module "react-syntax-highlighter/styles/hljs/default-style" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/docco' { declare module "react-syntax-highlighter/styles/hljs/docco" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/dracula' { declare module "react-syntax-highlighter/styles/hljs/dracula" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/far' { declare module "react-syntax-highlighter/styles/hljs/far" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/foundation' { declare module "react-syntax-highlighter/styles/hljs/foundation" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/github-gist' { declare module "react-syntax-highlighter/styles/hljs/github-gist" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/github' { declare module "react-syntax-highlighter/styles/hljs/github" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/googlecode' { declare module "react-syntax-highlighter/styles/hljs/googlecode" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/grayscale' { declare module "react-syntax-highlighter/styles/hljs/grayscale" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/gruvbox-dark' { declare module "react-syntax-highlighter/styles/hljs/gruvbox-dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/gruvbox-light' { declare module "react-syntax-highlighter/styles/hljs/gruvbox-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/hopscotch' { declare module "react-syntax-highlighter/styles/hljs/hopscotch" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/hybrid' { declare module "react-syntax-highlighter/styles/hljs/hybrid" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/idea' { declare module "react-syntax-highlighter/styles/hljs/idea" {
const style: any; const style: any;
export default style; export default style;
} }
declare module "react-syntax-highlighter/styles/hljs/ir-black" {
declare module 'react-syntax-highlighter/styles/hljs/ir-black' {
const style: any; const style: any;
export default style; export default style;
} }
declare module "react-syntax-highlighter/styles/hljs/kimbie.dark" {
declare module 'react-syntax-highlighter/styles/hljs/kimbie.dark' {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/kimbie.light' { declare module "react-syntax-highlighter/styles/hljs/kimbie.light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/magula' { declare module "react-syntax-highlighter/styles/hljs/magula" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/mono-blue' { declare module "react-syntax-highlighter/styles/hljs/mono-blue" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/monokai-sublime' { declare module "react-syntax-highlighter/styles/hljs/monokai-sublime" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/monokai' { declare module "react-syntax-highlighter/styles/hljs/monokai" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/obsidian' { declare module "react-syntax-highlighter/styles/hljs/obsidian" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/ocean' { declare module "react-syntax-highlighter/styles/hljs/ocean" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/paraiso-dark' { declare module "react-syntax-highlighter/styles/hljs/paraiso-dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/paraiso-light' { declare module "react-syntax-highlighter/styles/hljs/paraiso-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/pojoaque' { declare module "react-syntax-highlighter/styles/hljs/pojoaque" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/purebasic' { declare module "react-syntax-highlighter/styles/hljs/purebasic" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/qtcreator_dark' { declare module "react-syntax-highlighter/styles/hljs/qtcreator_dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/qtcreator_light' { declare module "react-syntax-highlighter/styles/hljs/qtcreator_light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/railscasts' { declare module "react-syntax-highlighter/styles/hljs/railscasts" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/rainbow' { declare module "react-syntax-highlighter/styles/hljs/rainbow" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/school-book' { declare module "react-syntax-highlighter/styles/hljs/school-book" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/solarized-dark' { declare module "react-syntax-highlighter/styles/hljs/solarized-dark" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/solarized-light' { declare module "react-syntax-highlighter/styles/hljs/solarized-light" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/sunburst' { declare module "react-syntax-highlighter/styles/hljs/sunburst" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/tomorrow-night-blue' { declare module "react-syntax-highlighter/styles/hljs/tomorrow-night-blue" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/tomorrow-night-bright' { declare module "react-syntax-highlighter/styles/hljs/tomorrow-night-bright" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/tomorrow-night-eighties' { declare module "react-syntax-highlighter/styles/hljs/tomorrow-night-eighties" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/tomorrow-night' { declare module "react-syntax-highlighter/styles/hljs/tomorrow-night" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/tomorrow' { declare module "react-syntax-highlighter/styles/hljs/tomorrow" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/vs' { declare module "react-syntax-highlighter/styles/hljs/vs" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/xcode' { declare module "react-syntax-highlighter/styles/hljs/xcode" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/xt256' { declare module "react-syntax-highlighter/styles/hljs/xt256" {
const style: any; const style: any;
export default style; export default style;
} }
declare module 'react-syntax-highlighter/styles/hljs/zenburn' { declare module "react-syntax-highlighter/styles/hljs/zenburn" {
const style: any; const style: any;
export default style; export default style;
} }

View File

@@ -1,15 +1,15 @@
import * as React from 'react'; import * as React from "react";
import { AppState } from './../models/AppState' import { Action, AnyAction } from "redux";
import { Action, AnyAction } from 'redux'; import * as _ from "underscore";
import * as appActions from '../actions/types'; import * as appActions from "../actions/types";
import * as _ from 'underscore' import { AppState } from "./../models/AppState";
export function MainReducer(state:AppState = {login: { isLoggedIn: false, displayName: '', uid: ''}}, action: AnyAction) { export function MainReducer(state: AppState = {login: { isLoggedIn: false, displayName: "", uid: ""}}, action: AnyAction) {
switch(action.type){ switch (action.type) {
case appActions.LOGGED_IN: case appActions.LOGGED_IN:
return _.extend({}, state, {login:{ isLoggedIn: true, displayName: action.payload.displayName, uid: action.payload.uid}}) return _.extend({}, state, {login: { isLoggedIn: true, displayName: action.payload.displayName, uid: action.payload.uid}});
case appActions.LOGGED_OUT: case appActions.LOGGED_OUT:
return _.extend({}, state, {login:{ isLoggedIn: false, displayName: "", uid: ''}}) return _.extend({}, state, {login: { isLoggedIn: false, displayName: "", uid: ""}});
default: default:
return state return state;
} }
} }

View File

@@ -1,14 +1,14 @@
import * as firebase from "firebase" import * as firebase from "firebase";
import * as Rebase from "re-base" import * as Rebase from "re-base";
let config = { const config = {
apiKey: "AIzaSyBi1oHDSe7juSTOZws30RkyXgv9u9ey-HA", apiKey: "AIzaSyBi1oHDSe7juSTOZws30RkyXgv9u9ey-HA",
authDomain: "minbin-784f1.firebaseapp.com", authDomain: "minbin-784f1.firebaseapp.com",
databaseURL: "https://minbin-784f1.firebaseio.com", databaseURL: "https://minbin-784f1.firebaseio.com",
projectId: "minbin-784f1", projectId: "minbin-784f1",
storageBucket: "minbin-784f1.appspot.com", storageBucket: "minbin-784f1.appspot.com",
messagingSenderId: "437102882585" messagingSenderId: "437102882585",
}; };
let app = firebase.initializeApp(config); const app = firebase.initializeApp(config);
let db = firebase.database(app); const db = firebase.database(app);
export default {db:firebase.database(app), rebase: Rebase.createClass(db)} export default {db: firebase.database(app), rebase: Rebase.createClass(db)};

View File

@@ -1,17 +1,17 @@
export function generateDocId(){ export function generateDocId() {
let str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'; const str = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
let result = ''; let result = "";
for (let i = 0; i < 8; i++){ for (let i = 0; i < 8; i++) {
result += str.charAt(Math.floor(Math.random()*str.length)) result += str.charAt(Math.floor(Math.random() * str.length));
} }
return result; return result;
} }
export function getLanguage(title?: string){ export function getLanguage(title?: string) {
let language = null; let language = null;
if(title){ if (title) {
let split = title.split('.'); const split = title.split(".");
if(split.length == 2){ if (split.length === 2) {
language = split[1]; language = split[1];
} }
} }

22
tslint.json Normal file
View File

@@ -0,0 +1,22 @@
{
"defaultSeverity": "error",
"extends": [
"tslint:recommended"
],
"jsRules": {},
"rules": {
"no-console": false,
"jsdoc-format": false,
"no-reference": false,
"no-reference-import": false,
"interface-name": false,
"newline-before-return": false,
"max-line-length": [true, 400],
"comment-format": false,
"class-name": false,
"object-literal-sort-keys": false,
"indent": false,
"eofline": false
},
"rulesDirectory": []
}

View File

@@ -435,7 +435,7 @@ aws4@^1.2.1:
version "1.6.0" version "1.6.0"
resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.6.0.tgz#83ef5ca860b2b32e4a0deedee8c771b9db57471e" resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.6.0.tgz#83ef5ca860b2b32e4a0deedee8c771b9db57471e"
babel-code-frame@^6.11.0: babel-code-frame@^6.11.0, babel-code-frame@^6.22.0:
version "6.26.0" version "6.26.0"
resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz#63fd43f7dc1e3bb7ce35947db8fe369a3f58c74b" resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz#63fd43f7dc1e3bb7ce35947db8fe369a3f58c74b"
dependencies: dependencies:
@@ -652,7 +652,7 @@ buffer@^4.3.0:
ieee754 "^1.1.4" ieee754 "^1.1.4"
isarray "^1.0.0" isarray "^1.0.0"
builtin-modules@^1.0.0: builtin-modules@^1.0.0, builtin-modules@^1.1.1:
version "1.1.1" version "1.1.1"
resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-1.1.1.tgz#270f076c5a72c02f5b65a47df94c5fe3a278892f" resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-1.1.1.tgz#270f076c5a72c02f5b65a47df94c5fe3a278892f"
@@ -745,7 +745,7 @@ chalk@^1.1.3:
strip-ansi "^3.0.0" strip-ansi "^3.0.0"
supports-color "^2.0.0" supports-color "^2.0.0"
chalk@^2.3.0: chalk@^2.1.0, chalk@^2.3.0:
version "2.3.0" version "2.3.0"
resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.3.0.tgz#b5ea48efc9c1793dccc9b4767c93914d3f2d52ba" resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.3.0.tgz#b5ea48efc9c1793dccc9b4767c93914d3f2d52ba"
dependencies: dependencies:
@@ -912,6 +912,10 @@ comma-separated-tokens@^1.0.0:
dependencies: dependencies:
trim "0.0.1" trim "0.0.1"
commander@^2.9.0:
version "2.12.2"
resolved "https://registry.yarnpkg.com/commander/-/commander-2.12.2.tgz#0f5946c427ed9ec0d91a46bb9def53e54650e555"
component-emitter@^1.2.1: component-emitter@^1.2.1:
version "1.2.1" version "1.2.1"
resolved "https://registry.yarnpkg.com/component-emitter/-/component-emitter-1.2.1.tgz#137918d6d78283f7df7a6b7c5a63e140e69425e6" resolved "https://registry.yarnpkg.com/component-emitter/-/component-emitter-1.2.1.tgz#137918d6d78283f7df7a6b7c5a63e140e69425e6"
@@ -1243,6 +1247,10 @@ detect-node@^2.0.3:
version "2.0.3" version "2.0.3"
resolved "https://registry.yarnpkg.com/detect-node/-/detect-node-2.0.3.tgz#a2033c09cc8e158d37748fbde7507832bd6ce127" resolved "https://registry.yarnpkg.com/detect-node/-/detect-node-2.0.3.tgz#a2033c09cc8e158d37748fbde7507832bd6ce127"
diff@^3.2.0:
version "3.4.0"
resolved "https://registry.yarnpkg.com/diff/-/diff-3.4.0.tgz#b1d85507daf3964828de54b37d0d73ba67dda56c"
diffie-hellman@^5.0.0: diffie-hellman@^5.0.0:
version "5.0.2" version "5.0.2"
resolved "https://registry.yarnpkg.com/diffie-hellman/-/diffie-hellman-5.0.2.tgz#b5835739270cfe26acf632099fded2a07f209e5e" resolved "https://registry.yarnpkg.com/diffie-hellman/-/diffie-hellman-5.0.2.tgz#b5835739270cfe26acf632099fded2a07f209e5e"
@@ -1838,7 +1846,7 @@ glob-parent@^2.0.0:
dependencies: dependencies:
is-glob "^2.0.0" is-glob "^2.0.0"
glob@^7.0.3, glob@^7.0.5: glob@^7.0.3, glob@^7.0.5, glob@^7.1.1:
version "7.1.2" version "7.1.2"
resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.2.tgz#c19c9df9a028702d678612384a6552404c636d15" resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.2.tgz#c19c9df9a028702d678612384a6552404c636d15"
dependencies: dependencies:
@@ -3182,6 +3190,10 @@ path-key@^2.0.0:
version "2.0.1" version "2.0.1"
resolved "https://registry.yarnpkg.com/path-key/-/path-key-2.0.1.tgz#411cadb574c5a140d3a4b1910d40d80cc9f40b40" resolved "https://registry.yarnpkg.com/path-key/-/path-key-2.0.1.tgz#411cadb574c5a140d3a4b1910d40d80cc9f40b40"
path-parse@^1.0.5:
version "1.0.5"
resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.5.tgz#3c1adf871ea9cd6c9431b6ea2bd74a0ff055c4c1"
path-to-regexp@0.1.7: path-to-regexp@0.1.7:
version "0.1.7" version "0.1.7"
resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz#df604178005f522f15eb4490e7247a1bfaa67f8c" resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz#df604178005f522f15eb4490e7247a1bfaa67f8c"
@@ -4006,6 +4018,12 @@ resolve-url@^0.2.1:
version "0.2.1" version "0.2.1"
resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a" resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
resolve@^1.3.2:
version "1.5.0"
resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.5.0.tgz#1f09acce796c9a762579f31b2c1cc4c3cddf9f36"
dependencies:
path-parse "^1.0.5"
right-align@^0.1.1: right-align@^0.1.1:
version "0.1.3" version "0.1.3"
resolved "https://registry.yarnpkg.com/right-align/-/right-align-0.1.3.tgz#61339b722fe6a3515689210d24e14c96148613ef" resolved "https://registry.yarnpkg.com/right-align/-/right-align-0.1.3.tgz#61339b722fe6a3515689210d24e14c96148613ef"
@@ -4555,6 +4573,32 @@ trough@^1.0.0:
version "1.0.1" version "1.0.1"
resolved "https://registry.yarnpkg.com/trough/-/trough-1.0.1.tgz#a9fd8b0394b0ae8fff82e0633a0a36ccad5b5f86" resolved "https://registry.yarnpkg.com/trough/-/trough-1.0.1.tgz#a9fd8b0394b0ae8fff82e0633a0a36ccad5b5f86"
tslib@^1.7.1, tslib@^1.8.0:
version "1.8.1"
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.8.1.tgz#6946af2d1d651a7b1863b531d6e5afa41aa44eac"
tslint@^5.8.0:
version "5.8.0"
resolved "https://registry.yarnpkg.com/tslint/-/tslint-5.8.0.tgz#1f49ad5b2e77c76c3af4ddcae552ae4e3612eb13"
dependencies:
babel-code-frame "^6.22.0"
builtin-modules "^1.1.1"
chalk "^2.1.0"
commander "^2.9.0"
diff "^3.2.0"
glob "^7.1.1"
minimatch "^3.0.4"
resolve "^1.3.2"
semver "^5.3.0"
tslib "^1.7.1"
tsutils "^2.12.1"
tsutils@^2.12.1:
version "2.14.0"
resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-2.14.0.tgz#bc5291622aa2448c1baffc544bcc14ecfa528fb7"
dependencies:
tslib "^1.8.0"
tty-browserify@0.0.0: tty-browserify@0.0.0:
version "0.0.0" version "0.0.0"
resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6" resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6"