Håndterer disabled state

Author: anders-nom

src/components/main-section/content-view/pdf-exporter/PdfExporter.tsx

@@ -132,6 +132,7 @@ export const PdfExporter = ({ content, hidden }: Props) => {
                 <DownloadLink
                     href={`${pdfApi}/multi/${versionKeysSelected.join(',')}`}
                     icon={versionKeysSelected.length > 0 && <DownloadIcon />}
+                    disabled={versionKeysSelected.length === 0}
                 >
                     {versionKeysSelected.length === 0
                         ? 'Ingen versjoner valgt'

src/components/main-section/content-view/pdf-exporter/download-link/DownloadLink.module.css

@@ -22,8 +22,17 @@
 }
 
 .disabled {
-    pointer-events: none;
-    color: var(--a-gray-300);
+    color: var(--a-gray-400);
+    cursor: not-allowed;
+
+    &:hover {
+        background-color: unset;
+    }
+
+    &:active {
+        color: unset;
+        background-color: unset;
+    }
 }
 
 .iconContainer {

src/components/main-section/content-view/pdf-exporter/download-link/DownloadLink.tsx

@@ -17,7 +17,12 @@ type Props = {
 export const DownloadLink = ({ href, icon, disabled, className, children }: Props) => {
     const [isWaiting, setIsWaiting] = useState(false);
 
-    const onDownload = () => {
+    const onDownload = (e: React.MouseEvent) => {
+        if (disabled) {
+            e.preventDefault();
+            return;
+        }
+
         Cookies.remove(DOWNLOAD_COOKIE_NAME);
         setIsWaiting(true);