9 |
12 |
14 | );
15 | }
16 | }
17 |
18 | export default connect(
19 | state => ({ user: state.auth.user }),
20 | { }
21 | )(ResetPassword);
22 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Controllers/Account/Models/LoginModel.cs:
--------------------------------------------------------------------------------
1 | using System.ComponentModel.DataAnnotations;
2 | using Newtonsoft.Json;
3 |
4 | namespace ReactBoilerplate.Controllers.Account.Models
5 | {
6 | public class LoginModel
7 | {
8 | [JsonProperty("userName")]
9 | [Required]
10 | public string UserName { get; set; }
11 |
12 | [JsonProperty("password")]
13 | [Required]
14 | public string Password { get; set; }
15 |
16 | [JsonProperty("rememberMe")]
17 | public bool RememberMe { get; set; }
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/components/ExternalLoginButton.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { Button } from 'react-bootstrap';
3 |
4 | const bootstrapSocial = require('bootstrap-social');
5 | const fontAwesome = require('font-awesome/scss/font-awesome.scss');
6 |
7 | export default (props) =>
8 | (
9 |
15 | );
16 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/containers/ForgotPassword/ForgotPassword.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import { ForgotPasswordForm } from 'components';
3 | import { connect } from 'react-redux';
4 |
5 | class ForgotPassword extends Component {
6 | render() {
7 | return (
8 | Reset password
10 |Reset your password.
11 |12 |
9 |
12 |
14 | );
15 | }
16 | }
17 |
18 | export default connect(
19 | state => ({ user: state.auth.user }),
20 | { }
21 | )(ForgotPassword);
22 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/containers/Manage/ChangePassword/ChangePassword.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import { ChangePasswordForm } from 'components';
3 | import { connect } from 'react-redux';
4 |
5 | class ChangePassword extends Component {
6 | render() {
7 | return (
8 | Forgot your password?
10 |Enter your email.
11 |12 |
9 |
12 |
14 | );
15 | }
16 | }
17 |
18 | export default connect(
19 | state => ({ user: state.auth.user }),
20 | { }
21 | )(ChangePassword);
22 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/redux/reducer.js:
--------------------------------------------------------------------------------
1 | import { combineReducers } from 'redux';
2 | import { reducer as formReducer } from 'redux-form';
3 | import auth from './modules/auth';
4 | import account from './modules/account';
5 | import externalLogin from './modules/externalLogin';
6 | import manage from './modules/manage';
7 | import viewBag from './modules/viewBag';
8 | import { routerReducer } from 'react-router-redux';
9 |
10 | export default combineReducers({
11 | form: formReducer,
12 | routing: routerReducer,
13 | auth,
14 | account,
15 | externalLogin,
16 | manage,
17 | viewBag
18 | });
19 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/web.config:
--------------------------------------------------------------------------------
1 |
2 | Change Password.
10 |Change Password Form
11 |12 |
14 | {errors.map((err, i) =>
15 | (
16 |
23 | );
24 | }
25 | return null;
26 | }
27 | }
28 |
29 | export default ErrorList;
30 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/client.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import ReactDOM from 'react-dom';
3 | import { Router, browserHistory } from 'react-router';
4 | import getRoutes from './routes';
5 | import { Provider } from 'react-redux';
6 | import configureStore from './redux/configureStore';
7 | import { syncHistoryWithStore } from 'react-router-redux';
8 | import ApiClient from './helpers/ApiClient';
9 |
10 | const client = new ApiClient();
11 | const store = configureStore(window.__data, browserHistory, client);
12 | const history = syncHistoryWithStore(browserHistory, store);
13 |
14 | ReactDOM.render(
15 |
17 |
15 |
18 |
20 | );
21 | }
22 | }
23 |
24 | export default connect(
25 | state => ({ user: state.auth.user, externalLogin: state.externalLogin }),
26 | { pushState: push }
27 | )(Register);
28 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/redux/configureStore.js:
--------------------------------------------------------------------------------
1 | import { createStore, applyMiddleware, compose } from 'redux';
2 | import thunk from 'redux-thunk';
3 | import reducer from './reducer';
4 | import { routerMiddleware } from 'react-router-redux';
5 | import createMiddleware from './middleware/clientMiddleware';
6 |
7 | let devTools = f => f;
8 | if (typeof window === 'object'
9 | && typeof window.devToolsExtension !== 'undefined') {
10 | devTools = window.devToolsExtension();
11 | }
12 |
13 | export default function configureStore(initialState, history, client) {
14 | const enhancer = compose(
15 | applyMiddleware(thunk),
16 | applyMiddleware(routerMiddleware(history)),
17 | applyMiddleware(createMiddleware(client)),
18 | devTools
19 | )(createStore);
20 | return enhancer(reducer, initialState);
21 | }
22 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Controllers/Account/Models/ResetPasswordModel.cs:
--------------------------------------------------------------------------------
1 | using System.ComponentModel.DataAnnotations;
2 |
3 | namespace ReactBoilerplate.Controllers.Account.Models
4 | {
5 | public class ResetPasswordModel
6 | {
7 | [Required]
8 | [EmailAddress]
9 | public string Email { get; set; }
10 |
11 | [Required]
12 | [StringLength(100, ErrorMessage = "The {0} must be at least {2} characters long.", MinimumLength = 6)]
13 | [DataType(DataType.Password)]
14 | public string Password { get; set; }
15 |
16 | [DataType(DataType.Password)]
17 | [Compare("Password", ErrorMessage = "The password and confirmation password do not match.")]
18 | public string PasswordConfirm { get; set; }
19 |
20 | public string Code { get; set; }
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/containers/index.js:
--------------------------------------------------------------------------------
1 | export App from './App/App';
2 | export Home from './Home/Home';
3 | export About from './About/About';
4 | export Contact from './Contact/Contact';
5 | export NotFound from './NotFound/NotFound';
6 | export Register from './Register/Register';
7 | export Login from './Login/Login';
8 | export ForgotPassword from './ForgotPassword/ForgotPassword';
9 | export ResetPassword from './ResetPassword/ResetPassword';
10 | export ConfirmEmail from './ConfirmEmail/ConfirmEmail';
11 | export Manage from './Manage/Manage';
12 | export ManageIndex from './Manage/Index/Index';
13 | export ManageSecurity from './Manage/Security/Security';
14 | export ManageChangePassword from './Manage/ChangePassword/ChangePassword';
15 | export ManageLogins from './Manage/Logins/Logins';
16 | export ManageEmail from './Manage/Email/Email';
17 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Models/ApplicationDbContext.cs:
--------------------------------------------------------------------------------
1 | using Microsoft.AspNetCore.Identity.EntityFrameworkCore;
2 | using Microsoft.EntityFrameworkCore;
3 |
4 | namespace ReactBoilerplate.Models
5 | {
6 | public class ApplicationDbContext : IdentityDbContextRegister
16 |Create a new account.
17 |18 |
23 | {loginProviders.map((loginProvider, i) =>
24 | (
25 |
26 |
13 | {!success &&
14 |
41 | );
42 | }
43 | }
44 |
45 | export default connect(
46 | (state) => ({ success: state.viewBag.success, change: state.viewBag.change }),
47 | { }
48 | )(ConfirmEmail);
49 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Controllers/Manage/ServerController.cs:
--------------------------------------------------------------------------------
1 | using System.Threading.Tasks;
2 | using Microsoft.AspNetCore.Identity;
3 | using Microsoft.AspNetCore.Mvc;
4 | using ReactBoilerplate.Models;
5 |
6 | namespace ReactBoilerplate.Controllers.Manage
7 | {
8 | [Route("manage")]
9 | public class ServerController : BaseController
10 | {
11 | public ServerController(UserManager
15 |
18 | }
19 | {success &&
20 | Error.
16 |An error occurred while processing your request.
17 |
21 | {change &&
22 |
39 | }
40 |
23 |
28 | }
29 | {!change &&
30 | Change email
24 |25 | Your email was succesfully changed. 26 |
27 |
31 |
37 | }
38 | Confirm email
32 |33 | Thank you for confirming your email. 34 | Please Click here to Log in. 35 |
36 |
25 | {success &&
26 |
44 | );
45 | }
46 | }
47 |
48 | ForgotPasswordForm = reduxForm({
49 | form: 'forgotPassword',
50 | fields: ['email']
51 | },
52 | (state) => state,
53 | { }
54 | )(ForgotPasswordForm);
55 |
56 | export default ForgotPasswordForm;
57 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ASP.NET",
3 | "version": "0.0.0",
4 | "devDependencies": {},
5 | "dependencies": {
6 | "babel-core": "^6.11.4",
7 | "babel-eslint": "^6.1.2",
8 | "babel-loader": "^6.2.4",
9 | "babel-preset-es2015": "^6.9.0",
10 | "babel-preset-react": "^6.11.1",
11 | "babel-preset-stage-0": "^6.5.0",
12 | "bootstrap-loader": "^1.1.0",
13 | "bootstrap-sass": "^3.3.7",
14 | "bootstrap-social": "^4.11.0",
15 | "classnames": "^2.2.3",
16 | "css-loader": "^0.23.1",
17 | "eslint": "^3.2.2",
18 | "eslint-config-airbnb": "^10.0.0",
19 | "eslint-loader": "^1.5.0",
20 | "eslint-plugin-import": "^1.12.0",
21 | "eslint-plugin-jsx-a11y": "^2.0.1",
22 | "eslint-plugin-react": "^6.0.0",
23 | "extract-text-webpack-plugin": "^1.0.1",
24 | "file-loader": "^0.9.0",
25 | "font-awesome": "^4.5.0",
26 | "gulp": "^3.9.1",
27 | "gulp-util": "^3.0.7",
28 | "lodash": "^4.14.1",
29 | "node-sass": "^4.9.0",
30 | "promise-window": "^1.0.0",
31 | "react": "^15.3.0",
32 | "react-bootstrap": "^0.30.1",
33 | "react-dom": "^15.3.0",
34 | "react-helmet": "^3.1.0",
35 | "react-redux": "^4.4.5",
36 | "react-router": "^2.6.1",
37 | "react-router-bootstrap": "^0.23.1",
38 | "react-router-redux": "^4.0.5",
39 | "redux": "^3.5.2",
40 | "redux-form": "^4.2.2",
41 | "redux-thunk": "^2.1.0",
42 | "resolve-url-loader": "^1.6.0",
43 | "sass-loader": "^4.0.0",
44 | "serialize-javascript": "^1.3.0",
45 | "style-loader": "^0.13.1",
46 | "superagent": "^2.1.0",
47 | "url-loader": "^0.5.7",
48 | "webpack": "^1.13.1"
49 | }
50 | }
51 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/components/ChangeEmailForm/ChangeEmailForm.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import Form from 'components/Form';
3 | import { reduxForm } from 'redux-form';
4 | import { Input } from 'components';
5 | import { changeEmail } from 'redux/modules/manage';
6 |
7 | class ChangeEmailForm extends Form {
8 | constructor(props) {
9 | super(props);
10 | this.success = this.success.bind(this);
11 | this.state = { success: false };
12 | }
13 | success() {
14 | this.setState({ success: true });
15 | }
16 | render() {
17 | const {
18 | fields: { currentPassword, email, emailConfirm }
19 | } = this.props;
20 | const {
21 | success
22 | } = this.state;
23 | return (
24 | 27 | Please check your email to reset your password. 28 |
29 | } 30 | {!success && 31 | 42 | } 43 |
25 | {success &&
26 |
46 | );
47 | }
48 | }
49 |
50 | ChangeEmailForm = reduxForm({
51 | form: 'changeEmail',
52 | fields: ['currentPassword', 'email', 'emailConfirm']
53 | },
54 | (state) => state,
55 | { }
56 | )(ChangeEmailForm);
57 |
58 | export default ChangeEmailForm;
59 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/redux/modules/manage/email.js:
--------------------------------------------------------------------------------
1 | export const LOADEMAIL_START = 'react/manage/LOADEMAIL_START';
2 | export const LOADEMAIL_COMPLETE = 'react/manage/LOADEMAIL_COMPLETE';
3 | export const LOADEMAIL_ERROR = 'react/manage/LOADEMAIL_ERROR';
4 |
5 | export const CHANGEEMAIL_START = 'react/manage/CHANGEEMAIL_START';
6 | export const CHANGEEMAIL_COMPLETE = 'react/manage/CHANGEEMAIL_COMPLETE';
7 | export const CHANGEEMAIL_ERROR = 'react/manage/CHANGEEMAIL_ERROR';
8 |
9 | export const VERIFYEMAIL_START = 'react/manage/VERIFYEMAIL_START';
10 | export const VERIFYEMAIL_COMPLETE = 'react/manage/VERIFYEMAIL_COMPLETE';
11 | export const VERIFYEMAIL_ERROR = 'react/manage/VERIFYEMAIL_ERROR';
12 |
13 | export const EMAIL_DESTROY = 'react/manage/EMAIL_DESTROY';
14 |
15 | const initialState = {
16 |
17 | };
18 |
19 | export default function (state = initialState, action = {}) {
20 | switch (action.type) {
21 | case LOADEMAIL_COMPLETE:
22 | return {
23 | ...state,
24 | ...action.result
25 | };
26 | case EMAIL_DESTROY:
27 | return initialState;
28 | default:
29 | return state;
30 | }
31 | }
32 |
33 | export function loadEmail() {
34 | return {
35 | types: [LOADEMAIL_START, LOADEMAIL_COMPLETE, LOADEMAIL_ERROR],
36 | promise: (client) => client.post('/api/manage/email')
37 | };
38 | }
39 |
40 | export function destroyEmail() {
41 | return { type: EMAIL_DESTROY };
42 | }
43 |
44 | export function changeEmail(body) {
45 | return {
46 | types: [CHANGEEMAIL_START, CHANGEEMAIL_COMPLETE, CHANGEEMAIL_ERROR],
47 | promise: (client) => client.post('/api/manage/changeemail', { data: body })
48 | };
49 | }
50 |
51 | export function verifyEmail(body) {
52 | return {
53 | types: [VERIFYEMAIL_START, VERIFYEMAIL_COMPLETE, VERIFYEMAIL_ERROR],
54 | promise: (client) => client.post('/api/manage/verifyemail', { data: body })
55 | };
56 | }
57 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/gulpfile.js:
--------------------------------------------------------------------------------
1 | "use strict";
2 |
3 | var isProduction = process.env.NODE_ENV == 'production';
4 | console.log('isProduction=' + isProduction);
5 |
6 | var gulp = require('gulp');
7 | var gutil = require('gulp-util');
8 | var extend = require('lodash').extend;
9 | var webpack = require('webpack');
10 | var webpackConfig = {
11 | config: require("./Scripts/webpack/" + (isProduction ? "prod" : "dev") + ".config.js")
12 | };
13 |
14 | gulp.task('default', ['build']);
15 | gulp.task('build', ['build-client', 'build-server']);
16 | gulp.task('watch', ['watch-client', 'watch-server'])
17 |
18 | // client
19 | gulp.task('watch-client', ['build-client'], function(){
20 | gulp.watch(["Scripts/**/*"], ["build-client"]);
21 | })
22 | gulp.task('build-client-compiler', function() {
23 | if(!webpackConfig.clientCompiler)
24 | webpackConfig.clientCompiler = webpack(webpackConfig.config.client);
25 | });
26 | gulp.task('build-client', ['build-client-compiler'], function(cb) {
27 | webpackConfig.clientCompiler.run(function(err, stats) {
28 | if(err) throw new gutil.PluginError("build-client", err);
29 | gutil.log("[build-client]", stats.toString({
30 | colors: true,
31 | chunks: false
32 | }));
33 | cb();
34 | });
35 | });
36 |
37 | // server
38 | gulp.task('watch-server', ['build-server'], function(){
39 | gulp.watch(["Scripts/**/*"], ["build-server"]);
40 | })
41 | gulp.task('build-server-compiler', function() {
42 | if(!webpackConfig.serverCompiler)
43 | webpackConfig.serverCompiler = webpack(webpackConfig.config.server);
44 | });
45 | gulp.task('build-server', ['build-server-compiler'], function(cb) {
46 | webpackConfig.serverCompiler.run(function(err, stats) {
47 | if(err) throw new gutil.PluginError("build-server", err);
48 | gutil.log("[build-server]", stats.toString({
49 | colors: true,
50 | chunks: false
51 | }));
52 | cb();
53 | });
54 | });
55 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/components/ChangePasswordForm/ChangePasswordForm.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import Form from 'components/Form';
3 | import { reduxForm } from 'redux-form';
4 | import { Input } from 'components';
5 | import { changePassword } from 'redux/modules/manage';
6 |
7 | class ChangePasswordForm extends Form {
8 | constructor(props) {
9 | super(props);
10 | this.success = this.success.bind(this);
11 | this.state = { success: false };
12 | }
13 | success() {
14 | this.setState({ success: true });
15 | }
16 | render() {
17 | const {
18 | fields: { oldPassword, newPassword, newPasswordConfirm }
19 | } = this.props;
20 | const {
21 | success
22 | } = this.state;
23 | return (
24 | 27 | An email has been sent to your email to confirm the change. 28 |
29 | } 30 | {!success && 31 | 44 | } 45 |
25 | {success &&
26 |
46 | );
47 | }
48 | }
49 |
50 | ChangePasswordForm = reduxForm({
51 | form: 'changePassword',
52 | fields: ['oldPassword', 'newPassword', 'newPasswordConfirm']
53 | },
54 | (state) => state,
55 | { }
56 | )(ChangePasswordForm);
57 |
58 | export default ChangePasswordForm;
59 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/routes.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { IndexRoute, Route } from 'react-router';
3 | import {
4 | App,
5 | Home,
6 | About,
7 | Contact,
8 | NotFound,
9 | Register,
10 | Login,
11 | ForgotPassword,
12 | ResetPassword,
13 | ConfirmEmail,
14 | Manage,
15 | ManageIndex,
16 | ManageSecurity,
17 | ManageChangePassword,
18 | ManageLogins,
19 | ManageEmail
20 | } from './containers';
21 |
22 | export default (store) => {
23 | const requireLogin = (nextState, replace, cb) => {
24 | const { auth: { user } } = store.getState();
25 | if (!user) {
26 | // oops, not logged in, so can't be here!
27 | replace('/login?returnUrl=' +
28 | encodeURIComponent(nextState.location.pathname + nextState.location.search));
29 | }
30 | cb();
31 | };
32 | return (
33 | 27 | Your password has been changed. 28 |
29 | } 30 | {!success && 31 | 44 | } 45 |
36 |
37 | Two-factor authentication is {twoFactorEnabled ? 'enabled' : 'disabled'}.
38 |
39 | 44 |
45 | {(twoFactorEnabled && validTwoFactorProviders.length === 0) &&
46 |
47 | Although you have two-factor authentication enabled, you have no valid providers to authenticate with.
48 |
49 | }
50 |
51 | );
52 | }
53 | }
54 |
55 | export default connect(
56 | (state) => ({ security: state.manage.security }),
57 | { loadSecurity, destroySecurity, setTwoFactor }
58 | )(Security);
59 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/server.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import ReactDOM from 'react-dom/server';
3 | import Html from './helpers/Html';
4 | import { match } from 'react-router';
5 | import getRoutes from './routes';
6 | import createHistory from 'react-router/lib/createMemoryHistory';
7 | import RouterContext from 'react-router/lib/RouterContext';
8 | import configureStore from './redux/configureStore';
9 | import { Provider } from 'react-redux';
10 | import isEmpty from 'utils/isEmpty';
11 |
12 | export function renderView(callback, path, model, viewBag) {
13 | const history = createHistory(path);
14 | const store = configureStore(model, history);
15 | const result = {
16 | html: null,
17 | status: 404,
18 | redirect: null
19 | };
20 | match(
21 | { history, routes: getRoutes(store), location: path },
22 | (error, redirectLocation, renderProps) => {
23 | if (redirectLocation) {
24 | result.redirect = redirectLocation.pathname + redirectLocation.search;
25 | } else if (error) {
26 | result.status = 500;
27 | } else if (renderProps) {
28 | // if this is the NotFoundRoute, then return a 404
29 | const isNotFound = renderProps.routes.filter((route) => route.status === 404).length > 0;
30 | result.status = isNotFound ? 404 : 200;
31 | const component =
32 | (
33 | 39 | 44 |
32 | {success &&
33 |
53 | );
54 | }
55 | }
56 |
57 | ResetPasswordForm = reduxForm({
58 | form: 'resetPassword',
59 | fields: ['email', 'password', 'passwordConfirm']
60 | },
61 | (state) => {
62 | let code = null;
63 | if (state.routing.locationBeforeTransitions) {
64 | if (state.routing.locationBeforeTransitions.query) {
65 | code = state.routing.locationBeforeTransitions.query.code;
66 | }
67 | }
68 | return {
69 | code
70 | };
71 | },
72 | { }
73 | )(ResetPasswordForm);
74 |
75 | export default ResetPasswordForm;
76 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/containers/Manage/Email/Email.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import { connect } from 'react-redux';
3 | import { loadEmail, destroyEmail, verifyEmail } from 'redux/modules/manage';
4 | import { ChangeEmailForm, Spinner } from 'components';
5 | import { Alert, Button } from 'react-bootstrap';
6 |
7 | class Email extends Component {
8 | constructor(props) {
9 | super(props);
10 | this.verifyClick = this.verifyClick.bind(this);
11 | this.state = { sendingEmailVerification: false };
12 | }
13 | componentDidMount() {
14 | this.props.loadEmail();
15 | }
16 | componentWillUnmount() {
17 | this.props.destroyEmail();
18 | }
19 | verifyClick(event) {
20 | event.preventDefault();
21 | this.setState({ sendingEmailVerification: true });
22 | this.props.verifyEmail()
23 | .then(() => {
24 | this.setState({ sendingEmailVerification: false });
25 | }, () => {
26 | this.setState({ sendingEmailVerification: false });
27 | });
28 | }
29 | render() {
30 | const {
31 | email,
32 | emailConfirmed
33 | } = this.props.email;
34 | const {
35 | sendingEmailVerification
36 | } = this.state;
37 | console.log(email);
38 | if (typeof email === 'undefined') {
39 | return (34 | Your password has been reset. Please Click here to log in. 35 |
36 | } 37 | {!success && 38 | 51 | } 52 |
43 | Email
44 |
54 | Your email is not verified.
55 |
56 | 61 |
62 | }
63 |
66 | );
67 | }
68 | }
69 |
70 | export default connect(
71 | (state) => ({ email: state.manage.email }),
72 | { loadEmail, destroyEmail, verifyEmail }
73 | )(Email);
74 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/containers/Login/Login.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import { LoginForm } from 'components';
3 | import { connect } from 'react-redux';
4 | import { push } from 'react-router-redux';
5 | import { Link } from 'react-router';
6 | import { rehydrateLogin } from 'redux/modules/externalLogin';
7 |
8 | class Login extends Component {
9 | componentWillReceiveProps(nextProps) {
10 | // if the user logged in, redirect the user.
11 | if (!this.props.user && nextProps.user) {
12 | if (this.props.location.query.returnUrl) {
13 | this.props.pushState(this.props.location.query.returnUrl);
14 | } else {
15 | this.props.pushState('/');
16 | }
17 | return;
18 | }
19 | // if the user was externally authenticated, but wasn't registered,
20 | // redirect the user to the register.
21 | if (!this.props.externalLogin.externalAuthenticated && nextProps.externalLogin.externalAuthenticated) {
22 | if (nextProps.externalLogin.signInError) {
23 | // The user requires two-factor login or is locked out.
24 | // This means the user is already registered, so no need
25 | // to redirect to register page.
26 | return;
27 | }
28 |
29 | let registerUrl = '/register';
30 | if (this.props.location.query.returnUrl) {
31 | registerUrl += '?returnUrl=' + this.props.location.query.returnUrl;
32 | }
33 | this.props.pushState(registerUrl);
34 | // whenever we navigate to a new page, the external login info is cleared.
35 | // however, when we navigate to the register page, we want to this info
36 | // so that the register page can associte the external login to the new
37 | // account.
38 | // So, every the `pushState` call clears out `externalLogin`, we will
39 | // need to put it back in
40 | this.props.rehydrateLogin(nextProps.externalLogin);
41 | return;
42 | }
43 | }
44 | render() {
45 | return (
46 |
45 |
52 | {!emailConfirmed &&
53 |
46 |
47 |
51 |
48 |
50 | {email}
49 |56 | 61 |
Change your email
64 |
47 |
49 |
57 | );
58 | }
59 | }
60 |
61 | export default connect(
62 | state => ({ user: state.auth.user, externalLogin: state.externalLogin }),
63 | { pushState: push, rehydrateLogin }
64 | )(Login);
65 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/redux/modules/manage/externalLogins.js:
--------------------------------------------------------------------------------
1 | export const LOADEXTERNALLOGINS_START = 'react/manage/LOADEXTERNALLOGINS_START';
2 | export const LOADEXTERNALLOGINS_COMPLETE = 'react/manage/LOADEXTERNALLOGINS_COMPLETE';
3 | export const LOADEXTERNALLOGINS_ERROR = 'react/manage/LOADEXTERNALLOGINS_ERROR';
4 |
5 | export const ADDEXTERNALLOGIN_START = 'react/manage/ADDEXTERNALLOGIN_START';
6 | export const ADDEXTERNALLOGIN_COMPLETE = 'react/manage/ADDEXTERNALLOGIN_COMPLETE';
7 | export const ADDEXTERNALLOGIN_ERROR = 'react/manage/ADDEXTERNALLOGIN_ERROR';
8 |
9 | export const REMOVEEXTERNALLOGIN_START = 'react/manage/REMOVEEXTERNALLOGIN_START';
10 | export const REMOVEEXTERNALLOGIN_COMPLETE = 'react/manage/REMOVEEXTERNALLOGIN_COMPLETE';
11 | export const REMOVEEXTERNALLOGIN_ERROR = 'react/manage/REMOVEEXTERNALLOGIN_ERROR';
12 |
13 | export const EXTERNALLOGINS_DESTROY = 'react/manage/EXTERNALLOGINS_DESTROY';
14 |
15 | export default function (state = {}, action = {}) {
16 | switch (action.type) {
17 | case LOADEXTERNALLOGINS_START:
18 | return {
19 | ...state,
20 | loading: true
21 | };
22 | case LOADEXTERNALLOGINS_COMPLETE:
23 | case ADDEXTERNALLOGIN_COMPLETE:
24 | case REMOVEEXTERNALLOGIN_COMPLETE:
25 | return {
26 | ...state,
27 | loading: false,
28 | ...action.result.externalLogins,
29 | errors: action.result.errors
30 | };
31 | case LOADEXTERNALLOGINS_ERROR:
32 | return {
33 | ...state,
34 | loading: false,
35 | ...action.result.externalLogins
36 | };
37 | case EXTERNALLOGINS_DESTROY:
38 | return {};
39 | default:
40 | return state;
41 | }
42 | }
43 |
44 | export function loadExternalLogins() {
45 | return {
46 | types: [LOADEXTERNALLOGINS_START, LOADEXTERNALLOGINS_COMPLETE, LOADEXTERNALLOGINS_ERROR],
47 | promise: (client) => client.post('/api/manage/externallogins')
48 | };
49 | }
50 |
51 | export function destroyExternalLogins() {
52 | return { type: EXTERNALLOGINS_DESTROY };
53 | }
54 |
55 | export function addExternalLogin() {
56 | return {
57 | types: [ADDEXTERNALLOGIN_START, ADDEXTERNALLOGIN_COMPLETE, ADDEXTERNALLOGIN_ERROR],
58 | promise: (client) => client.post('/api/manage/addexternallogin')
59 | };
60 | }
61 |
62 | export function removeExternalLogin(body) {
63 | return {
64 | types: [REMOVEEXTERNALLOGIN_START, REMOVEEXTERNALLOGIN_COMPLETE, REMOVEEXTERNALLOGIN_ERROR],
65 | promise: (client) => client.post('/api/manage/removeexternallogin', { data: body })
66 | };
67 | }
68 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Controllers/BaseController.cs:
--------------------------------------------------------------------------------
1 | using System.Linq;
2 | using System.Threading.Tasks;
3 | using Microsoft.AspNetCore.Identity;
4 | using Microsoft.AspNetCore.Mvc;
5 | using ReactBoilerplate.Models;
6 | using ReactBoilerplate.State;
7 |
8 | namespace ReactBoilerplate.Controllers
9 | {
10 | public class BaseController : Controller
11 | {
12 | UserManagerLogin
48 |49 |
51 | Register as a new user? 52 |
53 |54 | Forgot your password? 55 |
56 |
10 |
12 |
13 | })
18 |
27 |
28 | })
33 |
42 |
43 | })
48 |
58 |
59 | })
64 |
74 |
75 |
76 | );
77 | }
78 | }
79 |
80 | function mapStateToProps(state) {
81 | return state;
82 | }
83 |
84 | function mapDispatchToProps() {
85 | return {};
86 | }
87 |
88 | export default connect(
89 | mapStateToProps,
90 | mapDispatchToProps
91 | )(Home);
92 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/containers/App/App.js:
--------------------------------------------------------------------------------
1 | import React, { Component, PropTypes } from 'react';
2 | import { connect } from 'react-redux';
3 | import Helmet from 'react-helmet';
4 | import config from '../../config';
5 | import { IndexLink } from 'react-router';
6 | import { LinkContainer, IndexLinkContainer } from 'react-router-bootstrap';
7 | import Navbar from 'react-bootstrap/lib/Navbar';
8 | import Nav from 'react-bootstrap/lib/Nav';
9 | import NavItem from 'react-bootstrap/lib/NavItem';
10 | import { logoff } from '../../redux/modules/account';
11 | import { push } from 'react-router-redux';
12 | import TwoFactorModal from './Modals/TwoFactorModal';
13 |
14 | require('./App.scss');
15 |
16 | class App extends Component {
17 | static propTypes = {
18 | children: PropTypes.object.isRequired
19 | };
20 | constructor(props) {
21 | super(props);
22 | this.logoffClick = this.logoffClick.bind(this);
23 | }
24 | logoffClick() {
25 | this.props.logoff();
26 | this.props.pushState('/');
27 | }
28 | renderLoggedInLinks(user) {
29 | return (
30 |
38 | );
39 | }
40 | renderAnonymousLinks() {
41 | return (
42 |
50 | );
51 | }
52 | render() {
53 | const {
54 | user
55 | } = this.props;
56 | let loginLinks;
57 | if (user) {
58 | loginLinks = this.renderLoggedInLinks(user);
59 | } else {
60 | loginLinks = this.renderAnonymousLinks();
61 | }
62 | return (
63 |
18 |
19 |
26 | 20 | Learn how to build ASP.NET apps that can run anywhere. 21 | 22 | Learn More 23 | 24 |
25 |
33 |
34 |
41 | 35 | There are powerful new features in Visual Studio for building modern web apps. 36 | 37 | Learn More 38 | 39 |
40 |
48 |
49 |
57 | 50 | Bring in libraries from NuGet, Bower, and npm, and automate 51 | tasks using Grunt or Gulp. 52 | 53 | Learn More 54 | 55 |
56 |
64 |
65 |
73 | 66 | Learn how Microsoft's Azure cloud platform allows you to build, 67 | deploy, and scale web apps. 68 | 69 | Learn More 70 | 71 |
72 |
64 |
66 |
67 |
68 |
69 | {config.app.title}
70 |
71 |
72 |
74 |
75 |
86 | {loginLinks}
87 |
88 |
89 |
98 | );
99 | }
100 | }
101 |
102 | export default connect(
103 | state => ({ user: state.auth.user }),
104 | { logoff, pushState: push }
105 | )(App);
106 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/webpack/prod.config.js:
--------------------------------------------------------------------------------
1 | var fs = require('fs');
2 | var babelrc = JSON.parse(fs.readFileSync('./.babelrc'));
3 | var ExtractTextPlugin = require('extract-text-webpack-plugin');
4 | var extractCSS = new ExtractTextPlugin('styles.css');
5 | var webpack = require('webpack');
6 | var path = require('path');
7 |
8 | module.exports = {
9 | server : {
10 | entry: {
11 | server: [
12 | path.resolve(__dirname, '..', '..', 'Scripts', 'server.js')
13 | ]
14 | },
15 | resolve: {
16 | modulesDirectories: [
17 | 'Scripts',
18 | 'node_modules'
19 | ],
20 | alias: {
21 | 'superagent': path.resolve(__dirname, '..', 'utils', 'superagent-server.js'),
22 | 'promise-window': path.resolve(__dirname, '..', 'utils', 'promise-window-server.js')
23 | },
24 | },
25 | module: {
26 | loaders: [
27 | { test: /\.jsx?$/, exclude: /node_modules/, loaders: ['babel?' + JSON.stringify(babelrc), 'eslint'] },
28 | { test: /\.css$/, loader: 'css/locals?module' },
29 | { test: /\.scss$/, loader: 'css/locals?module!sass' },
30 | { test: /\.(woff2?|ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'file' },
31 | { test: /\.(jpeg|jpeg|gif|png|tiff)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'file' }
32 | ]
33 | },
34 | output: {
35 | filename: '[name].generated.js',
36 | libraryTarget: 'this',
37 | path: path.resolve(__dirname, '..', '..', 'wwwroot', 'pack'),
38 | publicPath: '/pack/'
39 | },
40 | plugins: [
41 | new webpack.optimize.DedupePlugin(),
42 | new webpack.optimize.OccurenceOrderPlugin(),
43 | new webpack.optimize.UglifyJsPlugin({
44 | compress: {
45 | warnings: false
46 | }
47 | }),
48 | new webpack.DefinePlugin({
49 | 'process.env': {
50 | NODE_ENV: '"production"'
51 | },
52 | __CLIENT__: false,
53 | __SERVER__: true
54 | })
55 | ]
56 | },
57 | client: {
58 | entry: {
59 | 'client': [
60 | 'bootstrap-loader',
61 | path.resolve(__dirname, '..', '..', 'Scripts', 'client.js')
62 | ]
63 | },
64 | resolve: {
65 | modulesDirectories: [
66 | 'Scripts',
67 | 'node_modules'
68 | ]
69 | },
70 | module: {
71 | loaders: [
72 | { test: /\.jsx?$/, exclude: /node_modules/, loaders: ['babel?' + JSON.stringify(babelrc), 'eslint'] },
73 | { test: /\.css$/, loader: extractCSS.extract('style', 'css?modules') },
74 | { test: /\.scss$/, loader: extractCSS.extract('style', 'css?modules!sass') },
75 | { test: /\.(woff2?|ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'file' },
76 | { test: /\.(jpeg|jpeg|gif|png|tiff)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'file' }
77 | ]
78 | },
79 | output: {
80 | filename: '[name].generated.js',
81 | libraryTarget: 'this',
82 | path: path.resolve(__dirname, '..', '..', 'wwwroot', 'pack'),
83 | publicPath: '/pack/'
84 | },
85 | plugins: [
86 | extractCSS,
87 | new webpack.optimize.DedupePlugin(),
88 | new webpack.optimize.OccurenceOrderPlugin(),
89 | new webpack.optimize.UglifyJsPlugin({
90 | compress: {
91 | warnings: false
92 | }
93 | }),
94 | new webpack.DefinePlugin({
95 | 'process.env': {
96 | NODE_ENV: '"production"'
97 | },
98 | __CLIENT__: true,
99 | __SERVER__: false
100 | })
101 | ]
102 | }
103 | };
104 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # react-aspnet-boilerplate
2 |
90 | {this.props.children}
91 |
92 | 95 |
96 | 92 | 95 |
3 | 
4 |
43 | {errors.map((err, i) =>
44 | (
45 |
54 | );
55 | }
56 | renderInput() {
57 | return (
58 |
65 | );
66 | }
67 | renderOption() {
68 | const {
69 | options
70 | } = this.props;
71 | return (
72 |
83 | );
84 | }
85 | renderCheckBox() {
86 | return (
87 |
48 |
88 |
89 |
90 |
91 | );
92 | }
93 | render() {
94 | let hasError = false;
95 | let errors;
96 | if (this.props.field.touched && this.props.field.invalid) {
97 | hasError = true;
98 | errors = this.props.field.error.errors;
99 | if (!Array.isArray(errors)) {
100 | console.error('The errors object does not seem to be an array of errors.'); // eslint-disable-line max-len
101 | errors = null;
102 | }
103 | if (errors.length === 0) {
104 | console.error('The errors array is empty. If it is empty, no array should be provided, the field is valid.'); // eslint-disable-line max-len
105 | }
106 | }
107 | const rowClass = classNames({
108 | 'form-group': true,
109 | 'has-error': hasError,
110 | });
111 | let input;
112 | switch (this.props.type) {
113 | case 'password':
114 | case 'text':
115 | input = this.renderInput();
116 | break;
117 | case 'option':
118 | input = this.renderOption();
119 | break;
120 | case 'checkbox':
121 | input = this.renderCheckBox();
122 | break;
123 | default:
124 | throw new Error('unknown type');
125 | }
126 | return (
127 |
128 | {(this.props.type !== 'checkbox') &&
129 |
130 | }
131 |
136 | );
137 | }
138 | }
139 |
140 | Input.defaultProps = {
141 | type: 'text'
142 | };
143 |
144 | export default Input;
145 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/containers/Manage/Logins/Logins.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import { connect } from 'react-redux';
3 | import { loadExternalLogins, destroyExternalLogins, addExternalLogin, removeExternalLogin } from 'redux/modules/manage';
4 | import { authenticate as externalAuthenticate, clearAuthentication as clearExternalAuthentication } from 'redux/modules/externalLogin';
5 | import { Button } from 'react-bootstrap';
6 | import { ExternalLoginButton, Spinner, ErrorList } from 'components';
7 |
8 | class Logins extends Component {
9 | constructor(props) {
10 | super(props);
11 | this.addButtonClick = this.addButtonClick.bind(this);
12 | this.removeButtonClick = this.removeButtonClick.bind(this);
13 | }
14 | componentDidMount() {
15 | this.props.loadExternalLogins();
16 | }
17 | componentWillUnmount() {
18 | this.props.destroyExternalLogins();
19 | }
20 | addButtonClick(scheme) {
21 | return (event) => {
22 | event.preventDefault();
23 | this.props.externalAuthenticate(scheme, false /* don't auto sign-in */)
24 | .then((result) => {
25 | this.props.clearExternalAuthentication();
26 | if (result.externalAuthenticated) {
27 | // the user succesfully authenticated with the service.
28 | // add the login to this account.
29 | this.props.addExternalLogin();
30 | }
31 | }, () => {
32 | this.props.clearExternalAuthentication();
33 | });
34 | };
35 | }
36 | removeButtonClick(scheme) {
37 | return (event) => {
38 | event.preventDefault();
39 | this.props.removeExternalLogin(scheme);
40 | };
41 | }
42 | render() {
43 | if (this.props.externalLogins.loading) {
44 | return (
132 | {input}
133 | {this.renderErrorList(errors)}
134 |
135 |
56 |
107 | );
108 | }
109 | }
110 |
111 | export default connect(
112 | state => ({ externalLogins: state.manage.externalLogins }),
113 | { loadExternalLogins, destroyExternalLogins, externalAuthenticate, clearExternalAuthentication, addExternalLogin, removeExternalLogin }
114 | )(Logins);
115 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/redux/modules/externalLogin.js:
--------------------------------------------------------------------------------
1 | import promiseWindow from 'promise-window';
2 | import { LOGOFF_COMPLETE, LOGINSTATE_RESET } from 'redux/modules/account';
3 | import { LOCATION_CHANGE } from 'react-router-redux';
4 |
5 | export const EXTERNALAUTHENTICATE_START = 'react/externalLogin/EXTERNALAUTHENTICATE_START';
6 | export const EXTERNALAUTHENTICATE_COMPLETE = 'react/externalLogin/EXTERNALAUTHENTICATE_COMPLETE';
7 | export const EXTERNALAUTHENTICATE_ERROR = 'react/externalLogin/EXTERNALAUTHENTICATE_ERROR';
8 |
9 | export const EXTERNALAUTHENTICATE_CLEAR = 'react/externalLogin/EXTERNALAUTHENTICATE_CLEAR';
10 | export const EXTERNALAUTHENTICATE_REHYDATE = 'react/externalLogin/EXTERNALAUTHENTICATE_REHYDATE';
11 |
12 | function popupWindowSize(provider) {
13 | switch (provider.toLowerCase()) {
14 | case 'facebook':
15 | return { width: 580, height: 400 };
16 | case 'google':
17 | return { width: 452, height: 633 };
18 | case 'github':
19 | return { width: 1020, height: 618 };
20 | case 'linkedin':
21 | return { width: 527, height: 582 };
22 | case 'twitter':
23 | return { width: 495, height: 645 };
24 | case 'live':
25 | return { width: 500, height: 560 };
26 | case 'yahoo':
27 | return { width: 559, height: 519 };
28 | default:
29 | return { width: 1020, height: 618 };
30 | }
31 | }
32 |
33 | const initialState = {
34 | loginProviders: [], // it is up to the server to provide these values
35 | externalAuthenticated: false,
36 | externalAuthenticatedProvider: null,
37 | signInError: false,
38 | proposedEmail: '',
39 | proposedUserName: ''
40 | };
41 |
42 | export default function reducer(state = initialState, action = {}) {
43 | switch (action.type) {
44 | case EXTERNALAUTHENTICATE_REHYDATE:
45 | return {
46 | ...state,
47 | ...action.result
48 | };
49 | case EXTERNALAUTHENTICATE_COMPLETE:
50 | if (action.result.signInError) {
51 | // We have a valid account with this external login,
52 | // but we couldn't login for some reason.
53 | // We don't want to store this login though, because
54 | // either a two-factor modal will popup will show,
55 | // or lockout message will show to the user.
56 | // Either way, there is no reason to store this external
57 | // login. We can't register with it, or login with it.
58 | return {
59 | ...state,
60 | externalAuthenticated: false,
61 | externalAuthenticatedProvider: null,
62 | signInError: false,
63 | proposedEmail: '',
64 | proposedUserName: ''
65 | };
66 | }
67 | return {
68 | ...state,
69 | externalAuthenticated: action.result.externalAuthenticated,
70 | externalAuthenticatedProvider: action.result.loginProvider,
71 | signInError: action.result.signInError,
72 | proposedEmail: action.result.proposedEmail,
73 | proposedUserName: action.result.proposedUserName
74 | };
75 | case EXTERNALAUTHENTICATE_CLEAR: // when some requests to clear any previously stored external authentications
76 | case LOGOFF_COMPLETE: // when a user logs off
77 | case LOCATION_CHANGE: // when the user navigates to different pages, we want to clear the user's logged in provider.
78 | case LOGINSTATE_RESET:
79 | // let's clear out the any previously stored external authentications that were done on the client.
80 | return {
81 | ...state,
82 | externalAuthenticated: false,
83 | externalAuthenticatedProvider: null,
84 | signInError: false,
85 | proposedEmail: '',
86 | proposedUserName: ''
87 | };
88 | default:
89 | return state;
90 | }
91 | }
92 |
93 | export function authenticate(provider, autoLogin = true) {
94 | return {
95 | types: [EXTERNALAUTHENTICATE_START, EXTERNALAUTHENTICATE_COMPLETE, EXTERNALAUTHENTICATE_ERROR],
96 | promise: () => new Promise((result, reject) => {
97 | const windowSize = popupWindowSize(provider);
98 | promiseWindow.open('/externalloginredirect?provider=' + provider + '&autoLogin=' + autoLogin, { ...windowSize })
99 | .then((windowResult) => {
100 | result(windowResult);
101 | }, () => {
102 | reject({});
103 | });
104 | })
105 | };
106 | }
107 |
108 | export function rehydrateLogin(login) {
109 | return {
110 | type: EXTERNALAUTHENTICATE_REHYDATE,
111 | result: login
112 | };
113 | }
114 |
115 | export function clearAuthentication() {
116 | return {
117 | type: EXTERNALAUTHENTICATE_CLEAR
118 | };
119 | }
120 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Scripts/redux/modules/account.js:
--------------------------------------------------------------------------------
1 | export const REGISTER_START = 'react/account/REGISTER_START';
2 | export const REGISTER_COMPLETE = 'react/account/REGISTER_COMPLETE';
3 | export const REGISTER_ERROR = 'react/account/REGISTER_ERROR';
4 |
5 | export const LOGIN_START = 'react/account/LOGIN_START';
6 | export const LOGIN_COMPLETE = 'react/account/LOGIN_COMPLETE';
7 | export const LOGIN_ERROR = 'react/account/LOGIN_ERROR';
8 |
9 | export const LOGOFF_START = 'react/account/LOGOFF_START';
10 | export const LOGOFF_COMPLETE = 'react/account/LOGOFF_COMPLETE';
11 | export const LOGOFF_ERROR = 'react/account/LOGOFF_ERROR';
12 |
13 | export const FORGOTPASSWORD_START = 'react/account/FORGOTPASSWORD_START';
14 | export const FORGOTPASSWORD_COMPLETE = 'react/account/FORGOTPASSWORD_COMPLETE';
15 | export const FORGOTPASSWORD_ERROR = 'react/account/FORGOTPASSWORD_ERROR';
16 |
17 | export const RESETPASSWORD_START = 'react/account/RESETPASSWORD_START';
18 | export const RESETPASSWORD_COMPLETE = 'react/account/RESETPASSWORD_COMPLETE';
19 | export const RESETPASSWORD_ERROR = 'react/account/RESETPASSWORD_ERROR';
20 |
21 | export const SENDCODE_START = 'react/account/SENDCODE_START';
22 | export const SENDCODE_COMPLETE = 'react/account/SENDCODE_COMPLETE';
23 | export const SENDCODE_ERROR = 'react/account/SENDCODE_ERROR';
24 |
25 | export const VERIFYCODE_START = 'react/account/VERIFYCODE_START';
26 | export const VERIFYCODE_COMPLETE = 'react/account/VERIFYCODE_COMPLETE';
27 | export const VERIFYCODE_ERROR = 'react/account/VERIFYCODE_ERROR';
28 |
29 | export const LOGINSTATE_RESET = 'react/account/LOGINSTATE_RESET';
30 |
31 | import { EXTERNALAUTHENTICATE_COMPLETE } from 'redux/modules/externalLogin';
32 |
33 | const initialState = {
34 | sentCode: false,
35 | sentCodeWithProvider: null,
36 | userFactors: null,
37 | requiresTwoFactor: false
38 | };
39 |
40 | export default function reducer(state = initialState, action = {}) {
41 | switch (action.type) {
42 | case LOGINSTATE_RESET:
43 | return initialState;
44 | case LOGIN_COMPLETE:
45 | return {
46 | ...state,
47 | userFactors: action.result.userFactors,
48 | requiresTwoFactor: action.result.requiresTwoFactor
49 | };
50 | case SENDCODE_COMPLETE:
51 | return {
52 | ...state,
53 | sentCode: action.result.success,
54 | sentCodeWithProvider: action.result.provider
55 | };
56 | case EXTERNALAUTHENTICATE_COMPLETE:
57 | if (action.result.requiresTwoFactor) {
58 | return {
59 | ...state,
60 | userFactors: action.result.userFactors,
61 | requiresTwoFactor: true
62 | };
63 | }
64 | return state;
65 | case VERIFYCODE_COMPLETE:
66 | if (action.result.success) {
67 | return initialState; // we logged the user in, reset all the two-factor stuff
68 | }
69 | return state;
70 | default:
71 | return state;
72 | }
73 | }
74 |
75 | export function register(body) {
76 | return {
77 | types: [REGISTER_START, REGISTER_COMPLETE, REGISTER_ERROR],
78 | promise: (client) => client.post('/api/account/register', { data: body })
79 | };
80 | }
81 |
82 | export function login(body) {
83 | return {
84 | types: [LOGIN_START, LOGIN_COMPLETE, LOGIN_ERROR],
85 | promise: (client) => client.post('/api/account/login', { data: body })
86 | };
87 | }
88 |
89 | export function logoff() {
90 | return {
91 | types: [LOGOFF_START, LOGOFF_COMPLETE, LOGOFF_ERROR],
92 | promise: (client) => client.post('/api/account/logoff')
93 | };
94 | }
95 |
96 | export function forgotPassword(body) {
97 | return {
98 | types: [FORGOTPASSWORD_START, FORGOTPASSWORD_COMPLETE, FORGOTPASSWORD_ERROR],
99 | promise: (client) => client.post('/api/account/forgotpassword', { data: body })
100 | };
101 | }
102 |
103 | export function resetPassword(body) {
104 | return {
105 | types: [RESETPASSWORD_START, RESETPASSWORD_COMPLETE, RESETPASSWORD_ERROR],
106 | promise: (client) => client.post('/api/account/resetpassword', { data: body })
107 | };
108 | }
109 |
110 | export function sendCode(body) {
111 | return {
112 | types: [SENDCODE_START, SENDCODE_COMPLETE, SENDCODE_ERROR],
113 | promise: (client) => client.post('/api/account/sendcode', { data: body })
114 | };
115 | }
116 |
117 | export function verifyCode(body) {
118 | return {
119 | types: [VERIFYCODE_START, VERIFYCODE_COMPLETE, VERIFYCODE_ERROR],
120 | promise: (client) => client.post('/api/account/verifycode', { data: body })
121 | };
122 | }
123 |
124 | export function resetLoginState() {
125 | return {
126 | type: LOGINSTATE_RESET
127 | };
128 | }
129 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | ## Ignore Visual Studio temporary files, build results, and
2 | ## files generated by popular Visual Studio add-ons.
3 |
4 | # User-specific files
5 | *.suo
6 | *.user
7 | *.userosscache
8 | *.sln.docstates
9 |
10 | # User-specific files (MonoDevelop/Xamarin Studio)
11 | *.userprefs
12 |
13 | # Build results
14 | [Dd]ebug/
15 | [Dd]ebugPublic/
16 | [Rr]elease/
17 | [Rr]eleases/
18 | x64/
19 | x86/
20 | bld/
21 | [Bb]in/
22 | [Oo]bj/
23 |
24 | # Visual Studio 2015 cache/options directory
25 | .vs/
26 | # Uncomment if you have tasks that create the project's static files in wwwroot
27 | #wwwroot/
28 |
29 | # MSTest test Results
30 | [Tt]est[Rr]esult*/
31 | [Bb]uild[Ll]og.*
32 |
33 | # NUNIT
34 | *.VisualState.xml
35 | TestResult.xml
36 |
37 | # Build Results of an ATL Project
38 | [Dd]ebugPS/
39 | [Rr]eleasePS/
40 | dlldata.c
41 |
42 | # DNX
43 | project.lock.json
44 | artifacts/
45 |
46 | *_i.c
47 | *_p.c
48 | *_i.h
49 | *.ilk
50 | *.meta
51 | *.obj
52 | *.pch
53 | *.pdb
54 | *.pgc
55 | *.pgd
56 | *.rsp
57 | *.sbr
58 | *.tlb
59 | *.tli
60 | *.tlh
61 | *.tmp
62 | *.tmp_proj
63 | *.log
64 | *.vspscc
65 | *.vssscc
66 | .builds
67 | *.pidb
68 | *.svclog
69 | *.scc
70 |
71 | # Chutzpah Test files
72 | _Chutzpah*
73 |
74 | # Visual C++ cache files
75 | ipch/
76 | *.aps
77 | *.ncb
78 | *.opendb
79 | *.opensdf
80 | *.sdf
81 | *.cachefile
82 |
83 | # Visual Studio profiler
84 | *.psess
85 | *.vsp
86 | *.vspx
87 | *.sap
88 |
89 | # TFS 2012 Local Workspace
90 | $tf/
91 |
92 | # Guidance Automation Toolkit
93 | *.gpState
94 |
95 | # ReSharper is a .NET coding add-in
96 | _ReSharper*/
97 | *.[Rr]e[Ss]harper
98 | *.DotSettings.user
99 |
100 | # JustCode is a .NET coding add-in
101 | .JustCode
102 |
103 | # TeamCity is a build add-in
104 | _TeamCity*
105 |
106 | # DotCover is a Code Coverage Tool
107 | *.dotCover
108 |
109 | # NCrunch
110 | _NCrunch_*
111 | .*crunch*.local.xml
112 | nCrunchTemp_*
113 |
114 | # MightyMoose
115 | *.mm.*
116 | AutoTest.Net/
117 |
118 | # Web workbench (sass)
119 | .sass-cache/
120 |
121 | # Installshield output folder
122 | [Ee]xpress/
123 |
124 | # DocProject is a documentation generator add-in
125 | DocProject/buildhelp/
126 | DocProject/Help/*.HxT
127 | DocProject/Help/*.HxC
128 | DocProject/Help/*.hhc
129 | DocProject/Help/*.hhk
130 | DocProject/Help/*.hhp
131 | DocProject/Help/Html2
132 | DocProject/Help/html
133 |
134 | # Click-Once directory
135 | publish/
136 |
137 | # Publish Web Output
138 | *.[Pp]ublish.xml
139 | *.azurePubxml
140 | # TODO: Comment the next line if you want to checkin your web deploy settings
141 | # but database connection strings (with potential passwords) will be unencrypted
142 | *.pubxml
143 | *.publishproj
144 |
145 | # NuGet Packages
146 | *.nupkg
147 | # The packages folder can be ignored because of Package Restore
148 | **/packages/*
149 | # except build/, which is used as an MSBuild target.
150 | !**/packages/build/
151 | # Uncomment if necessary however generally it will be regenerated when needed
152 | #!**/packages/repositories.config
153 | # NuGet v3's project.json files produces more ignoreable files
154 | *.nuget.props
155 | *.nuget.targets
156 |
157 | # Microsoft Azure Build Output
158 | csx/
159 | *.build.csdef
160 |
161 | # Microsoft Azure Emulator
162 | ecf/
163 | rcf/
164 |
165 | # Microsoft Azure ApplicationInsights config file
166 | ApplicationInsights.config
167 |
168 | # Windows Store app package directory
169 | AppPackages/
170 | BundleArtifacts/
171 |
172 | # Visual Studio cache files
173 | # files ending in .cache can be ignored
174 | *.[Cc]ache
175 | # but keep track of directories ending in .cache
176 | !*.[Cc]ache/
177 |
178 | # Others
179 | ClientBin/
180 | ~$*
181 | *~
182 | *.dbmdl
183 | *.dbproj.schemaview
184 | *.pfx
185 | *.publishsettings
186 | node_modules/
187 | orleans.codegen.cs
188 |
189 | # RIA/Silverlight projects
190 | Generated_Code/
191 |
192 | # Backup & report files from converting an old project file
193 | # to a newer Visual Studio version. Backup files are not needed,
194 | # because we have git ;-)
195 | _UpgradeReport_Files/
196 | Backup*/
197 | UpgradeLog*.XML
198 | UpgradeLog*.htm
199 |
200 | # SQL Server files
201 | *.mdf
202 | *.ldf
203 |
204 | # Business Intelligence projects
205 | *.rdl.data
206 | *.bim.layout
207 | *.bim_*.settings
208 |
209 | # Microsoft Fakes
210 | FakesAssemblies/
211 |
212 | # GhostDoc plugin setting file
213 | *.GhostDoc.xml
214 |
215 | # Node.js Tools for Visual Studio
216 | .ntvs_analysis.dat
217 |
218 | # Visual Studio 6 build log
219 | *.plg
220 |
221 | # Visual Studio 6 workspace options file
222 | *.opt
223 |
224 | # Visual Studio LightSwitch build output
225 | **/*.HTMLClient/GeneratedArtifacts
226 | **/*.DesktopClient/GeneratedArtifacts
227 | **/*.DesktopClient/ModelManifest.xml
228 | **/*.Server/GeneratedArtifacts
229 | **/*.Server/ModelManifest.xml
230 | _Pvt_Extensions
231 |
232 | # Paket dependency manager
233 | .paket/paket.exe
234 |
235 | # FAKE - F# Make
236 | .fake/
237 | src/ReactBoilerplate/bower_components/
238 | src/ReactBoilerplate/wwwroot/
239 | src/ReactBoilerplate/React.sublime-workspace
240 |
--------------------------------------------------------------------------------
/src/ReactBoilerplate/Startup.cs:
--------------------------------------------------------------------------------
1 | using System;
2 | using System.Collections.Generic;
3 | using System.IO;
4 | using JavaScriptViewEngine;
5 | using Microsoft.AspNetCore.Authentication.Cookies;
6 | using Microsoft.AspNetCore.Authentication.Facebook;
7 | using Microsoft.AspNetCore.Authentication.Google;
8 | using Microsoft.AspNetCore.Builder;
9 | using Microsoft.AspNetCore.Hosting;
10 | using Microsoft.AspNetCore.Http;
11 | using Microsoft.AspNetCore.Identity;
12 | using Microsoft.AspNetCore.Identity.EntityFrameworkCore;
13 | using Microsoft.EntityFrameworkCore;
14 | using Microsoft.Extensions.Configuration;
15 | using Microsoft.Extensions.DependencyInjection;
16 | using Microsoft.Extensions.Logging;
17 | using ReactBoilerplate.Models;
18 | using ReactBoilerplate.Services;
19 |
20 | namespace ReactBoilerplate
21 | {
22 | public class Startup
23 | {
24 | IHostingEnvironment _env;
25 | IConfiguration _configuration;
26 | ILoggerFactory _loggerFactory;
27 |
28 | public Startup(IConfiguration configuration, IHostingEnvironment env)
29 | {
30 | _configuration = configuration;
31 | _env = env;
32 | }
33 |
34 | // This method gets called by the runtime. Use this method to add services to the container.
35 | public void ConfigureServices(IServiceCollection services)
36 | {
37 | services.AddJsEngine(builder =>
38 | {
39 | builder.UseSingletonEngineFactory();
40 | builder.UseNodeRenderEngine(nodeOptions =>
41 | {
42 | nodeOptions.ProjectDirectory = Path.Combine(_env.WebRootPath, "pack");
43 | nodeOptions.GetModuleName = (path, model, bag, values, area, type) => "server.generated";
44 | nodeOptions.NodeInstanceOutputLogger = _loggerFactory.CreateLogger("NodeRenderEngine");
45 | });
46 | });
47 | services.AddMvc();
48 |
49 | // Add framework services.
50 | services.AddDbContextManage your external logins
57 |
60 |
62 |
63 | {currentLogins.map((currentLogin, i) =>
64 | (
65 |
80 |
81 | }
82 | {(otherLogins.length > 0) &&
83 | Current logins
61 ||
67 |
70 | {' '}
71 | |
76 |
84 |
86 |
87 | {otherLogins.map((otherLogin, i) =>
88 | (
89 |
104 |
105 | }
106 | Add another service to log in.
85 ||
91 |
94 | {' '}
95 | |
100 |