From 20a5d2407c1ab3d6030962c68f8e95ed3d69ab19 Mon Sep 17 00:00:00 2001
From: Smilinko <martin.smilnak@gmail.com>
Date: Sat, 9 Dec 2023 19:48:12 +0100
Subject: [PATCH 1/2] Login window popup when submitting

---
 .../LoginFormWrapper/LoginFormWrapper.tsx     |  5 +--
 src/components/Problems/Problem.tsx           | 34 ++++++++++++++++---
 2 files changed, 32 insertions(+), 7 deletions(-)

diff --git a/src/components/PageLayout/LoginFormWrapper/LoginFormWrapper.tsx b/src/components/PageLayout/LoginFormWrapper/LoginFormWrapper.tsx
index c8f5453f..e58e7596 100644
--- a/src/components/PageLayout/LoginFormWrapper/LoginFormWrapper.tsx
+++ b/src/components/PageLayout/LoginFormWrapper/LoginFormWrapper.tsx
@@ -1,3 +1,4 @@
+import {Stack} from '@mui/material'
 import {useRouter} from 'next/router'
 import {FC, useState} from 'react'
 
@@ -16,7 +17,7 @@ export const LoginFormWrapper: FC<LoginFormWrapperProps> = ({closeOverlay}) => {
 
   if (form === 'login')
     return (
-      <>
+      <Stack alignItems={'center'} gap={1}>
         <LoginForm closeOverlay={closeOverlay} />
         <Button
           onClick={() => {
@@ -25,7 +26,7 @@ export const LoginFormWrapper: FC<LoginFormWrapperProps> = ({closeOverlay}) => {
         >
           Zabudnuté heslo
         </Button>
-      </>
+      </Stack>
     )
 
   return (
diff --git a/src/components/Problems/Problem.tsx b/src/components/Problems/Problem.tsx
index 85a760d4..bd05a8c8 100644
--- a/src/components/Problems/Problem.tsx
+++ b/src/components/Problems/Problem.tsx
@@ -6,7 +6,9 @@ import {Button} from '@/components/Clickable/Button'
 import {Link} from '@/components/Clickable/Link'
 import {Problem as ProblemType} from '@/types/api/competition'
 
+import {Dialog} from '../Dialog/Dialog'
 import {Latex} from '../Latex/Latex'
+import {LoginFormWrapper} from '../PageLayout/LoginFormWrapper/LoginFormWrapper'
 import styles from './Problem.module.scss'
 import {UploadProblemForm} from './UploadProblemForm'
 
@@ -45,16 +47,28 @@ export const Problem: FC<{
       }
     })
   }
+
+  const close = () => {
+    setDisplayLoginDialog(false)
+  }
+
   const handleUploadClick = () => {
     if (!registered && canRegister) {
       displayRegisterDialog()
+    } else if (!registered && !canRegister) {
+      setDisplayLoginDialog(true)
     } else {
       setDisplayProblemUploadForm((prevState) => !prevState)
       setDisplayActions(false)
     }
   }
 
+  const toggleDisplayLoginDialog = () => {
+    setDisplayLoginDialog((prevState) => !prevState)
+  }
+
   const [displayProblemUploadForm, setDisplayProblemUploadForm] = useState<boolean>(false)
+  const [displayLoginDialog, setDisplayLoginDialog] = useState<boolean>(false)
   const [displayActions, setDisplayActions] = useState(true)
 
   return (
@@ -84,6 +98,18 @@ export const Problem: FC<{
           setDisplayActions={setDisplayActions}
         />
       )}
+      {displayLoginDialog && (
+        <Dialog
+          open={displayLoginDialog}
+          close={close}
+          contentText={
+            <Stack alignItems={'center'} gap={3}>
+              <Typography variant="body1">Pre odovzdanie sa prihlás.</Typography>
+              <LoginFormWrapper closeOverlay={toggleDisplayLoginDialog} />
+            </Stack>
+          }
+        />
+      )}
       {displayActions && (
         <Stack direction="row" mt={0.5} justifyContent="end" gap={4}>
           {problem.solution_pdf && (
@@ -114,11 +140,9 @@ export const Problem: FC<{
           <Button onClick={handleDiscussionButtonClick} variant="button2">
             diskusia ({problem.num_comments}){' '}
           </Button>
-          {(registered || canRegister) && (
-            <Button onClick={handleUploadClick} disabled={!canSubmit} variant="button2">
-              odovzdať
-            </Button>
-          )}
+          <Button onClick={handleUploadClick} disabled={!canSubmit} variant="button2">
+            odovzdať
+          </Button>
         </Stack>
       )}
     </div>

From 856d17f5999727541efd1d71e6001c274f74d35a Mon Sep 17 00:00:00 2001
From: Smilinko <martin.smilnak@gmail.com>
Date: Sat, 9 Dec 2023 20:28:21 +0100
Subject: [PATCH 2/2] Login popup when submitting done properly

---
 src/components/Problems/Problem.tsx  | 27 +++------------------------
 src/components/Problems/Problems.tsx | 15 +++++++++++++++
 2 files changed, 18 insertions(+), 24 deletions(-)

diff --git a/src/components/Problems/Problem.tsx b/src/components/Problems/Problem.tsx
index bd05a8c8..fca9aefb 100644
--- a/src/components/Problems/Problem.tsx
+++ b/src/components/Problems/Problem.tsx
@@ -6,9 +6,7 @@ import {Button} from '@/components/Clickable/Button'
 import {Link} from '@/components/Clickable/Link'
 import {Problem as ProblemType} from '@/types/api/competition'
 
-import {Dialog} from '../Dialog/Dialog'
 import {Latex} from '../Latex/Latex'
-import {LoginFormWrapper} from '../PageLayout/LoginFormWrapper/LoginFormWrapper'
 import styles from './Problem.module.scss'
 import {UploadProblemForm} from './UploadProblemForm'
 
@@ -28,6 +26,7 @@ export const Problem: FC<{
   isAfterDeadline: boolean
   invalidateSeriesQuery: () => Promise<void>
   displayRegisterDialog: () => void
+  displayLoginDialog: () => void
 }> = ({
   problem,
   registered,
@@ -37,6 +36,7 @@ export const Problem: FC<{
   isAfterDeadline,
   invalidateSeriesQuery,
   displayRegisterDialog,
+  displayLoginDialog,
 }) => {
   const handleDiscussionButtonClick = () => {
     setDisplaySideContent((prevState) => {
@@ -48,27 +48,18 @@ export const Problem: FC<{
     })
   }
 
-  const close = () => {
-    setDisplayLoginDialog(false)
-  }
-
   const handleUploadClick = () => {
     if (!registered && canRegister) {
       displayRegisterDialog()
     } else if (!registered && !canRegister) {
-      setDisplayLoginDialog(true)
+      displayLoginDialog()
     } else {
       setDisplayProblemUploadForm((prevState) => !prevState)
       setDisplayActions(false)
     }
   }
 
-  const toggleDisplayLoginDialog = () => {
-    setDisplayLoginDialog((prevState) => !prevState)
-  }
-
   const [displayProblemUploadForm, setDisplayProblemUploadForm] = useState<boolean>(false)
-  const [displayLoginDialog, setDisplayLoginDialog] = useState<boolean>(false)
   const [displayActions, setDisplayActions] = useState(true)
 
   return (
@@ -98,18 +89,6 @@ export const Problem: FC<{
           setDisplayActions={setDisplayActions}
         />
       )}
-      {displayLoginDialog && (
-        <Dialog
-          open={displayLoginDialog}
-          close={close}
-          contentText={
-            <Stack alignItems={'center'} gap={3}>
-              <Typography variant="body1">Pre odovzdanie sa prihlás.</Typography>
-              <LoginFormWrapper closeOverlay={toggleDisplayLoginDialog} />
-            </Stack>
-          }
-        />
-      )}
       {displayActions && (
         <Stack direction="row" mt={0.5} justifyContent="end" gap={4}>
           {problem.solution_pdf && (
diff --git a/src/components/Problems/Problems.tsx b/src/components/Problems/Problems.tsx
index 1e17c4d3..e7cbb98f 100644
--- a/src/components/Problems/Problems.tsx
+++ b/src/components/Problems/Problems.tsx
@@ -17,6 +17,7 @@ import {useHasPermissions} from '@/utils/useHasPermissions'
 
 import {Dialog} from '../Dialog/Dialog'
 import {Loading} from '../Loading/Loading'
+import {LoginFormWrapper} from '../PageLayout/LoginFormWrapper/LoginFormWrapper'
 import {Discussion} from './Discussion'
 import {Problem} from './Problem'
 import styles from './Problems.module.scss'
@@ -117,6 +118,9 @@ export const Problems: FC = () => {
     closeRegisterDialog()
   }
 
+  const [displayLoginDialog, setDisplayLoginDialog] = useState<boolean>(false)
+  const closeLoginDialog = () => setDisplayLoginDialog(false)
+
   return (
     <>
       <Dialog
@@ -154,6 +158,16 @@ export const Problems: FC = () => {
           </Stack>
         }
       />
+      <Dialog
+        open={displayLoginDialog}
+        close={closeLoginDialog}
+        contentText={
+          <Stack alignItems={'center'} gap={3}>
+            <Typography variant="body1">Pre odovzdanie sa prihlás.</Typography>
+            <LoginFormWrapper closeOverlay={closeLoginDialog} />
+          </Stack>
+        }
+      />
       <Stack gap={5}>
         {(loading.semesterListIsLoading ||
           loading.currentSeriesIsLoading ||
@@ -177,6 +191,7 @@ export const Problems: FC = () => {
             isAfterDeadline={isAfterDeadline}
             invalidateSeriesQuery={invalidateSeriesQuery}
             displayRegisterDialog={() => setDisplayRegisterDialog(true)}
+            displayLoginDialog={() => setDisplayLoginDialog(true)}
           />
         ))}