Reduced login possibility to Google only

flojud · May 17, 2024 · 97a2a0c · 97a2a0c
1 parent 736c6e5
commit 97a2a0c
Show file tree

Hide file tree

Showing 6 changed files with 50 additions and 263 deletions.
diff --git a/src/AppRouting.tsx b/src/AppRouting.tsx
@@ -10,7 +10,6 @@ const AppRouting = () => {
   const PolicyPage = lazy(() => import('./components/legal/PolicyPage'));
   const TermsPage = lazy(() => import('./components/legal/TermsPage'));
   const ProfilePage = lazy(() => import('./components/settings/ProfilePage'));
-  const SignInPage = lazy(() => import('./components/SignInPage'));
   const SignUpPage = lazy(() => import('./components/SignUpPage'));
   const TimeInputPage = lazy(() => import('./components/time/TimeInputPage'));
   const TimeHistoryPage = lazy(() => import('./components/time/TimeHistoryPage'));
@@ -26,14 +25,6 @@ const AppRouting = () => {
           </Suspense>
         }
       />
-      <Route
-        path="/signin"
-        element={
-          <Suspense fallback={<LinearProgress color="secondary" />}>
-            <SignInPage />
-          </Suspense>
-        }
-      />
       <Route
         path="/signup"
         element={

diff --git a/src/components/SignInPage.tsx b/src/components/SignInPage.tsx
diff --git a/src/components/UnautheticatedHomePage.tsx b/src/components/UnautheticatedHomePage.tsx
@@ -1,7 +1,5 @@
-import EmailIcon from '@mui/icons-material/Email';
 import GoogleIcon from '@mui/icons-material/Google';
 import { Box, Button, Link, Stack, Typography } from '@mui/material';
-import { Link as RouterLink } from 'react-router-dom';
 import useNotification from '../hooks/useNotification';
 import { useAppDispatch } from '../store/hooks';
 import { googleSignIn } from '../store/thunks/authThunks';
@@ -45,20 +43,7 @@ const UnautheticatedHomePage = () => {
             onClick={handleGoogleSignup}
             color="secondary">
             <Typography variant="button" display="block" color="text.primary">
-              Mit Google registrieren
-            </Typography>
-          </Button>
-        </Item>
-        <Item>
-          <Button
-            variant="contained"
-            fullWidth
-            startIcon={<EmailIcon sx={{ color: 'text.primary' }} />}
-            component={RouterLink}
-            to="/signup"
-            color="secondary">
-            <Typography variant="button" display="block" color="text.primary">
-              Meine Email verwenden
+              Melde dich mit Google an
             </Typography>
           </Button>
         </Item>
@@ -68,11 +53,6 @@ const UnautheticatedHomePage = () => {
             <Link href="/legal/policy">Datenschutz-Bestimmungen</Link> an.
           </Typography>
         </Item>
-        <Item>
-          <Typography variant="body1" gutterBottom>
-            Bereits Mitglied? <Link href="/signin">Anmelden</Link>
-          </Typography>
-        </Item>
       </Box>
     </Stack>
   );

diff --git a/src/components/settings/ProfileSettingsTabs.tsx b/src/components/settings/ProfileSettingsTabs.tsx
@@ -32,7 +32,6 @@ function a11yProps(index: number) {
 
 const ProfileSettingsTabs = () => {
   const TabMyProfileCard = lazy(() => import('./TabMyProfileCard'));
-  const TabSecurityCard = lazy(() => import('./TabSecurityCard'));
   const TabMyDataCard = lazy(() => import('./TabMyDataCard'));
 
   const [value, setValue] = React.useState(0);
@@ -50,7 +49,6 @@ const ProfileSettingsTabs = () => {
         <Tabs value={value} onChange={handleChange} aria-label="basic tabs example">
           <Tab label="Meine Daten" {...a11yProps(0)} />
           <Tab label="Konto" {...a11yProps(1)} />
-          <Tab label="Security" {...a11yProps(2)} />
         </Tabs>
       </Box>
       <TabPanel value={value} index={0}>
@@ -63,11 +61,6 @@ const ProfileSettingsTabs = () => {
           <TabMyProfileCard />
         </Suspense>
       </TabPanel>
-      <TabPanel value={value} index={2}>
-        <Suspense fallback={<LinearProgress color="secondary" />}>
-          <TabSecurityCard />
-        </Suspense>
-      </TabPanel>
     </Box>
   );
 };

diff --git a/src/components/settings/TabMyProfileCard.tsx b/src/components/settings/TabMyProfileCard.tsx
@@ -1,9 +1,24 @@
-import { Avatar, Box, Card, CardContent, CardHeader, Stack, TextField } from '@mui/material';
-import { useAppSelector } from '../../store/hooks';
+import { ErrorOutlineOutlined } from '@mui/icons-material';
+import { Avatar, Box, Button, Card, CardActions, CardContent, CardHeader, Divider, Stack, TextField, Typography } from '@mui/material';
+import useNotification from '../../hooks/useNotification';
+import { useAppDispatch, useAppSelector } from '../../store/hooks';
+import { deleteMyUser } from '../../store/thunks/authThunks';
 import { ReactComponent as MyProfileSvg } from '../../svg/myprofile.svg';
 
 const TabMyProfileCard = () => {
   const user = useAppSelector((state) => state.auth.user);
+  const dispatch = useAppDispatch();
+  const { notifyContext } = useNotification();
+
+  /*
+    Handle Delete Account
+  */
+  const deleteAccount = () => {
+    dispatch(deleteMyUser(undefined)).catch((error) => {
+      console.error(error);
+      notifyContext.addNotification(error, 'error');
+    });
+  };
 
   return (
     <Stack direction="column" alignItems="center" spacing={0}>
@@ -31,6 +46,38 @@ const TabMyProfileCard = () => {
           </Box>
         </CardContent>
       </Card>
+      <Divider sx={{ my: 2 }} />
+      <Card sx={{ width: '100%' }}>
+        <CardHeader title="Account löschen"></CardHeader>
+        <CardContent
+          sx={{
+            display: 'flex',
+            flexDirection: 'column',
+            alignSelf: 'center',
+            padding: 2,
+            gap: 2,
+          }}>
+          <Typography variant="body1" display="block" gutterBottom>
+            Solltest du uns verlassen wollen, kannst du deinen Account mit all deinen Daten ganz einfach hier löschen. Es ist im Anschluss
+            nicht mehr möglich deine Daten wiederherzustellen.
+          </Typography>
+        </CardContent>
+        <CardActions
+          sx={{
+            padding: 2,
+            gap: 2,
+          }}>
+          <Button
+            variant="contained"
+            startIcon={<ErrorOutlineOutlined sx={{ color: 'text.primary' }} />}
+            color="secondary"
+            onClick={deleteAccount}>
+            <Typography variant="button" display="block" color="text.primary">
+              Löschen
+            </Typography>
+          </Button>
+        </CardActions>
+      </Card>
     </Stack>
   );
 };

diff --git a/src/components/settings/TabSecurityCard.tsx b/src/components/settings/TabSecurityCard.tsx