diff options
| author | Fabian Mastenbroek <mail.fabianm@gmail.com> | 2021-05-12 22:42:12 +0200 |
|---|---|---|
| committer | Fabian Mastenbroek <mail.fabianm@gmail.com> | 2021-05-17 17:06:47 +0200 |
| commit | 4397a959e806bf476be4c81bc804616adf58b969 (patch) | |
| tree | a2bfdcb314594433413a235b516d18fa5416bf6d /opendc-web/opendc-web-ui/src/pages/profile.js | |
| parent | d21606bd238702645690586df5ad5b5075ca09c9 (diff) | |
ui: Migrate from CRA to Next.js
This change updates the web frontend to use Next.js instead of Create
React App (CRA). Next.js enables the possibility of rendering pages on
the server side (which reduces the time to first frame) and overall
provides a better development experience.
Future commits will try to futher optimize the implementation for
Next.js.
Diffstat (limited to 'opendc-web/opendc-web-ui/src/pages/profile.js')
| -rw-r--r-- | opendc-web/opendc-web-ui/src/pages/profile.js | 54 |
1 files changed, 54 insertions, 0 deletions
diff --git a/opendc-web/opendc-web-ui/src/pages/profile.js b/opendc-web/opendc-web-ui/src/pages/profile.js new file mode 100644 index 00000000..de60037b --- /dev/null +++ b/opendc-web/opendc-web-ui/src/pages/profile.js @@ -0,0 +1,54 @@ +import React, { useState } from 'react' +import Head from 'next/head' +import { useDispatch } from 'react-redux' +import AppNavbarContainer from '../containers/navigation/AppNavbarContainer' +import ConfirmationModal from '../components/modals/ConfirmationModal' +import { deleteCurrentUser } from '../actions/users' +import { useRequireAuth } from '../auth/hook' + +const Profile = () => { + useRequireAuth() + + const dispatch = useDispatch() + + const [isDeleteModalOpen, setDeleteModalOpen] = useState(false) + const onDelete = (isConfirmed) => { + if (isConfirmed) { + dispatch(deleteCurrentUser()) + } + setDeleteModalOpen(false) + } + + return ( + <> + <Head> + <title>My Profile - OpenDC</title> + </Head> + <div className="full-height"> + <AppNavbarContainer fullWidth={false} /> + <div className="container text-page-container full-height"> + <button + className="btn btn-danger mb-2 ml-auto mr-auto" + style={{ maxWidth: 300 }} + onClick={() => setDeleteModalOpen(true)} + > + Delete my account on OpenDC + </button> + <p className="text-muted text-center"> + This does not delete your Google account, but simply disconnects it from the OpenDC platform and + deletes any project info that is associated with you (projects you own and any authorizations + you may have on other projects). + </p> + </div> + <ConfirmationModal + title="Delete my account" + message="Are you sure you want to delete your OpenDC account?" + show={isDeleteModalOpen} + callback={onDelete} + /> + </div> + </> + ) +} + +export default Profile |