From 4f71c00b28c8e57d9bad5ff99ede85f1d1aecc45 Mon Sep 17 00:00:00 2001 From: Jan Potoms <2109932+Janpot@users.noreply.github.com> Date: Mon, 25 Jul 2022 11:37:27 +0200 Subject: [PATCH] Standardize on React invariant library (#683) --- packages/toolpad-app/package.json | 4 ++- packages/toolpad-app/src/api.ts | 5 ++-- packages/toolpad-app/src/appDom.ts | 26 +++++++------------ .../src/components/MonacoEditor.tsx | 5 ++-- .../toolpad-app/src/server/evalExpression.ts | 3 ++- .../AppEditor/PageEditor/ComponentCatalog.tsx | 8 +++--- .../AppEditor/PageEditor/QueryEditor.tsx | 9 +++---- .../toolpad-app/src/toolpad/DomLoader.tsx | 5 ++-- packages/toolpad-app/src/utils/bindings.ts | 3 ++- yarn.lock | 22 ++++++++++++---- 10 files changed, 45 insertions(+), 45 deletions(-) diff --git a/packages/toolpad-app/package.json b/packages/toolpad-app/package.json index fbb79126e40..d818e64fc60 100644 --- a/packages/toolpad-app/package.json +++ b/packages/toolpad-app/package.json @@ -61,6 +61,7 @@ "find-up": "^6.2.0", "fractional-indexing": "^3.0.1", "headers-polyfill": "^3.0.10", + "invariant": "^2.2.4", "isolated-vm": "^4.4.1", "json-to-ts": "^1.7.0", "json5": "^2.2.1", @@ -97,6 +98,7 @@ "@types/crypto-js": "^4.1.1", "@types/glob": "^7.2.0", "@types/har-format": "^1.2.8", + "@types/invariant": "^2.2.35", "@types/lodash-es": "^4.17.6", "@types/node-fetch": "^2.6.2", "@types/react": "^18.0.14", @@ -108,7 +110,7 @@ "eslint-config-prettier": "^8.3.0", "eslint-plugin-import": "^2.25.3", "glob": "^8.0.3", - "monaco-editor": "^0.33.0", + "monaco-editor": "^0.34.0-dev.20220722", "webpack": "^5.73.0" }, "typings": "./index.d.ts", diff --git a/packages/toolpad-app/src/api.ts b/packages/toolpad-app/src/api.ts index ac6e22c901c..9f3174b5236 100644 --- a/packages/toolpad-app/src/api.ts +++ b/packages/toolpad-app/src/api.ts @@ -1,3 +1,4 @@ +import invariant from 'invariant'; import { QueryClient, useMutation, @@ -103,9 +104,7 @@ function createClient>(endpoint: string): ApiClient enabled: !!params, queryKey: [key, params], queryFn: () => { - if (!params) { - throw new Error(`Invariant: "enabled" prop of useQuery should prevent this call'`); - } + invariant(params, `"enabled" prop of useQuery should prevent this call'`); return query[key](...params); }, }); diff --git a/packages/toolpad-app/src/appDom.ts b/packages/toolpad-app/src/appDom.ts index ddf72736371..1047c8ffa5d 100644 --- a/packages/toolpad-app/src/appDom.ts +++ b/packages/toolpad-app/src/appDom.ts @@ -7,6 +7,7 @@ import { BindableAttrValues, SecretAttrValue, } from '@mui/toolpad-core'; +import invariant from 'invariant'; import { ConnectionStatus, AppTheme } from './types'; import { omit, update, updateOrCreate } from './utils/immutability'; import { camelCase, generateUniqueString, removeDiacritics } from './utils/strings'; @@ -184,9 +185,7 @@ function isType(node: AppDomNode, type: T['type']): node i } function assertIsType(node: AppDomNode, type: T['type']): asserts node is T { - if (!isType(node, type)) { - throw new Error(`Invariant: expected node type "${type}" but got "${node.type}"`); - } + invariant(isType(node, type), `Expected node type "${type}" but got "${node.type}"`); } export function createConst(value: V): ConstantAttrValue { @@ -338,11 +337,10 @@ export function getChildNodes(dom: AppDom, parent: N): Nod for (const childArray of Object.values(result)) { childArray?.sort((node1: AppDomNode, node2: AppDomNode) => { - if (!node1.parentIndex || !node2.parentIndex) { - throw new Error( - `Invariant: nodes inside the dom should have a parentIndex if they have a parent`, - ); - } + invariant( + node1.parentIndex && node2.parentIndex, + `Nodes inside the dom should have a parentIndex if they have a parent`, + ); return compareFractionalIndex(node1.parentIndex, node2.parentIndex); }); } @@ -649,9 +647,7 @@ export function removeNode(dom: AppDom, nodeId: NodeId) { const node = getNode(dom, nodeId); const parent = getParent(dom, node); - if (!parent) { - throw new Error(`Invariant: Node: "${node.id}" can't be removed`); - } + invariant(parent, `Node: "${node.id}" can't be removed`); const descendantIds = getDescendants(dom, node).map(({ id }) => id); @@ -731,9 +727,7 @@ export function getNewParentIndexBeforeNode( ) { const parent = getParent(dom, node); - if (!parent) { - throw new Error(`Invariant: Node: "${node.id}" has no parent`); - } + invariant(parent, `Node: "${node.id}" has no parent`); const parentChildren = ((isPage(parent) || isElement(parent)) && @@ -753,9 +747,7 @@ export function getNewParentIndexAfterNode( ) { const parent = getParent(dom, node); - if (!parent) { - throw new Error(`Invariant: Node: "${node.id}" has no parent`); - } + invariant(parent, `Node: "${node.id}" has no parent`); const parentChildren = ((isPage(parent) || isElement(parent)) && diff --git a/packages/toolpad-app/src/components/MonacoEditor.tsx b/packages/toolpad-app/src/components/MonacoEditor.tsx index ba0bdb81e9b..45d4d5c1f7e 100644 --- a/packages/toolpad-app/src/components/MonacoEditor.tsx +++ b/packages/toolpad-app/src/components/MonacoEditor.tsx @@ -8,6 +8,7 @@ import * as monaco from 'monaco-editor'; import { styled, SxProps } from '@mui/material'; import clsx from 'clsx'; import cuid from 'cuid'; +import invariant from 'invariant'; import monacoEditorTheme from '../monacoEditorTheme'; function getExtension(language: string): string { @@ -145,9 +146,7 @@ export default React.forwardRef(function const instanceRef = React.useRef(null); React.useEffect(() => { - if (!rootRef.current) { - return; - } + invariant(rootRef.current, 'Ref not attached'); const extraOptions: EditorOptions = { readOnly: disabled, diff --git a/packages/toolpad-app/src/server/evalExpression.ts b/packages/toolpad-app/src/server/evalExpression.ts index 6f9f25391d4..c3771b65c21 100644 --- a/packages/toolpad-app/src/server/evalExpression.ts +++ b/packages/toolpad-app/src/server/evalExpression.ts @@ -1,3 +1,4 @@ +import invariant from 'invariant'; import { getQuickJS, QuickJSHandle, QuickJSContext } from 'quickjs-emscripten'; export type Serializable = @@ -47,7 +48,7 @@ export function newJson(ctx: QuickJSContext, json: Serializable): QuickJSHandle return result; } default: - throw new Error(`Invariant: invalid value: ${json}`); + return invariant(false, `invalid value: ${json}`); } } diff --git a/packages/toolpad-app/src/toolpad/AppEditor/PageEditor/ComponentCatalog.tsx b/packages/toolpad-app/src/toolpad/AppEditor/PageEditor/ComponentCatalog.tsx index e8183755532..4c04511acd8 100644 --- a/packages/toolpad-app/src/toolpad/AppEditor/PageEditor/ComponentCatalog.tsx +++ b/packages/toolpad-app/src/toolpad/AppEditor/PageEditor/ComponentCatalog.tsx @@ -3,6 +3,7 @@ import { Box, Collapse, styled, Typography } from '@mui/material'; import ChevronLeftIcon from '@mui/icons-material/ChevronLeft'; import ChevronRightIcon from '@mui/icons-material/ChevronRight'; import DragIndicatorIcon from '@mui/icons-material/DragIndicator'; +import invariant from 'invariant'; import * as appDom from '../../../appDom'; import { useDom } from '../../DomLoader'; import { usePageEditorApi } from './PageEditorProvider'; @@ -105,11 +106,8 @@ export default function ComponentCatalog({ className }: ComponentCatalogProps) { ), ) .map(([componentId, componentType]) => { - if (!componentType) { - throw new Error( - `Invariant: Component definition for "${componentId}" is undefined`, - ); - } + invariant(componentType, `No component definition found for "${componentId}"`); + return ( ({ open, onCreated, onClose }: DataSourceSel const connectionId = input; const connection = connectionId && appDom.getMaybeNode(dom, connectionId, 'connection'); - if (!connection) { - throw new Error(`Invariant: Selected non-existing connection "${connectionId}"`); - } + invariant(connection, `Selected non-existing connection "${connectionId}"`); const dataSourceId = connection.attributes.dataSource.value; const dataSource = dataSources[dataSourceId]; - if (!dataSource) { - throw new Error(`Invariant: Selected non-existing dataSource "${dataSourceId}"`); - } + invariant(dataSource, `Selected non-existing dataSource "${dataSourceId}"`); const queryNode = appDom.createNode(dom, 'query', { attributes: { diff --git a/packages/toolpad-app/src/toolpad/DomLoader.tsx b/packages/toolpad-app/src/toolpad/DomLoader.tsx index 60fb7b55d02..919e9a80f0e 100644 --- a/packages/toolpad-app/src/toolpad/DomLoader.tsx +++ b/packages/toolpad-app/src/toolpad/DomLoader.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { Alert, Snackbar } from '@mui/material'; import { NodeId, BindableAttrValue, BindableAttrValues } from '@mui/toolpad-core'; +import invariant from 'invariant'; import * as appDom from '../appDom'; import { update } from '../utils/immutability'; import client from '../api'; @@ -257,9 +258,7 @@ export interface DomContextProps { export default function DomProvider({ appId, children }: DomContextProps) { const { data: dom } = client.useQuery('loadDom', [appId], { suspense: true }); - if (!dom) { - throw new Error(`Invariant: suspense should load the dom`); - } + invariant(dom, `Suspense should load the dom`); const [state, dispatch] = React.useReducer(domLoaderReducer, { saving: false, diff --git a/packages/toolpad-app/src/utils/bindings.ts b/packages/toolpad-app/src/utils/bindings.ts index 56260d513cf..4b231b1d4f1 100644 --- a/packages/toolpad-app/src/utils/bindings.ts +++ b/packages/toolpad-app/src/utils/bindings.ts @@ -1,4 +1,5 @@ import { BindingAttrValueFormat } from '@mui/toolpad-core'; +import invariant from 'invariant'; type ParsedBinding = string[]; @@ -30,7 +31,7 @@ export function formatExpression( case 'default': return expr.join(''); default: - throw new Error(`Invariant: Unrecognized binding format "${bindingFormat}"`); + return invariant(false, `Unrecognized binding format "${bindingFormat}"`); } } diff --git a/yarn.lock b/yarn.lock index 0f90d3dd466..d10296d3bef 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2702,6 +2702,11 @@ resolved "https://registry.yarnpkg.com/@types/history/-/history-4.7.11.tgz#56588b17ae8f50c53983a524fc3cc47437969d64" integrity sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA== +"@types/invariant@^2.2.35": + version "2.2.35" + resolved "https://registry.yarnpkg.com/@types/invariant/-/invariant-2.2.35.tgz#cd3ebf581a6557452735688d8daba6cf0bd5a3be" + integrity sha512-DxX1V9P8zdJPYQat1gHyY0xj3efl8gnMVjiM9iCY6y27lj+PoQWkgjt8jDqmovPqULkKVpKRg8J36iQiA+EtEg== + "@types/istanbul-lib-coverage@*", "@types/istanbul-lib-coverage@^2.0.0", "@types/istanbul-lib-coverage@^2.0.1": version "2.0.4" resolved "https://registry.yarnpkg.com/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz#8467d4b3c087805d63580480890791277ce35c44" @@ -7197,6 +7202,13 @@ interpret@^1.4.0: resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.4.0.tgz#665ab8bc4da27a774a40584e812e3e0fa45b1a1e" integrity sha512-agE4QfB2Lkp9uICn7BAqoscw4SZP9kTE2hxiFI3jBPmXJfdqiahTbUuKGsMoN2GtqL9AxhYioAcVvgsb1HvRbA== +invariant@^2.2.4: + version "2.2.4" + resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6" + integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA== + dependencies: + loose-envify "^1.0.0" + ip@^1.1.5: version "1.1.8" resolved "https://registry.yarnpkg.com/ip/-/ip-1.1.8.tgz#ae05948f6b075435ed3307acce04629da8cdbf48" @@ -8485,7 +8497,7 @@ log-symbols@^5.1.0: chalk "^5.0.0" is-unicode-supported "^1.1.0" -loose-envify@^1.1.0, loose-envify@^1.4.0: +loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0: version "1.4.0" resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf" integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q== @@ -8942,10 +8954,10 @@ modify-values@^1.0.0: resolved "https://registry.yarnpkg.com/modify-values/-/modify-values-1.0.1.tgz#b3939fa605546474e3e3e3c63d64bd43b4ee6022" integrity sha512-xV2bxeN6F7oYjZWTe/YPAy6MN2M+sL4u/Rlm2AHCIVGfo2p1yGmBHQ6vHehl4bRTZBdHu3TSkWdYgkwpYzAGSw== -monaco-editor@^0.33.0: - version "0.33.0" - resolved "https://registry.yarnpkg.com/monaco-editor/-/monaco-editor-0.33.0.tgz#842e244f3750a2482f8a29c676b5684e75ff34af" - integrity sha512-VcRWPSLIUEgQJQIE0pVT8FcGBIgFoxz7jtqctE+IiCxWugD0DwgyQBcZBhdSrdMC84eumoqMZsGl2GTreOzwqw== +monaco-editor@^0.34.0-dev.20220722: + version "0.34.0-dev.20220722" + resolved "https://registry.yarnpkg.com/monaco-editor/-/monaco-editor-0.34.0-dev.20220722.tgz#58bbb9477c2790c346c156e80d74585b6691b2e3" + integrity sha512-6l2hFsHOJE+5TQFDoWBeoACKcissTeLD5+xJ2HrtvP86sHnpnZy7ffbcFQCKpInJKIBSP7+y/bpctYn8eSAYTQ== mrmime@^1.0.0: version "1.0.1"