feat(eslint-plugin): add new use-client-directive rule

packages/eslint-plugin-orbit-components/src/__fixtures__/file.ts

@@ -0,0 +1 @@
+// noop

packages/eslint-plugin-orbit-components/src/__fixtures__/react.tsx

@@ -0,0 +1 @@
+// noop

packages/eslint-plugin-orbit-components/src/__tests__/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+    "strict": true,
+    "module": "ESNext",
+    "noEmit": true,
+    "moduleResolution": "node"
+  },
+  "include": ["*.test.ts", "../__fixtures__"]
+}

packages/eslint-plugin-orbit-components/src/__tests__/useClient.test.ts

@@ -0,0 +1,31 @@
+import dedent from "dedent";
+import ruleTester from "../ruleTester";
+import useClient from "../rules/useClient";
+
+describe("use-client-directive", () => {
+  ruleTester.run("use-client-directive", useClient, {
+    valid: [
+      {
+        code: dedent`
+          "use client";
+          import React from "react";
+          import styled from 'styled-components';
+          `,
+      },
+    ],
+    invalid: [
+      {
+        code: dedent`
+        import React from "react";
+        import styled from 'styled-components';
+      `,
+        errors: [{ messageId: "error" }],
+        output: dedent`
+        "use client";
+        import React from "react";
+        import styled from 'styled-components';
+        `,
+      },
+    ],
+  });
+});

packages/eslint-plugin-orbit-components/src/consts.ts

@@ -0,0 +1,2 @@
+export const RULE_URL =
+  "https://github.com/kiwicom/orbit/tree/master/packages/eslint-plugin-orbit-components/docs/rules";

packages/eslint-plugin-orbit-components/src/rules/useClient.ts

@@ -0,0 +1,41 @@
+import { AST_NODE_TYPES, TSESTree as t, TSESLint } from "@typescript-eslint/utils";
+import ruleCreator from "../utils/ruleCreator";
+
+const useClient = ruleCreator({
+  name: "use-client-directive",
+  meta: {
+    type: "problem",
+    fixable: "code",
+    docs: {
+      description: "Prevents missing 'use client' directive in Orbit components",
+    },
+    messages: {
+      error: "Missing 'use client' directive in Orbit components",
+    },
+    schema: [],
+  },
+  defaultOptions: [],
+
+  create: context => {
+    return {
+      Program(node: t.Program) {
+        if (node.sourceType !== "module") return;
+        if (node.body.length === 0) return;
+
+        const noDirective = node.body.some(n => n.type === AST_NODE_TYPES.ExpressionStatement);
+
+        if (!noDirective) {
+          context.report({
+            node,
+            messageId: "error",
+            fix: fixer => {
+              return fixer.insertTextBefore(node.body[0], `"use client";\n`);
+            },
+          });
+        }
+      },
+    };
+  },
+});
+
+export default useClient;

packages/eslint-plugin-orbit-components/src/utils/ruleCreator.ts

@@ -0,0 +1,5 @@
+import { ESLintUtils } from "@typescript-eslint/utils";
+
+import { RULE_URL } from "../consts";
+
+export default ESLintUtils.RuleCreator(name => `${RULE_URL}/${name}`);