From 491b38c3301044bb248e93045b4dafd6e269da47 Mon Sep 17 00:00:00 2001
From: Trevor Buckner <calculuschild@gmail.com>
Date: Tue, 4 Jun 2024 12:29:13 -0400
Subject: [PATCH] Small cleanup of Dialog component

Reduce number of `useEffects` needed
---
 client/components/dialog.jsx | 35 ++++++++++-------------------------
 1 file changed, 10 insertions(+), 25 deletions(-)

diff --git a/client/components/dialog.jsx b/client/components/dialog.jsx
index 36df4efc3..dc18b8e77 100644
--- a/client/components/dialog.jsx
+++ b/client/components/dialog.jsx
@@ -2,45 +2,30 @@
 const React = require('react');
 const { useState, useRef, useEffect } = React;
 
-function Dialog({ dismissKey, closeText = 'Close', blocking = false, children, ...rest }) {
-	const ref = useRef();
-
+function Dialog({ dismissKey, closeText = 'Close', blocking = false, ...rest }) {
+	const dialogRef = useRef();
 	const [open, setOpen] = useState(false);
 
 	useEffect(()=>{
-		if(!window || !dismissKey) return;
-		if(!localStorage.getItem(dismissKey)){
+		if(dismissKey && !localStorage.getItem(dismissKey)) {
+			blocking ? dialogRef.current?.showModal() : dialogRef.current?.show();
 			setOpen(true);
 		}
 	}, []);
 
-	useEffect(()=>{
-		if(open) {
-			blocking ? ref.current?.showModal() : ref.current?.show();
-		} else {
-			ref.current?.close();
-		}
-	}, [open]);
-
-	const dismiss = function(){
+	const dismiss = ()=>{
 		localStorage.setItem(dismissKey, true);
+		dialogRef.current?.close();
 		setOpen(false);
 	};
 
-	if(!open) return;
+	if(!open) return null;
 	return (
-		<dialog
-			ref={ref}
-			onCancel={()=>dismiss()}
-			{...rest}
-		>
-			<button
-				className='dismiss'
-				onClick={()=>dismiss()}
-			>
+		<dialog ref={dialogRef} onCancel={dismiss} {...rest}>
+			<button className='dismiss' onClick={dismiss}>
         	{closeText}
 			</button>
-			{children}
+			{rest.children}
 		</dialog>
 	);
 }