Migrate DevSettings to PluginSettings for much better config flow (#572)

* Add the devsetting config options into settings

* Create dropdown component and add setting controls

* Static dropdwon width and spin arrow

* Improve dropdown option contrast and border

* Forgot to make the settings page respect the static spacing, oops

* Smaller arrow

* Vert padding

* Reset option for settings

* Hide reset button when on default

* Respect the logLevel setting

* Portal settings out to external typechecking module

* Implement new configs using the new singleton Settings

* Remove DevSettings

* Update test runner to use new settings

* More helpful test failure output

* Support non-plugin environment

* Migrate dropdown to new packages system

* Clean up components a tad

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

@@ -3,8 +3,10 @@ local Plugin = Rojo.Plugin
 local Packages = Rojo.Packages
 
 local Roact = require(Packages.Roact)
+local Log = require(Packages.Log)
 
 local Assets = require(Plugin.Assets)
+local Settings = require(Plugin.Settings)
 local Theme = require(Plugin.App.Theme)
 
 local IconButton = require(Plugin.App.Components.IconButton)
@@ -13,6 +15,16 @@ local Setting = require(script.Setting)
 
 local e = Roact.createElement
 
+local function invertTbl(tbl)
+	local new = {}
+	for key, value in tbl do
+		new[value] = key
+	end
+	return new
+end
+
+local invertedLevels = invertTbl(Log.Level)
+
 local function Navbar(props)
 	return Theme.with(function(theme)
 		theme = theme.Settings.Navbar
@@ -102,6 +114,30 @@ function SettingsPage:render()
 				layoutOrder = 4,
 			}),
 
+			LogLevel = e(Setting, {
+				id = "logLevel",
+				name = "Log Level",
+				description = "Plugin output verbosity level",
+				transparency = self.props.transparency,
+				layoutOrder = 5,
+
+				options = invertedLevels,
+				showReset = Settings:getBinding("logLevel"):map(function(value)
+					return value ~= "Info"
+				end),
+				onReset = function()
+					Settings:set("logLevel", "Info")
+				end,
+			}),
+
+			TypecheckingEnabled = e(Setting, {
+				id = "typecheckingEnabled",
+				name = "Typechecking",
+				description = "Toggle typechecking on the API surface",
+				transparency = self.props.transparency,
+				layoutOrder = 6,
+			}),
+
 			Layout = e("UIListLayout", {
 				FillDirection = Enum.FillDirection.Vertical,
 				SortOrder = Enum.SortOrder.LayoutOrder,