group chat init

src/views/home/group/chat/Chat.tsx

@@ -1,17 +1,37 @@
-import { useEffect } from 'react';
+import { FC, useEffect } from 'react';
 import { useAppDispatch } from '../../../../redux/hooks';
 import { setMenuActiveGroupPage } from '../../../../redux/slices/store';
+import { SearchInput } from '../../../../components/input/SearchInput';
 
-export const Chat = () => {
+interface GroupChatProps {
+    groupId: number;
+}
+
+export const Chat: FC<GroupChatProps> = ({ groupId }) => {
     const dispatch = useAppDispatch();
 
     useEffect(() => {
         dispatch(setMenuActiveGroupPage('chat'));
     }, []);
     return (
-        <div className="h-full overflow-y-scroll thin-dark-scrollbar flex items-center justify-center font-bold text-liquid-white text-[50px]">
-            {' '}
-            Пока пусто :(
+        <div className="h-full relative">
+            <div className="grid grid-rows-[40px,1fr,50px] h-full relative min-h-0 gap-[20px]">
+                <div className="relative">
+                    <SearchInput
+                        className="w-[216px]"
+                        onChange={() => {}}
+                        placeholder="Поиск сообщений"
+                    />
+                </div>
+
+                <div className="min-h-0 overflow-y-scroll thin-dark-scrollbar">
+                    <div className="flex flex-col gap-[20px] min-h-0 h-0">
+                        {/* сообщения */}
+                    </div>
+                </div>
+
+                <div className=" bg-red-300">footer / input bar</div>
+            </div>
         </div>
     );
 };