From 7e8e060fb004ac7594f142ceafaef710461c11f5 Mon Sep 17 00:00:00 2001 From: Nicola Corti Date: Sat, 6 Aug 2022 19:06:51 +0100 Subject: [PATCH] Initial draft of Rules Marketplace --- website/docusaurus.config.js | 5 ++ website/src/data/rulesmarketplace.js | 74 ++++++++++++++++ .../_components/MarketplaceCard/index.jsx | 44 ++++++++++ .../MarketplaceCard/styles.module.css | 26 ++++++ website/src/pages/marketplace/index.jsx | 85 +++++++++++++++++++ .../src/pages/marketplace/styles.module.css | 9 ++ 6 files changed, 243 insertions(+) create mode 100644 website/src/data/rulesmarketplace.js create mode 100644 website/src/pages/marketplace/_components/MarketplaceCard/index.jsx create mode 100644 website/src/pages/marketplace/_components/MarketplaceCard/styles.module.css create mode 100644 website/src/pages/marketplace/index.jsx create mode 100644 website/src/pages/marketplace/styles.module.css diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js index 661b56f79ff9..3ef62368b458 100644 --- a/website/docusaurus.config.js +++ b/website/docusaurus.config.js @@ -106,6 +106,11 @@ const config = { position: 'left', label: 'API', }, + { + to: "/marketplace", + label: "Marketplace", + position: "left", + }, { type: "docsVersionDropdown", position: "right", diff --git a/website/src/data/rulesmarketplace.js b/website/src/data/rulesmarketplace.js new file mode 100644 index 000000000000..3c4a0fec3771 --- /dev/null +++ b/website/src/data/rulesmarketplace.js @@ -0,0 +1,74 @@ +/* + * ADD YOUR RULES TO THE DETEKT RULES MARKETPLACE + * + * Instructions for adding your ruleset: + * - Add your third-party rule in the json array below + * - `title` is the repository name name + * - `description` is a short (≤120 characters) description of the ruleset + * - `repo` is the repository URL + * - `mavenCoordinates` are the maven coordinates of the ruleset so users can easily copy them + * - `mavenRepo` is the maven repository where they're hosted. + * - `ruleset` is the ID of the ruleset + * - `rules` is an array of rules your ruleset is offering + * - `usesTypeResolution` a boolean weather or not your ruleset uses type resolution. + * - Open a PR and check for reported CI errors + */ + +// Add sites to this list +// prettier-ignore +export const rulesets = [ + { + title: 'Compiler', + description: 'A ruleset that wraps the warnings and info messages of the Kotlin compiler as detekt findings..', + repo: 'https://github.com/BraisGabin/detekt-compiler-rules', + mavenCoordinates: 'com.github.BraisGabin:detekt-compiler-rules:+', + mavenRepo: 'Jitpack', + ruleset: 'compiler', + rules: ['CompilerInfo', 'CompilerWarning'], + usesTypeResolution: true, + }, + { + title: 'Compose', + description: 'A set of Detekt rules to help prevent common errors in projects using Jetpack Compose.', + repo: 'https://github.com/appKODE/detekt-rules-compose', + mavenCoordinates: 'ru.kode:detekt-rules-compose:+', + mavenRepo: 'MavenCentral', + ruleset: 'compose', + rules: ['ReusedModifierInstance', 'UnnecessaryEventHandlerParameter', 'ComposableEventParameterNaming', 'ModifierHeightWithText', 'ModifierParameterPosition', 'ModifierDefaultValue', 'MissingModifierDefaultValue', 'PublicComposablePreview'], + usesTypeResolution: false, + }, + { + title: 'Doist', + description: 'This repository contains custom detekt rules based on Doist internal coding conventions.', + repo: 'https://github.com/Doist/detekt-rules', + mavenCoordinates: 'com.doist.detekt:detekt-rules:+', + mavenRepo: 'GithubPackages', + ruleset: 'DoistRuleSet', + rules: ['NoBlankNewLineAfterClassHeader', 'ConsistentWhenEntries', 'SingleLineWhenEntryExpressionsAreWrapped', 'MutableObservablePropertyIsPrivate', 'NoNotNullOperator', 'TodoPattern'], + usesTypeResolution: false, + }, + { + title: 'Operator', + description: 'Rules to prefer expressions over named functions for kotlin operators.', + repo: 'https://github.com/colematthew4/detekt-operator', + mavenCoordinates: 'io.cole.matthew.detekt.operator:detekt-operator:+', + mavenRepo: 'GithubPackages', + ruleset: 'detekt-operator', + rules: ['PreferInOverContainsSyntax', 'PreferUnaryPrefixOverFunctionSyntax', 'PreferUnaryPostfixOverFunctionSyntax', 'PreferArithmeticSymbolSyntax', 'PreferBracketAccessorOverFunctionSyntax'], + usesTypeResolution: false, + }, + { + title: 'Verify Implementation', + description: 'A ruleset which enables verifying whether concrete classes are implemented as specified according to annotations applied to base types.', + repo: 'https://github.com/cph-cachet/detekt-verify-implementation', + mavenCoordinates: 'dk.cachet.detekt.extensions:detekt-verify-implementation:+', + mavenRepo: 'GithubPackages', + ruleset: 'verify-implementation', + rules: ['Immutable', 'DataClass'], + usesTypeResolution: true, + }, + /* + Pro Tip: add your ruleset in alphabetical order. + Appending your ruleset here (at the end) is more likely to produce Git conflicts. + */ +]; diff --git a/website/src/pages/marketplace/_components/MarketplaceCard/index.jsx b/website/src/pages/marketplace/_components/MarketplaceCard/index.jsx new file mode 100644 index 000000000000..82271256e368 --- /dev/null +++ b/website/src/pages/marketplace/_components/MarketplaceCard/index.jsx @@ -0,0 +1,44 @@ +import React from "react"; +import Link from "@docusaurus/Link"; +import styles from "./styles.module.css"; + +function MarketplaceCard(input) { + const ruleset = input.ruleset; + return ( +
  • +
    +
    +

    + + {ruleset.title} + +

    +
    +
    +

    {ruleset.description}

    +
    Coordinates
    +

    + detektPlugins("{ruleset.mavenCoordinates}") on{" "} + {ruleset.mavenRepo} +

    +
    Rules
    +

    + Uses type resolution:{" "} + {ruleset.usesTypeResolution.toString()} +

    +

    +

      + {ruleset.rules.map((rule) => ( +
    • + {rule} +
    • + ))} +
    +

    +
    +
    +
  • + ); +} + +export default React.memo(MarketplaceCard); diff --git a/website/src/pages/marketplace/_components/MarketplaceCard/styles.module.css b/website/src/pages/marketplace/_components/MarketplaceCard/styles.module.css new file mode 100644 index 000000000000..cb2d6e716be4 --- /dev/null +++ b/website/src/pages/marketplace/_components/MarketplaceCard/styles.module.css @@ -0,0 +1,26 @@ +.marketplaceCardHeader { + display: flex; + align-items: center; + margin-bottom: 12px; +} + +.marketplaceCardTitle { + margin-bottom: 0; + flex: 1 1 auto; +} + +.marketplaceCardTitle a { + text-decoration: none; + background: linear-gradient(var(--ifm-color-primary), + var(--ifm-color-primary)) 0% 100% / 0% 1px no-repeat; + transition: background-size ease-out 200ms; +} + +.marketplaceCardTitle a:not(:focus):hover { + background-size: 100% 1px; +} + +.marketplaceCardBody { + font-size: smaller; + line-height: 1.66; +} diff --git a/website/src/pages/marketplace/index.jsx b/website/src/pages/marketplace/index.jsx new file mode 100644 index 000000000000..3500e649bdcf --- /dev/null +++ b/website/src/pages/marketplace/index.jsx @@ -0,0 +1,85 @@ +import React from "react"; +import clsx from "clsx"; +import Layout from "@theme/Layout"; +import { rulesets } from "@site/src/data/rulesmarketplace"; +import MarketplaceCard from "./_components/MarketplaceCard"; +import styles from "./styles.module.css"; + +const TITLE = "Detekt 3rd Party Rules Marketplace"; +const DESCRIPTION = + "List of Detekt Rules that have been built by the community 🎉"; +const SUBMIT_URL = + "https://github.com/detekt/detekt/blob/main/website/src/data/rulesmarketplace.js"; +const SEARCH_RULES_URL = "https://github.com/topics/detekt-rules"; + +function MarketplaceHeader() { + return ( +
    +

    Detekt 3rd Party Rules Marketplace

    +

    List of Detekt Rules that have been built by the community.

    + + 🙏 Please add your ruleset + + + Find more rules on Github + +
    + ); +} + +function MarketplaceCards() { + // No Results scenario + if (rulesets.length === 0) { + return ( +
    +
    +

    No results

    +
    +
    + ); + } + + return ( +
    + <> +
    +

    All rulesets

    +
      + {rulesets.map((ruleset) => ( + + ))} +
    +
    + +
    + ); +} + +export default function Marketplace() { + return ( + +
    + + +
    +
    + ); +} diff --git a/website/src/pages/marketplace/styles.module.css b/website/src/pages/marketplace/styles.module.css new file mode 100644 index 000000000000..a216c6dcb150 --- /dev/null +++ b/website/src/pages/marketplace/styles.module.css @@ -0,0 +1,9 @@ +.marketplaceList { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); + gap: 24px; +} + +.marketplaceHeaderButton { + margin: 8px; +} \ No newline at end of file