flexor-web/src/app/components/user-apps.tsx

import React, { FC, useEffect } from 'react'
import { useHistory } from 'react-router-dom'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faPlusCircle } from '@fortawesome/free-solid-svg-icons'

import { setTitle } from '../utils'

const UserApps: FC = () => {
    const history = useHistory()

    useEffect(() => {
        setTitle('Your Apps')
    }, [])

    return (
        <div>
            <button onClick={() => history.push('/apps/new')}>
                <span className="button-icon">
                    <FontAwesomeIcon icon={faPlusCircle} />
                </span>
                <span>Create a new App</span>
            </button>
        </div>
    )
}

export default UserApps