From 215c667c53f93adf7e1ea1696aae73a919a3bb93 Mon Sep 17 00:00:00 2001 From: Daniel Ochoa Date: Thu, 22 Jan 2026 20:42:56 -0500 Subject: [PATCH] feat(): SMX-242 - migrate to ESLint 9 flat config --- .eslintrc.json | 63 - components/error.tsx | 26 +- components/form.tsx | 215 +- components/header.tsx | 121 +- components/innerHeader.tsx | 36 +- components/loading.tsx | 12 +- context/session.tsx | 24 +- eslint.config.mjs | 83 + lib/auth.ts | 86 +- lib/db.ts | 18 +- lib/dbs/firebase.ts | 130 +- lib/dbs/mysql.ts | 113 +- lib/hooks.ts | 159 +- next-env.d.ts | 2 +- package-lock.json | 7356 ++++++++++++----- package.json | 31 +- package.json.backup | 59 + package.json.fe454-backup | 59 + pages/_app.tsx | 31 +- pages/_document.tsx | 2 +- pages/api/auth.ts | 22 +- pages/api/load.ts | 30 +- pages/api/logout.ts | 20 +- pages/api/orders/[orderId]/index.ts | 55 +- .../api/orders/[orderId]/shipping_products.ts | 62 +- pages/api/products/[pid].ts | 77 +- pages/api/products/index.ts | 23 +- pages/api/products/list.ts | 29 +- pages/api/removeUser.ts | 20 +- pages/api/uninstall.ts | 20 +- pages/index.tsx | 50 +- pages/orders/[orderId]/index.tsx | 128 +- pages/orders/[orderId]/modal.tsx | 191 +- .../productAppExtension/[productId]/index.tsx | 70 +- pages/products/[pid].tsx | 86 +- pages/products/index.tsx | 191 +- prettier.config.js | 5 + test/mocks/hooks.ts | 39 +- test/pages/index.spec.tsx | 12 +- test/pages/productAppExtension/index.spec.tsx | 22 +- test/pages/products/[pid].spec.tsx | 30 +- test/pages/products/index.spec.tsx | 40 +- test/utils.tsx | 13 +- types/auth.ts | 34 +- types/data.ts | 22 +- types/db.ts | 24 +- types/error.ts | 6 +- types/order.ts | 82 +- 48 files changed, 6834 insertions(+), 3195 deletions(-) delete mode 100644 .eslintrc.json create mode 100644 eslint.config.mjs create mode 100644 package.json.backup create mode 100644 package.json.fe454-backup create mode 100644 prettier.config.js diff --git a/.eslintrc.json b/.eslintrc.json deleted file mode 100644 index e407eb2f..00000000 --- a/.eslintrc.json +++ /dev/null @@ -1,63 +0,0 @@ -{ - "parser": "@typescript-eslint/parser", - "plugins": ["@typescript-eslint"], - "extends": [ - "eslint:recommended", - "plugin:@typescript-eslint/eslint-recommended", - "plugin:@typescript-eslint/recommended", - "plugin:import/errors", - "plugin:import/warnings", - "plugin:import/typescript", - "plugin:react/recommended", - "plugin:react-hooks/recommended" - ], - "env": { - "es6": true, - "node": true - }, - "settings": { - "react": { - "version": "detect" - }, - "import/resolver": { - "typescript": {} - } - }, - "rules": { - "@typescript-eslint/explicit-function-return-type": "off", - "@typescript-eslint/no-explicit-any": "off", - "@typescript-eslint/no-unused-vars": ["error", { "ignoreRestSiblings": true }], - "@typescript-eslint/no-use-before-define": "off", - "@typescript-eslint/explicit-function-return-type": "off", - "@typescript-eslint/explicit-module-boundary-types": "off", - "no-console": ["error", { "allow": ["warn", "error"] }], - "react/display-name": "off", - "react/prop-types": "off", - "react/react-in-jsx-scope": "off", - "newline-before-return": "error", - "sort-imports": [ - "error", - { - "ignoreCase": true, - "ignoreDeclarationSort": true - } - ], - "import/named": "off", - "import/no-named-as-default-member": "off", - "import/order": [ - "error", - { - "alphabetize": { - "order": "asc", - "caseInsensitive": true - }, - "newlines-between": "ignore", - "groups": [["builtin", "external"], "internal", "parent", "sibling", "index"] - } - ] - }, - "globals": { - "React": "writable" - }, - "ignorePatterns": ["scripts/*"] -} diff --git a/components/error.tsx b/components/error.tsx index e38986e2..fb5acf4f 100644 --- a/components/error.tsx +++ b/components/error.tsx @@ -2,22 +2,22 @@ import { H3, Panel } from '@bigcommerce/big-design'; import { ErrorMessageProps, ErrorProps } from '../types'; const ErrorContent = ({ message }: Pick) => ( - <> -

Failed to load

- {message} - -) + <> +

Failed to load

+ {message} + +); const ErrorMessage = ({ error, renderPanel = true }: ErrorMessageProps) => { - if (renderPanel) { - return ( - - - - ) - } + if (renderPanel) { + return ( + + + + ); + } - return + return ; }; export default ErrorMessage; diff --git a/components/form.tsx b/components/form.tsx index 1f494b2b..aa69e1b1 100644 --- a/components/form.tsx +++ b/components/form.tsx @@ -1,126 +1,131 @@ -import { Button, Checkbox, Flex, FormGroup, Input, Panel, Select, Form as StyledForm, Textarea } from '@bigcommerce/big-design'; +import { + Button, + Checkbox, + Flex, + FormGroup, + Input, + Panel, + Select, + Form as StyledForm, + Textarea, +} from '@bigcommerce/big-design'; import { ChangeEvent, FormEvent, useState } from 'react'; import { FormData, StringKeyValue } from '../types'; interface FormProps { - formData: FormData; - onCancel(): void; - onSubmit(form: FormData): void; + formData: FormData; + onCancel(): void; + onSubmit(form: FormData): void; } const FormErrors = { - name: 'Product name is required', - price: 'Default price is required', + name: 'Product name is required', + price: 'Default price is required', }; const Form = ({ formData, onCancel, onSubmit }: FormProps) => { - const { description, isVisible, name, price, type } = formData; - const [form, setForm] = useState({ description, isVisible, name, price, type }); - const [errors, setErrors] = useState({}); + const { description, isVisible, name, price, type } = formData; + const [form, setForm] = useState({ description, isVisible, name, price, type }); + const [errors, setErrors] = useState({}); - const handleChange = (event: ChangeEvent) => { - const { name: formName, value } = event.target || {}; - setForm(prevForm => ({ ...prevForm, [formName]: value })); + const handleChange = (event: ChangeEvent) => { + const { name: formName, value } = event.target || {}; + setForm((prevForm) => ({ ...prevForm, [formName]: value })); - // Add error if it exists in FormErrors and the input is empty, otherwise remove from errors - !value && FormErrors[formName] - ? setErrors(prevErrors => ({ ...prevErrors, [formName]: FormErrors[formName] })) - : setErrors(({ [formName]: removed, ...prevErrors }) => ({ ...prevErrors })); - }; + // Add error if it exists in FormErrors and the input is empty, otherwise remove from errors + !value && FormErrors[formName] + ? setErrors((prevErrors) => ({ ...prevErrors, [formName]: FormErrors[formName] })) + : setErrors(({ [formName]: removed, ...prevErrors }) => ({ ...prevErrors })); + }; - const handleSelectChange = (value: string) => { - setForm(prevForm => ({ ...prevForm, type: value })); - }; + const handleSelectChange = (value: string) => { + setForm((prevForm) => ({ ...prevForm, type: value })); + }; - const handleCheckboxChange = (event: ChangeEvent) => { - const { checked, name: formName } = event.target || {}; - setForm(prevForm => ({ ...prevForm, [formName]: checked })); - }; + const handleCheckboxChange = (event: ChangeEvent) => { + const { checked, name: formName } = event.target || {}; + setForm((prevForm) => ({ ...prevForm, [formName]: checked })); + }; - const handleSubmit = (event: FormEvent) => { - event.preventDefault(); + const handleSubmit = (event: FormEvent) => { + event.preventDefault(); - // If there are errors, do not submit the form - const hasErrors = Object.keys(errors).length > 0; - if (hasErrors) return; + // If there are errors, do not submit the form + const hasErrors = Object.keys(errors).length > 0; + if (hasErrors) return; - onSubmit(form); - }; + onSubmit(form); + }; - return ( - - - - - - - - - - - - - - - {/* Using description for demo purposes. Consider using a wysiwig instead (e.g. TinyMCE) */} -