From 3b0fb1562d58e6c767ccf2850ac075cd00e9f465 Mon Sep 17 00:00:00 2001
From: Jed Fox <git@jedfox.com>
Date: Sun, 27 Dec 2020 17:07:05 -0500
Subject: [PATCH] feat: Require use of a preset dialog size; adjust dialog
 sizing (#2684)

---
 src/components/Dialog.tsx                | 4 ++--
 src/components/ErrorDialog.tsx           | 2 +-
 src/components/ExportDialog.tsx          | 6 +-----
 src/components/PasteChartDialog.tsx      | 2 +-
 src/components/ShortcutsDialog.tsx       | 6 +-----
 src/excalidraw-app/collab/RoomDialog.tsx | 6 +-----
 6 files changed, 7 insertions(+), 19 deletions(-)

diff --git a/src/components/Dialog.tsx b/src/components/Dialog.tsx
index 90c3d030..4efbadb8 100644
--- a/src/components/Dialog.tsx
+++ b/src/components/Dialog.tsx
@@ -19,7 +19,7 @@ const useRefState = <T,>() => {
 export const Dialog = (props: {
   children: React.ReactNode;
   className?: string;
-  maxWidth?: number;
+  small?: boolean;
   onCloseRequest(): void;
   title: React.ReactNode;
   autofocus?: boolean;
@@ -76,7 +76,7 @@ export const Dialog = (props: {
     <Modal
       className={clsx("Dialog", props.className)}
       labelledBy="dialog-title"
-      maxWidth={props.maxWidth}
+      maxWidth={props.small ? 550 : 800}
       onCloseRequest={props.onCloseRequest}
     >
       <Island padding={4} ref={setIslandNode}>
diff --git a/src/components/ErrorDialog.tsx b/src/components/ErrorDialog.tsx
index f10c7189..fbd8e48c 100644
--- a/src/components/ErrorDialog.tsx
+++ b/src/components/ErrorDialog.tsx
@@ -24,7 +24,7 @@ export const ErrorDialog = ({
     <>
       {modalIsShown && (
         <Dialog
-          maxWidth={500}
+          small
           onCloseRequest={handleClose}
           title={t("errorDialog.title")}
         >
diff --git a/src/components/ExportDialog.tsx b/src/components/ExportDialog.tsx
index 013bbed3..4abae755 100644
--- a/src/components/ExportDialog.tsx
+++ b/src/components/ExportDialog.tsx
@@ -262,11 +262,7 @@ export const ExportDialog = ({
         ref={triggerButton}
       />
       {modalIsShown && (
-        <Dialog
-          maxWidth={800}
-          onCloseRequest={handleClose}
-          title={t("buttons.export")}
-        >
+        <Dialog onCloseRequest={handleClose} title={t("buttons.export")}>
           <ExportModal
             elements={elements}
             appState={appState}
diff --git a/src/components/PasteChartDialog.tsx b/src/components/PasteChartDialog.tsx
index 3c1aeade..22381d8a 100644
--- a/src/components/PasteChartDialog.tsx
+++ b/src/components/PasteChartDialog.tsx
@@ -97,7 +97,7 @@ export const PasteChartDialog = ({
 
   return (
     <Dialog
-      maxWidth={500}
+      small
       onCloseRequest={handleClose}
       title={t("labels.pasteCharts")}
       className={"PasteChartDialog"}
diff --git a/src/components/ShortcutsDialog.tsx b/src/components/ShortcutsDialog.tsx
index 2e58a1ea..1fc87765 100644
--- a/src/components/ShortcutsDialog.tsx
+++ b/src/components/ShortcutsDialog.tsx
@@ -130,11 +130,7 @@ export const ShortcutsDialog = ({ onClose }: { onClose?: () => void }) => {
 
   return (
     <>
-      <Dialog
-        maxWidth={900}
-        onCloseRequest={handleClose}
-        title={t("shortcutsDialog.title")}
-      >
+      <Dialog onCloseRequest={handleClose} title={t("shortcutsDialog.title")}>
         <Columns>
           <Column>
             <ShortcutIsland caption={t("shortcutsDialog.shapes")}>
diff --git a/src/excalidraw-app/collab/RoomDialog.tsx b/src/excalidraw-app/collab/RoomDialog.tsx
index afe8ef24..fdf62f1c 100644
--- a/src/excalidraw-app/collab/RoomDialog.tsx
+++ b/src/excalidraw-app/collab/RoomDialog.tsx
@@ -123,11 +123,7 @@ const RoomDialog = ({
     );
   };
   return (
-    <Dialog
-      maxWidth={800}
-      onCloseRequest={handleClose}
-      title={t("labels.createRoom")}
-    >
+    <Dialog small onCloseRequest={handleClose} title={t("labels.createRoom")}>
       {renderRoomDialog()}
     </Dialog>
   );