> ## Content Index
> Fetch the complete content index at: https://www.bramadams.dev/llms.txt
> Use this file to discover other available public pages before exploring further.

# Fast Travel YCB Graphs
- URL: https://www.bramadams.dev/fast-travel-ycb-graphs/
- Published: 2025-01-13T05:53:02.000Z
- Updated: 2025-01-13T05:53:02.000Z
- Description: 1,2,3 ... 2,2,3...
- Author: Bram Adams
- Tags: ycb

0:00 

/0:06 

1× 

Moving around a graph with arrow keys feels really good (or swiping on mobile). The user experience matters most to human psychology, even if just perceived. 

```javascript
// Arrow-key navigation: left/right to move through nodes if hovered
  useEffect(() => {
    function handleKeyDown(event: KeyboardEvent) {
      if (!hovered || graphNodes.length === 0) return;

      if (event.key === 'ArrowRight') {
        setCurrentIndex((prevIndex) => {
          if (prevIndex === null) return 0;
          return (prevIndex + 1) % graphNodes.length;
        });
      } else if (event.key === 'ArrowLeft') {
        setCurrentIndex((prevIndex) => {
          if (prevIndex === null) return graphNodes.length - 1;
          return (prevIndex - 1 + graphNodes.length) % graphNodes.length;
        });
      }
    }

    window.addEventListener('keydown', handleKeyDown);
    return () => {
      window.removeEventListener('keydown', handleKeyDown);
    };
  }, [hovered, graphNodes]);
```