From 51a4b3472064845a4bc695a66914802dd973e78a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Vikt=C3=B3ria=20Brezinov=C3=A1?=
 <52294703+vikibrezinova@users.noreply.github.com>
Date: Sat, 11 Nov 2023 14:31:15 +0100
Subject: [PATCH] Upload of publications in administration (#156)

* create PublicationUploader

* add uploading publications for current semester

* add Accept to Uploader

* refactor uploading publications

* add order to Publication

* refactor/cleanup + style the section

---------

Co-authored-by: rtrembecky <rtrembecky@gmail.com>
---
 src/components/FileUploader/FileUploader.tsx  |  6 ++-
 .../PublicationUploader.tsx                   | 43 +++++++++++++++++++
 .../SemesterAdministration.tsx                |  8 ++++
 src/types/api/competition.ts                  |  1 +
 src/types/api/generated/competition.ts        |  1 +
 5 files changed, 57 insertions(+), 2 deletions(-)
 create mode 100644 src/components/PublicationUploader/PublicationUploader.tsx

diff --git a/src/components/FileUploader/FileUploader.tsx b/src/components/FileUploader/FileUploader.tsx
index 8550df1e..52b617af 100644
--- a/src/components/FileUploader/FileUploader.tsx
+++ b/src/components/FileUploader/FileUploader.tsx
@@ -7,10 +7,11 @@ import {Accept, DropzoneOptions, useDropzone} from 'react-dropzone'
 interface FileUploaderProps {
   uploadLink: string
   acceptedFormats?: Accept
+  adjustFormData?: (formData: FormData) => void
   refetch: () => void
 }
 
-export const FileUploader: FC<FileUploaderProps> = ({uploadLink, acceptedFormats, refetch}) => {
+export const FileUploader: FC<FileUploaderProps> = ({uploadLink, acceptedFormats, adjustFormData, refetch}) => {
   const {mutate: fileUpload} = useMutation({
     mutationFn: (formData: FormData) => axios.post(uploadLink, formData),
     onSuccess: () => refetch(),
@@ -23,9 +24,10 @@ export const FileUploader: FC<FileUploaderProps> = ({uploadLink, acceptedFormats
       }
       const formData = new FormData()
       formData.append('file', acceptedFiles[0])
+      adjustFormData?.(formData)
       fileUpload(formData)
     },
-    [fileUpload],
+    [adjustFormData, fileUpload],
   )
 
   const {getRootProps, getInputProps} = useDropzone({
diff --git a/src/components/PublicationUploader/PublicationUploader.tsx b/src/components/PublicationUploader/PublicationUploader.tsx
new file mode 100644
index 00000000..8c959d47
--- /dev/null
+++ b/src/components/PublicationUploader/PublicationUploader.tsx
@@ -0,0 +1,43 @@
+import {Stack} from '@mui/material'
+import {useQueryClient} from '@tanstack/react-query'
+import {FC} from 'react'
+
+import {SemesterWithProblems} from '@/types/api/generated/competition'
+
+import {Link} from '../Clickable/Clickable'
+import {FileUploader} from '../FileUploader/FileUploader'
+
+interface PublicationUploaderProps {
+  semesterId: string
+  order: number
+  semesterData: SemesterWithProblems | undefined
+}
+
+export const PublicationUploader: FC<PublicationUploaderProps> = ({semesterId, order, semesterData}) => {
+  const queryClient = useQueryClient()
+
+  const refetch = () => queryClient.invalidateQueries({queryKey: ['competition', 'semester', semesterId]})
+
+  const appendFormData = (formData: FormData) => {
+    formData.append('publication_type', 'Časopisy')
+    formData.append('event', semesterId)
+    formData.append('order', order.toString())
+  }
+
+  const publication = semesterData?.publication_set.find((publication) => publication.order === order)
+
+  return (
+    <Stack direction="row" gap={2} alignItems="center">
+      <h4>{order}. Časopis:</h4>
+      {publication && (
+        <Link href={`/api/competition/publication/${publication.id}/download`}>{publication.name}.pdf</Link>
+      )}
+      <FileUploader
+        uploadLink={'/api/competition/publication/upload/'}
+        acceptedFormats={{'application/pdf': ['.pdf']}}
+        adjustFormData={appendFormData}
+        refetch={refetch}
+      />
+    </Stack>
+  )
+}
diff --git a/src/components/SemesterAdministration/SemesterAdministration.tsx b/src/components/SemesterAdministration/SemesterAdministration.tsx
index 78fd8a2b..329749c1 100644
--- a/src/components/SemesterAdministration/SemesterAdministration.tsx
+++ b/src/components/SemesterAdministration/SemesterAdministration.tsx
@@ -1,3 +1,4 @@
+import {Stack} from '@mui/material'
 import {useQuery} from '@tanstack/react-query'
 import axios from 'axios'
 import {useRouter} from 'next/router'
@@ -9,6 +10,7 @@ import {useHasPermissions} from '@/utils/useHasPermissions'
 import {Button, Link} from '../Clickable/Clickable'
 import {Loading} from '../Loading/Loading'
 import styles from '../Problems/Problems.module.scss'
+import {PublicationUploader} from '../PublicationUploader/PublicationUploader'
 import {Result} from '../Results/ResultsRow'
 
 interface PostalCard {
@@ -125,6 +127,12 @@ export const SemesterAdministration: FC = () => {
       ) : (
         <></>
       )}
+      <Stack mt={1} gap={1}>
+        <h3>Nahrávanie časopisov</h3>
+        {[1, 2, 3].map((order) => (
+          <PublicationUploader key={order} semesterId={semesterId ?? ''} order={order} semesterData={semester} />
+        ))}
+      </Stack>
     </>
   )
 }
diff --git a/src/types/api/competition.ts b/src/types/api/competition.ts
index fc7243f2..45875149 100644
--- a/src/types/api/competition.ts
+++ b/src/types/api/competition.ts
@@ -13,6 +13,7 @@ export interface Publication {
   file: string
   publication_type: number | null
   event: number | null
+  order: number | null
 }
 
 export interface RegistrationLink {
diff --git a/src/types/api/generated/competition.ts b/src/types/api/generated/competition.ts
index 6dcb24af..62c5f460 100644
--- a/src/types/api/generated/competition.ts
+++ b/src/types/api/generated/competition.ts
@@ -4,6 +4,7 @@ export interface Publication {
   file: any
   publication_type?: any | null
   event?: any | null
+  order: number | null
 }
 
 export interface RegistrationLink {