From 7f98a5c07e3ec09debf61b01a0d554c66e25f70d Mon Sep 17 00:00:00 2001
From: overflowerror <mail@overflowerror.com>
Date: Sat, 21 Aug 2021 19:40:01 +0200
Subject: [PATCH] feat: reset form data on cancel

---
 .../src/components/AccountDialog/index.tsx    | 12 +++++++++-
 .../src/components/ThreadFormDialog/index.tsx | 22 ++++++++++++++++++-
 2 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/AccountDialog/index.tsx b/frontend/src/components/AccountDialog/index.tsx
index 53ca892..5a1ff69 100644
--- a/frontend/src/components/AccountDialog/index.tsx
+++ b/frontend/src/components/AccountDialog/index.tsx
@@ -1,4 +1,4 @@
-import {FunctionComponent, useState} from "react";
+import {FunctionComponent, useEffect, useState} from "react";
 import {
     Button,
     Dialog,
@@ -37,6 +37,16 @@ const AccountDialog: FunctionComponent<AccountFormDialogProps> = (
 
     const [error, setError] = useState<string | null>(null)
 
+    useEffect(() => {
+        if (!open) {
+            // dialog is closed; reset component
+            setError(null)
+            setCode("")
+            setAccountId(null)
+            setActiveStep(0)
+        }
+    })
+
     return (
         <Dialog open={open}>
             <DialogTitle title={"New Account"}/>
diff --git a/frontend/src/components/ThreadFormDialog/index.tsx b/frontend/src/components/ThreadFormDialog/index.tsx
index 4fc5d58..716e952 100644
--- a/frontend/src/components/ThreadFormDialog/index.tsx
+++ b/frontend/src/components/ThreadFormDialog/index.tsx
@@ -1,4 +1,4 @@
-import React, {FunctionComponent, useState} from "react";
+import React, {FunctionComponent, useEffect, useState} from "react";
 import {
     Button,
     Dialog,
@@ -7,6 +7,7 @@ import {
     DialogTitle,
     Grid,
     IconButton,
+    InputAdornment,
     TextField
 } from "@material-ui/core";
 import DeleteIcon from '@material-ui/icons/Delete';
@@ -41,10 +42,21 @@ const Index: FunctionComponent<ThreadFormProps> = (
         return _idCounter
     }
 
+    const [_initial, _setInitial] = useState<Thread>(initial)
     const [thread, setThread] = useState<Thread>(initial)
 
     const [error, setError] = useState<string | null>(null)
 
+    useEffect(() => {
+        if (initial != _initial) {
+            // initial changed
+            _setInitial(initial)
+            setThread(initial)
+            setError(null)
+            _setIdCounter(0)
+        }
+    })
+
     return (
         <Dialog open={open}>
             <DialogTitle title={"Thread"}/>
@@ -113,6 +125,14 @@ const Index: FunctionComponent<ThreadFormProps> = (
                                                                         ...thread
                                                                     })
                                                                 }}
+                                                                InputProps={{
+                                                                    endAdornment: (
+                                                                        <InputAdornment position="end">
+                                                                            {280 - thread.tweets[index].text.length}
+                                                                        </InputAdornment>
+                                                                    )
+                                                                }}
+
                                                                 variant="outlined"
                                                                 fullWidth
                                                             />