fix empty list not rendering when no active channel

src/components/ChannelList/ChannelList.tsx

@@ -10,14 +10,10 @@ const Container = styled.div`
 	flex: 1;
 `;
 
-export function EmptyChannelList() {
-	return <Container></Container>;
-}
-
 function ChannelList() {
 	const app = useAppStore();
 
-	if (!app.activeGuild || !app.activeChannel) return null;
+	if (!app.activeGuild || !app.activeChannel) return <Container />;
 	const { channels } = app.activeGuild;
 
 	const rowRenderer = ({ index, key, style }: ListRowProps) => {

src/components/ChannelSidebar.tsx

@@ -1,8 +1,7 @@
 import { observer } from "mobx-react-lite";
 import styled from "styled-components";
-import { useAppStore } from "../stores/AppStore";
 import ChannelHeader from "./ChannelHeader";
-import ChannelList, { EmptyChannelList } from "./ChannelList/ChannelList";
+import ChannelList from "./ChannelList/ChannelList";
 import Container from "./Container";
 import UserPanel from "./UserPanel";
 
@@ -18,13 +17,11 @@ const Wrapper = styled(Container)`
 `;
 
 function ChannelSidebar() {
-	const app = useAppStore();
-
 	return (
 		<Wrapper>
 			{/* TODO: replace with dm search if no guild */}
 			<ChannelHeader />
-			{app.activeGuild ? <ChannelList /> : <EmptyChannelList />}
+			<ChannelList />
 			<UserPanel />
 		</Wrapper>
 	);