orca/src/renderer/src/components/sidebar/RemoveFolderDialog.tsx

64 lines
1.9 KiB
TypeScript

import React, { useCallback } from 'react'
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle
} from '@/components/ui/dialog'
import { Button } from '@/components/ui/button'
import { useAppStore } from '@/store'
const RemoveFolderDialog = React.memo(function RemoveFolderDialog() {
const activeModal = useAppStore((s) => s.activeModal)
const modalData = useAppStore((s) => s.modalData)
const closeModal = useAppStore((s) => s.closeModal)
const removeRepo = useAppStore((s) => s.removeRepo)
const isOpen = activeModal === 'confirm-remove-folder'
const repoId = typeof modalData.repoId === 'string' ? modalData.repoId : ''
const displayName = typeof modalData.displayName === 'string' ? modalData.displayName : ''
const handleConfirm = useCallback(() => {
if (repoId) {
void removeRepo(repoId)
}
closeModal()
}, [closeModal, removeRepo, repoId])
const handleOpenChange = useCallback(
(open: boolean) => {
if (!open) {
closeModal()
}
},
[closeModal]
)
return (
<Dialog open={isOpen} onOpenChange={handleOpenChange}>
<DialogContent className="max-w-sm sm:max-w-sm" showCloseButton={false}>
<DialogHeader>
<DialogTitle className="text-sm">Remove Project</DialogTitle>
<DialogDescription className="text-xs">
This only removes{' '}
<span className="break-all font-medium text-foreground">{displayName}</span> from Orca.
It is still on your disk.
</DialogDescription>
</DialogHeader>
<DialogFooter>
<Button variant="outline" onClick={() => handleOpenChange(false)}>
Cancel
</Button>
<Button variant="destructive" onClick={handleConfirm}>
Remove
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
)
})
export default RemoveFolderDialog