Fix loading messages (#97)

packages/react-chat/src/components/Chat.tsx

@@ -129,7 +129,7 @@ export function Chat({
         showMembers={showMembers}
         community={communityData}
         showCommunity={!showChannels}
-        loadPrevDay={() => loadPrevDay(activeChannel.name)}
+        loadPrevDay={() => loadPrevDay(activeChannel.id)}
         onCommunityClick={showModal}
         fetchMetadata={fetchMetadata}
         loadingMessages={loadingMessages}

packages/react-chat/src/components/Chat/ChatMessages.tsx

@@ -3,6 +3,7 @@ import styled from "styled-components";
 
 import { ChatMessage } from "../../models/ChatMessage";
 import { Metadata } from "../../models/Metadata";
+import { equalDate } from "../../utils";
 import { LoadingIcon } from "../Icons/LoadingIcon";
 import { UserIcon } from "../Icons/UserIcon";
 import { LinkModal } from "../Modals/LinkModal";
@@ -26,7 +27,7 @@ export function ChatMessages({
 }: ChatMessagesProps) {
   const [scrollOnBot, setScrollOnBot] = useState(true);
   const ref = useRef<HTMLHeadingElement>(null);
-  const today = useMemo(() => new Date().getDay(), []);
+  const today = useMemo(() => new Date(), []);
   useEffect(() => {
     if (ref && ref.current && scrollOnBot) {
       ref.current.scrollTop = ref.current.scrollHeight;
@@ -38,6 +39,7 @@ export function ChatMessages({
       if (
         (ref?.current?.clientHeight ?? 0) >= (ref?.current?.scrollHeight ?? 0)
       ) {
+        setScrollOnBot(true);
         loadPrevDay();
       }
     }
@@ -84,10 +86,9 @@ export function ChatMessages({
         return (
           <MessageOuterWrapper key={message.date.getTime()}>
             {(idx === 0 ||
-              messages[idx - 1].date.getDay() !=
-                messages[idx].date.getDay()) && (
+              !equalDate(messages[idx - 1].date, message.date)) && (
               <DateSeparator>
-                {message.date.getDay() === today
+                {equalDate(message.date, today)
                   ? "Today"
                   : message.date.toLocaleDateString()}
               </DateSeparator>

packages/react-chat/src/utils/equalDate.ts

@@ -0,0 +1,7 @@
+export function equalDate(a: Date, b: Date) {
+  return (
+    a.getDate() === b.getDate() &&
+    a.getMonth() === b.getMonth() &&
+    a.getFullYear() === b.getFullYear()
+  );
+}

packages/react-chat/src/utils/index.ts

@@ -9,3 +9,4 @@ export {
 } from "./identityStorage";
 export { reduceString } from "./reduceString";
 export { uintToImgUrl } from "./uintToImgUrl";
+export { equalDate } from "./equalDate";