disable button when input is empty

src/app/components/add-item.tsx

@@ -1,8 +1,9 @@
 'use client';
 
 import { useState } from 'react';
-import { Input } from './input';
+
 import { Button } from './button';
+import { Input } from './input';
 
 type Props = {
 	onAddItem: (content: string) => void;
@@ -27,7 +28,9 @@ export function AddItem({ onAddItem: addItem }: Props) {
 				onValueChange={handleOnValueChange}
 				onEnter={handleAdd}
 			/>
-			<Button onClick={handleAdd}>Add item</Button>
+			<Button disabled={!value} onClick={handleAdd}>
+				Add item
+			</Button>
 		</div>
 	);
 }

src/app/components/button.tsx

@@ -3,10 +3,12 @@ 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
+		disabled={disabled}
 		onClick={onClick}
 		data-testid="button"
 		className="