From 160749762fcbe3c7fdd8537a8619154a245d79bb Mon Sep 17 00:00:00 2001
From: Atul Varma <varmaa@gmail.com>
Date: Thu, 23 Sep 2021 15:38:15 -0400
Subject: [PATCH] Make modal button work.

---
 lib/page-with-shareable-state.tsx | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/lib/page-with-shareable-state.tsx b/lib/page-with-shareable-state.tsx
index d03d129..da6e424 100644
--- a/lib/page-with-shareable-state.tsx
+++ b/lib/page-with-shareable-state.tsx
@@ -86,15 +86,17 @@ export function createPageWithShareableState<T>({
 
     /** The default state from the URL, which we'll pass into our component. */
     let defaults: T = defaultValue;
-    let deserializeError = false;
+    let didDeserializeThrow = false;
 
     try {
       defaults = deserialize(state || "");
     } catch (e) {
       console.log(`Error deserializing state: ${e}`);
-      deserializeError = true;
+      didDeserializeThrow = true;
     }
 
+    const [showError, setShowError] = useState(didDeserializeThrow);
+
     const onChange = useCallback(
       (value: T) => {
         const newState = serialize(value);
@@ -119,7 +121,7 @@ export function createPageWithShareableState<T>({
 
     return (
       <>
-        {deserializeError && (
+        {showError && (
           <div className="page-error">
             <div>
               <p>
@@ -130,7 +132,7 @@ export function createPageWithShareableState<T>({
                 Either its data is corrupted, or displaying it is no longer
                 supported.
               </p>
-              <button>Alas</button>
+              <button onClick={() => setShowError(false)}>OK</button>
             </div>
           </div>
         )}