From 8c7a91c7b87ef1be1cde4258293e575922a17690 Mon Sep 17 00:00:00 2001
From: Alejandro Celaya <alejandro@alejandrocelaya.com>
Date: Sat, 27 Mar 2021 18:56:24 +0100
Subject: [PATCH] Memoized initial state for editing short URL, to ensure the
 form values are not reset while saving

---
 src/short-urls/EditShortUrl.tsx | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/short-urls/EditShortUrl.tsx b/src/short-urls/EditShortUrl.tsx
index ff21254e..3f3f3e49 100644
--- a/src/short-urls/EditShortUrl.tsx
+++ b/src/short-urls/EditShortUrl.tsx
@@ -1,4 +1,4 @@
-import { FC, useEffect } from 'react';
+import { FC, useEffect, useMemo } from 'react';
 import { RouteComponentProps } from 'react-router';
 import { Button, Card } from 'reactstrap';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
@@ -58,6 +58,10 @@ export const EditShortUrl = (ShortUrlForm: FC<ShortUrlFormProps>) => ({
   const { loading, error, errorData, shortUrl } = shortUrlDetail;
   const { saving, error: savingError, errorData: savingErrorData } = shortUrlEdition;
   const { domain } = parseQuery<{ domain?: string }>(search);
+  const initialState = useMemo(
+    () => getInitialState(shortUrl, shortUrlCreationSettings),
+    [ shortUrl, shortUrlCreationSettings ],
+  );
 
   useEffect(() => {
     getShortUrlDetail(params.shortCode, domain);
@@ -91,7 +95,7 @@ export const EditShortUrl = (ShortUrlForm: FC<ShortUrlFormProps>) => ({
         </Card>
       </header>
       <ShortUrlForm
-        initialState={getInitialState(shortUrl, shortUrlCreationSettings)}
+        initialState={initialState}
         saving={saving}
         selectedServer={selectedServer}
         mode="edit"