[Frontend] Create Profile Card Component

[PrerakMathur20]

Profile Card Design

A Profile Card Component has to be designed and coded for the /dashboard and /profile routes.

Sub-Issue of #295

It should look something like the TaskCard as found here -

OpenMF/React-frontend/src/components/Admin/TaskCard.js

Lines 54 to 112 in 7d3cc7c

	function TaskCard({ id, title, description, due_on, is_completed }) {
	const classes = useStyles()
	const auth = useSelector(state => state.auth)
	const dispatch = useDispatch()
	const history = useHistory()
	// toggle is_completed true of false function
	function toggleComplete(id, is_completed) {
	dispatch(updateTask(id, is_completed, history))
	history.push('amdin/task/list')
	}
	return (
	<Container component="main" className={classes.root}>
	<Typography
	variant="h5"
	component="h2"
	className={classes.title}>
	{title}
	</Typography>
	<Typography
	variant="body1"
	component="h4"
	className={classes.date}>
	{due_on}
	</Typography>
	<Typography
	variant="body1"
	component="h4"
	className={classes.bodyText}>
	{description}
	</Typography>
	<Typography
	variant="body1"
	component="h4"
	className={classes.bodyText}>
	{
	(is_completed) ? (<span>Completed</span>) : (<span>Not Completed</span>)
	}
	</Typography>
	{/* Button to mask task completed */}
	{
	(auth.user.role === "admin") ?
	(<Button
	variant="contained"
	color="primary"
	onClick={() => toggleComplete(id, is_completed)}>
	{
	(is_completed) ? (<span>Mark Incomplete</span>) : (<span>Mark Complete</span>)
	}
	</Button>)
	: null
	}
	</Container>
	)
	}

It preferably should look like this -

Here's the Figma link for the same:
https://www.figma.com/file/I5D5qoMrLMWyxCZGcBGDkG/OpenMF-ProfileCard?node-id=101%3A11