From 04158302aca0bde8efeea6af0f8310b861f70279 Mon Sep 17 00:00:00 2001
From: brecert <me@bree.dev>
Date: Tue, 7 Sep 2021 10:57:40 -0400
Subject: [PATCH] Remove the ability to hide the channel sidebar on mobile

---
 src/pages/channels/Channel.tsx       |  4 ++++
 src/pages/channels/ChannelHeader.tsx | 10 ++++++----
 src/pages/home/Home.tsx              | 15 +++++++++++----
 3 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/src/pages/channels/Channel.tsx b/src/pages/channels/Channel.tsx
index fd7ab919..265fe824 100644
--- a/src/pages/channels/Channel.tsx
+++ b/src/pages/channels/Channel.tsx
@@ -89,6 +89,10 @@ const TextChannel = observer(({ channel }: { channel: ChannelI }) => {
                     }
                 }}
                 toggleChannelSidebar={() => {
+                    if (isTouchscreenDevice) {
+                        return
+                    }
+
                     setChannels(!showChannels);
 
                     if (showChannels) {
diff --git a/src/pages/channels/ChannelHeader.tsx b/src/pages/channels/ChannelHeader.tsx
index 7ed07340..84f188af 100644
--- a/src/pages/channels/ChannelHeader.tsx
+++ b/src/pages/channels/ChannelHeader.tsx
@@ -3,7 +3,7 @@ import { Notepad, Group } from "@styled-icons/boxicons-solid";
 import { observer } from "mobx-react-lite";
 import { Channel } from "revolt.js/dist/maps/Channels";
 import { User } from "revolt.js/dist/maps/Users";
-import styled from "styled-components";
+import styled, { css } from "styled-components";
 
 import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice";
 
@@ -69,9 +69,11 @@ const IconConainer = styled.div`
     cursor: pointer;
     color: var(--secondary-foreground);
 
-    &:hover {
-        color: var(--foreground);
-    }
+    ${!isTouchscreenDevice && css`
+        &:hover {
+            color: var(--foreground);
+        }
+    `}
 `
 
 export default observer(({ channel, toggleSidebar, toggleChannelSidebar }: ChannelHeaderProps) => {
diff --git a/src/pages/home/Home.tsx b/src/pages/home/Home.tsx
index bc961495..9d54c541 100644
--- a/src/pages/home/Home.tsx
+++ b/src/pages/home/Home.tsx
@@ -11,7 +11,8 @@ import Header from "../../components/ui/Header";
 import CategoryButton from "../../components/ui/fluent/CategoryButton";
 import { dispatch, getState } from "../../redux";
 import { useState } from "preact/hooks";
-import styled from "styled-components";
+import styled, { css } from "styled-components";
+import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice";
 
 const CHANNELS_SIDEBAR_KEY = "sidebar_channels";
 
@@ -19,9 +20,11 @@ const IconConainer = styled.div`
     cursor: pointer;
     color: var(--secondary-foreground);
 
-    &:hover {
-        color: var(--foreground);
-    }
+    ${!isTouchscreenDevice && css`
+        &:hover {
+            color: var(--foreground);
+        }
+    `}
 `
 
 export default function Home() {
@@ -30,6 +33,10 @@ export default function Home() {
     );
 
     const toggleChannelSidebar = () => {
+        if (isTouchscreenDevice) {
+            return
+        }
+
         setChannels(!showChannels);
 
         if (showChannels) {