first commit

resources/client/admin/reviews/delete-reviews-button.tsx

@@ -0,0 +1,58 @@
+import {DialogTrigger} from '@common/ui/overlays/dialog/dialog-trigger';
+import {Button} from '@common/ui/buttons/button';
+import {Trans} from '@common/i18n/trans';
+import {ConfirmationDialog} from '@common/ui/overlays/dialog/confirmation-dialog';
+import React from 'react';
+import {ButtonVariant} from '@common/ui/buttons/get-shared-button-style';
+import {ButtonSize} from '@common/ui/buttons/button-size';
+import {useDeleteReviews} from '@app/reviews/requests/use-delete-reviews';
+
+interface Props {
+  reviewIds: number[];
+  variant?: ButtonVariant;
+  size?: ButtonSize;
+}
+export function DeleteReviewsButton({
+  reviewIds,
+  variant = 'outline',
+  size = 'xs',
+}: Props) {
+  const deleteReviews = useDeleteReviews();
+  return (
+    <DialogTrigger
+      type="modal"
+      onClose={isConfirmed => {
+        if (isConfirmed) {
+          deleteReviews.mutate({reviewIds});
+        }
+      }}
+    >
+      <Button
+        variant={variant}
+        size={size}
+        color="danger"
+        className="mr-10"
+        disabled={deleteReviews.isPending}
+      >
+        <Trans message="Delete" />
+      </Button>
+      <ConfirmationDialog
+        isDanger
+        title={
+          <Trans
+            message="Delete [one review|other :count reviews]"
+            values={{count: reviewIds.length}}
+          />
+        }
+        body={
+          reviewIds.length > 1 ? (
+            <Trans message="Are you sure you want to delete selected reviews?" />
+          ) : (
+            <Trans message="Are you sure you want to delete this review?" />
+          )
+        }
+        confirm={<Trans message="Delete" />}
+      />
+    </DialogTrigger>
+  );
+}