fix: move project and story dispatch to navbar

client/components/projects/nav-bar.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import styled from 'styled-components';
 
@@ -9,6 +9,9 @@ import { colors, fonts, fontSizes, spacing } from '~lib/theme';
 import { toggleStoryList } from '~redux/actions/toggle-story-list';
 import { ReduxState } from '~redux/reducers';
 
+import { setProject } from '~redux/actions/project';
+import { setStory } from '~redux/actions/story';
+
 const Header = styled.div`
   display: flex;
   justify-content: space-between;
@@ -71,6 +74,11 @@ const NavBar = ({ projects, stories }: Props) => {
     dispatch(toggleStoryList());
   };
 
+  useEffect(() => {
+    dispatch(setProject(projects[0]));
+    dispatch(setStory(projects[0].stories[0], 1));
+  }, []);
+
   return (
     <>
       <Header>

client/components/projects/projects-dropdown.tsx

@@ -1,12 +1,11 @@
-import React, { useEffect, useState } from 'react';
-import { useDispatch, useSelector } from 'react-redux';
+import React, { useState } from 'react';
+import { useDispatch } from 'react-redux';
 import styled from 'styled-components';
 
 import * as Types from '~components/projects/types';
 import { colors, fonts, fontSizes } from '~lib/theme';
 import { setProject } from '~redux/actions/project';
 import { setStory } from '~redux/actions/story';
-import { ReduxState } from '~redux/reducers';
 
 import DropDown from '~assets/images/drop-down.svg';
 
@@ -98,11 +97,6 @@ const ProjectsDropdown = ({ projects }: Props) => {
     setProjectName(newProject.name);
   };
 
-  useEffect(() => {
-    dispatch(setProject(projects[0]));
-    dispatch(setStory(projects[0].stories[0], 1));
-  }, []);
-
   return (
     <>
       <ProjectButton onClick={() => toggleVisibility(!isVisible)}>