diff --git a/package-lock.json b/package-lock.json index 788971421f..3ebc7e03d0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "@channel.io/design-system", - "version": "0.3.13", + "version": "0.3.14", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 181781fe30..d6cb5f6e3f 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@channel.io/design-system", - "version": "0.3.13", + "version": "0.3.14", "description": "Design System by Channel", "repository": { "type": "git", diff --git a/src/layout/Side/SideViewContent/SideViewContent.tsx b/src/layout/Side/SideViewContent/SideViewContent.tsx index e0e082653a..d240545dc7 100644 --- a/src/layout/Side/SideViewContent/SideViewContent.tsx +++ b/src/layout/Side/SideViewContent/SideViewContent.tsx @@ -1,12 +1,11 @@ /* External dependencies */ -import React, { useEffect } from 'react' +import React from 'react' import { noop } from 'lodash-es' /* Internal dependencies */ +import useLayoutState from '../../../hooks/useLayoutState' import LayoutSideType from '../../../types/LayoutSideType' import { SideArea } from '../SideArea' -import useLayoutDispatch from '../../../hooks/useLayoutDispatch' -import LayoutActions from '../../redux/LayoutActions' import SideViewContentProps from './SideViewContent.types' export const SIDE_VIEW_CONTENT_TEST_ID = 'ch-design-system-side-view-content' @@ -16,20 +15,11 @@ function SideViewContent({ children, onChangeSideWidth = noop, }: SideViewContentProps) { - const dispatch = useLayoutDispatch() + const { showSideView } = useLayoutState() - useEffect(() => { - dispatch(LayoutActions.setShowSide({ - showSideView: true, - })) - - return function cleanup() { - dispatch(LayoutActions.setShowSide({ - showSideView: false, - })) - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, []) + if (!showSideView) { + return null + } return ( -
SideView
+
{ state }
+ ) }