Merge pull request #3225 from tloncorp/lb/fix-input-padding

chat: fix missing message input on mobile
tloncorp · Feb 9, 2024 · 5402cbe · 5402cbe
2 parents de0c2ee + 5e1d2ae
commit 5402cbe
Show file tree

Hide file tree

Showing 6 changed files with 6 additions and 10 deletions.
diff --git a/ui/src/chat/ChatChannel.tsx b/ui/src/chat/ChatChannel.tsx
@@ -9,7 +9,6 @@ import Layout from '@/components/Layout/Layout';
 import { ViewProps } from '@/types/groups';
 import { useRouteGroup } from '@/state/groups/groups';
 import ChannelHeader from '@/channels/ChannelHeader';
-import { isGroups } from '@/logic/utils';
 import MagnifyingGlassIcon from '@/components/icons/MagnifyingGlassIcon';
 import useMedia, { useIsMobile } from '@/logic/useMedia';
 import ChannelTitleButton from '@/channels/ChannelTitleButton';
@@ -65,7 +64,7 @@ function ChatChannel({ title }: ViewProps) {
   // We only inset the bottom for groups, since DMs display the navbar
   // underneath this view
   const shouldApplyPaddingBottom = useMemo(
-    () => isGroups && isMobile && !isChatInputFocused,
+    () => isMobile && !isChatInputFocused,
     [isMobile, isChatInputFocused]
   );
 

diff --git a/ui/src/chat/ChatThread/ChatThread.tsx b/ui/src/chat/ChatThread/ChatThread.tsx
@@ -14,7 +14,6 @@ import {
 import ChatInput from '@/chat/ChatInput/ChatInput';
 import BranchIcon from '@/components/icons/BranchIcon';
 import X16Icon from '@/components/icons/X16Icon';
-import { isGroups } from '@/logic/utils';
 import useLeap from '@/components/Leap/useLeap';
 import useMedia, { useIsMobile } from '@/logic/useMedia';
 import keyMap from '@/keyMap';
@@ -104,7 +103,7 @@ export default function ChatThread() {
     perms.writers.length === 0 ||
     _.intersection(perms.writers, vessel.sects).length !== 0;
   const { compatible, text } = useChannelCompatibility(`chat/${flag}`);
-  const shouldApplyPaddingBottom = isGroups && isMobile && !isChatInputFocused;
+  const shouldApplyPaddingBottom = isMobile && !isChatInputFocused;
   const readTimeout = useChatInfo(flag).unread?.readTimeout;
   const isSmall = useMedia('(max-width: 1023px)');
   const clearOnNavRef = useRef({ isSmall, readTimeout, nest, flag, markRead });

diff --git a/ui/src/dms/Dm.tsx b/ui/src/dms/Dm.tsx
@@ -32,7 +32,7 @@ import MagnifyingGlassMobileNavIcon from '@/components/icons/MagnifyingGlassMobi
 import DmWindow from '@/dms/DmWindow';
 import { useIsScrolling } from '@/logic/scroll';
 import { useChatInputFocus } from '@/logic/ChatInputFocusContext';
-import { dmListPath, isGroups } from '@/logic/utils';
+import { dmListPath } from '@/logic/utils';
 import { useNegotiate } from '@/state/negotiation';
 import MessageSelector from './MessageSelector';
 import DmSearch from './DmSearch';
@@ -118,7 +118,7 @@ export default function Dm() {
   const isScrolling = useIsScrolling(scrollElementRef);
   const canStart = ship && !!unread;
   const root = `/dm/${ship}`;
-  const shouldApplyPaddingBottom = isGroups && isMobile && !isChatInputFocused;
+  const shouldApplyPaddingBottom = isMobile && !isChatInputFocused;
   const { matchedOrPending, isLoading: negotiationLoading } = useNegotiate(
     ship,
     'chat',

diff --git a/ui/src/dms/MultiDm.tsx b/ui/src/dms/MultiDm.tsx
@@ -13,7 +13,7 @@ import ChatInput from '@/chat/ChatInput/ChatInput';
 import Layout from '@/components/Layout/Layout';
 import { useMultiDm, useMultiDmIsPending, useSendMessage } from '@/state/chat';
 import { useIsMobile } from '@/logic/useMedia';
-import { dmListPath, isGroups, pluralize } from '@/logic/utils';
+import { dmListPath, pluralize } from '@/logic/utils';
 import useMessageSelector from '@/logic/useMessageSelector';
 import ReconnectingSpinner from '@/components/ReconnectingSpinner';
 import { Club } from '@/types/dms';
@@ -83,7 +83,7 @@ export default function MultiDm() {
   const root = `/dm/${clubId}`;
   const scrollElementRef = useRef<HTMLDivElement>(null);
   const isScrolling = useIsScrolling(scrollElementRef);
-  const shouldApplyPaddingBottom = isGroups && isMobile && !isChatInputFocused;
+  const shouldApplyPaddingBottom = isMobile && !isChatInputFocused;
   const dmParticipants = [...(club?.team ?? []), ...(club?.hive ?? [])];
   const { match: negotiationMatch, isLoading: negotiationLoading } =
     useNegotiateMulti(dmParticipants, 'chat', 'chat');

diff --git a/ui/src/env.d.ts b/ui/src/env.d.ts
@@ -2,7 +2,6 @@ interface ImportMetaEnv
   extends Readonly<Record<string, string | boolean | undefined>> {
   readonly VITE_LAST_WIPE: string;
   readonly VITE_STORAGE_VERSION: string;
-  readonly VITE_APP: 'groups' | 'chat';
   readonly VITE_ENABLE_WDYR: 'true' | 'false' | undefined;
   readonly VITE_POSTHOG_KEY: string;
   readonly VITE_BRANCH_KEY: string;

diff --git a/ui/src/logic/utils.ts b/ui/src/logic/utils.ts
@@ -47,7 +47,6 @@ import type {
   ConnectionStatus,
 } from '../state/vitals';
 
-export const isGroups = import.meta.env.VITE_APP === 'groups';
 export const isStagingHosted =
   import.meta.env.DEV ||
   (import.meta.env.VITE_SHIP_URL || '').endsWith('.test.tlon.systems') ||