no-hydrate

react-dom/no-hydrate

@eslint-react/dom-no-hydrate

// Problem: ReactDOM.hydrate() is deprecated.
import Component from "Component";
import ReactDOM from "react-dom";

ReactDOM.hydrate(<Component />, document.getElementById("app"));

// Recommended: use hydrateRoot() for better error handling and concurrent features.
import Component from "Component";
import ReactDOM from "react-dom";
import { hydrateRoot } from "react-dom/client";

hydrateRoot(document.getElementById("app"), <Component />);

// Problem: hydrate() from react-dom is deprecated.
import { hydrate } from 'react-dom';

const container = document.getElementById('app');
hydrate(<App tab="home" />, container);

// Recommended: use hydrateRoot() from react-dom/client.
import { hydrateRoot } from 'react-dom/client';

const container = document.getElementById('app');
const root = hydrateRoot(container, <App tab="home" />);

// Recommended: Verify the DOM node exists before hydrating
import { hydrateRoot } from "react-dom/client";
import App from "./App";

const domNode = document.getElementById("root");
if (domNode) {
  hydrateRoot(domNode, <App />);
} else {
  console.error("Hydration target not found");
}