From 67458dc609c41b214358ccde653449bda4cfb79a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=BDofie=20T=C5=AFmov=C3=A1?= <zofietumova@gmail.com>
Date: Thu, 4 Apr 2024 20:12:59 +0200
Subject: [PATCH 1/3] button disabled

---
 src/app/components/add-item.tsx | 4 +++-
 src/app/components/button.tsx   | 4 +++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/app/components/add-item.tsx b/src/app/components/add-item.tsx
index a07ad0a..4a80bb9 100644
--- a/src/app/components/add-item.tsx
+++ b/src/app/components/add-item.tsx
@@ -27,7 +27,9 @@ export function AddItem({ onAddItem: addItem }: Props) {
 				onValueChange={handleOnValueChange}
 				onEnter={handleAdd}
 			/>
-			<Button onClick={handleAdd}>Add item</Button>
+			<Button onClick={handleAdd} disabled={value === ''}>
+				Add item
+			</Button>
 		</div>
 	);
 }
diff --git a/src/app/components/button.tsx b/src/app/components/button.tsx
index 14ee322..00533bf 100644
--- a/src/app/components/button.tsx
+++ b/src/app/components/button.tsx
@@ -3,9 +3,10 @@ import React from 'react';
 type Props = {
 	onClick: () => void;
 	children: React.ReactNode;
+	disabled: boolean;
 };
 
-export const Button = ({ onClick, children }: Props) => (
+export const Button = ({ onClick, children, disabled }: Props) => (
 	<button
 		onClick={onClick}
 		data-testid="button"
@@ -15,6 +16,7 @@ export const Button = ({ onClick, children }: Props) => (
 		 focus:ring-offset-0 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring
 		active:bg-destructive/80
 		disabled:opacity-50"
+		disabled={disabled}
 	>
 		{children}
 	</button>

From 8254b3f64d35b39c2ad4a66d8ffc5767cf8baaa7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=BDofie=20T=C5=AFmov=C3=A1?= <zofietumova@gmail.com>
Date: Thu, 4 Apr 2024 20:24:51 +0200
Subject: [PATCH 2/3] reset value on submit

---
 src/app/components/add-item.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/app/components/add-item.tsx b/src/app/components/add-item.tsx
index 4a80bb9..6bd260c 100644
--- a/src/app/components/add-item.tsx
+++ b/src/app/components/add-item.tsx
@@ -10,6 +10,7 @@ type Props = {
 
 export function AddItem({ onAddItem: addItem }: Props) {
 	const [value, setValue] = useState('');
+
 	const handleOnValueChange = (value: string) => {
 		setValue(value);
 	};
@@ -18,6 +19,7 @@ export function AddItem({ onAddItem: addItem }: Props) {
 		if (value !== '') {
 			addItem(value);
 		}
+		setValue('');
 	};
 
 	return (

From a7eafa4eebef532e9fb77b351ad341b9b8c7f405 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=BDofie=20T=C5=AFmov=C3=A1?= <zofietumova@gmail.com>
Date: Thu, 4 Apr 2024 20:33:06 +0200
Subject: [PATCH 3/3] Revert "button disabled"

This reverts commit 67458dc609c41b214358ccde653449bda4cfb79a.
---
 src/app/components/add-item.tsx | 4 +---
 src/app/components/button.tsx   | 4 +---
 2 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/src/app/components/add-item.tsx b/src/app/components/add-item.tsx
index 6bd260c..51af451 100644
--- a/src/app/components/add-item.tsx
+++ b/src/app/components/add-item.tsx
@@ -29,9 +29,7 @@ export function AddItem({ onAddItem: addItem }: Props) {
 				onValueChange={handleOnValueChange}
 				onEnter={handleAdd}
 			/>
-			<Button onClick={handleAdd} disabled={value === ''}>
-				Add item
-			</Button>
+			<Button onClick={handleAdd}>Add item</Button>
 		</div>
 	);
 }
diff --git a/src/app/components/button.tsx b/src/app/components/button.tsx
index 00533bf..14ee322 100644
--- a/src/app/components/button.tsx
+++ b/src/app/components/button.tsx
@@ -3,10 +3,9 @@ import React from 'react';
 type Props = {
 	onClick: () => void;
 	children: React.ReactNode;
-	disabled: boolean;
 };
 
-export const Button = ({ onClick, children, disabled }: Props) => (
+export const Button = ({ onClick, children }: Props) => (
 	<button
 		onClick={onClick}
 		data-testid="button"
@@ -16,7 +15,6 @@ export const Button = ({ onClick, children, disabled }: Props) => (
 		 focus:ring-offset-0 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring
 		active:bg-destructive/80
 		disabled:opacity-50"
-		disabled={disabled}
 	>
 		{children}
 	</button>