Infragistics provides a "Theme Manager" for React Grid, which allows you to easily switch between various built-in themes or create your own custom theme. Here's an example of how to use the Theme Manager to switch between the "light" and "dark" themes for the React Grid:

First, you need to install the Infragistics React Controls package:

npm install igniteui-react-core igniteui-react-grids

Then, in your React component, import the necessary modules:

import { ThemeManager, Theme } from "igniteui-react-core";
import { IgrGrid } from "igniteui-react-grids";

To switch between the "light" and "dark" themes, you can use the setTheme method of the ThemeManager. Here's an example of how to toggle between the two themes:

// Define the light and dark themes
const lightTheme = Theme.createEmpty();
const darkTheme = Theme.createEmpty();
darkTheme.fillColors = ["#1e1e1e"];
darkTheme.accentColor = "#fff";

// Initialize the grid and set the initial theme
const gridRef = React.useRef(null);
React.useEffect(() => {
  ThemeManager.setTheme(lightTheme);
}, []);

// Toggle between the light and dark themes
const toggleTheme = () => {
  const currentTheme = ThemeManager.theme;
  if (currentTheme === lightTheme) {
    ThemeManager.setTheme(darkTheme);
  } else {
    ThemeManager.setTheme(lightTheme);
  }
};

// Render the grid and a button to toggle the theme
return (
  <>
    
    Toggle Theme
  
);

This example initializes the React Grid with the "light" theme and sets up a button to toggle between the "light" and "dark" themes. When the button is clicked, the toggleTheme function switches between the two themes using the setTheme method of the ThemeManager.

Note that you can customize the built-in themes or create your own custom theme by modifying the various properties of the Theme object. You can find more information about the ThemeManager and Theme objects in the Infragistics documentation.