fix: types and linting errors

Author: martinbuchta

app/messaging/[roomId]/page.tsx

@@ -1,12 +1,11 @@
 import { CreateMessage } from "@/app/messaging/components/CreateMessage"
 import { MessagesList } from "@/app/messaging/components/MessagesList"
 
-import { getMessages, getRoom, getRooms } from "@/modules/messaging"
+import { getMessages, getRoom } from "@/modules/messaging"
 
 export default async function Page({ params }: { params: { roomId: string } }) {
   const roomId = parseInt(params.roomId)
   const messages = await getMessages({ roomId })
-  console.log(messages)
 
   const room = await getRoom({ id: roomId })
   return (

app/messaging/components/CreateRoomSheet.tsx

@@ -42,7 +42,7 @@ export default function CreateRoomSheet({
   rooms: Room[]
 }) {
   const [open, setOpen] = React.useState(false)
-  const [value, setValue] = React.useState("")
+  const [value] = React.useState("")
   const [selectedUsers, setSelectedUsers] = useState<User[]>([])
   const [roomName, setRoomName] = useState("")
 

app/messaging/components/MessagesList.tsx

@@ -25,12 +25,6 @@ export const MessagesList: React.FC<{
 
   useEffect(() => {
     if (scrollRef.current) {
-      console.log(
-        "message created",
-        scrollRef.current.scrollTop,
-        scrollRef.current.scrollHeight
-      )
-
       scrollRef.current.scrollTop = scrollRef.current.scrollHeight + 200
     }
   }, [messages.at(-1)?.id])
@@ -57,6 +51,7 @@ export const MessagesList: React.FC<{
             user_id: string
           }) => (
             <MessagePanel
+              key={id}
               newMessages={newMessages}
               id={id}
               user_id={user_id}

components/ui/command.tsx

@@ -41,7 +41,7 @@ const CommandInput = React.forwardRef<
   React.ElementRef<typeof CommandPrimitive.Input>,
   React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>
 >(({ className, ...props }, ref) => (
-  <div className="flex items-center border-b px-3" cmdk-input-wrapper="">
+  <div className="flex items-center border-b px-3">
     <MagnifyingGlassIcon className="mr-2 h-4 w-4 shrink-0 opacity-50" />
     <CommandPrimitive.Input
       ref={ref}

modules/messaging/hooks/useMessages.ts

@@ -72,7 +72,11 @@ export const useMessages = ({
         .then(({ data: messagesOlder }) => {
           console.log(messagesOlder)
 
-          setMessages((messages) => [...messagesOlder, ...messages])
+          if (messagesOlder) {
+            setMessages((messages) => [...messagesOlder, ...messages])
+          } else {
+            setMessages(messages)
+          }
         })
     },
     [messages, setMessages, roomId]

modules/messaging/hooks/useRooms.ts

@@ -135,10 +135,12 @@ export const useRooms = ({
         )
         .eq("room_id", roomId)
 
-      return participants.data?.map((data) => ({
-        id: data.id,
-        username: data.profiles.at(0)?.username ?? "",
-      }))
+      return (
+        participants.data?.map((data) => ({
+          id: data.id,
+          username: data.profiles.at(0)?.username ?? "",
+        })) || null
+      )
     },
     []
   )