feat(website): change enabledNurseryRules to All/Recommended select
Fixes
MODIFY
website/src/playground/PlaygroundLoader.tsx
website/src/playground/PlaygroundLoader.tsx
@@ -11,6 +11,7 @@ import {
QuoteStyle,
TrailingComma,
Semicolons,
+ LintRules,
} from "./types";
import {
createLocalStorage,
@@ -318,9 +319,9 @@ function initState(
semicolons:
(searchParams.get("semicolons") as Semicolons) ??
defaultPlaygroundState.settings.semicolons,
- enabledNurseryRules:
- searchParams.get("enabledNurseryRules") === "true" ||
- defaultPlaygroundState.settings.enabledNurseryRules,
+ lintRules:
+ (searchParams.get("lintRules") as LintRules) ??
+ defaultPlaygroundState.settings.lintRules,
enabledLinting:
searchParams.get("enabledLinting") === "true" ||
defaultPlaygroundState.settings.enabledLinting,

MODIFY
website/src/playground/styles/_diagnostics.scss
website/src/playground/styles/_diagnostics.scss
@@ -36,6 +36,7 @@ ul.diagnostics-list {
padding-right: 10px;
cursor: pointer;
display: flex;
+ white-space: pre;
img {
margin: 7px 10px;

MODIFY
website/src/playground/styles/_settings.scss
website/src/playground/styles/_settings.scss
}
select, input[type=number] {
- width: 100px;
+ width: 110px;
}
select, input[type=number], .input-container {

MODIFY
website/src/playground/tabs/SettingsTab.tsx
website/src/playground/tabs/SettingsTab.tsx
import {
IndentStyle,
+ LintRules,
PlaygroundState,
QuoteProperties,
QuoteStyle,
@@ -41,7 +42,7 @@ export default function SettingsTab({
quoteProperties,
trailingComma,
semicolons,
- enabledNurseryRules,
+ lintRules,
enabledLinting,
},
},
@@ -74,9 +75,9 @@ export default function SettingsTab({
setPlaygroundState,
"semicolons",
);
- const setEnabledNurseryRules = createPlaygroundSettingsSetter(
+ const setLintRules = createPlaygroundSettingsSetter(
setPlaygroundState,
- "enabledNurseryRules",
+ "lintRules",
);
const setEnabledLinting = createPlaygroundSettingsSetter(
setPlaygroundState,
@@ -210,8 +211,8 @@ export default function SettingsTab({
setSemicolons={setSemicolons}
/>
<LinterSettings
- enabledNurseryRules={enabledNurseryRules}
- setEnabledNurseryRules={setEnabledNurseryRules}
+ lintRules={lintRules}
+ setLintRules={setLintRules}
enabledLinting={enabledLinting}
setEnabledLinting={setEnabledLinting}
/>
@@ -597,13 +598,13 @@ function FormatterSettings({
}
function LinterSettings({
- enabledNurseryRules,
- setEnabledNurseryRules,
+ lintRules,
+ setLintRules,
enabledLinting,
setEnabledLinting,
}: {
- enabledNurseryRules: boolean;
- setEnabledNurseryRules: (value: boolean) => void;
+ lintRules: LintRules;
+ setLintRules: (value: LintRules) => void;
enabledLinting: boolean;
setEnabledLinting: (value: boolean) => void;
}) {
@@ -622,16 +623,18 @@ function LinterSettings({
<label htmlFor="linting-enabled">Linter enabled</label>
</div>
<div className="field-row">
- <input
- id="nursery-rules"
- aria-describedby="nursery-rules-description"
- name="nursery-rules"
- type="checkbox"
+ <label htmlFor="trailingComma">Lint Rules</label>
+ <select
+ id="lint-rules"
+ aria-describedby="lint-rules-description"
+ name="lint-rules"
disabled={!enabledLinting}
- checked={enabledNurseryRules}
- onChange={(e) => setEnabledNurseryRules(e.target.checked)}
- />
- <label htmlFor="nursery-rules">Nursery lint rules</label>
+ value={lintRules ?? LintRules.Recommended}
+ onChange={(e) => setLintRules(e.target.value as LintRules)}
+ >
+ <option value={LintRules.Recommended}>Recommended</option>
+ <option value={LintRules.All}>All</option>
+ </select>
</div>
</section>
</>

MODIFY
website/src/playground/types.ts
website/src/playground/types.ts
@@ -17,6 +17,11 @@ export enum QuoteStyle {
Single = "single",
}
+export enum LintRules {
+ Recommended = "recommended",
+ All = "all",
+}
+
export enum QuoteProperties {
AsNeeded = "as-needed",
Preserve = "preserve",
@@ -93,7 +98,7 @@ export interface PlaygroundSettings {
quoteProperties: QuoteProperties;
trailingComma: TrailingComma;
semicolons: Semicolons;
- enabledNurseryRules: boolean;
+ lintRules: LintRules;
enabledLinting: boolean;
}
@@ -132,7 +137,7 @@ export const defaultPlaygroundState: PlaygroundState = {
quoteProperties: QuoteProperties.AsNeeded,
trailingComma: TrailingComma.All,
semicolons: Semicolons.Always,
- enabledNurseryRules: true,
+ lintRules: LintRules.Recommended,
enabledLinting: true,
},
};

MODIFY
website/src/playground/workers/romeWorker.ts
website/src/playground/workers/romeWorker.ts
@@ -7,6 +7,7 @@ import init, {
} from "@rometools/wasm-web";
import {
IndentStyle,
+ LintRules,
LoadingState,
PlaygroundSettings,
QuoteProperties,
@@ -65,7 +66,7 @@ self.addEventListener("message", async (e) => {
indentWidth,
quoteStyle,
quoteProperties,
- enabledNurseryRules,
+ lintRules,
enabledLinting,
trailingComma,
semicolons,
@@ -98,10 +99,19 @@ self.addEventListener("message", async (e) => {
},
};
- if (enabledNurseryRules) {
+ if (lintRules === LintRules.All) {
configuration.linter = {
enabled: enabledLinting,
rules: {
+ correctness: {
+ noRestrictedGlobals: "error",
+ noUndeclaredVariables: "error",
+ noUnusedVariables: "error",
+ noUselessFragments: "error",
+ },
+ style: {
+ useFragmentSyntax: "error",
+ },
nursery: {
noConstAssign: "error",
useExhaustiveDependencies: "error",

feat(website): change enabledNurseryRules to All/Recommended select (#3810)

Fixes https://github.com/rome/tools/issues/3769