Otvaranie PDF nahrateho/opraveneho riesenia v novom tabe (#152)

* otvorit PDF nahrateho/opraveneho riesenia v novom tabe * open rest of the PDF links in a new tab
ZdruzenieSTROM · Nov 10, 2023 · c4126a1 · c4126a1
1 parent d4b53be
commit c4126a1
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 8 deletions.
diff --git a/src/components/Archive/Archive.tsx b/src/components/Archive/Archive.tsx
@@ -23,7 +23,11 @@ const PublicationButton: FC<{
   publicationId: number
   publicationName: string
 }> = ({publicationId, publicationName}) => {
-  return <Link href={`/api/competition/publication/${publicationId}/download`}>{publicationName}</Link>
+  return (
+    <Link href={`/api/competition/publication/${publicationId}/download`} target="_blank">
+      {publicationName}
+    </Link>
+  )
 }
 
 const ResultsButton: FC<{

diff --git a/src/components/Clickable/Clickable.tsx b/src/components/Clickable/Clickable.tsx
@@ -1,6 +1,6 @@
 import clsx from 'clsx'
 import NextLink from 'next/link'
-import {ButtonHTMLAttributes, FC, ReactNode} from 'react'
+import {ButtonHTMLAttributes, ComponentProps, FC, ReactNode} from 'react'
 
 import styles from './Clickable.module.scss'
 
@@ -24,20 +24,20 @@ export const Button: FC<ButtonProps> = ({children, onClick, disabled, type}) =>
   )
 }
 
-interface LinkProps {
+type LinkProps = {
   href?: string
   disabled?: boolean
   children: ReactNode
-}
+} & Pick<ComponentProps<typeof NextLink>, 'target'>
 
-export const Link: FC<LinkProps> = ({children, href, disabled}) => {
+export const Link: FC<LinkProps> = ({children, href, disabled, target}) => {
   // https://a11y-guidelines.orange.com/en/articles/disable-elements/#disable-a-link
   return disabled ? (
     <a className={clsx(styles.actionButton, styles.disabled)} aria-disabled role="link">
       {children}
     </a>
   ) : (
-    <NextLink href={href ?? ''} className={clsx(styles.actionButton)}>
+    <NextLink href={href ?? ''} target={target} className={clsx(styles.actionButton)}>
       {children}
     </NextLink>
   )

diff --git a/src/components/Problems/Problems.tsx b/src/components/Problems/Problems.tsx
@@ -72,14 +72,23 @@ const Problem: FC<{
       )}
       {displayActions && (
         <div className={styles.actions}>
-          {problem.solution_pdf && <Link href={problem.solution_pdf}>vzorové riešenie</Link>}
+          {problem.solution_pdf && (
+            <Link href={problem.solution_pdf} target="_blank">
+              vzorové riešenie
+            </Link>
+          )}
           {registered && (
             <>
-              <Link href={`/api/competition/problem/${problem.id}/my-solution`} disabled={!problem.submitted}>
+              <Link
+                href={`/api/competition/problem/${problem.id}/my-solution`}
+                target="_blank"
+                disabled={!problem.submitted}
+              >
                 moje riešenie
               </Link>
               <Link
                 href={`/api/competition/problem/${problem.id}/corrected-solution`}
+                target="_blank"
                 disabled={!problem.submitted?.corrected_solution}
               >
                 opravené riešenie{!!problem.submitted?.corrected_solution && ` (${problem.submitted.score || '?'})`}