feat(playground): remove import sorting tab, rename import sorting to…

… assist

src/playground/Playground.tsx

@@ -8,7 +8,6 @@ import DiagnosticsConsoleTab from "@/playground/tabs/DiagnosticsConsoleTab";
 import DiagnosticsListTab from "@/playground/tabs/DiagnosticsListTab";
 import FormatterCodeTab from "@/playground/tabs/FormatterCodeTab";
 import FormatterIrTab from "@/playground/tabs/FormatterIrTab";
-import ImportSortingTab from "@/playground/tabs/ImportSortingTab";
 import SettingsTab from "@/playground/tabs/SettingsTab";
 import SyntaxTab from "@/playground/tabs/SyntaxTab";
 import {
@@ -270,16 +269,6 @@ export default function Playground({
 						<ControlFlowTab graph={biomeOutput.analysis.controlFlowGraph} />
 					),
 				},
-				{
-					key: PlaygroundTab.ImportSorting,
-					title: "Import Sorting",
-					children: (
-						<ImportSortingTab
-							code={biomeOutput.importSorting.code}
-							extensions={codeMirrorExtensions}
-						/>
-					),
-				},
 				{
 					key: PlaygroundTab.Console,
 					title: "Console",

src/playground/PlaygroundLoader.tsx

@@ -28,6 +28,7 @@ import {
 	isTypeScriptFilename,
 	normalizeFilename,
 } from "@/playground/utils";
+import type { FixFileMode } from "@biomejs/wasm-web";
 import {
 	type Dispatch,
 	type SetStateAction,
@@ -355,9 +356,12 @@ function initState(
 			enabledLinting:
 				searchParams.get("enabledLinting") === "true" ||
 				defaultPlaygroundState.settings.enabledLinting,
-			importSortingEnabled:
-				searchParams.get("importSortingEnabled") === "true" ||
-				defaultPlaygroundState.settings.importSortingEnabled,
+			enabledAssist:
+				searchParams.get("enabledAssist") === "true" ||
+				defaultPlaygroundState.settings.enabledAssist,
+			analyzerFixMode:
+				(searchParams.get("analyzerFixMode") as FixFileMode) ||
+				defaultPlaygroundState.settings.analyzerFixMode,
 			unsafeParameterDecoratorsEnabled:
 				searchParams.get("unsafeParameterDecoratorsEnabled") === "true" ||
 				defaultPlaygroundState.settings.unsafeParameterDecoratorsEnabled,

src/playground/tabs/SettingsTab.tsx

@@ -20,7 +20,11 @@ import {
 	modifyFilename,
 	normalizeFilename,
 } from "@/playground/utils";
-import type { FixFileMode } from "@biomejs/wasm-web";
+import type {
+	FixFileMode,
+	RuleDomain,
+	RuleDomainValue,
+} from "@biomejs/wasm-web";
 import type { Dispatch, SetStateAction } from "react";
 import type React from "react";
 import { useState } from "react";
@@ -53,10 +57,11 @@ export default function SettingsTab({
 			lintRules,
 			enabledLinting,
 			analyzerFixMode,
-			importSortingEnabled,
+			enabledAssist,
 			unsafeParameterDecoratorsEnabled,
 			allowComments,
 			attributePosition,
+			ruleDomains,
 		},
 	},
 }: SettingsTabProps) {
@@ -121,9 +126,9 @@ export default function SettingsTab({
 		"analyzerFixMode",
 	);
 
-	const setImportSorting = createPlaygroundSettingsSetter(
+	const setEnabledAssist = createPlaygroundSettingsSetter(
 		setPlaygroundState,
-		"importSortingEnabled",
+		"enabledAssist",
 	);
 
 	const setUnsafeParameterDecoratorsEnabled = createPlaygroundSettingsSetter(
@@ -135,6 +140,11 @@ export default function SettingsTab({
 		"allowComments",
 	);
 
+	const setRuleDomains = createPlaygroundSettingsSetter(
+		setPlaygroundState,
+		"ruleDomains",
+	);
+
 	function setCurrentFilename(newFilename: string) {
 		setPlaygroundState((state) => {
 			if (state.currentFile === newFilename) {
@@ -290,10 +300,12 @@ export default function SettingsTab({
 				setEnabledLinting={setEnabledLinting}
 				analyzerFixMode={analyzerFixMode}
 				setAnalyzerFixMode={setAnalyzerFixMode}
+				ruleDomains={ruleDomains}
+				setRuleDomains={setRuleDomains}
 			/>
-			<ImportSortingSettings
-				importSortingEnabled={importSortingEnabled}
-				setImportSorting={setImportSorting}
+			<AssistSettings
+				enabledAssist={enabledAssist}
+				setEnabledAssist={setEnabledAssist}
 			/>
 			<SyntaxSettings
 				filename={currentFile}
@@ -809,14 +821,28 @@ function LinterSettings({
 	setEnabledLinting,
 	analyzerFixMode,
 	setAnalyzerFixMode,
+	ruleDomains,
+	setRuleDomains,
 }: {
 	lintRules: LintRules;
 	setLintRules: (value: LintRules) => void;
 	enabledLinting: boolean;
 	setEnabledLinting: (value: boolean) => void;
 	analyzerFixMode: FixFileMode;
 	setAnalyzerFixMode: (value: FixFileMode) => void;
+	ruleDomains: Record<RuleDomain, RuleDomainValue>;
+	setRuleDomains: (value: Record<RuleDomain, RuleDomainValue>) => void;
 }) {
+	const updateDomain = (domain: RuleDomain, value: RuleDomainValue) => {
+		setRuleDomains({
+			...ruleDomains,
+			[domain]: value,
+		});
+	};
+	if (ruleDomains === undefined) {
+		ruleDomains = {};
+	}
+
 	return (
 		<>
 			<h2>Linter options</h2>
@@ -860,31 +886,96 @@ function LinterSettings({
 						<option value={"applySuppressions"}>Apply Suppressions</option>
 					</select>
 				</div>
+
+				<h3>Domains</h3>
+				<div className="field-row">
+					<label htmlFor="react-domain">React Rules</label>
+					<select
+						id="react-domain"
+						value={ruleDomains.react}
+						onChange={(e) =>
+							updateDomain("react", e.target.value as RuleDomainValue)
+						}
+						disabled={!enabledLinting}
+					>
+						<option value="all">All</option>
+						<option value="recommended">Recommended</option>
+						<option value="none">None</option>
+					</select>
+				</div>
+
+				<div className="field-row">
+					<label htmlFor="test-domain">Test Rules</label>
+					<select
+						id="test-domain"
+						value={ruleDomains.test}
+						onChange={(e) =>
+							updateDomain("test", e.target.value as RuleDomainValue)
+						}
+						disabled={!enabledLinting}
+					>
+						<option value="all">All</option>
+						<option value="recommended">Recommended</option>
+						<option value="none">None</option>
+					</select>
+				</div>
+
+				<div className="field-row">
+					<label htmlFor="solid-domain">Solid Rules</label>
+					<select
+						id="solid-domain"
+						value={ruleDomains.solid}
+						onChange={(e) =>
+							updateDomain("solid", e.target.value as RuleDomainValue)
+						}
+						disabled={!enabledLinting}
+					>
+						<option value="all">All</option>
+						<option value="recommended">Recommended</option>
+						<option value="none">None</option>
+					</select>
+				</div>
+
+				<div className="field-row">
+					<label htmlFor="next-domain">Next.js Rules</label>
+					<select
+						id="next-domain"
+						value={ruleDomains.next}
+						onChange={(e) =>
+							updateDomain("next", e.target.value as RuleDomainValue)
+						}
+						disabled={!enabledLinting}
+					>
+						<option value="all">All</option>
+						<option value="recommended">Recommended</option>
+						<option value="none">None</option>
+					</select>
+				</div>
 			</section>
 		</>
 	);
 }
 
-export function ImportSortingSettings({
-	importSortingEnabled,
-	setImportSorting,
+export function AssistSettings({
+	enabledAssist,
+	setEnabledAssist,
 }: {
-	importSortingEnabled: boolean;
-	setImportSorting: (value: boolean) => void;
+	enabledAssist: boolean;
+	setEnabledAssist: (value: boolean) => void;
 }) {
 	return (
 		<>
-			<h2>Import sorting options</h2>
+			<h2>Assist options</h2>
 			<section>
 				<div className="field-row">
 					<input
-						id="import-sorting-enabled"
-						name="import-sorting-enabled"
+						id="assist-enabled"
+						name="assist-enabled"
 						type="checkbox"
-						checked={importSortingEnabled}
-						onChange={(e) => setImportSorting(e.target.checked)}
+						checked={enabledAssist}
+						onChange={(e) => setEnabledAssist(e.target.checked)}
 					/>
-					<label htmlFor="import-sorting-enabled">Import sorting enabled</label>
+					<label htmlFor="assist-enabled">Assists enabled</label>
 				</div>
 			</section>
 		</>

src/playground/types.ts

@@ -1,4 +1,9 @@
-import type { Diagnostic, FixFileMode } from "@biomejs/wasm-web";
+import type {
+	Diagnostic,
+	FixFileMode,
+	RuleDomain,
+	RuleDomainValue,
+} from "@biomejs/wasm-web";
 import type { parser } from "codemirror-lang-rome-ast";
 import type { Dispatch, SetStateAction } from "react";
 
@@ -96,9 +101,6 @@ export interface BiomeOutput {
 		/** The snippet with lint fixes applied. */
 		fixed: string;
 	};
-	importSorting: {
-		code: string;
-	};
 }
 
 export const emptyBiomeOutput: BiomeOutput = {
@@ -118,9 +120,6 @@ export const emptyBiomeOutput: BiomeOutput = {
 		controlFlowGraph: "",
 		fixed: "",
 	},
-	importSorting: {
-		code: "",
-	},
 };
 
 export interface PlaygroundSettings {
@@ -139,9 +138,10 @@ export interface PlaygroundSettings {
 	lintRules: LintRules;
 	enabledLinting: boolean;
 	analyzerFixMode: FixFileMode;
-	importSortingEnabled: boolean;
+	enabledAssist: boolean;
 	unsafeParameterDecoratorsEnabled: boolean;
 	allowComments: boolean;
+	ruleDomains: Record<RuleDomain, RuleDomainValue>;
 }
 
 export interface PlaygroundFileState {
@@ -187,9 +187,10 @@ export const defaultPlaygroundState: PlaygroundState = {
 		lintRules: LintRules.Recommended,
 		enabledLinting: true,
 		analyzerFixMode: "safeFixes",
-		importSortingEnabled: true,
+		enabledAssist: true,
 		unsafeParameterDecoratorsEnabled: true,
 		allowComments: true,
+		ruleDomains: {},
 	},
 };
 

src/playground/workers/biomeWorker.ts

@@ -88,7 +88,7 @@ self.addEventListener("message", async (e) => {
 				arrowParentheses,
 				bracketSpacing,
 				bracketSameLine,
-				importSortingEnabled,
+				enabledAssist,
 				unsafeParameterDecoratorsEnabled,
 				allowComments,
 				attributePosition,
@@ -110,7 +110,7 @@ self.addEventListener("message", async (e) => {
 				},
 
 				assist: {
-					enabled: importSortingEnabled,
+					enabled: enabledAssist,
 				},
 
 				javascript: {
@@ -275,10 +275,6 @@ self.addEventListener("message", async (e) => {
 				formatterIr = "Can't format";
 			}
 
-			const importSorting = {
-				code: "Moved to Analyzer Fixes tab",
-			};
-
 			const categories: RuleCategories = [];
 			if (configuration?.formatter?.enabled) {
 				categories.push("syntax");
@@ -363,9 +359,6 @@ self.addEventListener("message", async (e) => {
 					controlFlowGraph,
 					fixed: fixed.code,
 				},
-				importSorting: {
-					code: importSorting.code,
-				},
 			};
 
 			self.postMessage({