diff --git a/apps/web/src/components/configuration/config-field.tsx b/apps/web/src/components/configuration/config-field.tsx
index 4a291048..6602d7e6 100644
--- a/apps/web/src/components/configuration/config-field.tsx
+++ b/apps/web/src/components/configuration/config-field.tsx
@@ -91,9 +91,9 @@ export function ConfigField({
         return;
       }
 
-      const parsedJson = JSON.parse(jsonString);
+      JSON.parse(jsonString);
 
-      handleChange(parsedJson);
+      handleChange(jsonString);
       setJsonError(null);
     } catch {
       if (isExternallyManaged && externalSetValue) {
@@ -108,7 +108,8 @@ export function ConfigField({
   const handleFormatJson = (jsonString: string) => {
     try {
       const parsed = JSON.parse(jsonString);
-      handleChange(parsed);
+      const formattedJson = JSON.stringify(parsed, null, 2);
+      handleChange(formattedJson);
       setJsonError(null);
     } catch {
       setJsonError("Invalid JSON format");
@@ -257,16 +258,13 @@ export function ConfigField({
                 "border-red-500 focus:border-red-500 focus-visible:ring-red-500",
             )}
           />
-          <div className="flex w-full items-start justify-between gap-2 pt-1">
-            {" "}
+          <div className="flex w-full items-center justify-between gap-2 pt-1">
             {/* Use items-start */}
             <Button
               variant="outline"
               size="sm"
               onClick={() => handleFormatJson(currentValue ?? "")}
-              disabled={
-                !currentValue || typeof currentValue !== "string" || !!jsonError
-              }
+              disabled={!currentValue || typeof currentValue !== "string"}
               className="mt-1"
             >
               Format
@@ -274,15 +272,10 @@ export function ConfigField({
             {jsonError && (
               <Alert
                 variant="destructive"
-                className="flex-grow px-3 py-1"
+                className="flex items-center gap-2 rounded-md py-1"
               >
-                <div className="flex items-center gap-2">
-                  {" "}
-                  <AlertCircle className="h-4 w-4 flex-shrink-0" />{" "}
-                  <AlertDescription className="text-xs">
-                    {jsonError}
-                  </AlertDescription>
-                </div>
+                <AlertCircle className="mb-1" />
+                <AlertDescription>{jsonError}</AlertDescription>
               </Alert>
             )}
           </div>
diff --git a/apps/web/src/features/settings-page/config-manager.tsx b/apps/web/src/features/settings-page/config-manager.tsx
index d2f1646a..c9454249 100644
--- a/apps/web/src/features/settings-page/config-manager.tsx
+++ b/apps/web/src/features/settings-page/config-manager.tsx
@@ -184,7 +184,6 @@ export function ConfigManager() {
                       step={config.step}
                       value={configs[DEFAULT_CONFIG_KEY]?.[config.label]}
                       setValue={(value) => {
-                        console.log("setting value!", value);
                         updateConfig(DEFAULT_CONFIG_KEY, config.label, value);
                       }}
                     />