From 79fec6409e465f8b43668d7b780a08dbac5dc75b Mon Sep 17 00:00:00 2001
From: EnderDev <kieran@dothq.org>
Date: Thu, 20 Jul 2023 21:28:29 +0100
Subject: [PATCH 1/2] =?UTF-8?q?=F0=9F=92=84=20Add=20disabled=20state=20to?=
 =?UTF-8?q?=20button=20component?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ui/foundation/components/button/index.scss | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/ui/foundation/components/button/index.scss b/ui/foundation/components/button/index.scss
index 2f6901c..76ba33a 100644
--- a/ui/foundation/components/button/index.scss
+++ b/ui/foundation/components/button/index.scss
@@ -81,3 +81,8 @@
 :root.no-js .fdn-button.no-js + .fdn-button:not(.no-js) {
 	display: none;
 }
+
+.fdn-button[disabled] {
+	opacity: 0.5;
+	pointer-events: none;
+}

From 86ffb6643ced58337227472c149248438441a2a4 Mon Sep 17 00:00:00 2001
From: EnderDev <kieran@dothq.org>
Date: Thu, 20 Jul 2023 21:28:55 +0100
Subject: [PATCH 2/2] =?UTF-8?q?=F0=9F=92=84=20Add=20disabled=20state=20to?=
 =?UTF-8?q?=20tab?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/ui/Tabs/index.tsx         | 6 +++++-
 ui/foundation/components/tabs/index.scss | 4 ++++
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/app/components/ui/Tabs/index.tsx b/app/components/ui/Tabs/index.tsx
index 1864d5d..422349f 100644
--- a/app/components/ui/Tabs/index.tsx
+++ b/app/components/ui/Tabs/index.tsx
@@ -7,6 +7,7 @@ import Button, { ButtonProps } from "../Button";
 export interface Tab {
 	value: string;
 	label: string;
+	disabled?: boolean;
 	children?: any;
 }
 
@@ -38,6 +39,7 @@ export const Tabs = ({
 						colour={rest.colour}
 						fullwidth
 						htmlFor={`tab__${tab.value}`}
+						disabled={tab.disabled || false}
 						as={"label"}
 						style={{
 							"--no-js-pos": "absolute",
@@ -52,7 +54,9 @@ export const Tabs = ({
 						{tab.label}
 					</Button>
 					<div hidden style={{ paddingTop: "45px" }}>
-						{tab.children()}
+						{typeof tab.children == "function"
+							? tab.children()
+							: tab.children}
 					</div>
 				</>
 			))}
diff --git a/ui/foundation/components/tabs/index.scss b/ui/foundation/components/tabs/index.scss
index 70ebbdf..da81a5f 100644
--- a/ui/foundation/components/tabs/index.scss
+++ b/ui/foundation/components/tabs/index.scss
@@ -9,6 +9,10 @@
 	.fdn-tab:hover {
 		--tab-border-bottom: 2px solid var(--fdn-colours-gray);
 	}
+
+	.fdn-tab[disabled] {
+		background-color: var(--fdn-colours-black-secondary);
+	}
 }
 
 :root:not(.no-js) .fdn-tabs {