mirror of
https://github.com/supabase/supabase.git
synced 2026-10-05 17:35:10 +03:00
Gildas GarciaandIvan Vasilov
96d43099bb
## Problem Our `<Button>` component breaks the default `button` contract by redefining the `type` prop to set its variant (`primary`, `default`, etc) instead of the button type (`submit`, `button`, etc). This is confusing and forces to write more code when using it with shadcn components that expect/inject the standard button props. ## Solution - rename the `type` prop to `variant` - rename the `htmlType` prop to `type` - propagate the changes where necessary - format code ## How to test As this is just prop renaming, if it builds it's ok --------- Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
69 lines
1.9 KiB
TypeScript
69 lines
1.9 KiB
TypeScript
import { useParams } from 'common'
|
|
import { toast } from 'sonner'
|
|
import {
|
|
Button,
|
|
Dialog,
|
|
DialogContent,
|
|
DialogDescription,
|
|
DialogFooter,
|
|
DialogHeader,
|
|
DialogSection,
|
|
DialogSectionSeparator,
|
|
DialogTitle,
|
|
} from 'ui'
|
|
|
|
import { useS3AccessKeyDeleteMutation } from '@/data/storage/s3-access-key-delete-mutation'
|
|
|
|
interface RevokeCredentialModalProps {
|
|
visible: boolean
|
|
selectedCredential?: { id: string; description: string }
|
|
onClose: () => void
|
|
}
|
|
|
|
export const RevokeCredentialModal = ({
|
|
visible,
|
|
selectedCredential,
|
|
onClose,
|
|
}: RevokeCredentialModalProps) => {
|
|
const { ref: projectRef } = useParams()
|
|
const { mutate: deleteS3AccessKey, isPending: isDeleting } = useS3AccessKeyDeleteMutation({
|
|
onSuccess: () => {
|
|
toast.success('Successfully revoked S3 access key')
|
|
onClose()
|
|
},
|
|
})
|
|
|
|
return (
|
|
<Dialog open={visible} onOpenChange={onClose}>
|
|
<DialogContent size="small">
|
|
<DialogHeader>
|
|
<DialogTitle>
|
|
Revoke credential <code className="text-sm">{selectedCredential?.description}</code>
|
|
</DialogTitle>
|
|
</DialogHeader>
|
|
<DialogSectionSeparator />
|
|
<DialogSection>
|
|
<DialogDescription>
|
|
This action is irreversible and requests made with these access keys will stop working.
|
|
</DialogDescription>
|
|
</DialogSection>
|
|
<DialogFooter className="flex justify-end gap-x-1">
|
|
<Button variant="outline" onClick={() => onClose()}>
|
|
Cancel
|
|
</Button>
|
|
<Button
|
|
variant="danger"
|
|
loading={isDeleting}
|
|
onClick={async () => {
|
|
if (!selectedCredential) return
|
|
deleteS3AccessKey({ id: selectedCredential.id, projectRef })
|
|
}}
|
|
>
|
|
Yes, revoke access keys
|
|
</Button>
|
|
</DialogFooter>
|
|
</DialogContent>
|
|
</Dialog>
|
|
)
|
|
}
|