From 23d29ac2ae89e2af5d84f1e1d9152e32d006e46e Mon Sep 17 00:00:00 2001
From: Gabe Kangas <gabek@real-ity.com>
Date: Sat, 6 May 2023 20:36:13 -0700
Subject: [PATCH] fix(ui): use showChat selector for dynamicPadding logic

---
 web/components/layouts/Main/Main.tsx  | 5 ++++-
 web/components/ui/Content/Content.tsx | 2 +-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/web/components/layouts/Main/Main.tsx b/web/components/layouts/Main/Main.tsx
index 734f7d0ad..938e40853 100644
--- a/web/components/layouts/Main/Main.tsx
+++ b/web/components/layouts/Main/Main.tsx
@@ -17,6 +17,7 @@ import {
   appStateAtom,
   serverStatusState,
   isMobileAtom,
+  isChatVisibleSelector,
 } from '../../stores/ClientConfigStore';
 import { Content } from '../../ui/Content/Content';
 import { Header } from '../../ui/Header/Header';
@@ -52,6 +53,7 @@ export const Main: FC = () => {
   const fatalError = useRecoilValue<DisplayableError>(fatalErrorStateAtom);
   const appState = useRecoilValue<AppStateOptions>(appStateAtom);
   const isMobile = useRecoilValue<boolean | undefined>(isMobileAtom);
+  const isChatVisible = useRecoilValue<boolean>(isChatVisibleSelector);
 
   const layoutRef = useRef<HTMLDivElement>(null);
   const { chatDisabled } = clientConfig;
@@ -59,7 +61,8 @@ export const Main: FC = () => {
   const { online, streamTitle, versionNumber: version } = clientStatus;
 
   // accounts for sidebar width when online in desktop
-  const dynamicPadding = online && !chatDisabled && !isMobile ? '320px' : '0px';
+  const showChat = online && !chatDisabled && isChatVisible;
+  const dynamicPadding = showChat && !isMobile ? '320px' : '0px';
 
   useEffect(() => {
     setupNoLinkReferrer(layoutRef.current);
diff --git a/web/components/ui/Content/Content.tsx b/web/components/ui/Content/Content.tsx
index 71508f927..585e09189 100644
--- a/web/components/ui/Content/Content.tsx
+++ b/web/components/ui/Content/Content.tsx
@@ -181,7 +181,7 @@ export const Content: FC = () => {
   const showChat = online && !chatDisabled && isChatVisible;
 
   // accounts for sidebar width when online in desktop
-  const dynamicPadding = online && !chatDisabled && !isMobile ? '320px' : '0px';
+  const dynamicPadding = showChat && !isMobile ? '320px' : '0px';
 
   return (
     <>