From e31459b402bb27f04d3e34f29a33359ad8df51a1 Mon Sep 17 00:00:00 2001
From: wolesijohn <104014371+wolesijohn@users.noreply.github.com>
Date: Tue, 17 Dec 2024 15:15:59 +0100
Subject: [PATCH] Update 5-useState-counter.js

---
 .../1-useState/setup/5-useState-counter.js      | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/tutorial/1-useState/setup/5-useState-counter.js b/src/tutorial/1-useState/setup/5-useState-counter.js
index fb6ede72..673cdae9 100644
--- a/src/tutorial/1-useState/setup/5-useState-counter.js
+++ b/src/tutorial/1-useState/setup/5-useState-counter.js
@@ -1,7 +1,22 @@
 import React, { useState } from 'react';
 
 const UseStateCounter = () => {
-  return <h2>useState counter example</h2>;
+  const [value,setValue]=useState(0);
+  const reset=()=>{
+    setValue(0)
+  }
+
+  return (<>
+            <section style={{margin:"4 rem 0"}}>
+              <h2>Counter</h2>
+              <h1>{value}</h1>
+              <button className="btn" onClick={()=>setValue(value+1)}>Increase</button>
+              <button className="btn" onClick={reset}>Reset</button>
+              <button className="btn" onClick={()=>setValue(value-1)}>Decrease</button>
+
+
+            </section>
+);
 };
 
 export default UseStateCounter;