fix(formatter): add space after commas in import attributes (#22274)

Fixes #22273

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

Author: Leonabcd123

crates/oxc_formatter/src/print/import_declaration.rs

@@ -231,11 +231,12 @@ impl<'a> Format<'a> for AstNode<'a, Vec<'a, ImportAttribute<'a>>> {
                             let trailing_separator =
                                 FormatTrailingCommas::ES5.trailing_separator(f.options());
 
-                            f.join_with(soft_line_break()).entries_with_trailing_separator(
-                                self.iter(),
-                                ",",
-                                trailing_separator,
-                            );
+                            f.join_with(soft_line_break_or_space())
+                                .entries_with_trailing_separator(
+                                    self.iter(),
+                                    ",",
+                                    trailing_separator,
+                                );
                         },),
                         should_insert_space_around_brackets
                     )]

crates/oxc_formatter/tests/fixtures/js/import-attributes/issue-22273.mjs

@@ -0,0 +1,8 @@
+// Issue #22273 - Should have a space after commas in import attributes
+import myEmbeddedDb from './my.db' with { type: 'sqlite', embed: 'true' }
+import myEmbeddedDb2 from './my.db' with {type: 'sqlite',embed: 'true'}
+import myEmbeddedDb3 from './my.db' with { embed: 'true', type: 'sqlite' }
+
+// Should be spread over multiple lines
+import myEmbeddedDb4 from './my.db' with { type: 'sqlite', embed: 'true', veryLongAttribute: 'true' }
+import myEmbeddedDb5 from './my.db' with { veryVeryVeryVeryVeryVeryVeryVeryVeryLongAttribute: 'true' }

crates/oxc_formatter/tests/fixtures/js/import-attributes/issue-22273.mjs.snap

@@ -0,0 +1,51 @@
+---
+source: crates/oxc_formatter/tests/fixtures/mod.rs
+---
+==================== Input ====================
+// Issue #22273 - Should have a space after commas in import attributes
+import myEmbeddedDb from './my.db' with { type: 'sqlite', embed: 'true' }
+import myEmbeddedDb2 from './my.db' with {type: 'sqlite',embed: 'true'}
+import myEmbeddedDb3 from './my.db' with { embed: 'true', type: 'sqlite' }
+
+// Should be spread over multiple lines
+import myEmbeddedDb4 from './my.db' with { type: 'sqlite', embed: 'true', veryLongAttribute: 'true' }
+import myEmbeddedDb5 from './my.db' with { veryVeryVeryVeryVeryVeryVeryVeryVeryLongAttribute: 'true' }
+
+==================== Output ====================
+------------------
+{ printWidth: 80 }
+------------------
+// Issue #22273 - Should have a space after commas in import attributes
+import myEmbeddedDb from "./my.db" with { type: "sqlite", embed: "true" };
+import myEmbeddedDb2 from "./my.db" with { type: "sqlite", embed: "true" };
+import myEmbeddedDb3 from "./my.db" with { embed: "true", type: "sqlite" };
+
+// Should be spread over multiple lines
+import myEmbeddedDb4 from "./my.db" with {
+  type: "sqlite",
+  embed: "true",
+  veryLongAttribute: "true",
+};
+import myEmbeddedDb5 from "./my.db" with {
+  veryVeryVeryVeryVeryVeryVeryVeryVeryLongAttribute: "true",
+};
+
+-------------------
+{ printWidth: 100 }
+-------------------
+// Issue #22273 - Should have a space after commas in import attributes
+import myEmbeddedDb from "./my.db" with { type: "sqlite", embed: "true" };
+import myEmbeddedDb2 from "./my.db" with { type: "sqlite", embed: "true" };
+import myEmbeddedDb3 from "./my.db" with { embed: "true", type: "sqlite" };
+
+// Should be spread over multiple lines
+import myEmbeddedDb4 from "./my.db" with {
+  type: "sqlite",
+  embed: "true",
+  veryLongAttribute: "true",
+};
+import myEmbeddedDb5 from "./my.db" with {
+  veryVeryVeryVeryVeryVeryVeryVeryVeryLongAttribute: "true",
+};
+
+===================== End =====================