Confirmation behaviors (#774)

plugin/src/App/StatusPages/Settings/init.lua

@@ -12,6 +12,7 @@ local Theme = require(Plugin.App.Theme)
 local IconButton = require(Plugin.App.Components.IconButton)
 local ScrollingFrame = require(Plugin.App.Components.ScrollingFrame)
 local Tooltip = require(Plugin.App.Components.Tooltip)
+local TextInput = require(Plugin.App.Components.TextInput)
 local Setting = require(script.Setting)
 
 local e = Roact.createElement
@@ -25,6 +26,7 @@ local function invertTbl(tbl)
 end
 
 local invertedLevels = invertTbl(Log.Level)
+local confirmationBehaviors = { "Initial", "Always", "Large Changes", "Unlisted PlaceId" }
 
 local function Navbar(props)
 	return Theme.with(function(theme)
@@ -104,12 +106,50 @@ function SettingsPage:render()
 				layoutOrder = 2,
 			}),
 
+			ConfirmationBehavior = e(Setting, {
+				id = "confirmationBehavior",
+				name = "Confirmation Behavior",
+				description = "When to prompt for confirmation before syncing",
+				transparency = self.props.transparency,
+				layoutOrder = 3,
+
+				options = confirmationBehaviors,
+			}),
+
+			LargeChangesConfirmationThreshold = e(Setting, {
+				id = "largeChangesConfirmationThreshold",
+				name = "Confirmation Threshold",
+				description = "How many modified instances to be considered a large change",
+				transparency = self.props.transparency,
+				layoutOrder = 4,
+				visible = Settings:getBinding("confirmationBehavior"):map(function(value)
+					return value == "Large Changes"
+				end),
+				input = e(TextInput, {
+					size = UDim2.new(0, 40, 0, 28),
+					text = Settings:getBinding("largeChangesConfirmationThreshold"):map(function(value)
+						return tostring(value)
+					end),
+					transparency = self.props.transparency,
+					enabled = true,
+					onEntered = function(text)
+						local number = tonumber(string.match(text, "%d+"))
+						if number then
+							Settings:set("largeChangesConfirmationThreshold", math.clamp(number, 1, 999))
+						else
+							-- Force text back to last valid value
+							Settings:set("largeChangesConfirmationThreshold", Settings:get("largeChangesConfirmationThreshold"))
+						end
+					end,
+				}),
+			}),
+
 			PlaySounds = e(Setting, {
 				id = "playSounds",
 				name = "Play Sounds",
 				description = "Toggle sound effects",
 				transparency = self.props.transparency,
-				layoutOrder = 3,
+				layoutOrder = 5,
 			}),
 
 			OpenScriptsExternally = e(Setting, {
@@ -119,7 +159,7 @@ function SettingsPage:render()
 				locked = self.props.syncActive,
 				experimental = true,
 				transparency = self.props.transparency,
-				layoutOrder = 4,
+				layoutOrder = 6,
 			}),
 
 			TwoWaySync = e(Setting, {
@@ -129,7 +169,7 @@ function SettingsPage:render()
 				locked = self.props.syncActive,
 				experimental = true,
 				transparency = self.props.transparency,
-				layoutOrder = 5,
+				layoutOrder = 7,
 			}),
 
 			LogLevel = e(Setting, {