Update

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": {

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>

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}

React/test-feedback/src/pages/Home.js

@@ -12,6 +12,7 @@ export const Home = () => {
   }
 
   const addFeed = (feed) => {
+    console.log(feed)
     setFeed(feed.push(feed))
   }