спасибо

А можешь описать, что значит "браузер запомнит переход"? Не хочу персональные данные оставлять там

можно будет нажать назад на кнопках браузера и вернуться к компоненту который появился после кнопки "далее"

Это апи по работе с навигационным стеком истории

Всем привет. Помогите разобраться почему неправильно работает код. Есть 2компоненты- хедер и мувлист(рендерит список фильмов с сервера). В хедере есть кнопка, при клике на которую меняется список фильмов, но мувлист не реагирует на изменения этого списка и не хочет перерендериваться.
Код хедера
export const NewHeader = () => {

   const [{movieList}, dispatch] = useReducer(reducer, {
       movieList: [],
   })

   const getFromButton = async () => {
       try {
           const requestMovies = await fetch(https://api.themoviedb.org/3/discover/movie?api_key=${apiKey}&language=en-US&sort_by=popularity.desc&include_adult=false&include_video=false&page=2);
           const jsonMovies = await requestMovies.json();
           const {results} = jsonMovies;
           console.log(results);

           dispatch({type: "BUTTON", payload: results});

       } catch (e) {
           console.log(e);
       }
   }
 
   return (
       <div className="header">
           <img src={Logo} className="header-logo" alt="logo"/>
           <div className="header-menu">{
               menu.map(value => {
                   return (
                       <div className="header-menu" key={value.url}>
                           <NavLink className="header-menu-link" to={value.url}>{value.name} </NavLink>
                       </div>
                   )
               })
           }
           </div>
               <div className="header-menu">
               <button onClick={getFromButton}>click</button>
               <span>Вхід</span>
               <span>/</span>
               <span>Регістарція</span>
           </div>
       </div>
   );
}
код мувлиста
export const NewMovielist = (props) => {

   const [{movieList}, dispatch] = useReducer(reducer, {
       movieList: [],
   })

   const getMovies = async () => {
       try {
           const requestMovies = await fetch(https://api.themoviedb.org/3/discover/movie?api_key=${apiKey}&language=en-US&sort_by=popularity.desc&include_adult=false&include_video=false&page=1);
           const jsonMovies = await requestMovies.json();
           const {results} = jsonMovies;
           console.log(results);
           dispatch({type: "GET_MOVIES", payload: results});

       } catch (e) {
           console.log(e);
       }
   }
   const render = () => {
       console.log(movieList);
       return (movieList.map(value => {
           return (
               <div key={value.id}>{value.title}</div>
           )
       }))
   }
   const getFromButton = async () => {
       try {
           const requestMovies = await fetch(https://api.themoviedb.org/3/discover/movie?api_key=${apiKey}&language=en-US&sort_by=popularity.desc&include_adult=false&include_video=false&page=2);
           const jsonMovies = await requestMovies.json();
           const {results} = jsonMovies;
           console.log(results);

           dispatch({type: "BUTTON", payload: results});

       } catch (e) {
           console.log(e);
       }
   }

   useEffect(() => {
       getMovies();
   }, []);

   useEffect(() => {
       render();
   }, [movieList]);


   return (
       
       <div>
           <div>{render()}</div>
           <button onClick={getFromButton}>click</button>
       </div>
   )

}
код редюсера
const initialState = {
   movieList: []
  };

export const reducer = (state=initialState, action) => {
   switch (action.type) {
       case 'GET_MOVIES':
           console.log(action.payload);
           return {...state, movieList: action.payload};

       case 'BUTTON':
           console.log(action.payload);
           return {...state, movieList: action.payload};
       default:
           return state;

   }
}

я бы посоветовал залить в codesandbox

в нем вообще не хочет работать... сейчас сохнаню как есть

Ладно уж все остальное. Но почему ты называешь компоненты со строчной буквы?

та то я на скорую руку набирал, у меня все в папках лежит, а сюда так быстро хотел вставить

Попереходил. Hash-router же

Ну и, собственно, url меняется. Как при работе с hash-router

я так понимаю что стейт мувлиста не привязан к  списку с редюсера хедера...

при этом если я нажму "назад" на стрелках браузера, он вернёт меня на первый скрин

Из-за api_key в ссылке у тебя ошибка была

ну в шторме у меня апи кей в константе лежит и я его экспортирую

не везде поменял, сейчас исправлю

Ну, я скопировал api_key из первой ссылки во вторую. Так должно быть?