Repo lint and typing improvements (GitbookIO#73)

valentin0h · web-flow · commit 63fe46ade843 · 2022-10-12T13:05:17.000+02:00
* add workers types

* add node types as dev deps

* Fix jsx issues

* fix lint

* Ignore linting ignored file

* Add initial typescript subpath export workaround

* Add comments

* Add tsconfig and eslint config as dev dependencies

* Remove script non production ready integrations

* fix package.json syntax issue
diff --git a/.prettierrc.json b/.prettierrc.json
@@ -1,5 +1,5 @@
 {
-  "printWidth": 100,
-  "singleQuote": true,
-  "tabWidth": 4
+    "printWidth": 100,
+    "singleQuote": true,
+    "tabWidth": 4
 }
diff --git a/integrations/contentkit/.eslintrc.json b/integrations/contentkit/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+    "extends": ["@gitbook/eslint-config/integration"]
+}
diff --git a/integrations/contentkit/package.json b/integrations/contentkit/package.json
@@ -3,11 +3,15 @@
     "version": "0.0.0",
     "private": true,
     "dependencies": {
-        "@gitbook/api": "*",
         "@gitbook/runtime": "*"
     },
     "devDependencies": {
-        "@gitbook/cli": "*"
+        "@gitbook/eslint-config": "*",
+        "@gitbook/tsconfig": "*"
     },
-    "scripts": {}
+    "scripts": {
+        "lint": "eslint ./**/*.ts*",
+        "typecheck": "tsc --noEmit",
+        "publish-integrations-staging": "gitbook publish ."
+    }
 }
diff --git a/integrations/contentkit/tsconfig.json b/integrations/contentkit/tsconfig.json
@@ -0,0 +1,3 @@
+{
+    "extends": "@gitbook/tsconfig/integration.json"
+}
diff --git a/integrations/figma/.eslintrc.json b/integrations/figma/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+    "extends": ["@gitbook/eslint-config/integration"]
+}
diff --git a/integrations/figma/package.json b/integrations/figma/package.json
@@ -3,13 +3,15 @@
     "version": "0.0.0",
     "private": true,
     "dependencies": {
-        "@gitbook/api": "*",
         "@gitbook/runtime": "*"
     },
     "devDependencies": {
-        "@gitbook/cli": "*"
+        "@gitbook/eslint-config": "*",
+        "@gitbook/tsconfig": "*"
     },
     "scripts": {
+        "lint": "eslint ./**/*.ts*",
+        "typecheck": "tsc --noEmit",
         "publish-integrations-staging": "gitbook publish ."
     }
-}
+}
diff --git a/integrations/figma/src/figma.ts b/integrations/figma/src/figma.ts
@@ -1,4 +1,4 @@
-import { FigmaRuntimeContext } from "./types";
+import { FigmaRuntimeContext } from './types';
 
 export interface FileNodeId {
     fileId: string;
@@ -17,16 +17,16 @@ interface FigmaAPINodes extends FigmaAPIFile {
         [key: string]: {
             document?: {
                 name?: string;
-            }
-        }
-    }
+            };
+        };
+    };
 }
 
 // https://www.figma.com/developers/api#get-images-endpoint
 interface FigmaAPIImages {
     images: {
         [key: string]: string;
-    }
+    };
 }
 
 /**
@@ -55,17 +55,21 @@ export function extractNodeFromURL(input: string): FileNodeId | undefined {
 /**
  * Fetch the informations about a Figma node.
  */
- export async function fetchFigmaNode(fileId: string, nodeId: string, context: FigmaRuntimeContext) {
+export async function fetchFigmaNode(fileId: string, nodeId: string, context: FigmaRuntimeContext) {
     try {
         const [node, image] = await Promise.all([
-            fetchFigmaAPI<FigmaAPINodes>(`files/${fileId}/nodes`, { ids: nodeId, depth: 1 }, context),
-            fetchFigmaImage(fileId, nodeId, context)
+            fetchFigmaAPI<FigmaAPINodes>(
+                `files/${fileId}/nodes`,
+                { ids: nodeId, depth: 1 },
+                context
+            ),
+            fetchFigmaImage(fileId, nodeId, context),
         ]);
         return {
             name: node.name,
             thumbnailUrl: node.thumbnailUrl,
             nodeName: node.nodes[nodeId]?.document?.name,
-            nodeImage: image
+            nodeImage: image,
         };
     } catch (err) {
         return undefined;
@@ -75,9 +79,17 @@ export function extractNodeFromURL(input: string): FileNodeId | undefined {
 /**
  * Fetch the preview image for a node.
  */
- export async function fetchFigmaImage(fileId: string, nodeId: string, context: FigmaRuntimeContext) {
+export async function fetchFigmaImage(
+    fileId: string,
+    nodeId: string,
+    context: FigmaRuntimeContext
+) {
     try {
-        const image = await fetchFigmaAPI<FigmaAPIImages>(`images/${fileId}`, { ids: nodeId, format: 'svg' }, context);
+        const image = await fetchFigmaAPI<FigmaAPIImages>(
+            `images/${fileId}`,
+            { ids: nodeId, format: 'svg' },
+            context
+        );
         const imageUrl = image.images?.[nodeId];
         if (!imageUrl) {
             return undefined;
@@ -86,12 +98,12 @@ export function extractNodeFromURL(input: string): FileNodeId | undefined {
         const response = await fetch(imageUrl);
         const svgText = await response.text();
 
-        const [,width, height] = svgText.match(/viewBox="0 0 (\d+) (\d+)"/) || [];
+        const [, width, height] = svgText.match(/viewBox="0 0 (\d+) (\d+)"/) || [];
 
         return {
             width: parseInt(width, 10),
             height: parseInt(height, 10),
-            url: imageUrl
+            url: imageUrl,
         };
     } catch (err) {
         return undefined;
@@ -113,7 +125,11 @@ export async function fetchFigmaFile(fileId: string, context: FigmaRuntimeContex
 /**
  * Execute a Figma API request.
  */
-export async function fetchFigmaAPI<T>(path: string, params: object, { environment }: FigmaRuntimeContext): Promise<T> {
+export async function fetchFigmaAPI<T>(
+    path: string,
+    params: object,
+    { environment }: FigmaRuntimeContext
+): Promise<T> {
     const url = new URL(`https://api.figma.com/v1/${path}`);
 
     Object.entries(params).forEach(([key, value]) => {
@@ -122,7 +138,7 @@ export async function fetchFigmaAPI<T>(path: string, params: object, { environme
 
     const response = await fetch(url.toString(), {
         headers: {
-            'Authorization': `Bearer ${environment.installation.configuration.oauth_credentials.access_token}`,
+            Authorization: `Bearer ${environment.installation.configuration.oauth_credentials.access_token}`,
         },
     });
 
diff --git a/integrations/figma/src/index.tsx b/integrations/figma/src/index.tsx
@@ -5,6 +5,7 @@ import {
     RuntimeEnvironment,
     RuntimeContext,
 } from '@gitbook/runtime';
+
 import { extractNodeFromURL, fetchFigmaFile, fetchFigmaNode } from './figma';
 
 interface FigmaInstallationConfiguration {
diff --git a/integrations/figma/src/types.ts b/integrations/figma/src/types.ts
@@ -1,4 +1,4 @@
-import { RuntimeEnvironment, RuntimeContext } from "@gitbook/runtime";
+import { RuntimeEnvironment, RuntimeContext } from '@gitbook/runtime';
 
 export interface FigmaInstallationConfiguration {
     oauth_credentials?: {
diff --git a/integrations/figma/tsconfig.json b/integrations/figma/tsconfig.json
@@ -0,0 +1,3 @@
+{
+    "extends": "@gitbook/tsconfig/integration.json"
+}
diff --git a/integrations/mermaid/.eslintrc.json b/integrations/mermaid/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+    "extends": ["@gitbook/eslint-config/integration"]
+}
diff --git a/integrations/mermaid/package.json b/integrations/mermaid/package.json
@@ -7,7 +7,13 @@
         "@gitbook/runtime": "*"
     },
     "devDependencies": {
-        "@gitbook/cli": "*"
+        "@gitbook/cli": "*",
+        "@gitbook/eslint-config": "*",
+        "@gitbook/tsconfig": "*"
     },
-    "scripts": {}
+    "scripts": {
+        "lint": "eslint ./**/*.ts*",
+        "typecheck": "tsc --noEmit",
+        "publish-integrations-staging": "gitbook publish ."
+    }
 }
diff --git a/integrations/mermaid/src/index.tsx b/integrations/mermaid/src/index.tsx
@@ -1,63 +1,65 @@
-import { createIntegration, createComponent } from "@gitbook/runtime";
+import { createIntegration, createComponent } from '@gitbook/runtime';
 
-const defaultContent =`graph TD
+const defaultContent = `graph TD
   Mermaid --> Diagram`;
 
-const diagramBlock = createComponent<{
-    content?: string;
-}, {
-    content: string;
-}>({
+const diagramBlock = createComponent<
+    {
+        content?: string;
+    },
+    {
+        content: string;
+    }
+>({
     componentId: 'diagram',
     initialState: (props) => {
         return {
-            content: props.content || defaultContent
+            content: props.content || defaultContent,
         };
     },
     async render(element, { environment }) {
         const { editable } = element.context;
         const { content } = element.state;
-        
+
         return (
             <block>
                 <box style="secondary">
                     <vstack>
                         {editable ? (
                             <>
                                 <box>
-                                <codeblock
-                                    state="content"
-                                    content={content}
-                                    syntax="mermaid"
-                                    onContentChange={{
-                                        action: '@editor.node.updateProps',
-                                        props: {
-                                            content: element.dynamicState('content')
-                                        }
-                                    }}
+                                    <codeblock
+                                        state="content"
+                                        content={content}
+                                        syntax="mermaid"
+                                        onContentChange={{
+                                            action: '@editor.node.updateProps',
+                                            props: {
+                                                content: element.dynamicState('content'),
+                                            },
+                                        }}
                                     />
                                 </box>
                                 <divider />
                             </>
                         ) : null}
                         <box>
-                        <webframe
-                            source={{
-                                url: environment.integration.urls.publicEndpoint,
-                            }}
-                            aspectRatio={16 / 9}
-                            data={{
-                                content: element.dynamicState('content'),
-                            }}
-                        />
+                            <webframe
+                                source={{
+                                    url: environment.integration.urls.publicEndpoint,
+                                }}
+                                aspectRatio={16 / 9}
+                                data={{
+                                    content: element.dynamicState('content'),
+                                }}
+                            />
                         </box>
                     </vstack>
                 </box>
             </block>
         );
-    }
-})
-
+    },
+});
 
 export default createIntegration({
     events: {
@@ -123,7 +125,7 @@ export default createIntegration({
                     },
                 }
             );
-        }
+        },
     },
-    components: [diagramBlock]
+    components: [diagramBlock],
 });
diff --git a/integrations/mermaid/tsconfig.json b/integrations/mermaid/tsconfig.json
@@ -0,0 +1,3 @@
+{
+    "extends": "@gitbook/tsconfig/integration.json"
+}
diff --git a/integrations/runkit/.eslintignore b/integrations/runkit/.eslintignore
@@ -0,0 +1 @@
+src/webframe.ts
diff --git a/integrations/runkit/.eslintrc.json b/integrations/runkit/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+    "extends": ["@gitbook/eslint-config/integration"]
+}
diff --git a/integrations/runkit/package.json b/integrations/runkit/package.json
@@ -9,10 +9,14 @@
     },
     "devDependencies": {
         "@gitbook/cli": "*",
+        "@gitbook/eslint-config": "*",
+        "@gitbook/tsconfig": "*",
         "esbuild": "^0.15.7"
     },
     "scripts": {
         "build": "node -r esbuild-register ./webframe/scripts/build.ts",
+        "lint": "eslint ./**/*.ts*",
+        "typecheck": "tsc --noEmit",
         "publish-integrations-staging": "gitbook publish ."
     }
 }
diff --git a/integrations/runkit/src/index.tsx b/integrations/runkit/src/index.tsx
@@ -1,10 +1,12 @@
 import { Router } from 'itty-router';
+
 import {
     createIntegration,
     createComponent,
     RuntimeContext,
     FetchEventCallback,
 } from '@gitbook/runtime';
+
 import { fetchRunKitFromLink } from './runkit';
 import { webFrameHTML } from './webframe';
 
diff --git a/integrations/segment/package.json b/integrations/segment/package.json
@@ -7,14 +7,16 @@
         "@gitbook/runtime": "*"
     },
     "devDependencies": {
-        "@gitbook/cli": "*",
+        "@gitbook/eslint-config": "*",
+        "@gitbook/tsconfig": "*",
         "test": "^3.2.1",
         "assert": "^2.0.0"
     },
     "scripts": {
-        "lint": "eslint ./src/**/*.ts",
-        "publish-integrations": "gitbook publish .",
+        "lint": "eslint ./**/*.ts*",
+        "typecheck": "tsc --noEmit",
         "publish-integrations-staging": "gitbook publish .",
+        "publish-integrations": "gitbook publish .",
         "test": "node -r esbuild-register ./tests/index.ts"
     }
 }
diff --git a/integrations/segment/tests/events.ts b/integrations/segment/tests/events.ts
@@ -3,6 +3,7 @@ import test from 'test';
 
 import * as api from '@gitbook/api';
 
+// eslint-disable-next-line import/no-internal-modules
 import { generateSegmentTrackEvent } from '../src/events';
 
 const fakeSpaceViewEvent: api.SpaceViewEvent = {
diff --git a/integrations/segment/tsconfig.json b/integrations/segment/tsconfig.json
@@ -1,3 +1,3 @@
 {
     "extends": "@gitbook/tsconfig/integration.json"
-}
+}
diff --git a/integrations/slack/package.json b/integrations/slack/package.json
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
diff --git a/packages/runtime/jsx-dev-runtime.d.ts b/packages/runtime/jsx-dev-runtime.d.ts
diff --git a/packages/runtime/jsx-runtime.d.ts b/packages/runtime/jsx-runtime.d.ts
diff --git a/packages/runtime/package.json b/packages/runtime/package.json
diff --git a/packages/tsconfig/integration.json b/packages/tsconfig/integration.json
diff --git a/packages/tsconfig/package.json b/packages/tsconfig/package.json

Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,5 @@`
`1`	`1`	`{`
`2`		`- "printWidth": 100,`
`3`		`- "singleQuote": true,`
`4`		`- "tabWidth": 4`
	`2`	`+ "printWidth": 100,`
	`3`	`+ "singleQuote": true,`
	`4`	`+ "tabWidth": 4`
`5`	`5`	`}`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+{`
	`2`	`+ "extends": ["@gitbook/eslint-config/integration"]`
	`3`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+{`
	`2`	`+ "extends": "@gitbook/tsconfig/integration.json"`
	`3`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import { RuntimeEnvironment, RuntimeContext } from "@gitbook/runtime";`
	`1`	`+import { RuntimeEnvironment, RuntimeContext } from '@gitbook/runtime';`
`2`	`2`
`3`	`3`	`export interface FigmaInstallationConfiguration {`
`4`	`4`	`oauth_credentials?: {`
Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,3 @@`
`1`	`1`	`{`
`2`	`2`	`"extends": "@gitbook/tsconfig/integration.json"`
`3`		`-}`
	`3`	`+}`