feat: Replace the avatar with a generic one
This commit is contained in:
parent
8b2aba5d91
commit
79ee9c075a
@ -128,6 +128,14 @@ export function setReviewPopover(state: boolean, text: string, color: string, te
|
||||
};
|
||||
};
|
||||
|
||||
export const REVIEW_SET_MODAL = "REVIEW_SET_MODAL";
|
||||
export function setReviewModal(state: boolean) {
|
||||
return {
|
||||
type: REVIEW_SET_MODAL,
|
||||
state,
|
||||
};
|
||||
};
|
||||
|
||||
export const REVIEW_SET_LOADING = "REVIEW_SET_LOADING";
|
||||
export function setReviewLoading(state: boolean) {
|
||||
return {
|
||||
|
@ -12,12 +12,13 @@ import SwipeableDrawer from "@material-ui/core/SwipeableDrawer";
|
||||
import List from "@material-ui/core/List";
|
||||
import ListItem from "@material-ui/core/ListItem";
|
||||
import ListItemIcon from "@material-ui/core/ListItemIcon";
|
||||
import ListItemAvatar from "@material-ui/core/ListItemAvatar";
|
||||
import ListItemText from "@material-ui/core/ListItemText";
|
||||
import Divider from "@material-ui/core/Divider";
|
||||
import Avatar from "@material-ui/core/Avatar";
|
||||
import MenuIcon from "@material-ui/icons/Menu";
|
||||
/* import SettingsIcon from "@material-ui/icons/Settings";
|
||||
* import PersonIcon from "@material-ui/icons/Person"; */
|
||||
/* import SettingsIcon from "@material-ui/icons/Settings"; */
|
||||
import PersonIcon from "@material-ui/icons/Person";
|
||||
import ListIcon from "@material-ui/icons/List";
|
||||
import InfoIcon from "@material-ui/icons/Info";
|
||||
import HomeIcon from "@material-ui/icons/Home";
|
||||
@ -130,7 +131,11 @@ export default class Drawer extends React.Component<IProps> {
|
||||
onOpen={this.openDrawer}>
|
||||
<List component="nav">
|
||||
<ListItem>
|
||||
<Avatar alt={this.props.user.username} style={{ width: 80, height: 80 }} src="https://avatarfiles.alphacoders.com/105/105250.jpg" />
|
||||
<ListItemAvatar>
|
||||
<Avatar>
|
||||
<PersonIcon />
|
||||
</Avatar>
|
||||
</ListItemAvatar>
|
||||
<ListItemText primary={this.props.user.username} />
|
||||
</ListItem>
|
||||
|
||||
|
@ -2,7 +2,8 @@ import { connect } from "react-redux";
|
||||
|
||||
import {
|
||||
setDrawerButton, setReviewPopover, setReviewSummary,
|
||||
setReview, setReviewLoading, setReviewDialog, setReviewHelp
|
||||
setReview, setReviewLoading, setReviewDialog, setReviewHelp,
|
||||
setReviewModal
|
||||
} from "../actions";
|
||||
|
||||
import { IReviewMetadata } from "../models/review";
|
||||
@ -21,6 +22,8 @@ const mapStateToProps = state => {
|
||||
popoverTextColor: state.review.popoverTextColor,
|
||||
loading: state.review.loading,
|
||||
showHelp: state.review.showHelp,
|
||||
|
||||
modalShow: state.review.modalShow,
|
||||
};
|
||||
};
|
||||
const mapDispatchToProps = dispatch => {
|
||||
@ -32,6 +35,8 @@ const mapDispatchToProps = dispatch => {
|
||||
setLoading: (state: boolean) => dispatch(setReviewLoading(state)),
|
||||
setReviewDialog: (state: boolean) => dispatch(setReviewDialog(state)),
|
||||
setShowHelp: (state: boolean) => dispatch(setReviewHelp(state)),
|
||||
|
||||
setModal: (state: boolean) => dispatch(setReviewModal(state)),
|
||||
};
|
||||
};
|
||||
|
||||
|
@ -8,8 +8,6 @@ import Button from "@material-ui/core/Button";
|
||||
import Typography from "@material-ui/core/Typography";
|
||||
import Popover from "@material-ui/core/Popover";
|
||||
import LinearProgress from "@material-ui/core/LinearProgress";
|
||||
import CircularProgress from "@material-ui/core/CircularProgress";
|
||||
import Paper from "@material-ui/core/Paper";
|
||||
import Tooltip from "@material-ui/core/Tooltip";
|
||||
import Dialog from "@material-ui/core/Dialog";
|
||||
import DialogActions from "@material-ui/core/DialogActions";
|
||||
@ -322,7 +320,30 @@ const ReviewPageWithRouter = withRouter(
|
||||
|
||||
render() {
|
||||
if (this.props.loading) {
|
||||
return <Loader />;
|
||||
return <div>
|
||||
<Dialog
|
||||
open={this.props.modalShow}
|
||||
onClose={() => { }}>
|
||||
<DialogTitle>Deine Vokabelliste ist leer</DialogTitle>
|
||||
<DialogContent>
|
||||
<DialogContentText>
|
||||
Du hast noch keine Vokabeln, die du wiederholen könntest.
|
||||
|
||||
Vokabeln werden nach dem erfolgreichen beenden eines Levels
|
||||
der Vokabelliste hinzugefügt
|
||||
</DialogContentText>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button
|
||||
onClick={this.closeModal}
|
||||
color="primary">
|
||||
Verstanden
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
|
||||
<Loader />
|
||||
</div>;
|
||||
}
|
||||
|
||||
const { question, qtype } = this.props.current;
|
||||
@ -431,26 +452,6 @@ const ReviewPageWithRouter = withRouter(
|
||||
) : undefined
|
||||
}
|
||||
|
||||
<Dialog
|
||||
open={true}
|
||||
onClose={() => { }}>
|
||||
<DialogTitle>Deine Vokabelliste ist leer</DialogTitle>
|
||||
<DialogContent>
|
||||
<DialogContentText>
|
||||
Du hast noch keine Vokabeln, die du wiederholen könntest.
|
||||
|
||||
Vokabeln werden nach dem erfolgreichen beenden eines Levels
|
||||
der Vokabelliste hinzugefügt
|
||||
</DialogContentText>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button
|
||||
onClick={this.closeModal}
|
||||
color="primary">
|
||||
Verstanden
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
<Dialog
|
||||
open={this.props.dialogOpen}
|
||||
onClose={this.closeDialog}>
|
||||
|
@ -56,6 +56,8 @@ interface IState {
|
||||
popoverColor: string;
|
||||
popoverTextColor: string;
|
||||
showHelp: boolean;
|
||||
|
||||
modalShow: boolean;
|
||||
};
|
||||
|
||||
vocab: {
|
||||
@ -131,6 +133,8 @@ const initialState: IState = {
|
||||
popoverColor: "",
|
||||
popoverTextColor: "",
|
||||
showHelp: false,
|
||||
|
||||
modalShow: true,
|
||||
},
|
||||
|
||||
vocab: {
|
||||
@ -351,6 +355,12 @@ export function LateinicusApp(state: IState = initialState, action: any) {
|
||||
searchTerm: action.term,
|
||||
}),
|
||||
});
|
||||
case Actions.REVIEW_SET_MODAL:
|
||||
return Object.assign({}, state, {
|
||||
review: Object.assign({}, state.review, {
|
||||
modalShow: action.state,
|
||||
}),
|
||||
});
|
||||
default:
|
||||
// Ignore the initialization call to the reducer. By that we can
|
||||
// catch all actions that are not implemented
|
||||
|
Reference in New Issue
Block a user