Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: Fix profile edit form on submission #119

Closed
wants to merge 1 commit into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 13 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@
"react-router-dom": "^5.2.0",
"react-router-redux": "^4.0.8",
"react-scripts": "3.4.1",
"react-toastify": "^7.0.3",
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I am not sure about adding this, but it looks good. @Aaishpra and @keshakaneria What do you think about adding this?
(I am asking this because it is mentioned to use semantic-UI.)

"redux": "^4.0.5",
"redux-api-middleware": "^3.2.1",
"redux-persist": "^6.0.0",
Expand Down
41 changes: 23 additions & 18 deletions src/PrivateRoute.js
Original file line number Diff line number Diff line change
@@ -1,22 +1,27 @@
import React, { Component } from 'react'
import { Route, Redirect } from 'react-router-dom'
import Menubar from './components/Menubar'
import Navbar from './components/Navbar'
import { login } from './urls'
import React, { Component } from "react";
import { Route, Redirect } from "react-router-dom";
import Menubar from "./components/Menubar";
import Navbar from "./components/Navbar";
import { login } from "./urls";
import { ToastContainer } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";

export const PrivateRoute = ({ component: Component, ...rest }) => (
<>
<Navbar/>
<Route {...rest} render={props => (
localStorage.getItem('token')
?
(
<>
<Menubar/>
<>
<Navbar />
<ToastContainer />
<Route
{...rest}
render={(props) =>
localStorage.getItem("token") ? (
<>
<Menubar />
<Component {...props} />
</>
</>
) : (
<Redirect to={login()} />
)
: <Redirect to={login()}/>
)} />
</>
)
}
/>
</>
);
142 changes: 68 additions & 74 deletions src/actions/info.js
Original file line number Diff line number Diff line change
@@ -1,80 +1,74 @@
import axios from 'axios'
import axios from "axios";
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why this file has been changed @ruddi10 as there is no need for change in actions.
If it's just re-formatting then unstage this file.

import { urlInfo, urlPatchInfo } from "../urls";
import {
urlInfo,
urlPatchInfo
} from '../urls'
import {
GET_USER_INFO,
POST_USER_INFO,
UPDATE_USER_INFO,
USER_INFO_ERRORS
} from './types'
GET_USER_INFO,
POST_USER_INFO,
UPDATE_USER_INFO,
USER_INFO_ERRORS,
} from "./types";

export const getInfo = () => async dispatch => {
try {
const config = {
headers: {
Authorization: `Bearer ${localStorage.token}`,
}
}
const res = await axios.get(urlInfo(), config);
dispatch({
type: GET_USER_INFO,
payload: res.data
});
}
catch (err) {
dispatch({
type: USER_INFO_ERRORS,
payload: err.response.data
})
}
}
export const getInfo = () => async (dispatch) => {
try {
const config = {
headers: {
Authorization: `Bearer ${localStorage.token}`,
},
};
const res = await axios.get(urlInfo(), config);
dispatch({
type: GET_USER_INFO,
payload: res.data,
});
} catch (err) {
dispatch({
type: USER_INFO_ERRORS,
payload: err.response.data,
});
}
};

export const postInfo = (data, callback) => async dispatch => {
try {
const config = {
headers: {
'content-type': 'application/json',
Authorization: `Bearer ${localStorage.token}`,
}
}
const res = await axios.post(urlInfo(), data, config);
dispatch({
type: POST_USER_INFO,
payload: res.data
});
callback()
}
catch (err) {
dispatch({
type: USER_INFO_ERRORS,
payload: err.response.data
});
callback()
}
export const postInfo = (data, callback, success) => async (dispatch) => {
try {
const config = {
headers: {
"content-type": "application/json",
Authorization: `Bearer ${localStorage.token}`,
},
};
const res = await axios.post(urlInfo(), data, config);
dispatch({
type: POST_USER_INFO,
payload: res.data,
});
success();
} catch (err) {
dispatch({
type: USER_INFO_ERRORS,
payload: err.response.data,
});
callback();
}
};

export const patchInfo = (id, data, callback) => async dispatch => {
try {
const config = {
headers: {
'content-type': 'application/json',
Authorization: `Bearer ${localStorage.token}`,
}
}
const res = await axios.patch(urlPatchInfo(id), data, config);
dispatch({
type: UPDATE_USER_INFO,
payload: res.data
});
callback()
}
catch (err) {
dispatch({
type: USER_INFO_ERRORS,
payload: err.response.data
});
callback()
}
export const patchInfo = (id, data, callback, success) => async (dispatch) => {
try {
const config = {
headers: {
"content-type": "application/json",
Authorization: `Bearer ${localStorage.token}`,
},
};
const res = await axios.patch(urlPatchInfo(id), data, config);
dispatch({
type: UPDATE_USER_INFO,
payload: res.data,
});
success();
} catch (err) {
dispatch({
type: USER_INFO_ERRORS,
payload: err.response.data,
});
callback();
}
};
17 changes: 7 additions & 10 deletions src/components/App.js
Original file line number Diff line number Diff line change
@@ -1,22 +1,19 @@
import React, { Component } from 'react'
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Again, If there is no change added by you in the code of this file then unstage that file because there is a PR for this.

import { Route, Switch, Router } from 'react-router-dom'
import Routes from '../Routes'
import { history } from '../store'
import '../styles/App.css'
import React, { Component } from "react";
import { Route, Switch, Router } from "react-router-dom";
import Routes from "../Routes";
import { history } from "../store";
import "../styles/App.css";

export default class App extends Component {
render() {
return (
<div className='app'>
<div className="app">
<Router history={history}>
<Switch>
<Route component={Routes} />
</Switch>
</Router>

</div>
)
);
}
}


121 changes: 64 additions & 57 deletions src/components/Dashboard.js
Original file line number Diff line number Diff line change
@@ -1,62 +1,69 @@
import React, { Component } from 'react'
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Also, unstage this file if there is no change made by you.

import '../styles/Dashboard.css'
import { Item, Card, Header, Divider, Icon } from 'semantic-ui-react'
import Profile from './Profile'
import Zulip from './Zulip'
import React, { Component } from "react";
import "../styles/Dashboard.css";
import { Item, Card, Header, Divider, Icon } from "semantic-ui-react";
import Profile from "./Profile";
import Zulip from "./Zulip";

export default class Dashboard extends Component {
constructor(props) {
super(props)
this.state = {
edit: false
}
}
constructor(props) {
super(props);
this.state = {
edit: false,
};
}

handleEdit = () => {
this.setState({
edit: !this.state.edit
})
}
handleEdit = () => {
this.setState({
edit: !this.state.edit,
});
};

render() {
return (
<div className='dashboard'>
<div className='left'>
{/* render profile details and list of forms filled by user */}
<Item.Group>
<Item>
<Item.Content>
<Item.Header>
<div className='head'>
<span>Profile</span>
<Icon name={this.state.edit ? 'x' : 'pencil'} color='grey' onClick={this.handleEdit} />
</div>
</Item.Header>
<Item.Description>
<Profile edit={this.state.edit}/>
</Item.Description>
</Item.Content>
</Item>
<Divider/>
<Item>
<Item.Content>
<Header>Forms Filled</Header>
</Item.Content>
</Item>
</Item.Group>
</div>
<div className='right'>
{/* render components for Zulip and Github stats */}
<Card.Group centered itemsPerRow={1}>
<Card>
<Zulip />
</Card>
<Card>
<Card.Content header='Github Stats' />
</Card>
</Card.Group>
</div>
</div>
)
}
render() {
return (
<div className="dashboard">
<div className="left">
{/* render profile details and list of forms filled by user */}
<Item.Group>
<Item>
<Item.Content>
<Item.Header>
<div className="head">
<span>Profile</span>
<Icon
name={this.state.edit ? "x" : "pencil"}
color="grey"
onClick={this.handleEdit}
/>
</div>
</Item.Header>
<Item.Description>
<Profile
edit={this.state.edit}
handleEdit={this.handleEdit}
/>
</Item.Description>
</Item.Content>
</Item>
<Divider />
<Item>
<Item.Content>
<Header>Forms Filled</Header>
</Item.Content>
</Item>
</Item.Group>
</div>
<div className="right">
{/* render components for Zulip and Github stats */}
<Card.Group centered itemsPerRow={1}>
<Card>
<Zulip />
</Card>
<Card>
<Card.Content header="Github Stats" />
</Card>
</Card.Group>
</div>
</div>
);
}
}
Loading