mirror of
https://github.com/supermemoryai/supermemory.git
synced 2026-09-14 23:21:20 +00:00
fix: prevent memory from opening when delete memory dialog is open (#582)
This commit is contained in:
Hardik Vora
GitHub
parent
b59330d506
commit
14de8b5212
5 changed files with 43 additions and 25 deletions
|
|
@ -1,5 +1,6 @@
|
|||
"use client"
|
||||
|
||||
import { useState } from "react"
|
||||
import { Card, CardContent } from "@repo/ui/components/card"
|
||||
import { Badge } from "@repo/ui/components/badge"
|
||||
import {
|
||||
|
|
@ -41,11 +42,15 @@ export const GoogleDocsCard = ({
|
|||
activeMemories,
|
||||
lastModified,
|
||||
}: GoogleDocsCardProps) => {
|
||||
const [isDialogOpen, setIsDialogOpen] = useState(false)
|
||||
|
||||
const handleCardClick = () => {
|
||||
if (onClick) {
|
||||
onClick()
|
||||
} else if (url) {
|
||||
window.open(url, "_blank", "noopener,noreferrer")
|
||||
if (!isDialogOpen) {
|
||||
if (onClick) {
|
||||
onClick()
|
||||
} else if (url) {
|
||||
window.open(url, "_blank", "noopener,noreferrer")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -68,7 +73,7 @@ export const GoogleDocsCard = ({
|
|||
}}
|
||||
>
|
||||
{onDelete && (
|
||||
<AlertDialog>
|
||||
<AlertDialog open={isDialogOpen} onOpenChange={setIsDialogOpen}>
|
||||
<AlertDialogTrigger asChild>
|
||||
<button
|
||||
className="absolute top-2 right-2 z-20 opacity-0 group-hover:opacity-100 transition-opacity p-1.5 rounded-md hover:bg-red-500/20"
|
||||
|
|
@ -85,7 +90,7 @@ export const GoogleDocsCard = ({
|
|||
<Trash2 className="w-3.5 h-3.5" />
|
||||
</button>
|
||||
</AlertDialogTrigger>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogContent onClick={(e) => e.stopPropagation()}>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>Delete Document</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@ import {
|
|||
import { colors } from "@repo/ui/memory-graph/constants"
|
||||
import { Brain, ExternalLink, Trash2 } from "lucide-react"
|
||||
import { cn } from "@lib/utils"
|
||||
import { useState } from "react"
|
||||
import {
|
||||
formatDate,
|
||||
getPastelBackgroundColor,
|
||||
|
|
@ -45,12 +46,16 @@ export const NoteCard = ({
|
|||
onOpenDetails,
|
||||
onDelete,
|
||||
}: NoteCardProps) => {
|
||||
const [isDialogOpen, setIsDialogOpen] = useState(false)
|
||||
|
||||
return (
|
||||
<Card
|
||||
className="w-full p-4 transition-all cursor-pointer group relative overflow-hidden gap-2 shadow-xs"
|
||||
onClick={() => {
|
||||
analytics.documentCardClicked()
|
||||
onOpenDetails(document)
|
||||
if (!isDialogOpen) {
|
||||
analytics.documentCardClicked()
|
||||
onOpenDetails(document)
|
||||
}
|
||||
}}
|
||||
style={{
|
||||
backgroundColor: getPastelBackgroundColor(
|
||||
|
|
@ -59,7 +64,7 @@ export const NoteCard = ({
|
|||
width: width,
|
||||
}}
|
||||
>
|
||||
<AlertDialog>
|
||||
<AlertDialog open={isDialogOpen} onOpenChange={setIsDialogOpen}>
|
||||
<AlertDialogTrigger asChild>
|
||||
<button
|
||||
className="absolute top-2 right-2 z-20 opacity-0 group-hover:opacity-100 group-hover:cursor-pointer transition-opacity p-1.5 rounded-md hover:bg-red-500/20"
|
||||
|
|
@ -76,7 +81,7 @@ export const NoteCard = ({
|
|||
<Trash2 className="w-3.5 h-3.5" />
|
||||
</button>
|
||||
</AlertDialogTrigger>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogContent onClick={(e) => e.stopPropagation()}>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>Delete Document</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { Suspense } from "react"
|
||||
import { Suspense, useState } from "react"
|
||||
import type { Tweet } from "react-tweet/api"
|
||||
import {
|
||||
type TwitterComponents,
|
||||
|
|
@ -88,6 +88,8 @@ export const TweetCard = ({
|
|||
activeMemories?: Array<{ id: string; isForgotten?: boolean }>
|
||||
onDelete?: () => void
|
||||
}) => {
|
||||
const [isDialogOpen, setIsDialogOpen] = useState(false)
|
||||
|
||||
return (
|
||||
<div
|
||||
className="relative transition-all group"
|
||||
|
|
@ -98,7 +100,7 @@ export const TweetCard = ({
|
|||
<CustomTweet components={{}} tweet={data} />
|
||||
|
||||
{onDelete && (
|
||||
<AlertDialog>
|
||||
<AlertDialog open={isDialogOpen} onOpenChange={setIsDialogOpen}>
|
||||
<AlertDialogTrigger asChild>
|
||||
<button
|
||||
className="absolute top-2 right-2 z-20 opacity-0 group-hover:opacity-100 transition-opacity p-1.5 rounded-md hover:bg-red-500/20"
|
||||
|
|
@ -115,7 +117,7 @@ export const TweetCard = ({
|
|||
<Trash2 className="w-3.5 h-3.5" />
|
||||
</button>
|
||||
</AlertDialogTrigger>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogContent onClick={(e) => e.stopPropagation()}>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>Delete Document</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
|
|
|
|||
|
|
@ -42,14 +42,17 @@ export const WebsiteCard = ({
|
|||
showExternalLink = true,
|
||||
}: WebsiteCardProps) => {
|
||||
const [imageError, setImageError] = useState(false)
|
||||
const [isDialogOpen, setIsDialogOpen] = useState(false)
|
||||
|
||||
const handleCardClick = () => {
|
||||
if (onClick) {
|
||||
onClick()
|
||||
} else if (onOpenDetails) {
|
||||
onOpenDetails()
|
||||
} else {
|
||||
window.open(url, "_blank", "noopener,noreferrer")
|
||||
if (!isDialogOpen) {
|
||||
if (onClick) {
|
||||
onClick()
|
||||
} else if (onOpenDetails) {
|
||||
onOpenDetails()
|
||||
} else {
|
||||
window.open(url, "_blank", "noopener,noreferrer")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -78,7 +81,7 @@ export const WebsiteCard = ({
|
|||
}}
|
||||
>
|
||||
{onDelete && (
|
||||
<AlertDialog>
|
||||
<AlertDialog open={isDialogOpen} onOpenChange={setIsDialogOpen}>
|
||||
<AlertDialogTrigger asChild>
|
||||
<button
|
||||
className="absolute top-2 right-2 z-20 opacity-0 group-hover:opacity-100 transition-opacity p-1.5 rounded-md hover:bg-red-500/20"
|
||||
|
|
@ -95,7 +98,7 @@ export const WebsiteCard = ({
|
|||
<Trash2 className="w-3.5 h-3.5" />
|
||||
</button>
|
||||
</AlertDialogTrigger>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogContent onClick={(e) => e.stopPropagation()}>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>Delete Document</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
|
|
|
|||
|
|
@ -54,6 +54,7 @@ const DocumentCard = memo(
|
|||
onOpenDetails: (document: DocumentWithMemories) => void
|
||||
onDelete: (document: DocumentWithMemories) => void
|
||||
}) => {
|
||||
const [isDialogOpen, setIsDialogOpen] = useState(false)
|
||||
const activeMemories = document.memoryEntries.filter((m) => !m.isForgotten)
|
||||
const forgottenMemories = document.memoryEntries.filter(
|
||||
(m) => m.isForgotten,
|
||||
|
|
@ -63,8 +64,10 @@ const DocumentCard = memo(
|
|||
<Card
|
||||
className="h-full mx-4 p-4 transition-all cursor-pointer group relative overflow-hidden gap-2 md:w-full shadow-xs"
|
||||
onClick={() => {
|
||||
analytics.documentCardClicked()
|
||||
onOpenDetails(document)
|
||||
if (!isDialogOpen) {
|
||||
analytics.documentCardClicked()
|
||||
onOpenDetails(document)
|
||||
}
|
||||
}}
|
||||
style={{
|
||||
backgroundColor: colors.document.primary,
|
||||
|
|
@ -143,7 +146,7 @@ const DocumentCard = memo(
|
|||
)}
|
||||
</div>
|
||||
|
||||
<AlertDialog>
|
||||
<AlertDialog open={isDialogOpen} onOpenChange={setIsDialogOpen}>
|
||||
<AlertDialogTrigger asChild>
|
||||
<button
|
||||
className="opacity-0 group-hover:opacity-100 transition-opacity p-1.5 rounded-md hover:bg-red-500/20"
|
||||
|
|
@ -158,7 +161,7 @@ const DocumentCard = memo(
|
|||
<Trash2 className="w-3.5 h-3.5" />
|
||||
</button>
|
||||
</AlertDialogTrigger>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogContent onClick={(e) => e.stopPropagation()}>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>Delete Document</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue