From 9a92729a309fcd08c4f1caf480581b80d9bc4191 Mon Sep 17 00:00:00 2001
From: Luke <sabolukas03@gmail.com>
Date: Wed, 11 Jan 2023 20:54:29 +0100
Subject: [PATCH] feat(web/input): allowCancel option

---
 resource/interface/client/input.lua     |  9 +++++++--
 web/src/features/dialog/InputDialog.tsx | 12 +++++++++++-
 2 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/resource/interface/client/input.lua b/resource/interface/client/input.lua
index 75144b8f3..bb6f32b20 100644
--- a/resource/interface/client/input.lua
+++ b/resource/interface/client/input.lua
@@ -16,10 +16,14 @@ local input
 ---@field step? number
 ---@field description? string
 
+---@class InputDialogOptionsProps
+---@field allowCancel? boolean
+
 ---@param heading string
 ---@param rows string[] | InputDialogRowProps[]
+---@param options InputDialogOptionsProps[]
 ---@return string[] | number[] | boolean[] | nil
-function lib.inputDialog(heading, rows)
+function lib.inputDialog(heading, rows, options)
     if input then return end
     input = promise.new()
 
@@ -35,7 +39,8 @@ function lib.inputDialog(heading, rows)
         action = 'openDialog',
         data = {
             heading = heading,
-            rows = rows
+            rows = rows,
+            options = options
         }
     })
 
diff --git a/web/src/features/dialog/InputDialog.tsx b/web/src/features/dialog/InputDialog.tsx
index 17b9cd341..ae3a000a5 100644
--- a/web/src/features/dialog/InputDialog.tsx
+++ b/web/src/features/dialog/InputDialog.tsx
@@ -15,6 +15,9 @@ import ColorField from './components/fields/color';
 export interface InputProps {
   heading: string;
   rows: Array<IInput | ICheckbox | ISelect | INumber | ISlider | IColorInput>;
+  options?: {
+    allowCancel?: boolean;
+  };
 }
 
 export type FormValues = {
@@ -80,6 +83,7 @@ const InputDialog: React.FC = () => {
         opened={visible}
         onClose={handleClose}
         centered
+        closeOnEscape={fields.options?.allowCancel !== false}
         closeOnClickOutside={false}
         size="xs"
         styles={{ title: { textAlign: 'center', width: '100%', fontSize: 18 } }}
@@ -117,7 +121,13 @@ const InputDialog: React.FC = () => {
               );
             })}
             <Group position="right" spacing={10}>
-              <Button uppercase variant="default" onClick={handleClose} mr={3}>
+              <Button
+                uppercase
+                variant="default"
+                onClick={handleClose}
+                mr={3}
+                disabled={fields.options?.allowCancel === false}
+              >
                 {locale.ui.cancel}
               </Button>
               <Button uppercase variant="light" type="submit">