Skip to content

Commit 0be1df6

Browse files
axmmisakaKagamihara Nadeshiko
axmmisaka
authored and
Kagamihara Nadeshiko
committed
Linting WIP
Linted some but not all Fix typing issue in LinguaFrancaMultiTargetUtils/LanguageSelector Get around of typing issue in src/remark/TransformDynamicLFFileImportToStatic.ts
1 parent c228319 commit 0be1df6

File tree

12 files changed

+646
-133
lines changed

12 files changed

+646
-133
lines changed

‎.eslintrc.js

+40
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
/**
2+
* Copyright (c) Facebook, Inc. and its affiliates.
3+
*
4+
* This source code is licensed under the MIT license found in the
5+
* LICENSE file in the root directory of this source tree.
6+
*
7+
*
8+
* Copyright (c) 2019-2023, the Lingua Franca contributors.
9+
* All rights reserved.
10+
*/
11+
12+
const OFF = 0;
13+
const WARNING = 1;
14+
const ERROR = 2;
15+
16+
module.exports = {
17+
extends: [
18+
'eslint:recommended',
19+
'plugin:@typescript-eslint/recommended-type-checked',
20+
'plugin:@typescript-eslint/stylistic-type-checked',
21+
'plugin:react-hooks/recommended',
22+
'plugin:regexp/recommended',
23+
'prettier',
24+
'plugin:@docusaurus/all',
25+
],
26+
plugins: [
27+
'react-hooks',
28+
'@typescript-eslint',
29+
'regexp',
30+
'@docusaurus',
31+
],
32+
rules: {
33+
'react/jsx-uses-react': OFF, // JSX runtime: automatic
34+
'react/react-in-jsx-scope': OFF, // JSX runtime: automatic
35+
},
36+
parser: '@typescript-eslint/parser',
37+
parserOptions: {
38+
project: ["tsconfig.json"]
39+
},
40+
};

‎.prittierrc

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"arrowParens": "always",
3+
"bracketSpacing": false,
4+
"bracketSameLine": true,
5+
"printWidth": 80,
6+
"proseWrap": "never",
7+
"singleQuote": true,
8+
"trailingComma": "all"
9+
}

‎docusaurus.config.ts

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import {themes as prismThemes} from 'prism-react-renderer';
22
import type {Config} from '@docusaurus/types';
33
import type * as Preset from '@docusaurus/preset-classic';
4+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
45
import { TransformDynamicLFFileImportToStatic } from './src/remark/TransformDynamicLFFileImportToStatic';
56
import redirects from "./docs/lagacy_routing";
67

@@ -144,9 +145,9 @@ const config: Config = {
144145
// We don't use createRedirects because directory structure has changed.
145146
},
146147
],
147-
(context, options) => ({
148+
() => ({
148149
name: 'read-lf-source-code-files',
149-
configureWebpack: (config, isServer, utils) => ({
150+
configureWebpack: () => ({
150151
module: {
151152
rules: [
152153
{

‎package.json

+8-1
Original file line numberDiff line numberDiff line change
@@ -29,10 +29,17 @@
2929
"unist-util-visit": "^5.0.0"
3030
},
3131
"devDependencies": {
32+
"@docusaurus/eslint-plugin": "^3.0.1",
3233
"@docusaurus/module-type-aliases": "^3.0.1",
3334
"@docusaurus/tsconfig": "^3.0.1",
3435
"@docusaurus/types": "^3.0.1",
35-
"typescript": "~5.2.2"
36+
"@typescript-eslint/eslint-plugin": "^6.13.1",
37+
"@typescript-eslint/parser": "^6.13.1",
38+
"eslint": "^8.55.0",
39+
"eslint-config-prettier": "^9.1.0",
40+
"eslint-plugin-react-hooks": "^4.6.0",
41+
"eslint-plugin-regexp": "^2.1.1",
42+
"typescript": "^5.3.2"
3643
},
3744
"browserslist": {
3845
"production": [

‎src/components/HomepageFeatures/index.tsx

+16-11
Original file line numberDiff line numberDiff line change
@@ -2,41 +2,46 @@ import clsx from 'clsx';
22
import Heading from '@theme/Heading';
33
import styles from './styles.module.css';
44
import { ReactElement } from 'react';
5+
import Translate from '@docusaurus/Translate';
56

6-
type FeatureItem = {
7+
interface FeatureItem {
78
title: string;
89
Svg: React.ComponentType<React.ComponentProps<'svg'>>;
910
description: JSX.Element;
10-
};
11+
}
12+
13+
import Mountain from '@site/static/img/undraw_docusaurus_mountain.svg';
14+
import Tree from "@site/static/img/undraw_docusaurus_tree.svg";
15+
import SaurusReact from "@site/static/img/undraw_docusaurus_react.svg";
1116

1217
const FeatureList: FeatureItem[] = [
1318
{
1419
title: 'Composable',
15-
Svg: require('@site/static/img/undraw_docusaurus_mountain.svg').default,
20+
Svg: Mountain,
1621
description: (
17-
<>
22+
<Translate>
1823
Reactors are composable software components with inputs, outputs, and local state.
19-
</>
24+
</Translate>
2025
),
2126
},
2227
{
2328
title: 'Concurrent',
24-
Svg: require('@site/static/img/undraw_docusaurus_tree.svg').default,
29+
Svg: Tree,
2530
description: (
26-
<>
31+
<Translate>
2732
Reactions to events are concurrent unless there is an explicit
2833
dependency between them.
29-
</>
34+
</Translate>
3035
),
3136
},
3237
{
3338
title: 'Deterministic',
34-
Svg: require('@site/static/img/undraw_docusaurus_react.svg').default,
39+
Svg: SaurusReact,
3540
description: (
36-
<>
41+
<Translate>
3742
Lingua Franca programs are deterministic by default and therefore easy
3843
to test.
39-
</>
44+
</Translate>
4045
),
4146
}
4247
];

‎src/components/LinguaFrancaMultiTargetUtils/DynamicMultiTargetCodeblock.tsx

+15-5
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
import React, { useState, useEffect } from 'react';
2-
import { targets, TargetsType, TargetToNameMap } from './index';
2+
import { TargetsType, } from './index';
33
import { NoSelectorTargetCodeBlock } from './LangSpecific';
4+
import Translate from '@docusaurus/Translate';
45

56
interface WebpackImportedRawModule {
6-
default: { readonly [key: string]: string };
7+
default: Readonly<Record<string, string>>;
78
[key: string]: unknown;
89
}
910

@@ -21,11 +22,15 @@ export const DynamicMultiTargetCodeblock = ({
2122

2223
useEffect(() => {
2324
const getCode = async (targetLang: TargetsType) => {
25+
// Webpack 5 magic, it's not typed so it's really screwed up
26+
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
2427
const content: WebpackImportedRawModule = await import(
2528
`@site/docs/assets/code/${targetLang}/${file}.lf`
2629
);
2730
setTargetToCodeState((prevState) => ({
2831
...prevState,
32+
// Idibem
33+
// eslint-disable-next-line @typescript-eslint/no-base-to-string
2934
[targetLang]: content.default.toString(),
3035
}));
3136
};
@@ -39,10 +44,15 @@ export const DynamicMultiTargetCodeblock = ({
3944
}
4045
);
4146
}
42-
}, []);
47+
});
4348

4449
return <>
45-
{ !doNotTransformInMDX && <b>Warning: DynamicMultiTargetCodeblock is present, but DynamicMultiTargetCodeblock is not set. This means corresponding MDX plugin that transforms it into code selector and import statements is not working correctly!</b> }
46-
<NoSelectorTargetCodeBlock {...targetToCodeState} />
50+
{ !doNotTransformInMDX && <b>
51+
<Translate>
52+
Warning: DynamicMultiTargetCodeblock is present, but DynamicMultiTargetCodeblock is not set. This means corresponding MDX plugin that transforms it into code selector and import statements is not working correctly!
53+
</Translate>
54+
</b>
55+
}
56+
<NoSelectorTargetCodeBlock {...targetToCodeState} lf />
4757
</>;
4858
};

‎src/components/LinguaFrancaMultiTargetUtils/LangSpecific.tsx

+9-30
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,14 @@ import { ReactNode, useEffect, useState } from 'react';
77
import { ShikijiLFHighlighter } from '../ShikijiLFHighlighter';
88

99
interface WebpackImportedRawModule {
10-
default: { readonly [key: string]: string };
10+
default: Readonly<Record<string, string>>;
1111
[key: string]: unknown;
1212
}
1313

1414
export const LangSpecific = (
1515
props: Record<TargetsType, ReactNode>
16-
): JSX.Element => {
16+
// Make ESLint happy
17+
): JSX.Element | false => {
1718
const propArr: [TargetsType, string?][] = Object.entries(props) as [
1819
TargetsType,
1920
string?
@@ -25,6 +26,8 @@ export const LangSpecific = (
2526
<TabItem
2627
key={target}
2728
value={target}
29+
// Idk what happened here
30+
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
2831
label={TargetToNameMap.get[target]}
2932
attributes={{ className: styles.hidden }}
3033
>
@@ -39,35 +42,12 @@ export const LangSpecific = (
3942

4043
export const NoSelectorTargetCodeBlock = (
4144
props:
42-
({ allowAsync?: false; lf: boolean } & Record<TargetsType, string>) |
43-
({ allowAsync: true; lf: boolean } & Record<TargetsType, string | Promise<WebpackImportedRawModule>>)
45+
({ lf: boolean } & Record<TargetsType, string | null>) |
46+
({ lf: boolean } & Record<TargetsType, string | Promise<WebpackImportedRawModule | null>>)
4447
): JSX.Element => {
4548
const Component = props.lf ? ShikijiLFHighlighter : CodeBlock;
46-
// I know, using === on boolean looks dumb, but this makes TS discriminated union work!
47-
if (props.allowAsync === true) {
48-
// Idem. I would like to do destruction above, but that will affect TS type system!
49-
const { allowAsync, lf, ...targetToCode } = props;
50-
// Although honestly, this is not really needed. We should prefer static import over this async one.
51-
const [newProps, setNewProps] = useState<Record<TargetsType, ReactNode>>({} as Record<
52-
TargetsType,
53-
ReactNode
54-
>);
55-
56-
useEffect(() => {
57-
(async () => {
58-
Object.entries(targetToCode).forEach(async ([target, content]: [TargetsType, string | Promise<WebpackImportedRawModule>]) => {
59-
const resolvedContent = await Promise.resolve(content);
60-
setNewProps(prev => ({
61-
[target]: <Component language={target}>{typeof resolvedContent === "string" ? resolvedContent : resolvedContent.default.toString()}</Component>,
62-
...prev
63-
}));
64-
});
65-
})();
66-
}, []);
67-
68-
return <LangSpecific {...newProps} />;
69-
} else {
70-
const { allowAsync, lf, ...targetToCode } = props;
49+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
50+
const { lf, ...targetToCode } = props;
7151
const newProps: Record<TargetsType, ReactNode> = {} as Record<
7252
TargetsType,
7353
ReactNode
@@ -77,5 +57,4 @@ export const NoSelectorTargetCodeBlock = (
7757
});
7858

7959
return <LangSpecific {...newProps} />;
80-
}
8160
};

‎src/components/LinguaFrancaMultiTargetUtils/LanguageSelector.tsx

+10-4
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import Tabs from '@theme/Tabs';
2-
import TabItem from '@theme/TabItem';
32
import { type TargetsType, TargetToNameMap } from './index';
3+
import Translate from '@docusaurus/Translate';
44

55
// String-like keys will preserve insertion ordering. This is hacky but it looks nicer.
66
export const LanguageSelector = (props: Record<TargetsType, boolean | null>): JSX.Element => {
@@ -25,11 +25,17 @@ export const LanguageSelector = (props: Record<TargetsType, boolean | null>): JS
2525

2626
return (
2727
<>
28-
<p>This article has examples in the following target languages:</p>
28+
<p>
29+
<Translate>
30+
This article has examples in the following target languages:
31+
</Translate>
32+
</p>
2933
<Tabs groupId="target-languages"
3034
queryString
31-
values={Object.entries(ordered).map(
32-
([lang, exist]: [TargetsType, boolean], i) => (exist && {value: lang, label: TargetToNameMap.get(lang)})
35+
values={Object.entries(ordered)
36+
.filter(([lang, exist]: [TargetsType, boolean]) => (exist))
37+
.map(
38+
([lang, exist]: [TargetsType, boolean]) => ({value: lang, label: TargetToNameMap.get(lang)})
3339
)} children={[]} />
3440
</>
3541
);

0 commit comments

Comments
 (0)