Skip to content
This repository was archived by the owner on Feb 26, 2020. It is now read-only.

Commit 02c9919

Browse files
authored
Merge pull request #7 from Ik-williams/context-error-fix
fix for context error
2 parents 667c006 + 30c1870 commit 02c9919

File tree

9 files changed

+211
-196
lines changed

9 files changed

+211
-196
lines changed

pages/_app.js

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import React from "react";
2+
import App, { Container } from "next/app";
3+
import { Provider } from "react-redux";
4+
import withRedux from "next-redux-wrapper";
5+
6+
import initStore from "../src/store";
7+
8+
class EnhancedApp extends App {
9+
static async getInitialProps({ Component, ctx }) {
10+
return {
11+
pageProps: Component.getInitialProps
12+
? await Component.getInitialProps(ctx)
13+
: {}
14+
};
15+
}
16+
17+
render() {
18+
const { Component, pageProps, store } = this.props;
19+
return (
20+
<Container>
21+
<Provider store={store}>
22+
<Component {...pageProps} />
23+
</Provider>
24+
</Container>
25+
);
26+
}
27+
}
28+
29+
export default withRedux(initStore)(EnhancedApp);

pages/account.js

Lines changed: 10 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,20 @@
1-
import React from 'react';
2-
import withRedux from 'next-redux-wrapper';
3-
import { connect } from 'react-redux';
4-
import { compose } from 'recompose';
1+
import React from "react";
2+
import { connect } from "react-redux";
53

6-
import initStore from '../src/store';
7-
import { PasswordForgetForm } from './pw-forget';
8-
import { AppWithAuthorization } from '../src/components/App';
9-
import PasswordChangeForm from '../src/components/PasswordChange';
4+
import { PasswordForgetForm } from "./pw-forget";
5+
import { AppWithAuthorization } from "../src/components/App";
6+
import PasswordChangeForm from "../src/components/PasswordChange";
107

11-
const AccountPage = ({ authUser }) =>
8+
const AccountPage = ({ authUser }) => (
129
<AppWithAuthorization>
1310
<h1>Account: {authUser.email}</h1>
1411
<PasswordForgetForm />
1512
<PasswordChangeForm />
1613
</AppWithAuthorization>
14+
);
1715

18-
const mapStateToProps = (state) => ({
19-
authUser: state.sessionState.authUser,
16+
const mapStateToProps = state => ({
17+
authUser: state.sessionState.authUser
2018
});
2119

22-
export default compose(
23-
withRedux(initStore),
24-
connect(mapStateToProps)
25-
)(AccountPage);
20+
export default connect(mapStateToProps)(AccountPage);

pages/home.js

Lines changed: 18 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,10 @@
1-
import React, { Component } from 'react';
2-
import withRedux from 'next-redux-wrapper';
3-
import { connect } from 'react-redux';
4-
import { compose } from 'recompose';
1+
import React, { Component } from "react";
2+
import { connect } from "react-redux";
53

6-
import initStore from '../src/store';
7-
import { AppWithAuthorization } from '../src/components/App';
8-
import { db } from '../src/firebase';
4+
import { AppWithAuthorization } from "../src/components/App";
5+
import { db } from "../src/firebase";
96

10-
const fromObjectToList = (object) =>
7+
const fromObjectToList = object =>
118
object
129
? Object.keys(object).map(key => ({ ...object[key], index: key }))
1310
: [];
@@ -29,29 +26,30 @@ class HomePage extends Component {
2926
<h1>Home</h1>
3027
<p>The Home Page is accessible by every signed in user.</p>
3128

32-
{ !!users.length && <UserList users={users} /> }
29+
{!!users.length && <UserList users={users} />}
3330
</AppWithAuthorization>
3431
);
3532
}
3633
}
3734

38-
const UserList = ({ users }) =>
35+
const UserList = ({ users }) => (
3936
<div>
4037
<h2>List of App User IDs (Saved on Sign Up in Firebase Database)</h2>
41-
{users.map(user =>
38+
{users.map(user => (
4239
<div key={user.index}>{user.index}</div>
43-
)}
40+
))}
4441
</div>
42+
);
4543

46-
const mapStateToProps = (state) => ({
47-
users: state.userState.users,
44+
const mapStateToProps = state => ({
45+
users: state.userState.users
4846
});
4947

50-
const mapDispatchToProps = (dispatch) => ({
51-
onSetUsers: (users) => dispatch({ type: 'USERS_SET', users }),
48+
const mapDispatchToProps = dispatch => ({
49+
onSetUsers: users => dispatch({ type: "USERS_SET", users })
5250
});
5351

54-
export default compose(
55-
withRedux(initStore),
56-
connect(mapStateToProps, mapDispatchToProps)
57-
)(HomePage);
52+
export default connect(
53+
mapStateToProps,
54+
mapDispatchToProps
55+
)(HomePage);

pages/index.js

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
1-
import React from 'react';
2-
import withRedux from 'next-redux-wrapper';
1+
import React from "react";
32

4-
import initStore from '../src/store';
5-
import { AppWithAuthentication } from '../src/components/App';
3+
import { AppWithAuthentication } from "../src/components/App";
64

7-
const LandingPage = () =>
5+
const LandingPage = () => (
86
<AppWithAuthentication>
97
<h1>Landing</h1>
10-
<p>The Landing Page is open to everyone, even though the user isn't signed in.</p>
8+
<p>
9+
The Landing Page is open to everyone, even though the user isn't signed
10+
in.
11+
</p>
1112
</AppWithAuthentication>
12-
13-
export default withRedux(initStore)(LandingPage);
13+
);
14+
export default LandingPage;

pages/pw-forget.js

Lines changed: 28 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,24 @@
1-
import React, { Component } from 'react';
2-
import Link from 'next/link';
3-
import withRedux from 'next-redux-wrapper';
1+
import React, { Component } from "react";
2+
import Link from "next/link";
43

5-
import initStore from '../src/store';
6-
import { AppWithAuthentication } from '../src/components/App';
7-
import * as routes from '../src/constants/routes';
8-
import { auth } from '../src/firebase';
4+
import { AppWithAuthentication } from "../src/components/App";
5+
import * as routes from "../src/constants/routes";
6+
import { auth } from "../src/firebase";
97

10-
const PasswordForgetPage = () =>
8+
const PasswordForgetPage = () => (
119
<AppWithAuthentication>
1210
<h1>PasswordForget</h1>
1311
<PasswordForgetForm />
1412
</AppWithAuthentication>
13+
);
1514

1615
const updateByPropertyName = (propertyName, value) => () => ({
17-
[propertyName]: value,
16+
[propertyName]: value
1817
});
1918

2019
const INITIAL_STATE = {
21-
email: '',
22-
error: null,
20+
email: "",
21+
error: null
2322
};
2423

2524
class PasswordForgetForm extends Component {
@@ -29,54 +28,54 @@ class PasswordForgetForm extends Component {
2928
this.state = { ...INITIAL_STATE };
3029
}
3130

32-
onSubmit = (event) => {
31+
onSubmit = event => {
3332
const { email } = this.state;
3433

35-
auth.doPasswordReset(email)
34+
auth
35+
.doPasswordReset(email)
3636
.then(() => {
3737
this.setState(() => ({ ...INITIAL_STATE }));
3838
})
3939
.catch(error => {
40-
this.setState(updateByPropertyName('error', error));
40+
this.setState(updateByPropertyName("error", error));
4141
});
4242

4343
event.preventDefault();
44-
}
44+
};
4545

4646
render() {
47-
const {
48-
email,
49-
error,
50-
} = this.state;
47+
const { email, error } = this.state;
5148

52-
const isInvalid = email === '';
49+
const isInvalid = email === "";
5350

5451
return (
5552
<form onSubmit={this.onSubmit}>
5653
<input
5754
value={this.state.email}
58-
onChange={event => this.setState(updateByPropertyName('email', event.target.value))}
55+
onChange={event =>
56+
this.setState(updateByPropertyName("email", event.target.value))
57+
}
5958
type="text"
6059
placeholder="Email Address"
6160
/>
6261
<button disabled={isInvalid} type="submit">
6362
Reset My Password
6463
</button>
6564

66-
{ error && <p>{error.message}</p> }
65+
{error && <p>{error.message}</p>}
6766
</form>
6867
);
6968
}
7069
}
7170

72-
const PasswordForgetLink = () =>
71+
const PasswordForgetLink = () => (
7372
<p>
74-
<Link href={routes.PASSWORD_FORGET}><a>Forgot Password?</a></Link>
73+
<Link href={routes.PASSWORD_FORGET}>
74+
<a>Forgot Password?</a>
75+
</Link>
7576
</p>
77+
);
7678

77-
export default withRedux(initStore)(PasswordForgetPage);
79+
export default PasswordForgetPage;
7880

79-
export {
80-
PasswordForgetForm,
81-
PasswordForgetLink,
82-
};
81+
export { PasswordForgetForm, PasswordForgetLink };

pages/signin.js

Lines changed: 30 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,29 @@
1-
import React, { Component } from 'react';
2-
import Router from 'next/router';
3-
import withRedux from 'next-redux-wrapper';
1+
import React, { Component } from "react";
2+
import Router from "next/router";
43

5-
import initStore from '../src/store';
6-
import { SignUpLink } from './signup';
7-
import { PasswordForgetLink } from './pw-forget';
8-
import { AppWithAuthentication } from '../src/components/App';
9-
import { auth } from '../src/firebase';
10-
import * as routes from '../src/constants/routes';
4+
import { SignUpLink } from "./signup";
5+
import { PasswordForgetLink } from "./pw-forget";
6+
import { AppWithAuthentication } from "../src/components/App";
7+
import { auth } from "../src/firebase";
8+
import * as routes from "../src/constants/routes";
119

12-
const SignInPage = () =>
10+
const SignInPage = () => (
1311
<AppWithAuthentication>
1412
<h1>SignIn</h1>
1513
<SignInForm />
1614
<PasswordForgetLink />
1715
<SignUpLink />
1816
</AppWithAuthentication>
17+
);
1918

2019
const updateByPropertyName = (propertyName, value) => () => ({
21-
[propertyName]: value,
20+
[propertyName]: value
2221
});
2322

2423
const INITIAL_STATE = {
25-
email: '',
26-
password: '',
27-
error: null,
24+
email: "",
25+
password: "",
26+
error: null
2827
};
2928

3029
class SignInForm extends Component {
@@ -34,61 +33,55 @@ class SignInForm extends Component {
3433
this.state = { ...INITIAL_STATE };
3534
}
3635

37-
onSubmit = (event) => {
38-
const {
39-
email,
40-
password,
41-
} = this.state;
36+
onSubmit = event => {
37+
const { email, password } = this.state;
4238

43-
auth.doSignInWithEmailAndPassword(email, password)
39+
auth
40+
.doSignInWithEmailAndPassword(email, password)
4441
.then(() => {
4542
this.setState(() => ({ ...INITIAL_STATE }));
4643
Router.push(routes.HOME);
4744
})
4845
.catch(error => {
49-
this.setState(updateByPropertyName('error', error));
46+
this.setState(updateByPropertyName("error", error));
5047
});
5148

5249
event.preventDefault();
53-
}
50+
};
5451

5552
render() {
56-
const {
57-
email,
58-
password,
59-
error,
60-
} = this.state;
53+
const { email, password, error } = this.state;
6154

62-
const isInvalid =
63-
password === '' ||
64-
email === '';
55+
const isInvalid = password === "" || email === "";
6556

6657
return (
6758
<form onSubmit={this.onSubmit}>
6859
<input
6960
value={email}
70-
onChange={event => this.setState(updateByPropertyName('email', event.target.value))}
61+
onChange={event =>
62+
this.setState(updateByPropertyName("email", event.target.value))
63+
}
7164
type="text"
7265
placeholder="Email Address"
7366
/>
7467
<input
7568
value={password}
76-
onChange={event => this.setState(updateByPropertyName('password', event.target.value))}
69+
onChange={event =>
70+
this.setState(updateByPropertyName("password", event.target.value))
71+
}
7772
type="password"
7873
placeholder="Password"
7974
/>
8075
<button disabled={isInvalid} type="submit">
8176
Sign In
8277
</button>
8378

84-
{ error && <p>{error.message}</p> }
79+
{error && <p>{error.message}</p>}
8580
</form>
8681
);
8782
}
8883
}
8984

90-
export default withRedux(initStore)(SignInPage);
85+
export default SignInPage;
9186

92-
export {
93-
SignInForm,
94-
};
87+
export { SignInForm };

0 commit comments

Comments
 (0)