bamlab / bamlab/react-tv-space-navigation

`SpatialNavigationNode` isFocusable change is not working.

Open
#169 2 comments 1 reaction 0 assignees View on GitHub
Dominant language
TypeScript
Stars
319
Forks
46
PR merge metrics
No merged PRs in 30d

Description

**Describe the bug**
The SpatialNavigationNode component does not function correctly when the isFocusable prop is changed dynamically.

**To Reproduce**
```tsx
const [focusable, setFocusable] = useState(false);

return (

{() => }

);
```

**Expected behavior**
The component should be able to receive focus when isFocusable is set to true and should not receive focus when it is false.

**Screenshots**
If applicable, add screenshots to help explain your problem.

**Version and OS**
- Library version:4.0.1
- React Native version: react-native-web 0.19.13
- OS: web

**Additional context**
I found that adding isFocused as a dependency at this [line](https://github.com/bamlab/react-tv-space-navigation/blob/3c53f44f0b91e06146df0b7c3a9d46f945d8a86b/packages/lib/src/spatial-navigation/components/Node.tsx#L204) resolves the issue. However, I'm uncertain if this is an appropriate solution.

Contributor guide

No contributing guide indexed for this repository

Research direction

Start in packages/lib/src/spatial-navigation/components/Node.tsx around line 204, where the issue reports that adding isFocused as a dependency resolves the problem. Reproduce the dynamic isFocusable toggle from the report and inspect the surrounding focus logic. Done means the node receives focus when isFocusable becomes true and is excluded when it becomes false.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native, typescript
Domain
frontend, mobile-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.