diff --git a/React/test-feedback/package-lock.json b/React/test-feedback/package-lock.json
index 6e2e40991..0a4120fe4 100644
--- a/React/test-feedback/package-lock.json
+++ b/React/test-feedback/package-lock.json
@@ -18,6 +18,7 @@
         "react-router": "^6.23.0",
         "react-router-dom": "^6.23.0",
         "react-scripts": "5.0.1",
+        "uuid": "^9.0.1",
         "web-vitals": "^2.1.4"
       }
     },
@@ -16091,6 +16092,14 @@
         "websocket-driver": "^0.7.4"
       }
     },
+    "node_modules/sockjs/node_modules/uuid": {
+      "version": "8.3.2",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
+      "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
+      "bin": {
+        "uuid": "dist/bin/uuid"
+      }
+    },
     "node_modules/source-list-map": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz",
@@ -17428,9 +17437,13 @@
       }
     },
     "node_modules/uuid": {
-      "version": "8.3.2",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
-      "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.1.tgz",
+      "integrity": "sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA==",
+      "funding": [
+        "https://github.com/sponsors/broofa",
+        "https://github.com/sponsors/ctavan"
+      ],
       "bin": {
         "uuid": "dist/bin/uuid"
       }
diff --git a/React/test-feedback/package.json b/React/test-feedback/package.json
index 1db882db5..61d82b69b 100644
--- a/React/test-feedback/package.json
+++ b/React/test-feedback/package.json
@@ -13,6 +13,7 @@
     "react-router": "^6.23.0",
     "react-router-dom": "^6.23.0",
     "react-scripts": "5.0.1",
+    "uuid": "^9.0.1",
     "web-vitals": "^2.1.4"
   },
   "scripts": {
diff --git a/React/test-feedback/src/components/feed/FeedForm.js b/React/test-feedback/src/components/feed/FeedForm.js
index 9fffc47f4..eee9050da 100644
--- a/React/test-feedback/src/components/feed/FeedForm.js
+++ b/React/test-feedback/src/components/feed/FeedForm.js
@@ -1,27 +1,47 @@
-import React from 'react'
+import React, { useState } from 'react'
 import { FeedRating } from './FeedRating'
 import { Button } from '../shared/Button'
 import { Card } from '../shared/Card'
+import { v4 as uuid } from 'uuid'
 
 export const FeedForm = (props) => {
+  const [text, setText] = useState('')
+  const [rating, setRating] = useState(0)
+  const [isDisabled, setIsDisabled] = useState(true)
 
   const handleSubmit = (e) => {
+    console.log('ss')
     e.preventDefault()
+    const newFeed = {
+      id: uuid(),
+      text,
+      rating
+    }
+    props.addFeed(newFeed)
+  }
+
+  const handleChange = (e) => {
+    setText(e.target.value)
+    if (e.target.value.length > 10) {
+      setIsDisabled(false)
+    } else {
+      setIsDisabled(true)
+    }
   }
 
   return (
     <Card>
       <form onSubmit={handleSubmit} >
         <h2>How would you rate your service with us?</h2>
-        <FeedRating />
+        <FeedRating onChange={(e) => setRating(e.rating)} />
         <div className="input-group">
           <input
-
+            onChange={handleChange}
             type="text"
-
+            value={text}
             placeholder="Write a review"
           />
-          <Button type={'submit'} >
+          <Button type={'submit'} isDisabled={isDisabled} >
             Send
           </Button>
         </div>
diff --git a/React/test-feedback/src/components/shared/Button.js b/React/test-feedback/src/components/shared/Button.js
index 4a1c3acf5..412572420 100644
--- a/React/test-feedback/src/components/shared/Button.js
+++ b/React/test-feedback/src/components/shared/Button.js
@@ -1,6 +1,9 @@
-import React from 'react'
+import React, { useEffect } from 'react'
 
 export const Button = (props, { version = 'secondary', type = 'button' }) => {
+  useEffect(() => {
+    console.log(version, type)
+  }, [])
   return (
     <button type={type} disabled={props.isDisabled} className={`btn btn-${version}`}>
       {props.children}
diff --git a/React/test-feedback/src/pages/Home.js b/React/test-feedback/src/pages/Home.js
index e114bfb2f..62faa496f 100644
--- a/React/test-feedback/src/pages/Home.js
+++ b/React/test-feedback/src/pages/Home.js
@@ -12,6 +12,7 @@ export const Home = () => {
   }
 
   const addFeed = (feed) => {
+    console.log(feed)
     setFeed(feed.push(feed))
   }