MM-62104 Fix board disappearing or move to default category when swit…

…ching teams (#44)

* MM-62104 Fix board disappearing or move to default category when switching teams

* fix tests

webapp/src/components/sidebar/sidebar.test.tsx

@@ -7,13 +7,14 @@ import {createMemoryHistory} from 'history'
 import {Provider as ReduxProvider} from 'react-redux'
 import {Router} from 'react-router-dom'
 
-import {render} from '@testing-library/react'
-import userEvent from '@testing-library/user-event'
+import {render, waitFor} from '@testing-library/react'
 
 import thunk from 'redux-thunk'
 
 import {mocked} from 'jest-mock'
 
+import userEvent from '@testing-library/user-event'
+
 import {mockMatchMedia, wrapIntl} from '../../testUtils'
 
 import {TestBlockFactory} from '../../test/testBlockFactory'
@@ -306,7 +307,7 @@ describe('components/sidebarSidebar', () => {
         expect(sidebarCollapsedCategory.length).toBe(1)
     })
 
-    test('should assign default category if current board doesnt have a category', () => {
+    test('should assign default category if current board doesnt have a category', async () => {
         const board2 = TestBlockFactory.createBoard()
         board2.id = 'board2'
 
@@ -362,7 +363,9 @@ describe('components/sidebarSidebar', () => {
         const {container} = render(component)
         expect(container).toMatchSnapshot()
 
-        expect(mockedOctoClient.moveBoardToCategory).toBeCalledWith('team-id', 'board2', 'default_category', '')
+        await waitFor(() => 
+            expect(mockedOctoClient.moveBoardToCategory).toBeCalledWith('team-id', 'board2', 'default_category', '')
+        )
     })
 
     test('shouldnt do any category assignment is board is in a category', () => {

webapp/src/components/sidebar/sidebar.tsx

@@ -75,6 +75,7 @@ const Sidebar = (props: Props) => {
     const me = useAppSelector<IUser|null>(getMe)
     const activeViewID = useAppSelector(getCurrentViewId)
     const currentBoard = useAppSelector(getCurrentBoard)
+    const [initialized, setInitialized] = useState(false)
 
     useEffect(() => {
         const categoryOnChangeHandler = (_: WSClient, categories: Category[]) => {
@@ -98,11 +99,14 @@ const Sidebar = (props: Props) => {
     const team = useAppSelector(getCurrentTeam)
 
     useEffect(() => {
+        setInitialized(false)
         if (team) {
-            dispatch(fetchSidebarCategories(team!.id))
+            dispatch(fetchSidebarCategories(team!.id)).then(() => {
+                setInitialized(true)
+            })
         }
         loadTheme()
-    }, [team?.id])
+    }, [team?.id, dispatch])
 
     useEffect(() => {
         function handleResize() {
@@ -125,7 +129,7 @@ const Sidebar = (props: Props) => {
     // because there is no good, explicit API call to add this logic to when opening
     // a board that you have implicit access to.
     useEffect(() => {
-        if (!sidebarCategories || sidebarCategories.length === 0 || !currentBoard || !team || currentBoard.isTemplate) {
+        if (!initialized || !sidebarCategories || sidebarCategories.length === 0 || !currentBoard || !team || currentBoard.isTemplate) {
             return
         }
 
@@ -147,7 +151,7 @@ const Sidebar = (props: Props) => {
         }
 
         octoClient.moveBoardToCategory(team.id, currentBoard.id, boardsCategory.id, '')
-    }, [sidebarCategories, currentBoard, team])
+    }, [sidebarCategories, currentBoard, team, initialized])
 
     useWebsockets(teamId, (websocketClient: WSClient) => {
         const onCategoryReorderHandler = (_: WSClient, newCategoryOrder: string[]): void => {