\n
\n \n
\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t\t\t{this.state.goal.deadline ?\n\t\t\t\t\t\t\n\t\t\t\t\t\t\tDue {moment(this.state.goal.deadline).format('DD/MM/YYYY')}\n\t\t\t\t\t\t : null\n\t\t\t\t\t}\n\t\t\t\t\n\n\t\t\t\t\n\t\t\t\t\t{this.state.goal.dateCompleted ?\n\t\t\t\t\t\tCompleted on {moment(this.state.goal.dateCompleted).format('DD/MM/YYYY')} \n\t\t\t\t\t\t:\n\t\t\t\t\t\tCurrent: {this.state.goal.currentLog ? this.state.goal.currentLog.values[1] : '-'} reps \n\t\t\t\t\t}\n\t\t\t\t\t
\n\t\t\t\t\tGoal: {this.state.goal.values[0]} {UnitPrettifier.weight()} × {this.state.goal.values[1]} reps \n\t\t\t\t\n\n\t\t\t\t{this.state.goal.currentLog && (!this.state.routine || (!this.state.goal.routineExerciseId && this.state.routine.id !== this.state.goal.currentLog.routineId)) ? // Only if the goal is for all exercises and the current log is for another routine.\n\t\t\t\t\t\n\t\t\t\t\t\tDone in: {this.state.goal.currentLog.routine.name} \n\t\t\t\t\t \n\t\t\t\t\t: null\n\t\t\t\t}\n\t\t\t\n\t\t\n\t}\n}\n\nexport default withStyles(useStyles)(withRouter(WeightRepsGoalCard));","import React from 'react';\nimport withStyles from '@mui/styles/withStyles';\nimport {Card, CardContent, IconButton, LinearProgress, Typography} from \"@mui/material\";\nimport Box from \"@mui/material/Box\";\nimport {UnitPrettifier} from \"../../../../core/prettifier/UnitPrettifier\";\nimport moment from \"moment\";\nimport GoalCardBase from \"./GoalCardBase\";\nimport CallMadeIcon from \"@mui/icons-material/CallMade\";\nimport {withRouter} from \"../../../../hooks/withRouter\";\n\nconst useStyles = theme => ({\n\tgrow: {\n\t\tflexGrow: 1,\n\t},\n});\n\nclass WeightGoalCard extends GoalCardBase {\n\trender() {\n\t\tconst {classes} = this.props;\n\n\t\tlet percentage;\n\t\tif (this.state.goal.dateCompleted) {\n\t\t\tpercentage = 100;\n\t\t} else {\n\t\t\tpercentage = this.state.goal.currentLog ? 100 * this.state.goal.currentLog.values[0] / this.state.goal.values[0] : 0; // Weight is always in values[0]\n\t\t\tpercentage = Math.min(percentage, 100);\n\t\t}\n\t\t\n\t\treturn \n\t\t\t\n\t\t\t\t{!this.state.exercise && // Only if the goal is for all exercises and the current log is for another routine.\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t{this.state.goal.exercise.name}\n\t\t\t\t\t\t \n\t\t\t\t\t \n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\tWeight Goal\n\t\t\t\t\t \n\t\t\t\t\t
\n\t\t\t\t\t{this.state.goal.deadline ?\n\t\t\t\t\t\t\n\t\t\t\t\t\t\tDue {moment(this.state.goal.deadline).format('DD/MM/YYYY')}\n\t\t\t\t\t\t : null\n\t\t\t\t\t}\n\t\t\t\t\n\n\t\t\t\t\n\t\t\t\t\t{this.state.goal.dateCompleted ?\n\t\t\t\t\t\tCompleted on {moment(this.state.goal.dateCompleted).format('DD/MM/YYYY')} \n\t\t\t\t\t\t:\n\t\t\t\t\t\tCurrent: {this.state.goal.currentLog ? this.state.goal.currentLog.values[0] : '-'} {UnitPrettifier.weight()} \n\t\t\t\t\t}\n\t\t\t\t\t
\n\t\t\t\t\tGoal: {this.state.goal.values[0]} {UnitPrettifier.weight()} \n\t\t\t\t\n\n\t\t\t\t{this.state.goal.currentLog && (!this.state.routine || (!this.state.goal.routineExerciseId && this.state.routine.id !== this.state.goal.currentLog.routineId)) ? // Only if the goal is for all exercises and the current log is for another routine.\n\t\t\t\t\t\n\t\t\t\t\t\tDone in: {this.state.goal.currentLog.routine.name} \n\t\t\t\t\t \n\t\t\t\t\t: null\n\t\t\t\t}\n\t\t\t\n\t\t\t\n\t}\n}\n\nexport default withStyles(useStyles)(withRouter(WeightGoalCard));","import React from 'react';\nimport withStyles from '@mui/styles/withStyles';\nimport {Card, CardContent, IconButton, LinearProgress, Typography} from \"@mui/material\";\nimport Box from \"@mui/material/Box\";\nimport moment from \"moment\";\nimport GoalCardBase from \"./GoalCardBase\";\nimport CallMadeIcon from \"@mui/icons-material/CallMade\";\nimport {withRouter} from \"../../../../hooks/withRouter\";\n\nconst useStyles = theme => ({\n\tgrow: {\n\t\tflexGrow: 1,\n\t},\n});\n\nclass RepsGoalCard extends GoalCardBase {\n\trender() {\n\t\tconst {classes} = this.props;\n\n\t\tlet currentValue;\n\t\tif (this.state.goal.type.attributes.length === 1) {\n\t\t\tcurrentValue = this.state.goal.currentLog?.values[0] ?? null;\n\t\t} else { // length === 2\n\t\t\tcurrentValue = this.state.goal.currentLog?.values[1] ?? null; // Reps always goes second, so we can assume it's in value1\n\t\t}\n\t\t\n\t\tlet percentage;\n\t\tif (this.state.goal.dateCompleted) {\n\t\t\tpercentage = 100;\n\t\t} else {\n\t\t\tpercentage = this.state.goal.currentLog ? 100 * currentValue / this.state.goal.values[0] : 0;\n\t\t\tpercentage = Math.min(percentage, 100);\n\t\t}\n\t\t\n\t\treturn \n\t\t\t\n\t\t\t\t{!this.state.exercise && // Only if the goal is for all exercises and the current log is for another routine.\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t{this.state.goal.exercise.name}\n\t\t\t\t\t\t \n\t\t\t\t\t \n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\tReps Goal\n\t\t\t\t\t \n\t\t\t\t\t
\n\t\t\t\t\t{this.state.goal.deadline ?\n\t\t\t\t\t\t\n\t\t\t\t\t\t\tDue {moment(this.state.goal.deadline).format('DD/MM/YYYY')}\n\t\t\t\t\t\t : null\n\t\t\t\t\t}\n\t\t\t\t\n\n\t\t\t\t\n\t\t\t\t\t{this.state.goal.dateCompleted ?\n\t\t\t\t\t\tCompleted on {moment(this.state.goal.dateCompleted).format('DD/MM/YYYY')} \n\t\t\t\t\t\t:\n\t\t\t\t\t\tCurrent: {currentValue ? currentValue : '-'} reps \n\t\t\t\t\t}\n\t\t\t\t\t
\n\t\t\t\t\tGoal: {this.state.goal.values[0]} reps \n\t\t\t\t\n\n\t\t\t\t{this.state.goal.currentLog && (!this.state.routine || (!this.state.goal.routineExerciseId && this.state.routine.id !== this.state.goal.currentLog.routineId)) ? // Only if the goal is for all exercises and the current log is for another routine.\n\t\t\t\t\t\n\t\t\t\t\t\tDone in: {this.state.goal.currentLog.routine.name} \n\t\t\t\t\t \n\t\t\t\t\t: null\n\t\t\t\t}\n\t\t\t\n\t\t\n\t}\n}\n\nexport default withStyles(useStyles)(withRouter(RepsGoalCard));","import React from 'react';\nimport withStyles from '@mui/styles/withStyles';\nimport {Card, CardContent, IconButton, LinearProgress, Typography} from \"@mui/material\";\nimport Box from \"@mui/material/Box\";\nimport {UnitPrettifier} from \"../../../../core/prettifier/UnitPrettifier\";\nimport moment from \"moment\";\nimport {HoursMinutesTimeConverter} from \"../../../../core/prettifier/HoursMinutesTimeConverter\";\nimport GoalCardBase from \"./GoalCardBase\";\nimport CallMadeIcon from \"@mui/icons-material/CallMade\";\nimport {withRouter} from \"../../../../hooks/withRouter\";\n\nconst useStyles = theme => ({\n\tgrow: {\n\t\tflexGrow: 1,\n\t},\n});\n\nclass DistanceTimeGoalCard extends GoalCardBase {\n\n\trender() {\n\t\tconst {classes} = this.props;\n\n\t\tlet percentage;\n\t\tif (this.state.goal.dateCompleted) {\n\t\t\tpercentage = 100;\n\t\t} else {\n\t\t\tpercentage = this.state.goal.currentLog ? 100 * this.state.goal.currentLog.values[1] / this.state.goal.values[1] : 0;\n\t\t\tpercentage = Math.min(percentage, 100);\n\t\t}\n\n\t\treturn \n\t\t\t\n\t\t\t\t{!this.state.exercise && // Only if the goal is for all exercises and the current log is for another routine.\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t{this.state.goal.exercise.name}\n\t\t\t\t\t \n\t\t\t\t \n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\tDistance × Time Goal\n\t\t\t\t\t \n\t\t\t\t\t
\n\t\t\t\t\t{this.state.goal.deadline ?\n\t\t\t\t\t\t\n\t\t\t\t\t\t\tDue {moment(this.state.goal.deadline).format('DD/MM/YYYY')}\n\t\t\t\t\t\t : null\n\t\t\t\t\t}\n\t\t\t\t\n\n\t\t\t\t\n\t\t\t\t\t{this.state.goal.dateCompleted ?\n\t\t\t\t\t\tCompleted on {moment(this.state.goal.dateCompleted).format('DD/MM/YYYY')} \n\t\t\t\t\t\t: \n\t\t\t\t\t\tCurrent: {this.state.goal.currentLog ? HoursMinutesTimeConverter.convertFloatToString(this.state.goal.currentLog.values[1]) : '-'} \n\t\t\t\t\t}\n\t\t\t\t\t
\n\t\t\t\t\tGoal: {this.state.goal.values[0]} {UnitPrettifier.distance()} × {HoursMinutesTimeConverter.convertFloatToString(this.state.goal.values[1])} \n\t\t\t\t\n\n\t\t\t\t{this.state.goal.currentLog && (!this.state.routine || (!this.state.goal.routineExerciseId && this.state.routine.id !== this.state.goal.currentLog.routineId)) ? // Only if the goal is for all exercises and the current log is for another routine.\n\t\t\t\t\t\n\t\t\t\t\t\tDone in: {this.state.goal.currentLog.routine.name} \n\t\t\t\t\t \n\t\t\t\t\t: null\n\t\t\t\t}\n\t\t\t\n\t\t\n\t}\n}\n\nexport default withStyles(useStyles)(withRouter(DistanceTimeGoalCard));","import React from 'react';\nimport withStyles from '@mui/styles/withStyles';\nimport {Card, CardContent, IconButton, LinearProgress, Typography} from \"@mui/material\";\nimport Box from \"@mui/material/Box\";\nimport moment from \"moment\";\nimport CallMadeIcon from \"@mui/icons-material/CallMade\";\nimport GoalCardBase from \"./GoalCardBase\";\nimport {UnitPrettifier} from \"../../../../core/prettifier/UnitPrettifier\";\nimport {withRouter} from \"../../../../hooks/withRouter\";\n\nconst useStyles = theme => ({\n\tgrow: {\n\t\tflexGrow: 1,\n\t},\n});\n\nclass DistanceGoalCard extends GoalCardBase {\n\trender() {\n\t\tconst {classes} = this.props;\n\n\t\tlet percentage;\n\t\tif (this.state.goal.dateCompleted) {\n\t\t\tpercentage = 100;\n\t\t} else {\n\t\t\tpercentage = this.state.goal.currentLog ? 100 * this.state.goal.currentLog.values[0] / this.state.goal.values[0] : 0; // Distance is always in values[0]\n\t\t\tpercentage = Math.min(percentage, 100);\n\t\t}\n\t\t\n\t\treturn \n\t\t\t\n\t\t\t\t{!this.state.exercise && // Only if the goal is for all exercises and the current log is for another routine.\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t{this.state.goal.exercise.name}\n\t\t\t\t\t\t \n\t\t\t\t\t \n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\tDistance Goal\n\t\t\t\t\t \n\t\t\t\t\t
\n\t\t\t\t\t{this.state.goal.deadline ?\n\t\t\t\t\t\t\n\t\t\t\t\t\t\tDue {moment(this.state.goal.deadline).format('DD/MM/YYYY')}\n\t\t\t\t\t\t : null\n\t\t\t\t\t}\n\t\t\t\t\n\n\t\t\t\t\n\t\t\t\t\t{this.state.goal.dateCompleted ?\n\t\t\t\t\t\tCompleted on {moment(this.state.goal.dateCompleted).format('DD/MM/YYYY')} \n\t\t\t\t\t\t:\n\t\t\t\t\t\tCurrent: {this.state.goal.currentLog ? this.state.goal.currentLog.values[0] : '-'} {UnitPrettifier.distance()} \n\t\t\t\t\t}\n\t\t\t\t\t
\n\t\t\t\t\tGoal: {this.state.goal.values[0]} {UnitPrettifier.distance()} \n\t\t\t\t\n\n\t\t\t\t{this.state.goal.currentLog && (!this.state.routine || (!this.state.goal.routineExerciseId && this.state.routine.id !== this.state.goal.currentLog.routineId)) ? // Only if the goal is for all exercises and the current log is for another routine.\n\t\t\t\t\t\n\t\t\t\t\t\tDone in: {this.state.goal.currentLog.routine.name} \n\t\t\t\t\t \n\t\t\t\t\t: null\n\t\t\t\t}\n\t\t\t\n\t\t\t\n\t}\n}\n\nexport default withStyles(useStyles)(withRouter(DistanceGoalCard));","import React from 'react';\nimport withStyles from '@mui/styles/withStyles';\nimport {Card, CardContent, IconButton, LinearProgress, Typography} from \"@mui/material\";\nimport Box from \"@mui/material/Box\";\nimport moment from \"moment\";\nimport {HoursMinutesTimeConverter} from \"../../../../core/prettifier/HoursMinutesTimeConverter\";\nimport CallMadeIcon from \"@mui/icons-material/CallMade\";\nimport GoalCardBase from \"./GoalCardBase\";\nimport {withRouter} from \"../../../../hooks/withRouter\";\n\nconst useStyles = theme => ({\n\tgrow: {\n\t\tflexGrow: 1,\n\t},\n});\n\nclass TimeGoalCard extends GoalCardBase {\n\trender() {\n\t\tconst {classes} = this.props;\n\n\t\tlet currentValue;\n\t\tif (this.state.goal.type.attributes.length === 1) {\n\t\t\tcurrentValue = this.state.goal.currentLog?.values[0] ?? null;\n\t\t} else { // length === 2\n\t\t\tcurrentValue = this.state.goal.currentLog?.values[1] ?? null; // Time always goes second, so we can assume it's in value1\n\t\t}\n\t\t\n\t\tlet percentage;\n\t\tif (this.state.goal.dateCompleted) {\n\t\t\tpercentage = 100;\n\t\t} else {\n\t\t\tpercentage = currentValue ? 100 * currentValue / this.state.goal.values[0] : 0;\n\t\t\tpercentage = Math.min(percentage, 100);\n\t\t}\n\t\t\n\t\treturn \n\t\t\t\t\n\t\t\t\t\t{!this.state.exercise && // Only if the goal is for all exercises and the current log is for another routine.\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t{this.state.goal.exercise.name}\n\t\t\t\t\t\t\t \n\t\t\t\t\t\t \n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\tTime Goal\n\t\t\t\t\t\t \n\t\t\t\t\t\t
\n\t\t\t\t\t\t{this.state.goal.deadline ?\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\tDue {moment(this.state.goal.deadline).format('DD/MM/YYYY')}\n\t\t\t\t\t\t\t : null\n\t\t\t\t\t\t}\n\t\t\t\t\t\n\n\t\t\t\t\t\n\t\t\t\t\t\t{this.state.goal.dateCompleted ?\n\t\t\t\t\t\t\tCompleted on {moment(this.state.goal.dateCompleted).format('DD/MM/YYYY')} \n\t\t\t\t\t\t\t:\n\t\t\t\t\t\t\tCurrent: {currentValue ? HoursMinutesTimeConverter.convertFloatToString(currentValue) : '-'} \n\t\t\t\t\t\t}\n\t\t\t\t\t\t
\n\t\t\t\t\t\tGoal: {HoursMinutesTimeConverter.convertFloatToString(this.state.goal.values[0])} \n\t\t\t\t\t\n\n\t\t\t\t\t{this.state.goal.currentLog && (!this.state.routine || (!this.state.goal.routineExerciseId && this.state.routine.id !== this.state.goal.currentLog.routineId)) ? // Only if the goal is for all exercises and the current log is for another routine.\n\t\t\t\t\t\t\n\t\t\t\t\t\t\tDone in: {this.state.goal.currentLog.routine.name} \n\t\t\t\t\t\t \n\t\t\t\t\t\t: null\n\t\t\t\t\t}\n\t\t\t\t\n\t\t\t\n\t}\n}\n\nexport default withStyles(useStyles)(withRouter(TimeGoalCard));","import React from 'react';\nimport withStyles from '@mui/styles/withStyles';\nimport {Card, CardContent, IconButton, LinearProgress, Typography} from \"@mui/material\";\nimport Box from \"@mui/material/Box\";\nimport {UnitPrettifier} from \"../../../../core/prettifier/UnitPrettifier\";\nimport moment from \"moment\";\nimport {HoursMinutesTimeConverter} from \"../../../../core/prettifier/HoursMinutesTimeConverter\";\nimport CallMadeIcon from \"@mui/icons-material/CallMade\";\nimport GoalCardBase from \"./GoalCardBase\";\nimport {withRouter} from \"../../../../hooks/withRouter\";\n\nconst useStyles = theme => ({\n\tgrow: {\n\t\tflexGrow: 1,\n\t},\n});\n\nclass WeightTimeGoalCard extends GoalCardBase {\n\n\trender() {\n\t\tconst {classes} = this.props;\n\n\t\tlet percentage;\n\t\tif (this.state.goal.dateCompleted) {\n\t\t\tpercentage = 100;\n\t\t} else {\n\t\t\tpercentage = this.state.goal.currentLog ? 100 * this.state.goal.currentLog.values[1] / this.state.goal.values[1] : 0;\n\t\t\tpercentage = Math.min(percentage, 100);\n\t\t}\n\t\t\n\t\treturn \n\t\t\t\n\t\t\t\t{!this.state.exercise && // Only if the goal is for all exercises and the current log is for another routine.\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t{this.state.goal.exercise.name}\n\t\t\t\t\t\t \n\t\t\t\t\t \n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\tWeight × Time Goal\n\t\t\t\t\t \n\t\t\t\t\t
\n\t\t\t\t\t{this.state.goal.deadline ?\n\t\t\t\t\t\t\n\t\t\t\t\t\t\tDue {moment(this.state.goal.deadline).format('DD/MM/YYYY')}\n\t\t\t\t\t\t : null\n\t\t\t\t\t}\n\t\t\t\t\n\n\t\t\t\t\n\t\t\t\t\t{this.state.goal.dateCompleted ?\n\t\t\t\t\t\tCompleted on {moment(this.state.goal.dateCompleted).format('DD/MM/YYYY')} \n\t\t\t\t\t\t:\n\t\t\t\t\t\tCurrent: {this.state.goal.currentLog ? HoursMinutesTimeConverter.convertFloatToString(this.state.goal.currentLog.values[1]) : '-'} \n\t\t\t\t\t}\n\t\t\t\t\t
\n\t\t\t\t\tGoal: {this.state.goal.values[0]} {UnitPrettifier.weight()} × {HoursMinutesTimeConverter.convertFloatToString(this.state.goal.values[1])} \n\t\t\t\t\n\n\t\t\t\t{this.state.goal.currentLog && (!this.state.routine || (!this.state.goal.routineExerciseId && this.state.routine.id !== this.state.goal.currentLog.routineId)) ? // Only if the goal is for all exercises and the current log is for another routine.\n\t\t\t\t\t\n\t\t\t\t\t\tDone in: {this.state.goal.currentLog.routine.name} \n\t\t\t\t\t \n\t\t\t\t\t: null\n\t\t\t\t}\n\t\t\t\n\t\t\n\t}\n}\n\nexport default withStyles(useStyles)(withRouter(WeightTimeGoalCard));","import React, {Component} from 'react';\nimport {ExerciseGoalType} from \"../../../../core/models/ExerciseGoalType\";\nimport WeightRepsGoalCard from \"./WeightRepsGoalCard\";\nimport WeightGoalCard from \"./WeightGoalCard\";\nimport RepsGoalCard from \"./RepsGoalCard\";\nimport DistanceTimeGoalCard from \"./DistanceTimeGoalCard\";\nimport DistanceGoalCard from \"./DistanceGoalCard\";\nimport TimeGoalCard from \"./TimeGoalCard\";\nimport WeightTimeGoalCard from \"./WeightTimeGoalCard\";\n\nclass GoalCard extends Component {\n\t/**\n\t * @param props Containing:\n\t * 'routine': The routine\n\t * 'exercise': The exercise\n\t * 'goal': The goal\n\t */\n\tconstructor(props) {\n\t\tsuper(props);\n\n\t\tthis.state = {\n\t\t\t/**\n\t\t\t * The routine.\n\t\t\t */\n\t\t\troutine: this.props.routine,\n\t\t\t/**\n\t\t\t * The exercise,\n\t\t\t */\n\t\t\texercise: this.props.exercise,\n\t\t\t/**\n\t\t\t * The goal to show.\n\t\t\t */\n\t\t\tgoal: this.props.goal,\n\t\t};\n\t}\n\n\tcomponentWillReceiveProps(nextProps, nextContext) {\n\t\tthis.setState({\n\t\t\tgoal: nextProps.goal,\n\t\t\texercise: nextProps.exercise,\n\t\t});\n\t}\n\n\trenderGoalCard = () => {\n\t\tconst goal = this.state.goal;\n\t\t\n\t\tswitch (goal.type.id) {\n\t\t\tcase ExerciseGoalType.WeightAndRepsGoal:\n\t\t\t\treturn ;\n\t\t\tcase ExerciseGoalType.WeightGoal:\n\t\t\t\treturn ;\n\t\t\tcase ExerciseGoalType.RepsGoal:\n\t\t\t\treturn ;\n\t\t\tcase ExerciseGoalType.DistanceAndTimeGoal:\n\t\t\t\treturn \n\t\t\tcase ExerciseGoalType.DistanceGoal:\n\t\t\t\treturn ;\n\t\t\tcase ExerciseGoalType.TimeGoal:\n\t\t\t\treturn ;\n\t\t\tcase ExerciseGoalType.WeightAndTimeGoal:\n\t\t\t\treturn ;\n\t\t}\n\t}\n\t\n\trender() {\n\t\treturn this.renderGoalCard();\n\t}\n}\n\nexport default GoalCard;","import React, {PureComponent} from 'react';\nimport {\n\tCard,\n\tCardContent,\n\tTypography,\n} from '@mui/material';\nimport withStyles from '@mui/styles/withStyles';\nimport CardHeader from \"@mui/material/CardHeader\";\nimport Divider from \"@mui/material/Divider\";\nimport CardActionArea from \"@mui/material/CardActionArea\";\nimport {withRouter} from \"../../../hooks/withRouter\";\nimport Collapse from \"@mui/material/Collapse\";\nimport {ExpandLess, ExpandMore} from \"@mui/icons-material\";\nimport IconButton from \"@mui/material/IconButton\";\nimport {UrlBuilder} from \"../../../core/url/UrlBuilder\";\nimport {UserLocalStorage} from \"../../../core/storage/UserLocalStorage\";\nimport Skeleton from \"@mui/material/Skeleton\";\nimport Box from \"@mui/material/Box\";\nimport LinearProgress from \"@mui/material/LinearProgress\";\nimport Grid from \"@mui/material/Grid\";\nimport EmojiEventsIcon from '@mui/icons-material/EmojiEvents';\nimport GoalCard from \"../../routine/partials/Goals/GoalCard\";\n\nconst useStyles = theme => ({});\n\nclass GoalStatsCard extends PureComponent {\n\n\t/**\n\t * @param props Containing:\n\t * 'workout': The workout you want to show.\n\t */\n\tconstructor(props) {\n\t\tsuper(props);\n\n\t\tthis.state = {\n\t\t\t/**\n\t\t\t * The goals.\n\t\t\t */\n\t\t\tgoals: UserLocalStorage.get(UrlBuilder.goals.exerciseGoalsApi(null, null, true)) ?? null,\n\t\t\t/**\n\t\t\t * Is the collapse open?\n\t\t\t */\n\t\t\tisCollapseOpen: false,\n\t\t\t/**\n\t\t\t * Is loading?\n\t\t\t */\n\t\t\tisLoading: false,\n\t\t\t/**\n\t\t\t * Has it loaded at least once?\n\t\t\t */\n\t\t\thasLoadedAtLeastOnce: false,\n\t\t};\n\t}\n\t\n\thasNeverBeenFetched = () => {\n\t\treturn this.state.goals === null;\n\t}\n\n\tfetch = async () => {\n\t\tthis.setState({\n\t\t\tisLoading: true,\n\t\t});\n\n\t\tconst response = await fetch(UrlBuilder.goals.exerciseGoalsApi(null, null, true));\n\n\t\tif (response.status !== 200) {\n\t\t\tthis.setState({\n\t\t\t\tisLoading: false,\n\t\t\t});\n\t\t\treturn;\n\t\t}\n\n\t\tconst responseData = await response.json();\n\n\t\tthis.setState({\n\t\t\tgoals: responseData['data'] ?? [],\n\t\t\tisLoading: false,\n\t\t\thasLoadedAtLeastOnce: true,\n\t\t});\n\n\t\tUserLocalStorage.set(UrlBuilder.goals.exerciseGoalsApi(null, null, true), responseData['data'] ?? []);\n\t}\n\n\ttriggerCollapse = (event) => {\n\t\tthis.setState({\n\t\t\tisCollapseOpen: !this.state.isCollapseOpen\n\t\t});\n\n\t\tconst isOpening = !this.state.isCollapseOpen;\n\t\tif (isOpening && !this.state.hasLoadedAtLeastOnce) {\n\t\t\tthis.fetch();\n\t\t}\n\t}\n\n\trenderLoading = () => {\n\t\tconst {classes} = this.props;\n\n\t\treturn <>\n\t\t\t\n\n\t\t\t\n\t\t\t
\n\t\t\t\n\t\t\t
\n\t\t\t\n\t\t\t
\n\t\t\t\n\t\t;\n\t}\n\n\trenderGoalCards = () => {\n\t\tif (this.hasNeverBeenFetched()) {\n\t\t\treturn \n\t\t\t\t\n\t\t\t\t\tNo goals found. Create them in your routine exercises.\n\t\t\t\t \n\t\t\t \n\t\t}\n\n\t\treturn \n\t\t\t{this.state.goals.map(goal =>\n\t\t\t\t\n\t\t\t\t\t{/**/}\n\t\t\t\t\t\t\n\t\t\t\t\t{/* */}\n\t\t\t\t \n\t\t\t)}\n\t\t \n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t\n\t\t\t\t\n\t\t\t\t\tGoals }\n\t\t\t\t\t\tstyle={{paddingBottom: '12px', paddingTop: '12px'}}\n\t\t\t\t\t\t\n\t\t\t\t\t\taction={\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t{this.state.isCollapseOpen ? \n\t\t\t\t\t\t}\n\t\t\t\t\t\tonClick={this.triggerCollapse}\n\t\t\t\t\t/>\n\t\t\t\t\t\n\t\t\t\t\t\t \n\t\t\t\t \n\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t{this.renderGoalCards()}\n\t\t\t\t\t \n\t\t\t\t \n\t\t\t \n\t\t);\n\t}\n}\n\nexport default withStyles(useStyles)(withRouter(GoalStatsCard));","import React, {PureComponent} from 'react';\nimport Grid from \"@mui/material/Grid\";\nimport Box from \"@mui/material/Box\";\nimport withStyles from '@mui/styles/withStyles';\nimport {UrlBuilder} from \"../../../core/url/UrlBuilder\";\nimport {Link as RouterLink} from \"react-router-dom\";\nimport Typography from \"@mui/material/Typography\";\nimport WorkoutCard from \"../partials/WorkoutCard\";\nimport Link from \"@mui/material/Link\";\nimport IconButton from \"@mui/material/IconButton\";\nimport Skeleton from '@mui/material/Skeleton';\nimport {UserLocalStorage} from \"../../../core/storage/UserLocalStorage\";\nimport CircularProgress from \"@mui/material/CircularProgress\";\nimport LinearProgress from \"@mui/material/LinearProgress\";\nimport InfiniteScroll from \"react-infinite-scroll-component\";\nimport EventIcon from '@mui/icons-material/Event';\nimport CalendarModule from \"./CalendarModule\";\nimport AddToPhotosIcon from \"@mui/icons-material/AddToPhotos\";\nimport {pulse} from \"react-animations\";\nimport { styled } from '@mui/system';\nimport LastWeekWorkoutsCard from \"../partials/LastWeekWorkoutsCard\";\nimport {withRouter} from \"../../../hooks/withRouter\";\nimport {keyframes} from \"@mui/material/styles\";\nimport Button from \"@mui/material/Button\";\nimport GeneralStatsCard from \"../partials/GeneralStatsCard\";\nimport GoalStatsCard from \"../partials/GoalStatsCard\";\n\nconst useStyles = theme => ({\n\tmedia: {\n\t\theight: 80,\n\t},\n\tlargeIcon: {\n\t\twidth: 160,\n\t\theight: 160,\n\t},\n\tfloatRight: {\n\t\tfloat: 'right'\n\t},\n\tbutton: {\n\t\tminWidth: '30px',\n\t\twidth: '30px',\n\t\theight: '30px',\n\t\tpadding: '0',\n\t},\n});\n\nconst pulseAnimation = keyframes`${pulse}`;\nconst PulseDiv = styled('div')(({ theme }) => ({\n\tanimation: `2s ${pulseAnimation} infinite`\n}));\n\nclass WorkoutsModule extends PureComponent {\n\tconstructor(props) {\n\t\tsuper(props);\n\n\t\tthis.state = {\n\t\t\tworkouts: UserLocalStorage.get(UrlBuilder.modules.workoutsModuleApi()) ?? null,\n\t\t\tisLoading: true,\n\t\t\tcanFetchMoreWorkouts: false,\n\t\t\tisCalendarOpen: false,\n\t\t};\n\t}\n\n\tcomponentDidMount() {\n\t\tthis.fetch();\n\t}\n\n\tfetch = async () => {\n\t\tthis.setState({\n\t\t\tisLoading: true,\n\t\t});\n\n\t\tconst response = await fetch(UrlBuilder.modules.workoutsModuleApi());\n\n\t\tif (response.status !== 200) {\n\t\t\tthis.setState({\n\t\t\t\tisLoading: false,\n\t\t\t});\n\t\t\treturn;\n\t\t}\n\n\t\tconst responseData = await response.json();\n\n\t\tthis.setState({\n\t\t\tworkouts: responseData['data']['workouts'] ?? [],\n\t\t\tcanFetchMoreWorkouts: responseData['data']['workouts'] && responseData['data']['workouts'].length >= 7, // Only stop when there is no more data.\n\t\t\tisLoading: false,\n\t\t});\n\n\t\tUserLocalStorage.set(UrlBuilder.modules.workoutsModuleApi(), responseData['data']['workouts'] ?? []);\n\t}\n\n\tfetchMore = async () => {\n\t\tconst response = await fetch(UrlBuilder.modules.workoutsModuleApi(this.state.workouts.length));\n\n\t\tif (response.status !== 200) {\n\t\t\treturn;\n\t\t}\n\t\t\n\t\tconst responseData = await response.json();\n\n\t\tthis.setState({\n\t\t\tworkouts: this.state.workouts.concat(responseData['data']['workouts'] ?? []),\n\t\t\tcanFetchMoreWorkouts: responseData['data']['workouts'] && responseData['data']['workouts'].length >= 7, // Only stop when there is no more data.\n\t\t});\n\t}\n\t\n\ttoggleCalendar = (open) => {\n\t\tthis.setState({\n\t\t\tisCalendarOpen: open,\n\t\t});\n\t}\n\n\thasNeverBeenFetched = () => {\n\t\treturn this.state.workouts === null;\n\t}\n\n\trenderNoWorkouts = () => {\n\t\treturn <>\n\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t \n\t\t\t\t\n\t\t\t \n\n\t\t\t\n\t\t\t\t\n\t\t\t\t\tCreate a Routine to Start a Workout\n\t\t\t\t \n\t\t\t \n\n\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\tGo to your routines\n\t\t\t\t\t \n\t\t\t\t\n\t\t\t \n\t\t;\n\t}\n\t\n\trenderLoading = () => {\n\t\tconst {classes} = this.props;\n\n\t\treturn <>\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t\n\n\t\t\t\n\t\t\t\tWorkout History: \n\t\t\t\t\n\t\t\t \n\n\t\t\t this.toggleCalendar(false)}/>\n\n\t\t\t\n\t\t\t}\n\n\t\t\t\n\t\t\t\t\t\t }\n\t\t\t\t\tstyle={{overflowX: 'hidden' }} /* Prevents horizontal scrolling */\n\t\t\t\t>\n\t\t\t\t\t{this.state.workouts.map(workout =>\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
\n\t\t\t\t\t\t \n\t\t\t\t\t)}\n\t\t\t\t\n\t\t\t}\n\t\t;\n\t}\n}\nexport default withRouter(withStyles(useStyles)(WorkoutsModule))","export default __webpack_public_path__ + \"static/media/icon.c1e52c6b.png\";","export class Utils {\n\tstatic _isPWA = null;\n\n\t/**\n\t * https://stackoverflow.com/questions/59662776/how-to-distinguish-between-pwa-and-twa-in-code\n\t * \n\t * @returns {null}\n\t */\n\tstatic isApp() {\n\t\tif (Utils._isPWA === null) {\n\t\t\t// Utils._isPWA = !!document.referrer.includes('android-app://app.myworkinprogress.twa');\n\t\t\tUtils._isPWA = this.isAndroidApp();\n\t\t}\n\t\treturn Utils._isPWA;\n\t}\n\n\tstatic isAndroidApp() {\n\t\treturn document.referrer.includes('android-app://');\n\t}\n}","import React, {PureComponent} from 'react';\nimport withStyles from '@mui/styles/withStyles';\nimport {UrlBuilder} from \"../../../core/url/UrlBuilder\";\nimport {UserLocalStorage} from \"../../../core/storage/UserLocalStorage\";\nimport moment from \"moment\";\nimport Dialog from \"@mui/material/Dialog\";\nimport List from \"@mui/material/List\";\nimport ListItem from \"@mui/material/ListItem\";\nimport ListItemAvatar from \"@mui/material/ListItemAvatar\";\nimport {Avatar} from \"@mui/material\";\nimport {ColorPicker} from \"../../../core/colors/ColorPicker\";\nimport ListItemText from \"@mui/material/ListItemText\";\nimport Fab from \"@mui/material/Fab\";\nimport PlayArrowIcon from \"@mui/icons-material/PlayArrow\";\nimport Zoom from \"@mui/material/Zoom\";\nimport Skeleton from '@mui/material/Skeleton';\nimport {UserContext} from \"../../../core/UserContext\";\nimport {Link as RouterLink} from \"react-router-dom\";\nimport Grid from \"@mui/material/Grid\";\nimport Typography from \"@mui/material/Typography\";\nimport Link from \"@mui/material/Link\";\nimport Box from \"@mui/material/Box\";\nimport IconButton from \"@mui/material/IconButton\";\nimport AddToPhotosIcon from \"@mui/icons-material/AddToPhotos\";\nimport Toolbar from \"@mui/material/Toolbar\";\nimport AppBar from \"@mui/material/AppBar\";\nimport {DatePrettifier} from \"../../../core/prettifier/DatePrettifier\";\nimport {withRouter} from \"../../../hooks/withRouter\";\nimport Slide from \"@mui/material/Slide\";\n\nconst useStyles = theme => ({\n\tspeedDialWrapper: {\n\t\tmargin: 0,\n\t\ttop: 'auto',\n\t\tright: 35,\n\t\tbottom: 80,\n\t\tleft: 'auto',\n\t\tposition: 'fixed',\n\t},\n\tlargeIcon: {\n\t\twidth: 100,\n\t\theight: 100,\n\t},\n\tappBar: {\n\t\tposition: 'relative',\n\t\tminWidth: 275,\n\t},\n});\n\nconst Transition = React.forwardRef(function Transition(props, ref) {\n\treturn \n\n \n \n \n \n \n \n \n\n \n\n \n \n You have no routines\n \n \n\n \n \n \n Create A Routine\n \n \n \n\n \n ;\n\t}\n\t\n\trenderRoutines = () => {\n\t\treturn \n\t\t\t\t\n\t\t\t\t\t \n\t\t\t \n\t\t\t{this.renderPopUp()}\n\t\t;\n\t}\n}\n\nHomeFabButton.contextType = UserContext;\n\nexport default withStyles(useStyles)(withRouter(HomeFabButton));","import React, {PureComponent} from 'react';\nimport {UserContext} from \"../../core/UserContext\";\nimport {UrlBuilder} from \"../../core/url/UrlBuilder\";\nimport withStyles from '@mui/styles/withStyles';\nimport {PageDataContext} from \"../../core/PageDataContext\";\nimport {Link as RouterLink} from \"react-router-dom\";\nimport WorkoutsModule from \"./modules/WorkoutsModule\";\nimport Box from \"@mui/material/Box\";\nimport Grid from \"@mui/material/Grid\";\nimport Typography from \"@mui/material/Typography\";\nimport Divider from \"@mui/material/Divider\";\nimport './stylez.css';\nimport GooglePlayButton from \"../../res/img/google_play.png\";\nimport WIPIcon from \"../../res/img/icon.png\";\nimport Button from \"@mui/material/Button\";\nimport PersonAddIcon from \"@mui/icons-material/PersonAdd\";\nimport LockOpenIcon from \"@mui/icons-material/LockOpen\";\nimport Link from \"@mui/material/Link\";\nimport EmojiEmotionsIcon from '@mui/icons-material/EmojiEmotions';\nimport Container from \"@mui/material/Container\";\nimport SpaIcon from '@mui/icons-material/Spa';\nimport StarsIcon from '@mui/icons-material/Stars';\nimport BarChartIcon from '@mui/icons-material/BarChart';\nimport {Utils} from \"../../core/util/Utils\";\nimport HomeFabButton from \"./modules/HomeFabButton\";\nimport Alert from '@mui/material/Alert';\nimport {withRouter} from \"../../hooks/withRouter\";\nimport AppleIcon from '@mui/icons-material/Apple';\nimport GoogleIcon from '@mui/icons-material/Google';\nimport PersonIcon from '@mui/icons-material/Person';\nimport moment from \"moment\";\nimport CircularProgress from \"@mui/material/CircularProgress\";\nimport {Collapse, IconButton} from \"@mui/material\";\nimport {AlertTitle} from \"@mui/lab\";\nimport {UserLocalStorage} from \"../../core/storage/UserLocalStorage\";\nimport ExpandLessIcon from \"@mui/icons-material/ExpandLess\";\nimport ExpandMoreIcon from \"@mui/icons-material/ExpandMore\";\n\nconst useStyles = theme => ({\n\troot: {\n\t\tflexGrow: 1,\n\t},\n\tcontent: {\n\t\tpadding: theme.spacing(2),\n\t\ttextAlign: 'center',\n\t\t[theme.breakpoints.down('md')]: {\n\t\t\tmarginTop: theme.spacing(4),\n\t\t},\n\t\tmarginTop: theme.spacing(21),\n\t},\n\tvideo: {\n\t\t[theme.breakpoints.down('md')]: {\n\t\t\tmarginTop: theme.spacing(0),\n\t\t},\n\t\tmarginTop: theme.spacing(6),\n\t\ttextAlign: 'center',\n\t},\n\tcenterized: {\n\t\ttextAlign: 'center',\n\t},\n\tultimateWorkoutTrackerText: {\n\t\tfontSize: 18,\n\t\tcolor: theme.palette.text.secondary,\n\t},\n\theaderText: {\n\t\t[theme.breakpoints.down('md')]: {\n\t\t\tfontSize: 33,\n\t\t},\n\t\tfontSize: 52,\n\t},\n\tmargin: {\n\t\tmargin: theme.spacing(1),\n\t\tmarginTop: 0,\n\t},\n\tfooterText: {\n\t\tfontSize: 16,\n\t\tcolor: theme.palette.text.secondary,\n\t},\n\tuspText: {\n\t\tcolor: '#435f9b',\n\t\tfontSize: 24\n\t},\n\tdialogRoot: {\n\t\tmarginBottom: theme.spacing(2),\n\t\tcursor: 'pointer',\n\t\tpaddingBottom: 0,\n\t},\n\tdialogContent: {\n\t\ttextAlign: 'center',\n\t},\n\tbutton: {\n\t\tmarginTop: theme.spacing(2),\n\t\tmarginRight: theme.spacing(2),\n\t\tmarginBottom: theme.spacing(1),\n\t\tfloat: 'right'\n\t},\n});\n\nfunction Copyright() {\n\treturn (\n\t\t\n\t\t\t{'Copyright © '}\n\t\t\t{'My Work in Progress '}\n\t\t\t{new Date().getFullYear()}\n\t\t\t{'.'}\n\t\t \n\t);\n}\n\nclass Home extends PureComponent {\n\n\tconstructor(props) {\n\t\tsuper(props);\n\n\t\tthis.state = {\n\t\t\tisSigningUpAsGuest: false,\n\t\t\tisDonateDialogOpen: false,\n\t\t};\n\t}\n\n\tcomponentDidMount() {\n\t\tthis.context.setPageData({\n\t\t\ttitle: null, // Null is for the fallback\n\t\t});\n\t}\n\n\tredirectToGoogleAuth = () => {\n\t\twindow.location = '/api/users/google-signin';\n\t}\n\n\tredirectToAppleAuth = () => {\n\t\twindow.location = '/api/users/apple-signin';\n\t}\n\n\tsignUpAsGuest = async (event, setUser) => {\n\t\tevent.preventDefault(); // Prevents it from reloading the page and adding the params to the URL.\n\n\t\tthis.setState({\n\t\t\tisSigningUpAsGuest: true\n\t\t});\n\n\t\tlet guestUser = {\n\t\t\tdateCreated: moment().format('L, h:mm:ss A'),\n\t\t};\n\n\t\tlet response = await fetch(UrlBuilder.user.SignUpAsGuestApi(), {\n\t\t\tmethod: 'POST',\n\t\t\theaders: {\n\t\t\t\t'Accept': 'application/json',\n\t\t\t\t'Content-Type': 'application/json'\n\t\t\t},\n\t\t\tbody: JSON.stringify(guestUser)\n\t\t});\n\n\t\tlet jsonResponse = await response.json();\n\n\t\tif (response.status === 200) {\n\t\t\tsetUser(jsonResponse['data']);\n\t\t\tthis.props.navigate('/');\n\t\t}\n\t\t\n\t\tthis.setState({\n\t\t\tisSigningUpAsGuest: false,\n\t\t})\n\t}\n\t\n\tgetPromoPart = () => {\n\t\tconst {classes} = this.props;\n\n\t\treturn <>\n\t\t\t
\n\n\t\t\t\n\n\t\t\t\n\t\t\t\tMy Work in Progress\n\t\t\t \n\n\t\t\t\n\t\t\t\tTHE ULTIMATE WORKOUT TRACKER\n\t\t\t \n\n\t\t\t\n\n\t\t\t\n\t\t\t\t\n\t\t\t\t\t}>\n\t\t\t\t\t\tContinue with Google\n\t\t\t\t\t\n\t\t\t\t \n\t\t\t\t\n\t\t\t\t\t}>\n\t\t\t\t\t\tContinue with Apple\n\t\t\t\t\t\n\t\t\t\t \n\t\t\t \n\n\t\t\t\n\t\t\t\t\n\t\t\t\t\tOr Manually\n\t\t\t\t \n\t\t\t \n\n\t\t\t\n\t\t\t\t\n\t\t\t\n\n\t\t\t\n\t\t\t\t\n\t\t\t\n\n\t\t\t\n\n\t\t\t\n\t\t\t\t{({user, setUser}) => (\n\t\t\t\t\t \n\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\n\t\t\t\n\t\t\t\t\n\t\t\t\t\t
\n\t\t\t\t\n\t\t\t \n\t\t;\n\t}\n\t\n\trenderNoUserPage = () => {\n\t\tconst {classes} = this.props;\n\n\t\tif (Utils.isApp()) {\n\t\t\t// If we're in the TWA, just go to sign in page. Skip home page. \n\t\t\tthis.props.navigate(UrlBuilder.user.SignInPage());\n\t\t\treturn;\n\t\t}\n\n\t\tlet error = (new URLSearchParams(this.props.location.search)).get('error');\n\n\t\t// We're in a normal browser. Let's show the homepage.\n\t\treturn 🏋️ Love Using My Work in Progress? ❤️Help Keep Us Strong! \n\n\t\t\t\n\t\t\t\t\n\t\t\t\t\tI sincerely hope you enjoy using My Work in Progress and it adds value to your life. It's my mission to help you keep track of your fitness journey with no strings attached.\n\n\t\t\t\t\tAt the same time, keeping the app free and constantly improving it comes with certain costs - from server upkeep to new feature development. If you love using this app and would like to contribute towards its growth and sustainability, please consider making a donation.\n\n\t\t\t\t\tEvery little bit helps us to continue delivering a premium, ad-free experience, and to keep shaping My Work in Progress into the best workout tracker it can be.\n\n\t\t\t\t\tLet's keep growing stronger together!\n\t\t\t\t \n\t\t\t\t\n\t\t\t\t\n\t\t\t \n\t\t\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t\n\t\t\t\t{({user}) => user ?\n\t\t\t\t\t\n\t\t\t\t\t\t \n\t\t\t\t\t:\n\t\t\t\t\tthis.renderNoUserPage()\n\t\t\t\t}\n\t\t\t \n\t\t);\n\t}\n}\n\nHome.contextType = PageDataContext;\n\nexport default withStyles(useStyles)(withRouter(Home));","export default \"data:image/png;base64,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\"","import React, {PureComponent} from 'react';\nimport BottomNavigation from '@mui/material/BottomNavigation';\nimport BottomNavigationAction from '@mui/material/BottomNavigationAction';\nimport HomeIcon from '@mui/icons-material/Home';\nimport BookIcon from '@mui/icons-material/Book';\nimport FitnessCenterIcon from '@mui/icons-material/FitnessCenter';\nimport {Link} from \"react-router-dom\";\nimport {UrlBuilder} from \"../../core/url/UrlBuilder\";\nimport LockOpenIcon from \"@mui/icons-material/LockOpen\";\nimport PersonAddIcon from \"@mui/icons-material/PersonAdd\";\nimport {UserContext} from \"../../core/UserContext\";\nimport withStyles from '@mui/styles/withStyles';\nimport Box from \"@mui/material/Box\";\nimport AccessibilityIcon from '@mui/icons-material/Accessibility';\nimport {Utils} from \"../../core/util/Utils\";\nimport { styled } from '@mui/system';\n\nconst useStyles = theme => ({\n\tstickToBottom: {\n\t\twidth: '100%',\n\t\tposition: 'fixed',\n\t\tbottom: 0,\n\t\tzIndex: 1,\n\t\tbackground: theme.palette.primary.main\n\t},\n\tnavButton: {\n\t\tcolor: 'rgba(255, 255, 255, 0.5)',\n\t\t'&$selected': {\n\t\t\tcolor: theme.palette.primary.contrastText,\n\t\t},\n\t},\n\tselected: {}\n});\n\nconst Responsiveness = styled('div')(({ theme }) => ({\n\t[theme.breakpoints.up('md')]: {\n\t\tdisplay: 'none',\n\t},\n}));\n\nclass BottomNavMenu extends PureComponent {\n\t/**\n\t * No params needed.\n\t */\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {\n\t\t\tvalue: 0,\n\t\t};\n\t}\n\n\tcomponentWillReceiveProps(nextProps, nextContext) {\n\t\tthis.setValue(this.recognizePageIndex());\n\t}\n\n\trecognizePageIndex = () => {\n\t\tlet path = window.location.pathname;\n\t\tif (path.startsWith(UrlBuilder.routine.routineOverviewPage())) {\n\t\t\treturn 1;\n\t\t} else if (path.startsWith(UrlBuilder.exercise.exercisesOverviewPage())) {\n\t\t\treturn 2;\n\t\t} else if (path.startsWith(UrlBuilder.me.mePage())) {\n\t\t\treturn 3;\n\t\t} else if (path.startsWith(UrlBuilder.user.SignUpPage())) {\n\t\t\treturn 2;\n\t\t} else if (path.startsWith(UrlBuilder.user.SignInPage())) {\n\t\t\treturn 1;\n\t\t} else if (path.startsWith(UrlBuilder.user.settingsPage())) {\n\t\t\treturn null; // Don't show any selection on the settings page.\n\t\t}\n\t\t\n\t\treturn 0;\n\t}\n\t\n\tsetValue = (val) => {\n\t\tthis.setState({\n\t\t\tvalue: val,\n\t\t});\n\t}\n\t\n\trender() {\n\t\tconst { classes } = this.props;\n\n\t\treturn ( \n\t\t\t\n\t\t\t\n\t\t\t\t{({user, setUser}) => user ?\n\t\t\t\t\t {\n\t\t\t\t\t\t\tthis.setValue(newValue);\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t {\n\t\t\t\t\t\t\tthis.setValue(newValue);\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{Utils.isApp() ? null // in TWA- mode, don't show home page.\n\t\t\t\t\t\t\t : \n\t\t\t\t}\n\t\t\t \n\t\t\t \n\t\t);\n\t}\n}\n\nexport default (withStyles(useStyles)(BottomNavMenu))\n","import React, {PureComponent} from \"react\";\nimport withStyles from '@mui/styles/withStyles';\nimport IconButton from \"@mui/material/IconButton\";\nimport Typography from \"@mui/material/Typography\";\nimport RadioButtonCheckedIcon from \"@mui/icons-material/RadioButtonChecked\";\nimport {UserContext} from \"../../../core/UserContext\";\nimport { red } from '@mui/material/colors';\n\nconst useStyles = theme => ({\n\t'@keyframes flicker': {\n\t\tfrom: {\n\t\t\topacity: 1,\n\t\t},\n\t\tto: {\n\t\t\topacity: 0.4,\n\t\t},\n\t},\n\tflicker: {\n\t\tanimationName: '$flicker',\n\t\tanimationDuration: '1000ms',\n\t\tanimationIterationCount: 'infinite',\n\t\tanimationDirection: 'alternate',\n\t\tanimationTimingFunction: 'ease-in-out',\n\t\tcolor: red[300],\n\t},\n\tbutton: {\n\t\tcolor: red[300],\n\t}\n});\n\nclass ActiveWorkoutButton extends PureComponent {\n\trender() {\n\t\tif (!this.context.user || !this.context.user.activeWorkout) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst {classes} = this.props;\n\n\t\treturn <>\n this.context.openActiveWorkoutBloop(true)}\n size=\"large\"> \n \n WORKING\t \n \n \n \n ;\n\t}\n}\n\nActiveWorkoutButton.contextType = UserContext;\n\nexport default withStyles(useStyles)(ActiveWorkoutButton);","import React, {PureComponent} from 'react';\nimport AppBar from '@mui/material/AppBar';\nimport Toolbar from '@mui/material/Toolbar';\nimport IconButton from '@mui/material/IconButton';\nimport Typography from '@mui/material/Typography';\nimport {Link as RouterLink, Link} from \"react-router-dom\";\nimport {UserContext} from \"../../core/UserContext\";\nimport Button from \"@mui/material/Button\";\nimport {UrlBuilder} from \"../../core/url/UrlBuilder\";\nimport withStyles from '@mui/styles/withStyles';\nimport {PageDataContext} from \"../../core/PageDataContext\";\nimport ActiveWorkoutButton from \"./utils/ActiveWorkoutButton\";\nimport {Utils} from \"../../core/util/Utils\";\nimport SettingsIcon from '@mui/icons-material/Settings';\nimport Badge from \"@mui/material/Badge\";\nimport {withRouter} from \"../../hooks/withRouter\";\nimport AdminPanelSettingsIcon from '@mui/icons-material/AdminPanelSettings';\n\nconst useStyles = theme => ({\n\tgrow: {\n\t\tflexGrow: 1,\n\t},\n\tmenuButton: {\n\t\tmarginRight: theme.spacing(1),\n\t},\n\tsectionDesktop: {\n\t\tdisplay: 'none',\n\t\t[theme.breakpoints.up('md')]: {\n\t\t\tdisplay: 'flex',\n\t\t},\n\t},\n\tsectionMobile: {\n\t\t[theme.breakpoints.up('md')]: {\n\t\t\tdisplay: 'none',\n\t\t},\n\t},\n});\n\nclass TopNavMenu extends PureComponent {\n\tstatic displayName = TopNavMenu.name;\n\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {};\n\t}\n\n\tgoToSettingsPage = () => {\n\t\tthis.props.navigate(UrlBuilder.user.settingsPage());\n\t};\n\n\tgoToAdminPage = () => {\n\t\tthis.props.navigate(UrlBuilder.admin.overviewPage());\n\t};\n\n\trender() {\n\t\tconst { classes } = this.props;\n\n\t\treturn (\n \n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t{({data, setPageData}) =>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t{({user, setUser}) => data.title ?? (user?.name ? (user.name + \"'s Work in Progress\") : \"My Work in Progress\")\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t \n\t\t\t\t\t\t}\n\t\t\t\t\t \n\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
- \n\t\t\t\t
- \n\t\t\t{this.state.routines.map((routine) => (\n\t\t\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\n\t\t\t
\n\t\t\t{error === 'auth' ? <>\n\t\t\t\t
\n\t\t\t\tSomething went wrong with external authentication. Please try again or manually. \n\t\t\t : null}\n\t\t\t\n\t\t\t\n\t\t\t\t\n\t\t\t\t\t \n\t\t\t\t\n\t\t\t\t\t \n\t\t\t \n\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\n\t\t\t\n\t\t\t\t \n\n\t\t\t
\n\t\t\t
\n\n\t\t\t\n\t\t\t\t \n\n\t\t\t
\n\t\t
;\n\t}\n\n\thandleOpenDonateDialog = () => {\n\t\tthis.setState({\n\t\t\tisDonateDialogOpen: !this.state.isDonateDialogOpen,\n\t\t})\n\t}\n\t\n\tblockDonationDialog = () => {\n\t\tUserLocalStorage.set('block_donation_dialog', true);\n\t\tthis.forceUpdate();\n\t}\n\t\n\tredirectToSettings = () => {\n\t\tthis.props.navigate(UrlBuilder.user.settingsPage() + '?goToDonation=1');\n\t}\n\t\n\trenderDonateDialog = (user) => {\n\t\tif (UserLocalStorage.get('block_donation_dialog') || user.isSupporter || !Utils.isAndroidApp()) {\n\t\t\treturn null;\n\t\t}\n\t\t\n\t\tconst {classes} = this.props;\n\n\t\tconst userCreationDate = user.dateCreated ? new Date(user.dateCreated) : null;\n\t\t\n\t\tconst oneMonthAgo = new Date();\n\t\toneMonthAgo.setMonth(oneMonthAgo.getMonth() - 1);\n\n\t\t// if dateCreated is null then the account is very old and we're sure we want to show the dialog.\n\t\tif (userCreationDate && userCreationDate > oneMonthAgo) {\n\t\t\treturn null;\n\t\t}\n\t\t\n\t\treturn \n\t\t\t\t
\n\t\t\t\t\t\t{this.getPromoPart()}\n\t\t\t\t\t
\n\t\t\t\t\n\t\t\t\t\t\t
\n\t\t\t\t\n\t\t\t\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\n\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\t\tSimple, Smart, and Goal-based.\n\t\t\t\t\t \n\n\t\t\t\t\t
\n\n\t\t\t\t\t\n\t\t\t\t\t\t \n\t\t\t\t\t\n\t\t\t\t\t\tWe know the hassle of finding an intuitive and simple workout app. This is why we made My Work\n\t\t\t\t\t\tin Progress. We took what we learned about our 6 years of gym training using various gym apps\n\t\t\t\t\t\tand put the best of the best into one package, and best of all, it's free.\n\t\t\t\t\t \n\n\t\t\t\t\t
\n\t\t\t\t\t
\n\n\t\t\t\t\t\n\t\t\t\t\t\t \n\t\t\t\t\t\n\t\t\t\t\t\tWe want to make sure that you get the best out of logging. This is why we have hand-picked the\n\t\t\t\t\t\tmost relevant and intuitive graphs and statistics to spotting trends and progress in your gym\n\t\t\t\t\t\tjourney. Never miss another detail again.\n\t\t\t\t\t \n\n\t\t\t\t\t
\n\t\t\t\t\t
\n\n\t\t\t\t\t\n\t\t\t\t\t\t \n\t\t\t\t\t\n\t\t\t\t\t\tWe believe that the best way to achieve your goals is through detail planning and scheduling.\n\t\t\t\t\t\tThis is why we have built an integrated goal maker into the app. You are able to specify your\n\t\t\t\t\t\tspecific goals: how many sets, how much weight, reps, and by when.\n\t\t\t\t\t \n\n\t\t\t\t\t
\n\t\t\t\t\t
\n\n\t\t\t\t\t\n\t\t\t\t\t\t \n\t\t\t\t\t\n\t\t\t\t\t\tWe know it's already a pain to use your phone in the gym to log your workouts. This is why we\n\t\t\t\t\t\tmade sure to make this experience as seamless as possible using a continuously tested intuitive\n\t\t\t\t\t\tand ergonomic design in the app. Buttons are easy to reach, pages are quick to access, and\n\t\t\t\t\t\teverything is straight to the point.\n\t\t\t\t\t \n\t\t\t\t
\n\t\t\t\n\n\t\t\t\t\t
\n\t\t\t\t\t
\n\n\t\t\t\t\t
\n\t\t\t\t\t
\n\n\t\t\t\t\t
\n\t\t\t\t\t
\n\n\t\t\t\t\t
\n\t\t\t
\n\n\t\t\t
\n\t\t\t\t{this.getPromoPart()}\n\t\t\t
\n\n\t\t\t\n\t\t
\n\n\t\t\t\t\t\n\t\t\t\t\t\t{({user, setUser}) => user ?\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t{user.hasNotifications ?\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t\t\t\t:\n\t\t\t\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t:\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t{/*in TWA- mode, don't show Home */}\n\t\t\t\t\t\t\t\t{Utils.isApp() ? null : }\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\t\t\t\t \n\t\t\t\t\n\t\t\t\n );\n\t}\n}\n\nexport default withRouter((withStyles(useStyles)(TopNavMenu)))","import React, {PureComponent} from \"react\";\nimport withStyles from '@mui/styles/withStyles';\nimport Card from \"@mui/material/Card\";\nimport CardHeader from \"@mui/material/CardHeader\";\nimport PlayArrowIcon from '@mui/icons-material/PlayArrow';\nimport Avatar from \"@mui/material/Avatar\";\nimport moment from \"moment\";\nimport {UrlBuilder} from \"../../core/url/UrlBuilder\";\nimport Button from \"@mui/material/Button\";\nimport StopIcon from '@mui/icons-material/Stop';\nimport InfoIcon from '@mui/icons-material/Info';\nimport { green, red } from \"@mui/material/colors\";\nimport IconButton from \"@mui/material/IconButton\";\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore';\nimport MoreVertIcon from '@mui/icons-material/MoreVert';\nimport CircularProgress from \"@mui/material/CircularProgress\";\nimport {UserContext} from \"../../core/UserContext\";\nimport {Dialog, ListItemIcon, ListItemText, Menu, MenuItem, Popover} from \"@mui/material\";\nimport AppBar from \"@mui/material/AppBar\";\nimport Toolbar from \"@mui/material/Toolbar\";\nimport Typography from \"@mui/material/Typography\";\nimport CardContent from \"@mui/material/CardContent\";\nimport Grid from \"@mui/material/Grid\";\nimport {LocalizationProvider, StaticDateTimePicker} from \"@mui/lab\";\nimport AdapterDateFns from \"@mui/lab/AdapterDateFns\";\nimport Backdrop from \"@mui/material/Backdrop\";\nimport Fade from \"@mui/material/Fade\";\nimport TextField from \"@mui/material/TextField\";\nimport HistoryToggleOffIcon from '@mui/icons-material/HistoryToggleOff';\n\nconst useStyles = theme => ({\n\tcardStart: {\n\t\tbackgroundColor: theme.palette.secondary.startWorkoutColor,\n\t},\n\tstart: {\n\t\tbackgroundColor: green[500],\n\t},\n\tcardStop: {\n\t\tbackgroundColor: theme.palette.secondary.stopWorkoutColor,\n\t},\n\tstop: {\n\t\tbackgroundColor: red[500],\n\t},\n\tgrow: {\n\t\tflexGrow: 1,\n\t},\n\tpopOverText: {\n\t\tpadding: theme.spacing(2),\n\t},\n});\n\nclass WorkoutCallToAction extends PureComponent {\n\n\t/**\n\t * No params needed. This uses the User context to get the workout stuff.\n\t */\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {\n\t\t\t/**\n\t\t\t * Indicates whether this component is in a loading state.\n\t\t\t */\n\t\t\tisLoading: false,\n\t\t\t/**\n\t\t\t * The dropdown menu.\n\t\t\t */\n\t\t\tdropDownMenuAnchorEl: null,\n\t\t\t/**\n\t\t\t * The anchorEl for the startDate overwrite dialog.\n\t\t\t */\n\t\t\tdropDownStartDateOverwriteAnchorEl: null,\n\t\t\t/**\n\t\t\t * The start date overwrite.\n\t\t\t */\n\t\t\tstartDateOverwrite: null,\n\t\t\t/**\n\t\t\t * The anchorEl for the tooltip.\n\t\t\t */\n\t\t\tstartDateOverwriteTooltipAnchorEl: null,\n\t\t};\n\t}\n\t\n\tstartWorkout = async (event, startDateOverwrite = null) => {\n\t\tevent.preventDefault();\n\n\t\tthis.setState({\n\t\t\tisLoading: true,\n\t\t});\n\n\t\tlet workout = {\n\t\t\tdateTimeStarted: startDateOverwrite ? moment(startDateOverwrite).format('L, h:mm:ss A') : moment().format('L, h:mm:ss A'),\n\t\t\tisPastWorkout: !!startDateOverwrite, // If there a start date overwrite, then it is a past workout.\n\t\t};\n\n\t\tlet res = await fetch(UrlBuilder.workout.startWorkoutApi(), {\n\t\t\tmethod: 'POST',\n\t\t\theaders: {\n\t\t\t\t'Accept': 'application/json',\n\t\t\t\t'Content-Type': 'application/json'\n\t\t\t},\n\t\t\tbody: JSON.stringify(workout)\n\t\t}).then(res => res.json());\n\t\t\n\t\tthis.context.setUser(res.data);\n\t\t\n\t\tthis.setState({\n\t\t\tworkout: res.data,\n\t\t\tisLoading: false,\n\t\t\tdropDownStartDateOverwriteAnchorEl: null,\n\t\t});\n\t}\n\t\n\tfinishWorkout = async () => {\n\t\tthis.setState({\n\t\t\tisLoading: true,\n\t\t});\n\n\t\tconst response = await fetch(\n\t\t\tUrlBuilder.workout.currentWorkoutApi()\n\t\t).then(res => res.json());\n\t\tconst fetchedWorkout = response.data;\n\t\t\n\t\t// If there is something to finish, then open bloop and let that take care of it, otherwise just 'cancel' it.\n\t\tif (fetchedWorkout && fetchedWorkout.routines.length > 0) {\n\t\t\tthis.setState({\n\t\t\t\tisLoading: false,\n\t\t\t});\n\t\t\tthis.context.openActiveWorkoutBloop(true);\n\t\t\treturn;\n\t\t}\n\t\t\n\t\tlet workout = {\n\t\t\tdateTimeEnded: moment().format('L, h:mm:ss A')\n\t\t};\n\t\t\n\t\tconst res = await fetch(UrlBuilder.workout.finishWorkoutApi(), {\n\t\t\tmethod: 'POST',\n\t\t\theaders: {\n\t\t\t\t'Accept': 'application/json',\n\t\t\t\t'Content-Type': 'application/json'\n\t\t\t},\n\t\t\tbody: JSON.stringify(workout)\n\t\t}).then(res => res.json());\n\n\t\tthis.context.setUser(res['data']);\n\n\t\tthis.setState({\n\t\t\tisLoading: false,\n\t\t});\n\t}\n\n\topenDropdownMenu = (event) => {\n\t\tevent.stopPropagation();\n\t\tthis.setState({\n\t\t\tdropDownMenuAnchorEl: event.currentTarget,\n\t\t});\n\t};\n\n\tcloseDropdownMenu = (event) => {\n\t\tevent.stopPropagation();\n\t\tthis.setState({\n\t\t\tdropDownMenuAnchorEl: null\n\t\t});\n\t};\n\n\topenDropDownStartDateOverwriteAnchorEl = (event) => {\n\t\tthis.setState({\n\t\t\tdropDownStartDateOverwriteAnchorEl: event.currentTarget,\n\t\t\tdropDownMenuAnchorEl: null,\n\t\t});\n\t};\n\n\tcloseDropDownStartDateOverwriteAnchorEl = () => {\n\t\tthis.setState({\n\t\t\tdropDownStartDateOverwriteAnchorEl: null\n\t\t});\n\t};\n\n\topenStartDateOverwriteTooltip = (event) => {\n\t\tthis.setState({\n\t\t\tstartDateOverwriteTooltipAnchorEl: event?.currentTarget ?? null,\n\t\t});\n\t}\n\n\tsetStartDateOverwrite = (dateString) => {\n\t\tthis.setState({\n\t\t\tstartDateOverwrite: dateString\n\t\t});\n\t}\n\t\n\trenderStartPastWorkoutDialog = () => {\n\t\tconst {classes} = this.props;\n\n\t\treturn \n\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\tSelect a Workout Start Date\n\t\t\t\t\t \n\n\t\t\t\t\t
\n\n\t\t\t\t\t\n\t\t\t\t\t\t \n\t\t\t\t\t this.openStartDateOverwriteTooltip(null)}\n\t\t\t\t\t\tanchorOrigin={{\n\t\t\t\t\t\t\tvertical: 'bottom',\n\t\t\t\t\t\t\thorizontal: 'center',\n\t\t\t\t\t\t}}\n\t\t\t\t\t\ttransformOrigin={{\n\t\t\t\t\t\t\tvertical: 'top',\n\t\t\t\t\t\t\thorizontal: 'center',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\tYou can start a workout with a date and time from the past. This can be used to log previous workouts you did not get to log in real-time. \n\t\t\t\t\t\n\t\t\t\t\n\t\t\t\n\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t \n\t\t\t\t \n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t \n\t\t\t\t \n\t\t\t \n\t\t;\n\t}\n\n\trender() {\n\t\tconst {classes} = this.props;\n\t\t\n\t\tlet activeWorkout = this.context.user?.activeWorkout;\n\n\t\tif (!activeWorkout) {\n\t\t\treturn (\n \n \n {this.state.isLoading ? \n \n \n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t \n\t {this.renderStartPastWorkoutDialog()}\n\t\t\t\t\t\t \n }\n />\n \n );\n\t\t}\n\n\t\tconst subheader = <> {\"⌚ Started \" + moment(activeWorkout.dateTimeStarted).fromNow()};\n\t\t\n\t\treturn <>\n \n \n {this.state.isLoading ? \n \n :\n \n this.context.openActiveWorkoutBloop(true)} // We assume that the workout is active here, thats why we call this func.\n disabled={this.state.isLoading}\n >\n \n ;\n\t}\n}\n\nWorkoutCallToAction.contextType = UserContext;\n\nexport default withStyles(useStyles)(WorkoutCallToAction);","import React, {PureComponent} from 'react'\nimport withStyles from '@mui/styles/withStyles';\nimport {Link as RouterLink} from 'react-router-dom';\nimport Fade from \"@mui/material/Fade\";\nimport MenuItem from \"@mui/material/MenuItem\";\nimport ListItemIcon from \"@mui/material/ListItemIcon\";\nimport DeleteIcon from '@mui/icons-material/Delete';\nimport ListItemText from \"@mui/material/ListItemText\";\nimport Menu from \"@mui/material/Menu\";\nimport MoreVertIcon from \"@mui/icons-material/MoreVert\";\nimport IconButton from \"@mui/material/IconButton\";\nimport CardHeader from \"@mui/material/CardHeader\";\nimport Divider from \"@mui/material/Divider\";\nimport CardActions from \"@mui/material/CardActions\";\nimport Button from \"@mui/material/Button\";\nimport Card from \"@mui/material/Card\";\nimport {DatePrettifier} from \"../../../core/prettifier/DatePrettifier\";\nimport List from \"@mui/material/List\";\nimport CardContent from \"@mui/material/CardContent\";\nimport ListItem from \"@mui/material/ListItem\";\nimport Typography from \"@mui/material/Typography\";\nimport {Avatar} from \"@mui/material\";\nimport {ColorPicker} from \"../../../core/colors/ColorPicker\";\nimport Grid from \"@mui/material/Grid\";\nimport Link from \"@mui/material/Link\";\nimport {UrlBuilder} from \"../../../core/url/UrlBuilder\";\nimport EditIcon from \"@mui/icons-material/Edit\";\nimport Collapse from \"@mui/material/Collapse\";\nimport FitnessCenterIcon from \"@mui/icons-material/FitnessCenter\";\nimport {ExpandLess, ExpandMore} from \"@mui/icons-material\";\nimport CardActionArea from \"@mui/material/CardActionArea\";\nimport ArchiveIcon from '@mui/icons-material/Archive';\nimport {withRouter} from \"../../../hooks/withRouter\";\n\nconst useStyles = theme => ({\n\tfloatRight: {\n\t\tfloat: 'right'\n\t},\n\tgrow: {\n\t\tflexGrow: 1,\n\t},\n});\n\n/**\n * A card that can be popped up into fullscreen mode.\n */\nclass RoutineOverviewCard extends PureComponent {\n\tstatic displayName = RoutineOverviewCard.name;\n\n\t/**\n\t * @param props Containing:\n\t * 'routine': The routine.\n\t * 'toggleOpenEditRoutinePopup': Trigger the edit routine popuo.\n\t * 'deleteRoutine': Deletes itself.\n\t * 'archiveRoutine': Archives itself.\n\t * 'isInArchivedMode': Is it in archive mode?\n\t * 'dragHandle': The handle icon for dragging this card to reorder it.\n\t */\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {\n\t\t\t/**\n\t\t\t * The routine.\n\t\t\t */\n\t\t\troutine: this.props.routine,\n\t\t\t/**\n\t\t\t * The dropdown menu for each routine card.\n\t\t\t */\n\t\t\tdropDownMenuAnchorEl: null,\n\t\t\t/**\n\t\t\t * Is the collapse open?\n\t\t\t */\n\t\t\tisCollapseOpen: false,\n\t\t\t/**\n\t\t\t * In archive mode?\n\t\t\t */\n\t\t\tisInArchivedMode: props.isInArchivedMode,\n\t\t};\n\t}\n\t\n\tcomponentWillReceiveProps(nextProps, nextContext) {\n\t\tthis.setState({\n\t\t\troutine: nextProps.routine,\n\t\t\tisInArchivedMode: nextProps.isInArchivedMode,\n\t\t});\n\t}\n\n\topenDropdownMenu = (event) => {\n\t\tevent.stopPropagation();\n\t\tthis.setState({\n\t\t\tdropDownMenuAnchorEl: event.currentTarget\n\t\t});\n\t};\n\n\tcloseDropdownMenu = (event) => {\n\t\tevent.stopPropagation();\n\t\tthis.setState({\n\t\t\tdropDownMenuAnchorEl: null\n\t\t});\n\t};\n\t\n\ttriggerCollapse = (event) => {\n\t\tthis.setState({\n\t\t\tisCollapseOpen: !this.state.isCollapseOpen\n\t\t});\n\t}\n\n\tdeleteRoutine = async (event) => {\n\t\tevent.stopPropagation();\n\t\tthis.setState({\n\t\t\tdropDownMenuAnchorEl: null\n\t\t});\n\t\tthis.props.deleteRoutine(this.state.routine);\n\t}\n\n\tarchiveRoutine = async (event, shouldArchive) => {\n\t\tevent.stopPropagation();\n\t\tthis.setState({\n\t\t\tdropDownMenuAnchorEl: null\n\t\t});\n\t\tthis.props.archiveRoutine(shouldArchive);\n\t}\n\n\ttoggleOpenEditRoutinePopup = (event) => {\n\t\tevent.stopPropagation();\n\t\tthis.setState({\n\t\t\tdropDownMenuAnchorEl: null\n\t\t});\n\t\tthis.props.toggleOpenEditRoutinePopup();\t\n\t}\n\t\n\tgoToRoutineDetail = () => {\n\t\tthis.props.navigate(UrlBuilder.routine.routineDetailPage(this.state.routine.id));\n\t}\n\n\trender() {\n\t\tconst {classes} = this.props;\n\n\t\tlet description = this.state.routine.dateLastLogged ?\n\t\t\tDatePrettifier.prettifyLastTrained(new Date(this.state.routine.dateLastLogged))\n\t\t\t: '';\n\n\t\tif (this.state.routine.description) {\n\t\t\tdescription += description ? ' — ' : '';\n\t\t\tdescription += this.state.routine.description;\n\t\t}\n\t\t\n\t\treturn (\n\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\t\t{this.state.routine.name}\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\t\t\t\t\tsubheader={description}\n\t\t\t\t\t\tavatar={\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t{this.state.routine.name.charAt(0).toUpperCase()}\n\t\t\t\t\t\t\t \n\t\t\t\t\t\t}\n\t\t\t\t\t\taction={\n\t\t\t\t\t\t\t \n\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t: null\n\t\t\t\t\t\t}\n\t\t\t\t\t \n\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t{this.state.isInArchivedMode ?\n\t\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t : <>\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t \n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonClick={this.goToRoutineDetail}\n\t\t\t\t\t/>\n\t\t\t\t\t- \n\t\t\t\t\t\t\t\t\t{this.state.routine.exercises.map(exercise => {\n\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t
\n\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t{this.state.isCollapseOpen ? \n\n\t\t\t\t\t\t{this.props.dragHandle}\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t\n\t\t);\t\n\t}\n}\n\nexport default withStyles(useStyles)(withRouter(RoutineOverviewCard));","import React from \"react\";\nimport withStyles from '@mui/styles/withStyles';\nimport Badge from \"@mui/material/Badge\";\n\nconst styles = theme => ({\n\tcustomBadge: {\n\t\tbackgroundColor: props => props.color,\n\t\tcolor: \"rgb(238,238,238)\",\n\t}\n});\n\nfunction SimpleBadge(props) {\n\tconst { classes, children } = props;\n\treturn (\n \n\t\t\t{children}\n\t\t\n );\n}\nconst SmallBadge = withStyles(styles)(SimpleBadge);\n\nexport default SmallBadge;\n","import React, {PureComponent} from 'react'\nimport Typography from \"@mui/material/Typography\";\nimport { blue, green, purple, yellow, red } from \"@mui/material/colors\";\nimport Grid from \"@mui/material/Grid\";\nimport Avatar from \"@mui/material/Avatar\";\nimport IconButton from \"@mui/material/IconButton\";\nimport CheckIcon from '@mui/icons-material/Check';\nimport { HexColorPicker } from \"react-colorful\";\nimport Card from \"@mui/material/Card\";\nimport CardHeader from \"@mui/material/CardHeader\";\nimport Divider from \"@mui/material/Divider\";\nimport CardContent from \"@mui/material/CardContent\";\nimport {Popover} from \"@mui/material\";\nimport SmallBadge from \"../custom/SmallBadge\";\nimport CreateIcon from '@mui/icons-material/Create';\n\nclass ColorSelector extends PureComponent {\n\t/**\n\t * @param props Containing:\n\t * 'color': The color.\n\t * 'updateColorValueParentFunc': The function to call to update the color.\n\t */\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {\n\t\t\t/**\n\t\t\t * The color.\n\t\t\t */\n\t\t\tcolor: props.color ?? blue[500],\n\t\t\t/**\n\t\t\t * Is the custom color picker open?\n\t\t\t */\n\t\t\tcustomColorPickAnchorEl: null,\n\t\t};\n\t}\n\t\n\tcomponentWillReceiveProps(nextProps, nextContext) {\n\t\tthis.setState({\n\t\t\tcolor: nextProps.color ?? blue[500],\n\t\t})\n\t}\n\n\tupdateStateInputColorValue = (color) => {\n\t\tthis.props.updateColorValueParentFunc(color);\n\t}\n\n\topenCustomColorPicker = (event) => {\n\t\tthis.setState({\n\t\t\tcustomColorPickAnchorEl: event.currentTarget,\n\t\t});\n\t}\n\n\tcloseCustomColorPicker = () => {\n\t\tthis.setState({\n\t\t\tcustomColorPickAnchorEl: null,\n\t\t});\n\t}\n\n\trenderCustomColorPicker = () => {\n\t\treturn \n\t\t\t\n\t\t\t\tPick Custom Color}/>\n\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t \n\t\t\t \n\n\t\t;\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{this.renderCustomColorPicker()}\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t this.updateStateInputColorValue(blue[500])}>\n\t\t\t\t\t\t\t{this.state.color === blue[500] ? \n\t\t\t\t\t\t \n\t\t\t\t\t \n\t\t\t\t\t\n\t\t\t\t\t\t this.updateStateInputColorValue(green[500])}>\n\t\t\t\t\t\t\t{this.state.color === green[500] ? \n\t\t\t\t\t\t \n\t\t\t\t\t \n\t\t\t\t\t\n\t\t\t\t\t\t this.updateStateInputColorValue(red[500])}>\n\t\t\t\t\t\t\t{this.state.color === red[500] ? \n\t\t\t\t\t\t \n\t\t\t\t\t \n\t\t\t\t\t\n\t\t\t\t\t\t this.updateStateInputColorValue(yellow[600])}>\n\t\t\t\t\t\t\t{this.state.color === yellow[600] ? \n\t\t\t\t\t\t \n\t\t\t\t\t \n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tthis.state.color !== blue[500] &&\n\t\t\t\t\t\t\t\t\t\tthis.state.color !== green[500] &&\n\t\t\t\t\t\t\t\t\t\tthis.state.color !== red[500] &&\n\t\t\t\t\t\t\t\t\t\tthis.state.color !== yellow[600] ? \n\t\t\t\t\t \n\t\t\t\t \n\t\t\t\n\t\t);\n\t}\n}\n\nexport default ColorSelector;","import React, {Component} from 'react';\nimport {UrlBuilder} from \"../../../core/url/UrlBuilder\";\nimport withStyles from '@mui/styles/withStyles';\nimport Dialog from \"@mui/material/Dialog\";\nimport DialogContent from \"@mui/material/DialogContent\";\nimport TextField from \"@mui/material/TextField\";\nimport Button from \"@mui/material/Button\";\nimport DialogActions from \"@mui/material/DialogActions\";\nimport moment from \"moment\";\nimport Slide from \"@mui/material/Slide\";\nimport Toolbar from \"@mui/material/Toolbar\";\nimport Typography from \"@mui/material/Typography\";\nimport IconButton from \"@mui/material/IconButton\";\nimport CloseIcon from \"@mui/icons-material/Close\";\nimport AppBar from \"@mui/material/AppBar\";\nimport Container from \"@mui/material/Container\";\nimport CircularProgress from \"@mui/material/CircularProgress\";\nimport Box from \"@mui/material/Box\";\nimport ColorSelector from \"../../core/utils/ColorSelector\";\nimport {ColorPicker} from \"../../../core/colors/ColorPicker\";\nimport {blue} from \"@mui/material/colors\";\n\nconst useStyles = theme => ({\n\tbutton: {\n\t\tmarginTop: theme.spacing(1),\n\t\tmarginBottom: theme.spacing(1),\n\t\tmarginRight: theme.spacing(1)\n\t},\n\tappBar: {\n\t\tposition: 'relative',\n\t},\n\ttitle: {\n\t\tmarginLeft: theme.spacing(2),\n\t\tflex: 100,\n\t},\n\tgrow: {\n\t\tflexGrow: 1,\n\t},\n});\n\nconst Transition = React.forwardRef(function Transition(props, ref) {\n\treturn