diff --git a/website-next/.eslintrc.cjs b/website-next/.eslintrc.cjs
new file mode 100644
index 0000000000..31364bf2da
--- /dev/null
+++ b/website-next/.eslintrc.cjs
@@ -0,0 +1,26 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ */
+
+module.exports = {
+ root: false,
+ extends: [
+ 'plugin:react/recommended',
+ 'plugin:react/jsx-runtime',
+ 'plugin:react-hooks/recommended',
+ ],
+ settings: {
+ react: {
+ version: 'detect',
+ },
+ },
+ rules: {
+ 'react/prop-types': 'off',
+ 'react/no-unstable-nested-components': 'error',
+ },
+};
diff --git a/website-next/package.json b/website-next/package.json
index 69fbfc00cd..c78e00354b 100644
--- a/website-next/package.json
+++ b/website-next/package.json
@@ -31,7 +31,9 @@
"devDependencies": {
"@docusaurus/module-type-aliases": "3.0.0",
"@docusaurus/tsconfig": "3.0.0",
- "@docusaurus/types": "3.0.0"
+ "@docusaurus/types": "3.0.0",
+ "eslint-plugin-react": "^7.33.2",
+ "eslint-plugin-react-hooks": "^4.6.0"
},
"browserslist": "> 0.5%, last 2 versions, Firefox ESR, not dead",
"engines": {
diff --git a/website-next/src/components/EditorToolbar.tsx b/website-next/src/components/EditorToolbar.tsx
index 3d2c7b7d64..946c191f85 100644
--- a/website-next/src/components/EditorToolbar.tsx
+++ b/website-next/src/components/EditorToolbar.tsx
@@ -17,29 +17,26 @@ import SuccessIcon from '@theme/Icon/Success';
import styles from './EditorToolbar.module.css';
export type Props = Readonly<{
- getCode: () => string;
+ code: string;
className?: string;
style?: React.CSSProperties;
}>;
export default function EditorToolbar({
- getCode,
+ code,
className,
style,
}: Props): JSX.Element {
- const handleCopy = useCallback(
- () => navigator.clipboard.writeText(getCode()),
- [],
- );
+ const handleCopy = useCallback(() => {
+ navigator.clipboard.writeText(code);
+ }, [code]);
- const handleShare = useCallback(
- () =>
- navigator.clipboard.writeText(
- window.location.origin +
- `/playground?code=${encodeURIComponent(btoa(getCode()))}`,
- ),
- [],
- );
+ const handleShare = useCallback(() => {
+ navigator.clipboard.writeText(
+ window.location.origin +
+ `/playground?code=${encodeURIComponent(btoa(code))}`,
+ );
+ }, [code]);
return (
@@ -71,7 +68,7 @@ function ToolbarButton({
copyTimeout.current = window.setTimeout(() => {
setIsSuccess(false);
}, 1000);
- }, []);
+ }, [onClick]);
return (