src/hooks/useNavigate.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

import React, { useState, useContext, createContext } from 'react';

export interface Page {
  prefix: string;
  id?: string;
}

interface ContextType {
  page: Page;
  setPage: (page: Page) => void;
  navigate: (prefix: string, id?: string) => void;
}

const landingPage = { prefix: 'feed' };

const context = createContext<ContextType>({
  page: landingPage,
  setPage: () => {},
  navigate: () => {}
});

const useProvideNavigation = () => {
  const [page, setPage] = useState<Page>(landingPage);

  const navigate: ContextType['navigate'] = (prefix, id?) => {
    setPage({ prefix, id });
  };

  return { page, setPage, navigate };
};

export const NavigationProvider: React.FC = ({ children }) => {
  const navigation = useProvideNavigation();
  const { Provider } = context;
  return <Provider value={navigation}>{children}</Provider>;
};

export const useNavigate = (): ContextType => {
  return useContext(context);
};