Nicholai/jan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: added dialog confirmation when delete thread

Browse Source
This commit is contained in:
Faisal Amir 2023-12-19 13:32:12 +07:00
parent 7a148ea025
commit 6efc52f3bd
2 changed files with 47 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
uikit/src/button/styles.scss
View File

@ -1,6 +1,6 @@
.btn {
@apply inline-flex items-center justify-center whitespace-nowrap rounded-lg font-semibold transition-colors;
@apply focus-visible:ring-ring cursor-pointer focus-visible:outline-none focus-visible:ring-1;
@apply cursor-pointer focus:outline-none focus-visible:outline-none focus-visible:ring-0;
@apply disabled:pointer-events-none disabled:opacity-50;
&-primary {
@ -28,7 +28,7 @@
}
&-ghost {
@apply hover:bg-primary hover:text-primary-foreground;
@apply hover:bg-secondary hover:text-secondary-foreground;
}
&-sm {

54
web/screens/Chat/ThreadList/index.tsx
View File

@ -1,5 +1,16 @@
import { useEffect } from 'react'
import {
Modal,
ModalTrigger,
ModalClose,
ModalFooter,
ModalContent,
ModalHeader,
ModalTitle,
Button,
} from '@janhq/uikit'
import { motion as m } from 'framer-motion'
import { useAtomValue } from 'jotai'
import {
@ -107,15 +118,40 @@ export default function ThreadList() {
Clean thread
</span>
</div>
<div
className="flex cursor-pointer items-center space-x-2 px-4 py-2 hover:bg-secondary"
onClick={() => deleteThread(thread.id)}
>
<Trash2Icon size={16} className="text-muted-foreground" />
<span className="text-bold text-black dark:text-muted-foreground">
Delete thread
</span>
</div>
<Modal>
<ModalTrigger asChild>
<div className="flex cursor-pointer items-center space-x-2 px-4 py-2 hover:bg-secondary">
<Trash2Icon
size={16}
className="text-muted-foreground"
/>
<span className="text-bold text-black dark:text-muted-foreground">
Delete thread
</span>
</div>
</ModalTrigger>
<ModalContent>
<ModalHeader>
<ModalTitle>Delete Thread</ModalTitle>
</ModalHeader>
<p>Are you sure you want to delete Thread?</p>
<ModalFooter>
<div className="flex gap-x-2">
<ModalClose asChild>
<Button themes="ghost">No</Button>
</ModalClose>
<ModalClose asChild>
<Button
themes="danger"
onClick={() => deleteThread(thread.id)}
>
Yes
</Button>
</ModalClose>
</div>
</ModalFooter>
</ModalContent>
</Modal>
</div>
</div>
{/* {messages.length > 0 && (