Conditional Column Pinning

Illustrate implementing conditional pinning based on user input or specific conditions, using a toggle button to pin/unpin a column dynamically.
const [isPinned, setIsPinned] = React.useState(false);
Defines a state to track if a column is pinned or not. Initially, it is not pinned.
const togglePin = () => setIsPinned(!isPinned);
Function to toggle the pinning state of the column.
<button onClick={togglePin}>{isPinned ? 'Unpin Column' : 'Pin Column'}</button>
Render a button that when clicked, toggles the pin state of a column. The button's label changes based on the pin state.
const getColumnDefs = () => [
  { field: 'name', pinned: isPinned ? 'left' : null },
  { field: 'age' },
  { field: 'country' }
Function to define the column definitions. The 'name' column will be conditionally pinned to the left based on the isPinned state.