kobotoolbox / kpi / 12055670534

82%

master: 76%

push

github

refactor(organizations): add of useSession hook TASK-1305  (#5303)

### 👀 Preview steps
No behavior will change with this implementation, but it can be tested
by using the new hook somewhere.
As a test I've modified `MyProjectRoute` to verify that
`currentLoggedAccount` was properly dispatching component re-render and
that using hooks methods are working properly as well:
```typescript
...
export default function MyProjectsRoute() {

  const [counter, setCounter] = React.useState(0);

  const {currentLoggedAccount, refreshAccount} = useSession();

  useEffect(() => {
    setCounter((prev) => prev + 1);
  }, [currentLoggedAccount]);

  return (
    <>
    <button onClick={refreshAccount}>Refresh {counter} - {currentLoggedAccount?.username}</button>
    <UniversalProjectsRoute
...
```
Result:

![KPI_5303](https://github.com/user-attachments/assets/be5f9c7f-ce37-459b-90a7-9848bb88db7d)

### 💭 Notes

- This PR adds the `useSession` hook, aimed to be used instead of the
current `sessionStore` class to access the session data and methods.
- The `useSession` hook returns the `currentLoggedAccount` user, which
is already filtered to be an existent account returned from the `/me`
endpoint and verified not to be an anonymous account, which is currently
done in several places around the codebase where the `currentAccount`
from `sessionStore` is used.
- The internal implementation of this hook will eventually migrate to
use `react-query`, keeping the hook's signature.
- This implementation can be used as a base for the migration of the
other existing stores to allow for future dropping of `mob-x` in favor
of using react-query to cache data.
- First usage of this hook can be seen in
https://github.com/kobotoolbox/kpi/pull/5290

5643 of 9109 branches covered (61.95%)

21606 of 26975 relevant lines covered (80.1%)

0.8 hits per line