Disable ArchiveButton with unsupported contest resources

icpc-sinchon · Sep 8, 2023 · 37de121 · 37de121
1 parent e57a2b5
commit 37de121
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 11 deletions.
diff --git a/components/ArchiveButton/ArchiveButton.js b/components/ArchiveButton/ArchiveButton.js
@@ -1,4 +1,5 @@
-import styled from "styled-components";
+import { useRef } from "react";
+import styled, { css } from "styled-components";
 
 const CustomButton = styled.div`
   border: 2px solid #009d3e;
@@ -9,13 +10,38 @@ const CustomButton = styled.div`
   font-weight: 700;
   color: #009d3e;
 
+  ${(props) =>
+    props.disabled &&
+    css`
+      cursor: not-allowed;
+      background-color: #eeeeee;
+      color: #aaaaaa;
+      border: none;
+    `}
+
   @media (max-width: 633px) {
     border: none;
     padding: 0.2rem 0;
   }
 `;
 
-const ATag = styled.a`
+const ArchiveButton = styled(
+  ({ className, href, children, disabled, disabledText }) => {
+    const customButtonRef = useRef(null);
+    if (disabled) {
+      return (
+        <CustomButton ref={customButtonRef} disabled={disabled}>
+          {children}
+        </CustomButton>
+      );
+    }
+    return (
+      <a className={className} href={href} target="_blank" rel="noreferrer">
+        <CustomButton>{children}</CustomButton>
+      </a>
+    );
+  },
+)`
   margin-left: 1.2rem;
 
   &:first-child {
@@ -31,12 +57,4 @@ const ATag = styled.a`
   }
 `;
 
-const ArchiveButton = ({ href, children }) => {
-  return (
-    <ATag href={href} target="_blank">
-      <CustomButton>{children}</CustomButton>
-    </ATag>
-  );
-};
-
 export default ArchiveButton;
diff --git a/pages/suapc.page.js b/pages/suapc.page.js
@@ -146,6 +146,7 @@ const Suapc = () => {
           {currentSeasonData.fileNames ? (
             <ArchiveWrap className="hide-if-mobile">
               <ArchiveButton
+                disabled={!Boolean(currentSeasonData.fileNames.testPdf)}
                 disabledText="문제 PDF가 제공되지 않는 대회입니다."
                 href={`https://api.suapc.kr/${currentYear}${
                   currentSeason === "Winter" ? "w" : "s"
@@ -154,16 +155,21 @@ const Suapc = () => {
                 문제 PDF
               </ArchiveButton>
               <ArchiveButton
+                disabled={!Boolean(currentSeasonData.fileNames.solutionPdf)}
                 href={`https://api.suapc.kr/${currentYear}${
                   currentSeason === "Winter" ? "w" : "s"
                 }/${currentSeasonData.fileNames.solutionPdf}`}
               >
                 해설 PDF
               </ArchiveButton>
-              <ArchiveButton href={currentSeasonData.links.scoreboard}>
+              <ArchiveButton
+                disabled={!Boolean(currentSeasonData.links.scoreboard)}
+                href={currentSeasonData.links.scoreboard}
+              >
                 스코어보드
               </ArchiveButton>
               <ArchiveButton
+                disabled={!Boolean(currentSeasonData.fileNames.posterImage)}
                 href={`https://api.suapc.kr/${currentYear}${
                   currentSeason === "Winter" ? "w" : "s"
                 }/${currentSeasonData.fileNames.posterImage}`}
@@ -186,6 +192,7 @@ const Suapc = () => {
                 <span style={{ fontSize: "smaller" }}>12/05부터</span>
               </AdmissionButton> */}
               <AdmissionButton
+                disabled={!Boolean(currentSeasonData.fileNames.posterImage)}
                 href={`https://api.suapc.kr/${currentYear}${
                   currentSeason === "Winter" ? "w" : "s"
                 }/${currentSeasonData.fileNames.posterImage}`}