From 68cfc08a6dbaaafd0a1ba65751e50aa6db83d3d0 Mon Sep 17 00:00:00 2001 From: crowlkats Date: Tue, 17 Dec 2024 14:02:53 +0100 Subject: [PATCH 01/15] add logos of tags --- lint/index.md | 19 ------------------- lint/index.tsx | 39 +++++++++++++++++++++++++++++++++++++++ static/img/fresh.svg | 1 + static/img/jsr.svg | 6 ++++++ static/img/react.svg | 9 +++++++++ styles.css | 8 ++++++++ 6 files changed, 63 insertions(+), 19 deletions(-) delete mode 100644 lint/index.md create mode 100644 lint/index.tsx create mode 100644 static/img/fresh.svg create mode 100644 static/img/jsr.svg create mode 100644 static/img/react.svg diff --git a/lint/index.md b/lint/index.md deleted file mode 100644 index 7a4b1dcd3..000000000 --- a/lint/index.md +++ /dev/null @@ -1,19 +0,0 @@ ---- -title: Lint rules -templateEngine: [vto, md] ---- - -
- -{{ for lintRule of lintRulePages }} - -
- {{ lintRule.label }} - {{ for tag of lintRule.tags }} - {{ tag }} - {{/for }} -
- -{{ /for }} - -
diff --git a/lint/index.tsx b/lint/index.tsx new file mode 100644 index 000000000..ae6ead871 --- /dev/null +++ b/lint/index.tsx @@ -0,0 +1,39 @@ +export const title = "Lint rules"; + + +export const toc = []; + +export default function(data: Lume.Data, _helpers: Lume.Helpers) { + console.log(data); + return ( +
+
+
+ ✅ = recommended +
+
+ fresh{" "} + = fresh +
+
+ react{" "} + = react +
+
+ jsr{" "} + = jsr +
+
+ + + {data.lintRulePages.map((lintRule) => ( +
+ {lintRule.label}{" "} + {lintRule.tags.map((tag) => ( + {tag} + ))} +
+ ))} +
+ ); +} diff --git a/static/img/fresh.svg b/static/img/fresh.svg new file mode 100644 index 000000000..8ae349e15 --- /dev/null +++ b/static/img/fresh.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/img/jsr.svg b/static/img/jsr.svg new file mode 100644 index 000000000..663024d61 --- /dev/null +++ b/static/img/jsr.svg @@ -0,0 +1,6 @@ + + + + diff --git a/static/img/react.svg b/static/img/react.svg new file mode 100644 index 000000000..e07b10118 --- /dev/null +++ b/static/img/react.svg @@ -0,0 +1,9 @@ + + React Logo + + + + + + + \ No newline at end of file diff --git a/styles.css b/styles.css index d9894718b..e098c01c3 100644 --- a/styles.css +++ b/styles.css @@ -754,3 +754,11 @@ main:has(#example:checked) { display: block; } } + +.lintRuleLogosGroup { + @apply flex gap-3 flex-row mb-5; +} + +.lintRuleLogo { + @apply size-5; +} \ No newline at end of file From ba771306bb60821998f653decf9950d89f9b7359 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bartek=20Iwa=C5=84czuk?= Date: Tue, 17 Dec 2024 17:03:05 +0100 Subject: [PATCH 02/15] add jsx tag --- lint/index.tsx | 58 +++++++++++++++++++++++++++++++++++----------- static/img/jsx.svg | 7 ++++++ styles.css | 2 +- 3 files changed, 52 insertions(+), 15 deletions(-) create mode 100644 static/img/jsx.svg diff --git a/lint/index.tsx b/lint/index.tsx index ae6ead871..29c0cf7ba 100644 --- a/lint/index.tsx +++ b/lint/index.tsx @@ -1,37 +1,67 @@ export const title = "Lint rules"; - export const toc = []; -export default function(data: Lume.Data, _helpers: Lume.Helpers) { - console.log(data); +const JsrLogo = () => ( + jsr +); + +const JsxLogo = () => ( + jsx +); + +const ReactLogo = () => ( + react +); + +const FreshLogo = () => ( + fresh +); + +const RecommendedLogo = () => <>✅; + +function getTag(tag: string) { + switch (tag) { + case "jsr": + return ; + case "react": + return ; + case "jsx": + return ; + case "recommended": + return ; + case "fresh": + return ; + default: + break; + } +} + +export default function (data: Lume.Data, _helpers: Lume.Helpers) { return (
- ✅ = recommended + = recommended
- fresh{" "} - = fresh + = fresh
- react{" "} - = react + = jsx
- jsr{" "} - = jsr + = react +
+
+ = jsr
- {data.lintRulePages.map((lintRule) => (
{lintRule.label}{" "} - {lintRule.tags.map((tag) => ( - {tag} - ))} + {lintRule.tags.map((tag) => getTag(tag))}
))}
diff --git a/static/img/jsx.svg b/static/img/jsx.svg new file mode 100644 index 000000000..f6e65f7c8 --- /dev/null +++ b/static/img/jsx.svg @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/styles.css b/styles.css index e098c01c3..4dbc562d4 100644 --- a/styles.css +++ b/styles.css @@ -761,4 +761,4 @@ main:has(#example:checked) { .lintRuleLogo { @apply size-5; -} \ No newline at end of file +} From 15835641b33ba400ea4940a5756a9f003b9422ce Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bartek=20Iwa=C5=84czuk?= Date: Tue, 17 Dec 2024 17:11:40 +0100 Subject: [PATCH 03/15] checkmark icon --- lint/index.tsx | 32 +++++++++++++++++--------------- static/img/checkmark.svg | 10 ++++++++++ 2 files changed, 27 insertions(+), 15 deletions(-) create mode 100644 static/img/checkmark.svg diff --git a/lint/index.tsx b/lint/index.tsx index 29c0cf7ba..ec3815bf9 100644 --- a/lint/index.tsx +++ b/lint/index.tsx @@ -2,36 +2,38 @@ export const title = "Lint rules"; export const toc = []; -const JsrLogo = () => ( +const JsrIcon = () => ( jsr ); -const JsxLogo = () => ( +const JsxIcon = () => ( jsx ); -const ReactLogo = () => ( +const ReactIcon = () => ( react ); -const FreshLogo = () => ( +const FreshIcon = () => ( fresh ); -const RecommendedLogo = () => <>✅; +const RecommendedIcon = () => ( + recommended +); function getTag(tag: string) { switch (tag) { case "jsr": - return ; + return ; case "react": - return ; + return ; case "jsx": - return ; + return ; case "recommended": - return ; + return ; case "fresh": - return ; + return ; default: break; } @@ -42,19 +44,19 @@ export default function (data: Lume.Data, _helpers: Lume.Helpers) {
- = recommended + = recommended
- = fresh + = fresh
- = jsx + = jsx
- = react + = react
- = jsr + = jsr
diff --git a/static/img/checkmark.svg b/static/img/checkmark.svg new file mode 100644 index 000000000..931ce25c8 --- /dev/null +++ b/static/img/checkmark.svg @@ -0,0 +1,10 @@ + + + \ No newline at end of file From 3b742487f4bb1321227ba4f4d48c40b6a768d31c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bartek=20Iwa=C5=84czuk?= Date: Tue, 17 Dec 2024 17:12:54 +0100 Subject: [PATCH 04/15] description --- lint/index.tsx | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/lint/index.tsx b/lint/index.tsx index ec3815bf9..660990d8b 100644 --- a/lint/index.tsx +++ b/lint/index.tsx @@ -64,6 +64,11 @@ export default function (data: Lume.Data, _helpers: Lume.Helpers) {
{lintRule.label}{" "} {lintRule.tags.map((tag) => getTag(tag))} +
+ + Lorem ipsum dolor sit amet, 
consectetur
{" "} + adipiscing elit, sed do eiusmod tempor. +
))}
From c0dad0765794d59f9d3690fb836b27415458bfc8 Mon Sep 17 00:00:00 2001 From: Josh Collinsworth Date: Tue, 17 Dec 2024 16:13:50 -0600 Subject: [PATCH 05/15] Minor styling updates --- lint/_data.ts | 8 +-- lint/index.tsx | 119 ++++++++++++++++++++------------------------- styles.css | 8 --- tailwind.config.js | 2 +- 4 files changed, 59 insertions(+), 78 deletions(-) diff --git a/lint/_data.ts b/lint/_data.ts index a7d426ad5..df994d47c 100644 --- a/lint/_data.ts +++ b/lint/_data.ts @@ -1,7 +1,7 @@ -import { Sidebar, SidebarLink } from "../types.ts"; +import { extractYaml } from "jsr:@std/front-matter@1.0.5"; import { walk } from "jsr:@std/fs"; import { basename } from "jsr:@std/path"; -import { extractYaml } from "jsr:@std/front-matter@1.0.5"; +import { Sidebar, SidebarLink } from "../types.ts"; async function generateSidebarItems() { const sidebarItems = []; @@ -43,9 +43,9 @@ export const lintRulePages = await generateSidebarItems(); export const sidebar = [ { - title: "Lint rules", + title: "Deno lint rules", items: lintRulePages, }, ] satisfies Sidebar; -export const sectionTitle = "Lint rules"; +export const sectionTitle = "Deno lint rules"; diff --git a/lint/index.tsx b/lint/index.tsx index 660990d8b..71ccc36c0 100644 --- a/lint/index.tsx +++ b/lint/index.tsx @@ -1,76 +1,65 @@ -export const title = "Lint rules"; +type LintIconType = "jsr" | "react" | "jsx" | "recommended" | "fresh"; +export const title = "Lint rules"; export const toc = []; -const JsrIcon = () => ( - jsr -); - -const JsxIcon = () => ( - jsx -); - -const ReactIcon = () => ( - react -); - -const FreshIcon = () => ( - fresh -); - -const RecommendedIcon = () => ( - recommended -); - -function getTag(tag: string) { - switch (tag) { - case "jsr": - return ; - case "react": - return ; - case "jsx": - return ; - case "recommended": - return ; - case "fresh": - return ; - default: - break; +const getReadableIconName = (iconType: LintIconType) => { + if (["jsx", "jsr"].includes(iconType)) { + return iconType.toUpperCase(); } -} + return iconType.charAt(0).toUpperCase() + iconType.slice(1); +}; + +const getLintIcon = ( + type: LintIconType, +) => { + const svgFileName = type === "recommended" ? "checkmark" : type; + return ( + {type} + ); +}; -export default function (data: Lume.Data, _helpers: Lume.Helpers) { +export default function LintRulesIndex( + data: Lume.Data, + _helpers: Lume.Helpers, +) { + const TYPES = [ + "recommended", + "fresh", + "jsx", + "react", + "jsr", + ] as LintIconType[]; return (
-
-
- = recommended -
-
- = fresh -
-
- = jsx -
-
- = react -
-
- = jsr -
-
+
    + {TYPES.map((iconType) => ( +
  • + {getLintIcon(iconType)} = {getReadableIconName(iconType)} +
    • + ))} +
- {data.lintRulePages.map((lintRule) => ( -
- {lintRule.label}{" "} - {lintRule.tags.map((tag) => getTag(tag))} -
- - Lorem ipsum dolor sit amet, 
consectetur
{" "} - adipiscing elit, sed do eiusmod tempor. - -
- ))} +
    + {data.lintRulePages.map((lintRule) => ( +
  • +
    + + {lintRule.label} + {" "} + {lintRule.tags.map((tag: LintIconType) => getLintIcon(tag))} +
    +
    + Lorem ipsum dolor sit amet, 
    consectetur
    {" "} + adipiscing elit, sed do eiusmod tempor. +
    +
    • + ))} +
); } diff --git a/styles.css b/styles.css index 4dbc562d4..d9894718b 100644 --- a/styles.css +++ b/styles.css @@ -754,11 +754,3 @@ main:has(#example:checked) { display: block; } } - -.lintRuleLogosGroup { - @apply flex gap-3 flex-row mb-5; -} - -.lintRuleLogo { - @apply size-5; -} diff --git a/tailwind.config.js b/tailwind.config.js index 88a6b36c4..f33c565a6 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -2,7 +2,7 @@ /** @type {import('npm:tailwindcss').Config} */ export default { content: [ - "{by-example,deploy,_components,_includes,runtime,static,subhosting,404,examples}/**/*.{md,ts,tsx}", + "{by-example,deploy,_components,_includes,runtime,static,subhosting,404,examples,lint}/**/*.{md,ts,tsx}", "*.{ts,tsx}", ], corePlugins: { From ab1d07b68256c2b0e54f9b83bcafe576e4d64f0c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bartek=20Iwa=C5=84czuk?= Date: Thu, 19 Dec 2024 19:10:02 +0100 Subject: [PATCH 06/15] breadrumbs almost working, not tags on the rule page yet --- _config.ts | 1 + _includes/lint_rule.tsx | 13 ------------- lint/_data.ts | 11 +++++++---- lint/index.tsx | 2 +- lint/rules/_data.ts | 1 - lint_rule.page.tsx | 34 ++++++++++++++++++++++++++++++++++ 6 files changed, 43 insertions(+), 19 deletions(-) delete mode 100644 _includes/lint_rule.tsx delete mode 100644 lint/rules/_data.ts create mode 100644 lint_rule.page.tsx diff --git a/_config.ts b/_config.ts index 94b75defc..bfc412ea7 100644 --- a/_config.ts +++ b/_config.ts @@ -205,6 +205,7 @@ site.ignore( (path) => path.match(/\/reference_gen.*.ts/) !== null, (path) => path.includes("/reference_gen/node_modules"), (path) => path.includes("/reference_gen/node_descriptions"), + (path) => path.includes("/lint/rules/"), // "deploy", // "runtime", // "subhosting", diff --git a/_includes/lint_rule.tsx b/_includes/lint_rule.tsx deleted file mode 100644 index 09f1c69dd..000000000 --- a/_includes/lint_rule.tsx +++ /dev/null @@ -1,13 +0,0 @@ -export const layout = "doc.tsx"; - -export default function LintRule(props: Lume.Data, helpers: Lume.Helpers) { - // Strip /lint/rules/ and trailing slash - const lintRuleName = props.url.substring(12).slice(0, -1); - - return ( - <> -

{lintRuleName}

- {props.children} - - ); -} diff --git a/lint/_data.ts b/lint/_data.ts index df994d47c..e0c64f4b8 100644 --- a/lint/_data.ts +++ b/lint/_data.ts @@ -26,7 +26,7 @@ async function generateSidebarItems() { sidebarItems.push( { - href: `/lint/rules/${lintRuleName}`, + href: `/lint/rules/${lintRuleName}/`, label: lintRuleName, tags, // description, @@ -41,11 +41,14 @@ async function generateSidebarItems() { export const lintRulePages = await generateSidebarItems(); +export const sectionTitle = "Lint rules"; + +export const sectionHref = "/lint/"; + export const sidebar = [ { - title: "Deno lint rules", + title: sectionTitle, + href: sectionHref, items: lintRulePages, }, ] satisfies Sidebar; - -export const sectionTitle = "Deno lint rules"; diff --git a/lint/index.tsx b/lint/index.tsx index 71ccc36c0..456f5295e 100644 --- a/lint/index.tsx +++ b/lint/index.tsx @@ -1,6 +1,6 @@ type LintIconType = "jsr" | "react" | "jsx" | "recommended" | "fresh"; -export const title = "Lint rules"; +export const title = "Overview"; export const toc = []; const getReadableIconName = (iconType: LintIconType) => { diff --git a/lint/rules/_data.ts b/lint/rules/_data.ts deleted file mode 100644 index 65e006fce..000000000 --- a/lint/rules/_data.ts +++ /dev/null @@ -1 +0,0 @@ -export const layout = "lint_rule.tsx"; diff --git a/lint_rule.page.tsx b/lint_rule.page.tsx new file mode 100644 index 000000000..ca5c9f566 --- /dev/null +++ b/lint_rule.page.tsx @@ -0,0 +1,34 @@ +import { walkSync } from "@std/fs/walk"; +import { basename } from "@std/path"; +export { sectionHref, sectionTitle, sidebar } from "./lint/_data.ts"; +import { extractYaml } from "jsr:@std/front-matter@1.0.5"; + +export const layout = "doc.tsx"; + +export const toc = []; + +export default function* (_data: Lume.Data, helpers: Lume.Helpers) { + const files = walkSync("lint/rules/", { exts: [".md"] }); + + for (const file of files) { + const content = Deno.readTextFileSync(file.path); + let fmData = { + body: "", + attrs: {}, + }; + + try { + fmData = extractYaml(content); + } catch { + fmData.body = content; + } + + const ruleName = basename(file.path).slice(0, -3); + + yield { + url: `/lint/rules/${ruleName}/`, + title: ruleName, + content: helpers.md(fmData.body), + }; + } +} From ac8df8273c2706e5481fa9292ecaad3860550dd0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bartek=20Iwa=C5=84czuk?= Date: Thu, 19 Dec 2024 19:19:14 +0100 Subject: [PATCH 07/15] searchbar --- _includes/layout.tsx | 1 + lint/index.tsx | 11 +++++++++-- lint_rules.client.ts | 25 +++++++++++++++++++++++++ 3 files changed, 35 insertions(+), 2 deletions(-) create mode 100644 lint_rules.client.ts diff --git a/_includes/layout.tsx b/_includes/layout.tsx index 9ef5a17e5..f0e52805a 100644 --- a/_includes/layout.tsx +++ b/_includes/layout.tsx @@ -67,6 +67,7 @@ export default function Layout(props: Lume.Data) { + diff --git a/lint/index.tsx b/lint/index.tsx index 456f5295e..0adca2e96 100644 --- a/lint/index.tsx +++ b/lint/index.tsx @@ -44,9 +44,16 @@ export default function LintRulesIndex( ))} +
+ +
+
- +
    From 83e381f99c4627bd64d3dca824c6ef7c29639d1a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bartek=20Iwa=C5=84czuk?= Date: Fri, 20 Dec 2024 03:38:08 +0100 Subject: [PATCH 09/15] render tags in a rule page --- _includes/lintRule.tsx | 12 ++++++++++++ deno.json | 1 + deno.lock | 1 + lint/_data.ts | 2 +- lint/index.tsx | 3 ++- lint_rule.page.tsx => lint/lint_rule.page.tsx | 9 ++++++--- update_lint_rules.ts | 2 +- 7 files changed, 24 insertions(+), 6 deletions(-) create mode 100644 _includes/lintRule.tsx rename lint_rule.page.tsx => lint/lint_rule.page.tsx (76%) diff --git a/_includes/lintRule.tsx b/_includes/lintRule.tsx new file mode 100644 index 000000000..9684cf755 --- /dev/null +++ b/_includes/lintRule.tsx @@ -0,0 +1,12 @@ +import { getLintIcon } from "../lint/index.tsx"; + +export const layout = "doc.tsx"; + +export default function LintRule(props: Lume.Data, _helpers: Lume.Helpers) { + return ( + <> + {props.data.tags.map((tag) => getLintIcon(tag))} + {props.children} + + ); +} diff --git a/deno.json b/deno.json index b859620a5..bd6389ea4 100644 --- a/deno.json +++ b/deno.json @@ -3,6 +3,7 @@ "@std/assert": "jsr:@std/assert@^1.0.6", "@std/dotenv": "jsr:@std/dotenv@^0.225.2", "@std/fs": "jsr:@std/fs@^0.229.3", + "@std/front-matter": "jsr:@std/front-matter@1.0.5", "@std/html": "jsr:@std/html@^1.0.3", "@std/media-types": "jsr:@std/media-types@^1.0.3", "@std/path": "jsr:@std/path@^1.0.8", diff --git a/deno.lock b/deno.lock index 36a76dec2..ae4059855 100644 --- a/deno.lock +++ b/deno.lock @@ -1930,6 +1930,7 @@ "dependencies": [ "jsr:@std/assert@^1.0.6", "jsr:@std/dotenv@~0.225.2", + "jsr:@std/front-matter@1.0.5", "jsr:@std/fs@~0.229.3", "jsr:@std/html@^1.0.3", "jsr:@std/media-types@^1.0.3", diff --git a/lint/_data.ts b/lint/_data.ts index e0c64f4b8..e8ec2d173 100644 --- a/lint/_data.ts +++ b/lint/_data.ts @@ -1,4 +1,4 @@ -import { extractYaml } from "jsr:@std/front-matter@1.0.5"; +import { extractYaml } from "@std/front-matter"; import { walk } from "jsr:@std/fs"; import { basename } from "jsr:@std/path"; import { Sidebar, SidebarLink } from "../types.ts"; diff --git a/lint/index.tsx b/lint/index.tsx index ff9a1163a..c27b532eb 100644 --- a/lint/index.tsx +++ b/lint/index.tsx @@ -10,7 +10,7 @@ const getReadableIconName = (iconType: LintIconType) => { return iconType.charAt(0).toUpperCase() + iconType.slice(1); }; -const getLintIcon = ( +export const getLintIcon = ( type: LintIconType, ) => { const svgFileName = type === "recommended" ? "checkmark" : type; @@ -19,6 +19,7 @@ const getLintIcon = ( src={`/img/${svgFileName}.svg`} class="size-6" alt={type} + title={getReadableIconName(type)} /> ); }; diff --git a/lint_rule.page.tsx b/lint/lint_rule.page.tsx similarity index 76% rename from lint_rule.page.tsx rename to lint/lint_rule.page.tsx index ca5c9f566..374292ec4 100644 --- a/lint_rule.page.tsx +++ b/lint/lint_rule.page.tsx @@ -1,9 +1,9 @@ import { walkSync } from "@std/fs/walk"; import { basename } from "@std/path"; -export { sectionHref, sectionTitle, sidebar } from "./lint/_data.ts"; -import { extractYaml } from "jsr:@std/front-matter@1.0.5"; +import { extractYaml } from "@std/front-matter"; +export { sectionHref, sectionTitle, sidebar } from "./_data.ts"; -export const layout = "doc.tsx"; +export const layout = "lintRule.tsx"; export const toc = []; @@ -29,6 +29,9 @@ export default function* (_data: Lume.Data, helpers: Lume.Helpers) { url: `/lint/rules/${ruleName}/`, title: ruleName, content: helpers.md(fmData.body), + data: { + tags: fmData.attrs.tags, + }, }; } } diff --git a/update_lint_rules.ts b/update_lint_rules.ts index 5264ee12c..510ff4944 100644 --- a/update_lint_rules.ts +++ b/update_lint_rules.ts @@ -1,4 +1,4 @@ -import { extractYaml } from "jsr:@std/front-matter@1.0.5"; +import { extractYaml } from "@std/front-matter"; interface DenoLintRuleDesc { code: string; From 0d9a6b511af4f42bfb10195453d436c81015dba9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bartek=20Iwa=C5=84czuk?= Date: Fri, 20 Dec 2024 12:51:17 +0100 Subject: [PATCH 10/15] fix breadcrumbs --- lint/_data.ts | 2 +- lint/index.tsx | 2 +- lint/lint_rule.page.tsx | 4 +++- 3 files changed, 5 insertions(+), 3 deletions(-) diff --git a/lint/_data.ts b/lint/_data.ts index e8ec2d173..9be42dc6d 100644 --- a/lint/_data.ts +++ b/lint/_data.ts @@ -47,7 +47,7 @@ export const sectionHref = "/lint/"; export const sidebar = [ { - title: sectionTitle, + title: "List of rules", href: sectionHref, items: lintRulePages, }, diff --git a/lint/index.tsx b/lint/index.tsx index c27b532eb..eed90700a 100644 --- a/lint/index.tsx +++ b/lint/index.tsx @@ -1,6 +1,6 @@ type LintIconType = "jsr" | "react" | "jsx" | "recommended" | "fresh"; -export const title = "Overview"; +export const title = "List of rules"; export const toc = []; const getReadableIconName = (iconType: LintIconType) => { diff --git a/lint/lint_rule.page.tsx b/lint/lint_rule.page.tsx index 374292ec4..176d5e2c5 100644 --- a/lint/lint_rule.page.tsx +++ b/lint/lint_rule.page.tsx @@ -1,7 +1,9 @@ import { walkSync } from "@std/fs/walk"; import { basename } from "@std/path"; import { extractYaml } from "@std/front-matter"; -export { sectionHref, sectionTitle, sidebar } from "./_data.ts"; +export { sectionHref, sidebar } from "./_data.ts"; + +export const sectionTitle = "Lint rules"; export const layout = "lintRule.tsx"; From 6b8a420d4740bf16b3ae383597b14553b13a565a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bartek=20Iwa=C5=84czuk?= Date: Fri, 20 Dec 2024 13:53:12 +0100 Subject: [PATCH 11/15] render usage --- _includes/lintRule.tsx | 69 +++++++++++++++++++++++++++++++++++++++++- 1 file changed, 68 insertions(+), 1 deletion(-) diff --git a/_includes/lintRule.tsx b/_includes/lintRule.tsx index 9684cf755..5bdedb5c2 100644 --- a/_includes/lintRule.tsx +++ b/_includes/lintRule.tsx @@ -2,10 +2,77 @@ import { getLintIcon } from "../lint/index.tsx"; export const layout = "doc.tsx"; +const generateConfigFileForTag = (tag: string) => { + return `{ + "lint": { + "tags": ["${tag}"] + } +}`; +}; + +const generateConfigFileForTags = (tags: string[]) => { + return `{ + "lint": { + "tags": ["${tags[0]}"] // ...or ${ + tags.slice(1).map((tag) => `"${tag}"`).join(", ") + } + } +}`; +}; + +const generateCliForTag = (tag: string) => { + return `deno lint --tags=${tag}`; +}; + +const generateCliForTags = (tags: string[]) => { + return tags.map((tag) => `deno lint --tags=${tag}`).join("\n# or ...\n"); +}; + +function LintRuleTags(props: { tags: string[] }) { + const tags = props.tags; + if (tags.length === 0) { + return null; + } + + return ( +
    + {tags.map((tag) => getLintIcon(tag))}
    + {tags.length === 1 + ? ( + <> + + This rule can be enabled using {tags[0]} tag. + +
    + In the config file: + 
    {generateConfigFileForTag(tags[0])}
    + Using CLI: + 
    {generateCliForTag(tags[0])}
    + + ) + : ( + <> + + This rule can be enabled using one of{" "} + {tags.join(", ")} tags. + +
    + In the config file: + 
    {generateConfigFileForTags(tags)}
    + Using CLI: + 
    {generateCliForTags(tags)}
    + + )} +
    + ); +} + export default function LintRule(props: Lume.Data, _helpers: Lume.Helpers) { + const tags = props.data.tags; + return ( <> - {props.data.tags.map((tag) => getLintIcon(tag))} + {props.children} ); From 77f36eebdc5a6416b6f0a14b9f6e80716db0aebe Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bartek=20Iwa=C5=84czuk?= Date: Fri, 20 Dec 2024 14:47:18 +0100 Subject: [PATCH 12/15] snippet --- lint/_data.ts | 5 ++--- lint/index.tsx | 10 ++++++---- 2 files changed, 8 insertions(+), 7 deletions(-) diff --git a/lint/_data.ts b/lint/_data.ts index 9be42dc6d..53c059bf0 100644 --- a/lint/_data.ts +++ b/lint/_data.ts @@ -21,15 +21,14 @@ async function generateSidebarItems() { frontMatterData.body = mdContent; } const tags = frontMatterData.attrs.tags ?? []; - // TODO(bartlomieju): handle descriptions properly - // const description = frontMatterData.body.split(".")[0]; + const content = frontMatterData.body; sidebarItems.push( { href: `/lint/rules/${lintRuleName}/`, label: lintRuleName, tags, - // description, + content, } satisfies SidebarLink, ); } diff --git a/lint/index.tsx b/lint/index.tsx index eed90700a..967419bde 100644 --- a/lint/index.tsx +++ b/lint/index.tsx @@ -26,7 +26,7 @@ export const getLintIcon = ( export default function LintRulesIndex( data: Lume.Data, - _helpers: Lume.Helpers, + helpers: Lume.Helpers, ) { const TYPES = [ "recommended", @@ -83,9 +83,11 @@ export default function LintRulesIndex(     {" "} {lintRule.tags.map((tag: LintIconType) => getLintIcon(tag))} -
    - Lorem ipsum dolor sit amet, consectetur{" "} - adipiscing elit, sed do eiusmod tempor. +
    ))} From 60a0d5901b6cb6b6c617f4084b192ddfa2834a89 Mon Sep 17 00:00:00 2001 From: Josh Collinsworth Date: Fri, 20 Dec 2024 11:06:36 -0600 Subject: [PATCH 13/15] Styling touch-ups --- lint/index.tsx | 40 ++++++++++++++++++++++++---------------- 1 file changed, 24 insertions(+), 16 deletions(-) diff --git a/lint/index.tsx b/lint/index.tsx index 967419bde..ff4b387da 100644 --- a/lint/index.tsx +++ b/lint/index.tsx @@ -17,8 +17,8 @@ export const getLintIcon = ( return ( {type} ); @@ -37,23 +37,15 @@ export default function LintRulesIndex( ] as LintIconType[]; return (
    -
      - {TYPES.map((iconType) => ( -
    • - {getLintIcon(iconType)} = {getReadableIconName(iconType)} -
      • - ))} -
    - -
    +
    + +
      + {TYPES.map((iconType) => ( +
    • + {getLintIcon(iconType)} {getReadableIconName(iconType)} +
      • + ))} +
      @@ -77,13 +80,18 @@ export default function LintRulesIndex( class="border-t md:border md:rounded-md pt-8 pb-4 md:p-4 lint-rule-box" id={lintRule.label} > -
      - +
      + {lintRule.label} {" "} - {lintRule.tags.map((tag: LintIconType) => getLintIcon(tag))} + {lintRule.tags.map((tag: LintIconType) => ( +
      + {getLintIcon(tag)} +
      + ))}
      Date: Fri, 20 Dec 2024 11:31:15 -0600 Subject: [PATCH 14/15] Styling updates --- lint/index.tsx | 9 ++++++--- lint/rules/ban-unknown-rule-code.md | 2 +- lint/rules/ban-unused-ignore.md | 2 +- lint/rules/camelcase.md | 2 +- lint/rules/explicit-module-boundary-types.md | 2 +- lint/rules/for-direction.md | 2 +- lint/rules/fresh-handler-export.md | 2 +- lint/rules/fresh-server-event-handlers.md | 2 +- lint/rules/getter-return.md | 2 +- lint/rules/guard-for-in.md | 2 +- lint/rules/no-array-constructor.md | 2 +- lint/rules/no-async-promise-executor.md | 2 +- lint/rules/no-await-in-loop.md | 2 +- lint/rules/no-await-in-sync-fn.md | 4 ++-- lint/rules/no-class-assign.md | 2 +- lint/rules/no-constant-condition.md | 2 +- lint/rules/no-control-regex.md | 2 +- lint/rules/no-debugger.md | 2 +- lint/rules/no-delete-var.md | 2 +- lint/rules/no-deprecated-deno-api.md | 2 +- lint/rules/no-dupe-args.md | 2 +- lint/rules/no-dupe-class-members.md | 2 +- lint/rules/no-dupe-else-if.md | 2 +- lint/rules/no-duplicate-case.md | 2 +- lint/rules/no-empty-character-class.md | 2 +- lint/rules/no-empty-enum.md | 2 +- lint/rules/no-empty-interface.md | 2 +- lint/rules/no-empty-pattern.md | 2 +- lint/rules/no-eval.md | 2 +- lint/rules/no-ex-assign.md | 2 +- lint/rules/no-explicit-any.md | 2 +- lint/rules/no-external-imports.md | 17 ++++++++--------- lint/rules/no-extra-boolean-cast.md | 2 +- lint/rules/no-extra-non-null-assertion.md | 2 +- lint/rules/no-fallthrough.md | 2 +- lint/rules/no-func-assign.md | 2 +- lint/rules/no-global-assign.md | 2 +- lint/rules/no-import-assertions.md | 2 +- lint/rules/no-import-assign.md | 2 +- lint/rules/no-inferrable-types.md | 2 +- lint/rules/no-inner-declarations.md | 2 +- lint/rules/no-invalid-regexp.md | 2 +- lint/rules/no-irregular-whitespace.md | 2 +- lint/rules/no-new-symbol.md | 2 +- .../no-non-null-asserted-optional-chain.md | 2 +- lint/rules/no-non-null-assertion.md | 2 +- lint/rules/no-obj-calls.md | 2 +- lint/rules/no-octal.md | 2 +- lint/rules/no-prototype-builtins.md | 2 +- lint/rules/no-self-assign.md | 2 +- lint/rules/no-sparse-arrays.md | 2 +- lint/rules/no-sync-fn-in-async-fn.md | 2 +- lint/rules/no-throw-literal.md | 2 +- lint/rules/no-undef.md | 2 +- lint/rules/require-await.md | 2 +- lint/rules/single-var-declarator.md | 2 +- lint/rules/triple-slash-reference.md | 2 +- 57 files changed, 70 insertions(+), 68 deletions(-) diff --git a/lint/index.tsx b/lint/index.tsx index ff4b387da..a6006e680 100644 --- a/lint/index.tsx +++ b/lint/index.tsx @@ -67,7 +67,7 @@ export default function LintRulesIndex( aria-labelledby="lint-rules-key" > {TYPES.map((iconType) => ( -
    • +
    • {getLintIcon(iconType)} {getReadableIconName(iconType)}
      • ))} @@ -75,7 +75,7 @@ export default function LintRulesIndex(
        - {data.lintRulePages.map((lintRule) => ( + {data.lintRulePages.map((lintRule, idx: number) => (
      • Details about ${lintRule.label}`, + ), }} >
      diff --git a/lint/rules/ban-unknown-rule-code.md b/lint/rules/ban-unknown-rule-code.md index d00b4d5f8..c61d8252a 100644 --- a/lint/rules/ban-unknown-rule-code.md +++ b/lint/rules/ban-unknown-rule-code.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Warns the usage of unknown rule codes in ignore directives +Warns the usage of unknown rule codes in ignore directives. We sometimes have to suppress and ignore lint errors for some reasons. We can do so using [ignore directives](https://lint.deno.land/ignoring-rules) with rule diff --git a/lint/rules/ban-unused-ignore.md b/lint/rules/ban-unused-ignore.md index 546da36bc..3aade32f3 100644 --- a/lint/rules/ban-unused-ignore.md +++ b/lint/rules/ban-unused-ignore.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Warns unused ignore directives +Warns unused ignore directives. We sometimes have to suppress and ignore lint errors for some reasons and we can do so using [ignore directives](https://lint.deno.land/ignoring-rules). diff --git a/lint/rules/camelcase.md b/lint/rules/camelcase.md index c2e1601cf..69c344450 100644 --- a/lint/rules/camelcase.md +++ b/lint/rules/camelcase.md @@ -2,7 +2,7 @@ tags: [] --- -Enforces the use of camelCase in variable names +Enforces the use of camelCase in variable names. Consistency in a code base is key for readability and maintainability. This rule enforces variable declarations and object property names which you create to be diff --git a/lint/rules/explicit-module-boundary-types.md b/lint/rules/explicit-module-boundary-types.md index 4710efd86..a11b11292 100644 --- a/lint/rules/explicit-module-boundary-types.md +++ b/lint/rules/explicit-module-boundary-types.md @@ -2,7 +2,7 @@ tags: [] --- -Requires all module exports to have fully typed declarations +Requires all module exports to have fully typed declarations. Having fully typed function arguments and return values clearly defines the inputs and outputs of a module (known as the module boundary). This will make it diff --git a/lint/rules/for-direction.md b/lint/rules/for-direction.md index 82c2f188f..9581f8125 100644 --- a/lint/rules/for-direction.md +++ b/lint/rules/for-direction.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Requires `for` loop control variables to increment in the correct direction +Requires `for` loop control variables to increment in the correct direction. Incrementing `for` loop control variables in the wrong direction leads to infinite loops. This can occur through incorrect initialization, bad diff --git a/lint/rules/fresh-handler-export.md b/lint/rules/fresh-handler-export.md index ce8582c5a..276ebfd06 100644 --- a/lint/rules/fresh-handler-export.md +++ b/lint/rules/fresh-handler-export.md @@ -2,7 +2,7 @@ tags: [fresh] --- -Checks correct naming for named fresh middleware export +Checks correct naming for named fresh middleware export. Files inside the `routes/` folder can export middlewares that run before any rendering happens. They are expected to be available as a named export called diff --git a/lint/rules/fresh-server-event-handlers.md b/lint/rules/fresh-server-event-handlers.md index 46a8abf12..5b6bba4d0 100644 --- a/lint/rules/fresh-server-event-handlers.md +++ b/lint/rules/fresh-server-event-handlers.md @@ -2,7 +2,7 @@ tags: [fresh] --- -Disallows event handlers in fresh server components +Disallows event handlers in fresh server components. Components inside the `routes/` folder in a fresh app are exclusively rendered on the server. They are not rendered in the client and setting an event handler diff --git a/lint/rules/getter-return.md b/lint/rules/getter-return.md index a870a0a1a..5c64a12c0 100644 --- a/lint/rules/getter-return.md +++ b/lint/rules/getter-return.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Requires all property getter functions to return a value +Requires all property getter functions to return a value. Getter functions return the value of a property. If the function returns no value then this contract is broken. diff --git a/lint/rules/guard-for-in.md b/lint/rules/guard-for-in.md index 6cb3492a5..b0baacc87 100644 --- a/lint/rules/guard-for-in.md +++ b/lint/rules/guard-for-in.md @@ -2,7 +2,7 @@ tags: [] --- -Require `for-in` loops to include an `if` statement +Require `for-in` loops to include an `if` statement. Looping over objects with a `for-in` loop will include properties that are inherited through the prototype chain. This behavior can lead to unexpected diff --git a/lint/rules/no-array-constructor.md b/lint/rules/no-array-constructor.md index 51d85556f..da2d0d5b8 100644 --- a/lint/rules/no-array-constructor.md +++ b/lint/rules/no-array-constructor.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Enforce conventional usage of array construction +Enforce conventional usage of array construction. Array construction is conventionally done via literal notation such as `[]` or `[1, 2, 3]`. Using the `new Array()` is discouraged as is `new Array(1, 2, 3)`. diff --git a/lint/rules/no-async-promise-executor.md b/lint/rules/no-async-promise-executor.md index bbd741b17..2cc2e0854 100644 --- a/lint/rules/no-async-promise-executor.md +++ b/lint/rules/no-async-promise-executor.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Requires that async promise executor functions are not used +Requires that async promise executor functions are not used. Promise constructors take an executor function as an argument with `resolve` and `reject` parameters that can be used to control the state of the created diff --git a/lint/rules/no-await-in-loop.md b/lint/rules/no-await-in-loop.md index f91a2a08e..fd3494e5b 100644 --- a/lint/rules/no-await-in-loop.md +++ b/lint/rules/no-await-in-loop.md @@ -2,7 +2,7 @@ tags: [] --- -Requires `await` is not used in a for loop body +Requires `await` is not used in a for loop body. Async and await are used in Javascript to provide parallel execution. If each element in the for loop is waited upon using `await`, then this negates the diff --git a/lint/rules/no-await-in-sync-fn.md b/lint/rules/no-await-in-sync-fn.md index 6c2b5694c..3c1129c02 100644 --- a/lint/rules/no-await-in-sync-fn.md +++ b/lint/rules/no-await-in-sync-fn.md @@ -2,11 +2,11 @@ tags: [recommended] --- -Disallow `await` keyword inside a non-async function +Disallow `await` keyword inside a non-async function. Using the `await` keyword inside a non-async function is a syntax error. To be able to use `await` inside a function, the function needs to be marked as async -via the `async` keyword +via the `async` keyword. **Invalid:** diff --git a/lint/rules/no-class-assign.md b/lint/rules/no-class-assign.md index 9f10d31df..a7581ffae 100644 --- a/lint/rules/no-class-assign.md +++ b/lint/rules/no-class-assign.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows modifying variables of class declarations +Disallows modifying variables of class declarations. Declaring a class such as `class A {}`, creates a variable `A`. Like any variable this can be modified or reassigned. In most cases this is a mistake and diff --git a/lint/rules/no-constant-condition.md b/lint/rules/no-constant-condition.md index 3100e8f42..aa663d526 100644 --- a/lint/rules/no-constant-condition.md +++ b/lint/rules/no-constant-condition.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the use of a constant expression in conditional test +Disallows the use of a constant expression in conditional test. Using a constant expression in a conditional test is often either a mistake or a temporary situation introduced during development and is not ready for diff --git a/lint/rules/no-control-regex.md b/lint/rules/no-control-regex.md index b481ceccd..1952bf8cc 100644 --- a/lint/rules/no-control-regex.md +++ b/lint/rules/no-control-regex.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the use ascii control characters in regular expressions +Disallows the use ASCII control characters in regular expressions. Control characters are invisible characters in the ASCII range of 0-31. It is uncommon to use these in a regular expression and more often it is a mistake in diff --git a/lint/rules/no-debugger.md b/lint/rules/no-debugger.md index 5f8b035bd..1ec345915 100644 --- a/lint/rules/no-debugger.md +++ b/lint/rules/no-debugger.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the use of the `debugger` statement +Disallows the use of the `debugger` statement. `debugger` is a statement which is meant for stopping the javascript execution environment and start the debugger at the statement. Modern debuggers and diff --git a/lint/rules/no-delete-var.md b/lint/rules/no-delete-var.md index a633edaed..1470325c5 100644 --- a/lint/rules/no-delete-var.md +++ b/lint/rules/no-delete-var.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the deletion of variables +Disallows the deletion of variables. `delete` is used to remove a property from an object. Variables declared via `var`, `let` and `const` cannot be deleted (`delete` will return `false`). diff --git a/lint/rules/no-deprecated-deno-api.md b/lint/rules/no-deprecated-deno-api.md index f101caaa7..0ba79de1c 100644 --- a/lint/rules/no-deprecated-deno-api.md +++ b/lint/rules/no-deprecated-deno-api.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Warns the usage of the deprecated - Deno APIs +Warns the usage of the deprecated - Deno APIs. The following APIs will be removed from the `Deno.*` namespace but have newer APIs to migrate to. See the diff --git a/lint/rules/no-dupe-args.md b/lint/rules/no-dupe-args.md index 4de8e4461..b5cab5d52 100644 --- a/lint/rules/no-dupe-args.md +++ b/lint/rules/no-dupe-args.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows using an argument name more than once in a function signature +Disallows using an argument name more than once in a function signature. If you supply multiple arguments of the same name to a function, the last instance will shadow the preceding one(s). This is most likely an unintentional diff --git a/lint/rules/no-dupe-class-members.md b/lint/rules/no-dupe-class-members.md index 531bb8937..530e61b3e 100644 --- a/lint/rules/no-dupe-class-members.md +++ b/lint/rules/no-dupe-class-members.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows using a class member function name more than once +Disallows using a class member function name more than once. Declaring a function of the same name twice in a class will cause the previous declaration(s) to be overwritten, causing unexpected behaviors. diff --git a/lint/rules/no-dupe-else-if.md b/lint/rules/no-dupe-else-if.md index 53a1134b4..a2277eb77 100644 --- a/lint/rules/no-dupe-else-if.md +++ b/lint/rules/no-dupe-else-if.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows using the same condition twice in an `if`/`else if` statement +Disallows using the same condition twice in an `if`/`else if` statement. When you reuse a condition in an `if`/`else if` statement, the duplicate condition will never be reached (without unusual side-effects) meaning this is diff --git a/lint/rules/no-duplicate-case.md b/lint/rules/no-duplicate-case.md index 7a9e08c2b..3678a5ddc 100644 --- a/lint/rules/no-duplicate-case.md +++ b/lint/rules/no-duplicate-case.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows using the same case clause in a switch statement more than once +Disallows using the same case clause in a switch statement more than once. When you reuse a case test expression in a `switch` statement, the duplicate case will never be reached meaning this is almost always a bug. diff --git a/lint/rules/no-empty-character-class.md b/lint/rules/no-empty-character-class.md index 7928ba997..8c81d4193 100644 --- a/lint/rules/no-empty-character-class.md +++ b/lint/rules/no-empty-character-class.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows using the empty character class in a regular expression +Disallows using the empty character class in a regular expression. Regular expression character classes are a series of characters in brackets, e.g. `[abc]`. if nothing is supplied in the brackets it will not match anything diff --git a/lint/rules/no-empty-enum.md b/lint/rules/no-empty-enum.md index 6f03d235a..921fcf5d2 100644 --- a/lint/rules/no-empty-enum.md +++ b/lint/rules/no-empty-enum.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the declaration of an empty enum +Disallows the declaration of an empty enum. An enum with no members serves no purpose. This rule will capture these situations as either unnecessary code or a mistaken empty implementation. diff --git a/lint/rules/no-empty-interface.md b/lint/rules/no-empty-interface.md index c48decc1b..718337b31 100644 --- a/lint/rules/no-empty-interface.md +++ b/lint/rules/no-empty-interface.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the declaration of an empty interface +Disallows the declaration of an empty interface. An interface with no members serves no purpose. This rule will capture these situations as either unnecessary code or a mistaken empty implementation. diff --git a/lint/rules/no-empty-pattern.md b/lint/rules/no-empty-pattern.md index e89a9f404..ada9bba3c 100644 --- a/lint/rules/no-empty-pattern.md +++ b/lint/rules/no-empty-pattern.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the use of empty patterns in destructuring +Disallows the use of empty patterns in destructuring. In destructuring, it is possible to use empty patterns such as `{}` or `[]` which have no effect, most likely not what the author intended. diff --git a/lint/rules/no-eval.md b/lint/rules/no-eval.md index 2352b8f94..c7d6765eb 100644 --- a/lint/rules/no-eval.md +++ b/lint/rules/no-eval.md @@ -2,7 +2,7 @@ tags: [] --- -Disallows the use of `eval` +Disallows the use of `eval`. `eval` is a potentially dangerous function which can open your code to a number of security vulnerabilities. In addition to being slow, `eval` is also often diff --git a/lint/rules/no-ex-assign.md b/lint/rules/no-ex-assign.md index 758bf1691..45d3f3479 100644 --- a/lint/rules/no-ex-assign.md +++ b/lint/rules/no-ex-assign.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the reassignment of exception parameters +Disallows the reassignment of exception parameters. There is generally no good reason to reassign an exception parameter. Once reassigned the code from that point on has no reference to the error anymore. diff --git a/lint/rules/no-explicit-any.md b/lint/rules/no-explicit-any.md index 5c7385171..9b4f69c0d 100644 --- a/lint/rules/no-explicit-any.md +++ b/lint/rules/no-explicit-any.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows use of the `any` type +Disallows use of the `any` type. Use of the `any` type disables the type check system around that variable, defeating the purpose of Typescript which is to provide type safe code. diff --git a/lint/rules/no-external-imports.md b/lint/rules/no-external-imports.md index 63851131d..52e5cc9f0 100644 --- a/lint/rules/no-external-imports.md +++ b/lint/rules/no-external-imports.md @@ -2,22 +2,21 @@ tags: [] --- -Disallows the use of external imports +Disallows the use of external imports. -- what's the motivation of this lint rule? - - this rule emits warnings if external modules are imported via URL. "deps.ts" +- What's the motivation of this lint rule? + - This rule emits warnings if external modules are imported via URL. "deps.ts" and import maps are exception. -- why is linted code considered bad? - - importing external modules just works fine, but it will take time and effort +- Why is linted code considered bad? + - Importing external modules just works fine, but it will take time and effort when you want to upgrade those modules if they are imported in multiple places in your project. -- who should use it? - - to avoid it you could use "deps.ts convention" or +- When should it be used? + - To avoid it you could use "deps.ts convention" or [import maps](https://docs.deno.com/runtime/manual/basics/import_maps), where you import all external modules and then re-export them or assign aliases to them. - - so if you'd like to follow the "deps.ts convention" or to use import maps, - this rule is for you. + - If you'd like to follow the "deps.ts convention" or use import maps. **Invalid:** diff --git a/lint/rules/no-extra-boolean-cast.md b/lint/rules/no-extra-boolean-cast.md index be5fce4a1..170ffd34f 100644 --- a/lint/rules/no-extra-boolean-cast.md +++ b/lint/rules/no-extra-boolean-cast.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows unnecessary boolean casts +Disallows unnecessary boolean casts. In certain contexts, such as `if`, `while` or `for` statements, expressions are automatically coerced into a boolean. Therefore, techniques such as double diff --git a/lint/rules/no-extra-non-null-assertion.md b/lint/rules/no-extra-non-null-assertion.md index dea1e01dd..644a9307f 100644 --- a/lint/rules/no-extra-non-null-assertion.md +++ b/lint/rules/no-extra-non-null-assertion.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows unnecessary non-null assertions +Disallows unnecessary non-null assertions. Non-null assertions are specified with an `!` saying to the compiler that you know this value is not null. Specifying this operator more than once in a row, diff --git a/lint/rules/no-fallthrough.md b/lint/rules/no-fallthrough.md index 760971833..93aade17d 100644 --- a/lint/rules/no-fallthrough.md +++ b/lint/rules/no-fallthrough.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the implicit fallthrough of case statements +Disallows the implicit fallthrough of case statements. Case statements without a `break` will execute their body and then fallthrough to the next case or default block and execute this block as well. While this is diff --git a/lint/rules/no-func-assign.md b/lint/rules/no-func-assign.md index ee32c8641..942350beb 100644 --- a/lint/rules/no-func-assign.md +++ b/lint/rules/no-func-assign.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the overwriting/reassignment of an existing function +Disallows the overwriting/reassignment of an existing function. Javascript allows for the reassignment of a function definition. This is generally a mistake on the developers part, or poor coding practice as code diff --git a/lint/rules/no-global-assign.md b/lint/rules/no-global-assign.md index 21f236e5f..c880f2063 100644 --- a/lint/rules/no-global-assign.md +++ b/lint/rules/no-global-assign.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows assignment to native Javascript objects +Disallows assignment to native Javascript objects. In Javascript, `String` and `Object` for example are native objects. Like any object, they can be reassigned, but it is almost never wise to do so as this can diff --git a/lint/rules/no-import-assertions.md b/lint/rules/no-import-assertions.md index 8ac6e090e..541659cb0 100644 --- a/lint/rules/no-import-assertions.md +++ b/lint/rules/no-import-assertions.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the `assert` keyword for import attributes +Disallows the `assert` keyword for import attributes. ES import attributes (previously called import assertions) has been changed to use the `with` keyword. The old syntax using `assert` is still supported, but diff --git a/lint/rules/no-import-assign.md b/lint/rules/no-import-assign.md index 4c8578164..aecd47b03 100644 --- a/lint/rules/no-import-assign.md +++ b/lint/rules/no-import-assign.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows reassignment of imported module bindings +Disallows reassignment of imported module bindings. ES module import bindings should be treated as read-only since modifying them during code execution will likely result in runtime errors. It also makes for diff --git a/lint/rules/no-inferrable-types.md b/lint/rules/no-inferrable-types.md index 45e23bff9..04c8df3ac 100644 --- a/lint/rules/no-inferrable-types.md +++ b/lint/rules/no-inferrable-types.md @@ -2,7 +2,7 @@ tags: [] --- -Disallows easily inferrable types +Disallows easily inferrable types. Variable initializations to JavaScript primitives (and `null`) are obvious in their type. Specifying their type can add additional verbosity to the code. For diff --git a/lint/rules/no-inner-declarations.md b/lint/rules/no-inner-declarations.md index e7efedde9..a3b319d39 100644 --- a/lint/rules/no-inner-declarations.md +++ b/lint/rules/no-inner-declarations.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows variable or function definitions in nested blocks +Disallows variable or function definitions in nested blocks. Function declarations in nested blocks can lead to less readable code and potentially unexpected results due to compatibility issues in different diff --git a/lint/rules/no-invalid-regexp.md b/lint/rules/no-invalid-regexp.md index d427a40d0..d8977433d 100644 --- a/lint/rules/no-invalid-regexp.md +++ b/lint/rules/no-invalid-regexp.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows specifying invalid regular expressions in RegExp constructors +Disallows specifying invalid regular expressions in RegExp constructors. Specifying an invalid regular expression literal will result in a SyntaxError at compile time, however specifying an invalid regular expression string in the diff --git a/lint/rules/no-irregular-whitespace.md b/lint/rules/no-irregular-whitespace.md index 9e75ca74b..c0454e8e1 100644 --- a/lint/rules/no-irregular-whitespace.md +++ b/lint/rules/no-irregular-whitespace.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the use of non-space or non-tab whitespace characters +Disallows the use of non-space or non-tab whitespace characters. Non-space or non-tab whitespace characters can be very difficult to spot in your code as editors will often render them invisibly. These invisible characters can diff --git a/lint/rules/no-new-symbol.md b/lint/rules/no-new-symbol.md index 2824cd49c..c6fa0692e 100644 --- a/lint/rules/no-new-symbol.md +++ b/lint/rules/no-new-symbol.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the use of `new` operators with built-in `Symbol`s +Disallows the use of `new` operators with built-in `Symbol`s. `Symbol`s are created by being called as a function, but we sometimes call it with the `new` operator by mistake. This rule detects such wrong usage of the diff --git a/lint/rules/no-non-null-asserted-optional-chain.md b/lint/rules/no-non-null-asserted-optional-chain.md index c2c2ed5d7..e94d9e501 100644 --- a/lint/rules/no-non-null-asserted-optional-chain.md +++ b/lint/rules/no-non-null-asserted-optional-chain.md @@ -2,7 +2,7 @@ tags: [] --- -Disallow non-null assertions after an optional chain expression +Disallow non-null assertions after an optional chain expression. `?.` optional chain expressions provide undefined if an object is `null` or `undefined`. Using a `!` non-null assertion to assert the result of an `?.` diff --git a/lint/rules/no-non-null-assertion.md b/lint/rules/no-non-null-assertion.md index 921430751..1f9d40b13 100644 --- a/lint/rules/no-non-null-assertion.md +++ b/lint/rules/no-non-null-assertion.md @@ -2,7 +2,7 @@ tags: [] --- -Disallow non-null assertions using the `!` postfix operator +Disallow non-null assertions using the `!` postfix operator. TypeScript's `!` non-null assertion operator asserts to the type system that an expression is non-nullable, as in not `null` or `undefined`. Using assertions to diff --git a/lint/rules/no-obj-calls.md b/lint/rules/no-obj-calls.md index f2430de04..e99e136b7 100644 --- a/lint/rules/no-obj-calls.md +++ b/lint/rules/no-obj-calls.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows calling built-in global objects like functions +Disallows calling built-in global objects like functions. The following built-in objects should not be invoked like functions, even though they look like constructors: diff --git a/lint/rules/no-octal.md b/lint/rules/no-octal.md index 8b0603290..51adad271 100644 --- a/lint/rules/no-octal.md +++ b/lint/rules/no-octal.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows expressing octal numbers via numeric literals beginning with `0` +Disallows expressing octal numbers via numeric literals beginning with `0`. Octal numbers can be expressed via numeric literals with leading `0` like `042`, but this expression often confuses programmers. That's why ECMAScript's strict diff --git a/lint/rules/no-prototype-builtins.md b/lint/rules/no-prototype-builtins.md index 76970ff7e..d5f6e859c 100644 --- a/lint/rules/no-prototype-builtins.md +++ b/lint/rules/no-prototype-builtins.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows the use of `Object.prototype` builtins directly +Disallows the use of `Object.prototype` builtins directly. If objects are created via `Object.create(null)` they have no prototype specified. This can lead to runtime errors when you assume objects have diff --git a/lint/rules/no-self-assign.md b/lint/rules/no-self-assign.md index 1ed922f12..4f9514f86 100644 --- a/lint/rules/no-self-assign.md +++ b/lint/rules/no-self-assign.md @@ -2,7 +2,7 @@ tags: [recommended] --- -Disallows self assignments +Disallows self assignments. Self assignments like `a = a;` have no effect at all. If there are self assignments in the code, most likely it means that the author is still in the diff --git a/lint/rules/no-sparse-arrays.md b/lint/rules/no-sparse-arrays.md index 7d1574969..ccbab7542 100644 --- a/lint/rules/no-sparse-arrays.md +++ b/lint/rules/no-sparse-arrays.md @@ -2,7 +2,7 @@ tags: [] --- -Disallows sparse arrays +Disallows sparse arrays. Sparse arrays are arrays that contain _empty slots_, which later could be handled either as `undefined` value or skipped by array methods, and this may diff --git a/lint/rules/no-sync-fn-in-async-fn.md b/lint/rules/no-sync-fn-in-async-fn.md index 150db1773..32ebd3b39 100644 --- a/lint/rules/no-sync-fn-in-async-fn.md +++ b/lint/rules/no-sync-fn-in-async-fn.md @@ -2,7 +2,7 @@ tags: [] --- -Disallow sync function inside async function +Disallow sync function inside async function. Using sync functions like `Deno.readTextFileSync` blocks the deno event loop so it's not recommended to use it inside of an async function, because it stops diff --git a/lint/rules/no-throw-literal.md b/lint/rules/no-throw-literal.md index e5b0f5a18..39b4e7766 100644 --- a/lint/rules/no-throw-literal.md +++ b/lint/rules/no-throw-literal.md @@ -2,7 +2,7 @@ tags: [] --- -Disallow throwing literals as exceptions +Disallow throwing literals as exceptions. It is considered good practice to only `throw` the `Error` object itself or an object using the `Error` object as base objects for user-defined exceptions. The diff --git a/lint/rules/no-undef.md b/lint/rules/no-undef.md index 988127fe1..4d97b74fd 100644 --- a/lint/rules/no-undef.md +++ b/lint/rules/no-undef.md @@ -2,7 +2,7 @@ tags: [] --- -Disallow the use of undeclared variables +Disallow the use of undeclared variables. **Invalid:** diff --git a/lint/rules/require-await.md b/lint/rules/require-await.md index 801162b3b..72f478db4 100644 --- a/lint/rules/require-await.md +++ b/lint/rules/require-await.md @@ -3,7 +3,7 @@ tags: [recommended] --- Disallows async functions that have no await expression or await using -declaration +declaration. In general, the primary reason to use async functions is to use await expressions or await using declarations inside. If an async function has diff --git a/lint/rules/single-var-declarator.md b/lint/rules/single-var-declarator.md index 2f1c43695..e463f45ae 100644 --- a/lint/rules/single-var-declarator.md +++ b/lint/rules/single-var-declarator.md @@ -2,7 +2,7 @@ tags: [] --- -Disallows multiple variable definitions in the same declaration statement +Disallows multiple variable definitions in the same declaration statement. **Invalid:** diff --git a/lint/rules/triple-slash-reference.md b/lint/rules/triple-slash-reference.md index f85966105..e31c52b9c 100644 --- a/lint/rules/triple-slash-reference.md +++ b/lint/rules/triple-slash-reference.md @@ -3,7 +3,7 @@ tags: [] --- Disallow certain triple slash directives in favor of ES6-style import -declarations +declarations. TypeScript's `///` triple-slash references are a way to indicate that types from another module are available in a file. Use of triple-slash reference type From 03694df89b2fc682da157ff4d387bb0eac87be36 Mon Sep 17 00:00:00 2001 From: Josh Collinsworth Date: Fri, 20 Dec 2024 15:31:48 -0600 Subject: [PATCH 15/15] Fix up lintRule page --- _includes/lintRule.tsx | 40 +++++++++++++++++++++------------------- lint/lint_rule.page.tsx | 2 +- 2 files changed, 22 insertions(+), 20 deletions(-) diff --git a/_includes/lintRule.tsx b/_includes/lintRule.tsx index 5bdedb5c2..c0cb2ec9e 100644 --- a/_includes/lintRule.tsx +++ b/_includes/lintRule.tsx @@ -1,5 +1,3 @@ -import { getLintIcon } from "../lint/index.tsx"; - export const layout = "doc.tsx"; const generateConfigFileForTag = (tag: string) => { @@ -35,32 +33,36 @@ function LintRuleTags(props: { tags: string[] }) { } return ( -
      - {tags.map((tag) => getLintIcon(tag))}
      +
      {tags.length === 1 ? ( <> - - This rule can be enabled using {tags[0]} tag. - -
      - In the config file: +
      + NOTE: this rule is part of the {tags[0]}{" "} + rule set. +
      +
      + Enable full set in deno.json: + 
      {generateConfigFileForTag(tags[0])}
      - Using CLI: - 
      {generateCliForTag(tags[0])}
      +
      Enable full set using the Deno CLI:
      + 
      {generateCliForTag(tags[0])}
      ) : ( <> - - This rule can be enabled using one of{" "} - {tags.join(", ")} tags. - -
      - In the config file: +
      + + NOTE: this rule is included the following rule sets: + {tags.map((tag) => {tag})} + +
      +
      + Enable full set in deno.json: + 
      {generateConfigFileForTags(tags)}
      - Using CLI: - 
      {generateCliForTags(tags)}
      +
      Enable full set using the Deno CLI:
      + 
      {generateCliForTags(tags)}
      )}
      diff --git a/lint/lint_rule.page.tsx b/lint/lint_rule.page.tsx index 176d5e2c5..d4b429062 100644 --- a/lint/lint_rule.page.tsx +++ b/lint/lint_rule.page.tsx @@ -1,6 +1,6 @@ +import { extractYaml } from "@std/front-matter"; import { walkSync } from "@std/fs/walk"; import { basename } from "@std/path"; -import { extractYaml } from "@std/front-matter"; export { sectionHref, sidebar } from "./_data.ts"; export const sectionTitle = "Lint rules";