feedback form not showing

app/components/Article/FeedbackForm/feedbackForm.css

@@ -52,7 +52,7 @@
 .composite-button > .feedback-form {
   position: absolute;
   left: 90px;
-  top: -342px;
+  top: -350px;
   display: none;
 }
 .composite-button > .feedback-form.show {

app/components/Article/FeedbackForm/index.tsx

@@ -23,13 +23,18 @@ export interface FeedbackFormProps {
    * Has Options
    */
   hasOptions?: boolean
+  /**
+   * onSubmit
+   */
+  onSubmit?: () => void
 }
 const FeedbackForm = ({
   pageid,
   className = 'feedback-form',
   onBlur,
   onFocus,
   hasOptions = true,
+  onSubmit,
 }: FeedbackFormProps) => {
   // to be implemented.
   const [selected, setSelected] = React.useState<string>()
@@ -47,7 +52,7 @@ const FeedbackForm = ({
       option: 'typos',
     },
   ]
-  const [enabledSubmit, setEnabledSubmit] = React.useState(false)
+  const [enabledSubmit, setEnabledSubmit] = React.useState(!hasOptions)
   const selectFeedback = (option: string) => {
     setSelected(option)
 
@@ -73,7 +78,11 @@ const FeedbackForm = ({
     [onBlur]
   )
 
-  const handleSubmit = () => {}
+  const handleSubmit = () => {
+    if (onSubmit) {
+      onSubmit()
+    }
+  }
 
   return (
     <div key={pageid} className={className} onBlur={handleBlur} onFocus={onFocus}>

app/components/Article/index.tsx

@@ -52,7 +52,7 @@ const ArticleFooter = (question: Question) => {
         </div>
         <span>Was this page helpful?</span>
 
-        <CompositeButton className="flex-container">
+        <CompositeButton className="flex-container relative">
           <Action
             pageid={question.pageid}
             showText={true}
@@ -74,6 +74,7 @@ const ArticleFooter = (question: Question) => {
             onBlur={() => setIsFormFocused(false)}
             onFocus={() => setIsFormFocused(true)}
             hasOptions={false}
+            onSubmit={() => setShowFeedbackForm(false)}
           />
         </CompositeButton>
       </div>

app/newRoot.css

@@ -536,3 +536,6 @@ button {
 .margin-top-40 {
   margin-top: var(--spacing-40);
 }
+.relative {
+  position: relative;
+}