diff --git a/surfsense_web/components/chat-comments/comment-item/comment-actions.tsx b/surfsense_web/components/chat-comments/comment-item/comment-actions.tsx index 5c0e27779..564a6ba84 100644 --- a/surfsense_web/components/chat-comments/comment-item/comment-actions.tsx +++ b/surfsense_web/components/chat-comments/comment-item/comment-actions.tsx @@ -1,6 +1,6 @@ "use client"; -import { MoreHorizontal, Pencil, Trash2 } from "lucide-react"; +import { MoreHorizontal, PenLine, Trash2 } from "lucide-react"; import { Button } from "@/components/ui/button"; import { DropdownMenu, @@ -29,7 +29,7 @@ export function CommentActions({ canEdit, canDelete, onEdit, onDelete }: Comment {canEdit && ( - + Edit )} diff --git a/surfsense_web/components/documents/DocumentNode.tsx b/surfsense_web/components/documents/DocumentNode.tsx index 92a211277..fe796b5be 100644 --- a/surfsense_web/components/documents/DocumentNode.tsx +++ b/surfsense_web/components/documents/DocumentNode.tsx @@ -12,7 +12,6 @@ import { Trash2, } from "lucide-react"; import React, { useCallback, useRef, useState } from "react"; -import { useIsMobile } from "@/hooks/use-mobile"; import { useDrag } from "react-dnd"; import { getDocumentTypeIcon } from "@/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentTypeIcon"; import { ExportContextItems, ExportDropdownItems } from "@/components/shared/ExportMenuItems"; @@ -110,7 +109,6 @@ export const DocumentNode = React.memo(function DocumentNode({ const [titleTooltipOpen, setTitleTooltipOpen] = useState(false); const rowRef = useRef(null); const titleRef = useRef(null); - const isMobile = useIsMobile(); const handleExport = useCallback( (format: string) => { @@ -122,17 +120,13 @@ export const DocumentNode = React.memo(function DocumentNode({ [doc, onExport] ); - const handleTitleTooltipOpenChange = useCallback( - (open: boolean) => { - if (isMobile) return; - if (open && titleRef.current) { - setTitleTooltipOpen(titleRef.current.scrollWidth > titleRef.current.clientWidth); - } else { - setTitleTooltipOpen(false); - } - }, - [isMobile] - ); + const handleTitleTooltipOpenChange = useCallback((open: boolean) => { + if (open && titleRef.current) { + setTitleTooltipOpen(titleRef.current.scrollWidth > titleRef.current.clientWidth); + } else { + setTitleTooltipOpen(false); + } + }, []); const attachRef = useCallback( (node: HTMLDivElement | null) => { diff --git a/surfsense_web/components/layout/ui/sidebar/AllPrivateChatsSidebar.tsx b/surfsense_web/components/layout/ui/sidebar/AllPrivateChatsSidebar.tsx index 57c011f01..46b03a172 100644 --- a/surfsense_web/components/layout/ui/sidebar/AllPrivateChatsSidebar.tsx +++ b/surfsense_web/components/layout/ui/sidebar/AllPrivateChatsSidebar.tsx @@ -375,24 +375,24 @@ export function AllPrivateChatsSidebarContent({ {thread.title || "New Chat"} ) : ( - - - - - -

- {t("updated") || "Updated"}:{" "} - {format(new Date(thread.updatedAt), "MMM d, yyyy 'at' h:mm a")} -

-
-
+ + + + + +

+ {t("updated") || "Updated"}:{" "} + {format(new Date(thread.updatedAt), "MMM d, yyyy 'at' h:mm a")} +

+
+
)} {thread.title || "New Chat"} ) : ( - - - - - -

- {t("updated") || "Updated"}:{" "} - {format(new Date(thread.updatedAt), "MMM d, yyyy 'at' h:mm a")} -

-
-
+ + + + + +

+ {t("updated") || "Updated"}:{" "} + {format(new Date(thread.updatedAt), "MMM d, yyyy 'at' h:mm a")} +

+
+
)} )} - {isMobile ? ( - - ) : ( - - - - - - {t("mark_all_read") || "Mark all as read"} - - - )} + + + + + + {t("mark_all_read") || "Mark all as read"} + + @@ -921,61 +908,27 @@ export function InboxSidebarContent({ )} style={{ contentVisibility: "auto", containIntrinsicSize: "0 80px" }} > - {isMobile ? ( - - ) : ( - - - - - -

{item.title}

-

- {convertRenderedToDisplay(item.message)} -

-
-
- )} +
diff --git a/surfsense_web/components/ui/tooltip.tsx b/surfsense_web/components/ui/tooltip.tsx index 2fc85aae4..fb6dd17e7 100644 --- a/surfsense_web/components/ui/tooltip.tsx +++ b/surfsense_web/components/ui/tooltip.tsx @@ -2,9 +2,26 @@ import * as TooltipPrimitive from "@radix-ui/react-tooltip"; import type * as React from "react"; +import { useEffect, useState } from "react"; import { cn } from "@/lib/utils"; +const MOBILE_BREAKPOINT = 768; + +function useIsTouchDevice() { + const [isTouch, setIsTouch] = useState(false); + + useEffect(() => { + const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`); + const update = () => setIsTouch(mql.matches); + update(); + mql.addEventListener("change", update); + return () => mql.removeEventListener("change", update); + }, []); + + return isTouch; +} + function TooltipProvider({ delayDuration = 0, disableHoverableContent = true, @@ -20,10 +37,21 @@ function TooltipProvider({ ); } -function Tooltip({ ...props }: React.ComponentProps) { +function Tooltip({ + open, + onOpenChange, + ...props +}: React.ComponentProps) { + const isMobile = useIsTouchDevice(); + return ( - + ); }