Initial commit

hooks/useWebSocket.ts

@@ -0,0 +1,90 @@
+"use client"
+
+import { useEffect, useRef, useState } from "react"
+
+interface WebSocketMessage {
+  type: string
+  data?: any
+  timestamp?: string
+}
+
+export function useWebSocket(onMessage?: (message: WebSocketMessage) => void) {
+  const [isConnected, setIsConnected] = useState(false)
+  const [lastMessage, setLastMessage] = useState<WebSocketMessage | null>(null)
+  const ws = useRef<WebSocket | null>(null)
+  const reconnectTimeoutRef = useRef<NodeJS.Timeout>()
+  const reconnectAttempts = useRef(0)
+  const maxReconnectAttempts = 5
+
+  const connect = () => {
+    try {
+      // Use WSS for your HTTPS domain
+      const wsUrl = "wss://shelter.ruff.co.il/api/websocket"
+      ws.current = new WebSocket(wsUrl)
+
+      ws.current.onopen = () => {
+        console.log("WebSocket connected to shelter.ruff.co.il")
+        setIsConnected(true)
+        reconnectAttempts.current = 0
+
+        // Send ping to keep connection alive
+        const pingInterval = setInterval(() => {
+          if (ws.current?.readyState === WebSocket.OPEN) {
+            ws.current.send(JSON.stringify({ type: "ping" }))
+          } else {
+            clearInterval(pingInterval)
+          }
+        }, 30000)
+      }
+
+      ws.current.onmessage = (event) => {
+        try {
+          const message: WebSocketMessage = JSON.parse(event.data)
+          setLastMessage(message)
+          if (onMessage) {
+            onMessage(message)
+          }
+        } catch (err) {
+          console.error("Error parsing WebSocket message:", err)
+        }
+      }
+
+      ws.current.onclose = () => {
+        console.log("WebSocket disconnected")
+        setIsConnected(false)
+
+        // Attempt to reconnect
+        if (reconnectAttempts.current < maxReconnectAttempts) {
+          reconnectAttempts.current++
+          const delay = Math.min(1000 * Math.pow(2, reconnectAttempts.current), 30000)
+          console.log(`Attempting to reconnect in ${delay}ms (attempt ${reconnectAttempts.current})`)
+
+          reconnectTimeoutRef.current = setTimeout(() => {
+            connect()
+          }, delay)
+        }
+      }
+
+      ws.current.onerror = (error) => {
+        console.error("WebSocket error:", error)
+      }
+    } catch (err) {
+      console.error("Error creating WebSocket connection:", err)
+    }
+  }
+
+  useEffect(() => {
+    connect()
+
+    return () => {
+      if (reconnectTimeoutRef.current) {
+        clearTimeout(reconnectTimeoutRef.current)
+      }
+      if (ws.current) {
+        ws.current.close()
+      }
+    }
+  }, [])
+
+  return { isConnected, lastMessage }
+}