# notes

Source: https://developers.inkdrop.app/states/notes

An [app state](https://developers.inkdrop.app/guides/flux-architecture) of notes currently loaded for the note list bar.
You can obtain the `notes` state and integrate it with React components.

---

## Data Structure

- **items** (Note\[])

  An array of [Note](https://developers.inkdrop.app/data-access/notes)s.
- **hashedItems** ({ \[noteId]: Note })

  A map where keys are noteIds and values are [Note](https://developers.inkdrop.app/data-access/notes)s.
- **lastQuery** (NoteQuery | undefined)

  The last note query to show the list of notes.
- **cursor** (NoteQueryCursor | null)

  The current cursor to list the notes.
- **totalRows** (number)

  Number of items.
- **timestamp** (number)

  Last datetime when the state was changed.
- **viewOptions** (NotesViewOptions | undefined)

  The note list view options.
- **loading** (boolean)

  `true` while notes are being loaded.

Get the `notes` state manually:

```js
const { notes } = env.store.getState()
```

Connect the state with your React component:

```js
import { useSelector } from 'react-redux'
const selector = ({ notes }) => notes
const MyComponent = props => {
  const notes = useSelector(selector)
  // render
}
```
