import { Meta } from '@storybook/addon-docs/blocks'

<Meta title="pv-grid/Hooks/useGridEditor" />

# useGridEditor

If you need to know the `editable` state of the current cell in a custom hybrid editor, you will need to use this hook to give you that information.

```tsx
import { useGridEditor } from '@planview/pv-grid'
```

### Definition

```tsx
function useGridEditor(): {
    editable: boolean
}
```

### Usage

In the example below the `inStock` column is meant to display a custom-made binary component that will be disabled for users that are not admins. Only showing the status but not allowing the user to change it.

The `editable` attribute passed back from the hook inside the `Editor` component will be the result of the function in the `editable` attribute in the column definition.

_Note: When `editable` is false, the `Editor` will only be rendered if the `hybridEditor` is set to `"always"`. Otherwise the `Editor` will be bypassed and the `Renderer` will be used._

```tsx
type Book = {
    id: string
    name: string
    inStock: boolean
}

const column: Column<Book> = {
    id: 'inStock',
    label: 'In stock',
    cell: {
        editable: () => userIsAdmin(),
        hybridEditor: 'always',
        Editor(props){
            const { editable } = useGridEditor()
            return <MyCustomBinaryControl {...props} disabled={!editable}>
        },
    },
}



```