From 9fd5fc4bb75dabe64920c0ee154199a8f3c803b0 Mon Sep 17 00:00:00 2001 From: Bruno Henriques Date: Mon, 6 Jan 2025 15:31:23 +0000 Subject: [PATCH] build(types): improve project tsconfig - leverage module: preserve presets - review strictness - remove redundant rules - allow proper "exports" directory imports (useful for phosphor) --- apps/app/tsconfig.json | 17 ---------- apps/docs/src/components/home/HeroSection.tsx | 2 +- apps/docs/src/components/page/Description.tsx | 2 +- apps/docs/tsconfig.json | 15 +-------- .../src/CodeEditor/languages/xml.ts | 1 + packages/core/src/Slider/Slider.stories.tsx | 7 ++--- .../core/src/Table/TableBody/TableBody.tsx | 31 +++++++++---------- packages/lab/src/Blade/Blade.tsx | 23 +++++++------- .../lab/src/Flow/hooks/useFlowNodeMeta.ts | 4 +-- templates/KanbanBoard/TaskCard.tsx | 1 + tsconfig.build.json | 28 +++++++++++------ tsconfig.json | 3 +- 12 files changed, 55 insertions(+), 79 deletions(-) diff --git a/apps/app/tsconfig.json b/apps/app/tsconfig.json index 69f391ecad..c2b0a5ab94 100644 --- a/apps/app/tsconfig.json +++ b/apps/app/tsconfig.json @@ -1,22 +1,5 @@ { "extends": "../../tsconfig.json", - "compilerOptions": { - "target": "ESNext", - "useDefineForClassFields": true, - "lib": ["DOM", "DOM.Iterable", "ESNext"], - "allowJs": false, - "skipLibCheck": true, - "esModuleInterop": false, - "allowSyntheticDefaultImports": true, - "strict": true, - "forceConsistentCasingInFileNames": true, - "module": "ESNext", - "moduleResolution": "Node", - "resolveJsonModule": true, - "isolatedModules": true, - "noEmit": true, - "jsx": "react-jsx" - }, "include": ["src"], "references": [{ "path": "./tsconfig.node.json" }] } diff --git a/apps/docs/src/components/home/HeroSection.tsx b/apps/docs/src/components/home/HeroSection.tsx index e6018f2d10..09a195d8ec 100644 --- a/apps/docs/src/components/home/HeroSection.tsx +++ b/apps/docs/src/components/home/HeroSection.tsx @@ -1,5 +1,5 @@ import { useMemo } from "react"; -import { ArrowRight } from "@phosphor-icons/react"; +import { ArrowRight } from "@phosphor-icons/react/ArrowRight"; import { clsx } from "clsx"; import { HvButton } from "@hitachivantara/uikit-react-core"; diff --git a/apps/docs/src/components/page/Description.tsx b/apps/docs/src/components/page/Description.tsx index 0c4905f687..b35e02c6cf 100644 --- a/apps/docs/src/components/page/Description.tsx +++ b/apps/docs/src/components/page/Description.tsx @@ -1,4 +1,4 @@ -import { ArrowUpRight } from "@phosphor-icons/react"; +import { ArrowUpRight } from "@phosphor-icons/react/ArrowUpRight"; import { useData } from "nextra/hooks"; import { HvTypography } from "@hitachivantara/uikit-react-core"; diff --git a/apps/docs/tsconfig.json b/apps/docs/tsconfig.json index be17042c50..5db4edbd98 100644 --- a/apps/docs/tsconfig.json +++ b/apps/docs/tsconfig.json @@ -1,22 +1,9 @@ { "extends": "../../tsconfig.json", "compilerOptions": { - "target": "ESNext", "useDefineForClassFields": true, - "lib": ["DOM", "DOM.Iterable", "ESNext"], - "allowJs": false, - "skipLibCheck": true, - "esModuleInterop": true, "allowSyntheticDefaultImports": true, - "strict": true, - "forceConsistentCasingInFileNames": true, - "module": "ESNext", - "moduleResolution": "Node", - "resolveJsonModule": true, - "isolatedModules": true, - "noEmit": true, - "jsx": "preserve", - "incremental": true + "jsx": "preserve" }, "include": ["**/*"], "exclude": ["node_modules"] diff --git a/packages/code-editor/src/CodeEditor/languages/xml.ts b/packages/code-editor/src/CodeEditor/languages/xml.ts index c998b30cdd..34c7fd599e 100644 --- a/packages/code-editor/src/CodeEditor/languages/xml.ts +++ b/packages/code-editor/src/CodeEditor/languages/xml.ts @@ -126,6 +126,7 @@ const getLastOpenedTag = (content: string, closed = false) => { content = content.substring(0, tagPosition); } } + return undefined; }; /** diff --git a/packages/core/src/Slider/Slider.stories.tsx b/packages/core/src/Slider/Slider.stories.tsx index cc8708fce7..3b658b6eda 100644 --- a/packages/core/src/Slider/Slider.stories.tsx +++ b/packages/core/src/Slider/Slider.stories.tsx @@ -275,11 +275,8 @@ export const CustomValues: StoryObj = { render: () => { const [values, setValues] = useState([3]); const formattedLabel = (label: React.ReactNode) => { - if (label === "1") return "Very Low"; - if (label === "2") return "Low"; - if (label === "3") return "Medium"; - if (label === "4") return "High"; - if (label === "5") return "Very High"; + const labels = ["Very Low", "Low", "Medium", "High", "Very High"]; + return labels[Number(label) - 1]; }; return ( diff --git a/packages/core/src/Table/TableBody/TableBody.tsx b/packages/core/src/Table/TableBody/TableBody.tsx index 1cc8a0ff3d..6ca38b0f35 100644 --- a/packages/core/src/Table/TableBody/TableBody.tsx +++ b/packages/core/src/Table/TableBody/TableBody.tsx @@ -83,22 +83,21 @@ export const HvTableBody = forwardRef( > {withNavigation ? Children.map(children, (element) => { - if (isValidElement(element)) { - return ( - - {element} - - ); - } + if (!isValidElement(element)) return undefined; + return ( + + {element} + + ); }) : children} diff --git a/packages/lab/src/Blade/Blade.tsx b/packages/lab/src/Blade/Blade.tsx index 42cae47c63..aff6260eb4 100644 --- a/packages/lab/src/Blade/Blade.tsx +++ b/packages/lab/src/Blade/Blade.tsx @@ -248,18 +248,17 @@ export const HvBlade = (props: HvBladeProps) => { const bladeRef = useRef(null); const [maxWidth, setMaxWidth] = useState(undefined); useEffect(() => { - if (bladeRef.current) { - const resizeObserver = new ResizeObserver((entries) => { - setMaxWidth(entries[0].target.clientWidth); - }); - resizeObserver.observe( - // using the blade's container as reference max-width is more stable - bladeRef.current.parentElement ?? bladeRef.current, - ); - return () => { - resizeObserver.disconnect(); - }; - } + if (!bladeRef.current) return; + const resizeObserver = new ResizeObserver((entries) => { + setMaxWidth(entries[0].target.clientWidth); + }); + resizeObserver.observe( + // using the blade's container as reference max-width is more stable + bladeRef.current.parentElement ?? bladeRef.current, + ); + return () => { + resizeObserver.disconnect(); + }; }, [isExpanded]); const { style: containerStyle, ...otherContainerProps } = diff --git a/packages/lab/src/Flow/hooks/useFlowNodeMeta.ts b/packages/lab/src/Flow/hooks/useFlowNodeMeta.ts index cebcb846f0..2e1ced5b4b 100644 --- a/packages/lab/src/Flow/hooks/useFlowNodeMeta.ts +++ b/packages/lab/src/Flow/hooks/useFlowNodeMeta.ts @@ -5,7 +5,5 @@ export function useFlowNodeMeta(id?: string) { const nodeId = useNodeId(id); const { registry } = useNodeMetaRegistry(); - if (nodeId) { - return registry[nodeId]; - } + return registry[nodeId!]; } diff --git a/templates/KanbanBoard/TaskCard.tsx b/templates/KanbanBoard/TaskCard.tsx index 30c53cb2b9..7dc8ed164d 100644 --- a/templates/KanbanBoard/TaskCard.tsx +++ b/templates/KanbanBoard/TaskCard.tsx @@ -42,6 +42,7 @@ const getStatusIcon = (statusLevel?: number) => { case 5: return ; default: + return null; } }; diff --git a/tsconfig.build.json b/tsconfig.build.json index eadc10dd49..1392c7bc26 100644 --- a/tsconfig.build.json +++ b/tsconfig.build.json @@ -1,22 +1,32 @@ { "compilerOptions": { - "module": "ESNext", + /* Base Options */ "target": "ES2022", - "lib": ["DOM", "ES2022", "dom.iterable"], - "moduleResolution": "Node", - "noEmit": true, "resolveJsonModule": true, "esModuleInterop": true, "skipLibCheck": true, - "sourceMap": true, + "allowJs": true, + "moduleDetection": "force", + "isolatedModules": true, + // "verbatimModuleSyntax": true, + + /* Strictness */ + "strict": true, + "noImplicitReturns": true, + "noFallthroughCasesInSwitch": true, + // "noUncheckedIndexedAccess": true, + + /* Bundling options (vite monorepo) */ + "module": "preserve", + "noEmit": true, + "composite": true, "declaration": true, "declarationMap": true, - "strict": true, - "forceConsistentCasingInFileNames": true, - "allowSyntheticDefaultImports": true, + + /* Others */ + "lib": ["es2022", "dom", "dom.iterable"], "jsx": "react-jsx", "baseUrl": ".", - "noImplicitAny": true, "types": [ "node", "jest", diff --git a/tsconfig.json b/tsconfig.json index 20fd23fed7..1714dd850c 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -7,7 +7,8 @@ } }, "include": [ - ".config", + ".config/*.ts", + "*.config.ts", ".storybook/**/*", "apps", "docs",