Use action icons from design and fix spacing

This commit is contained in:
Nicolas Mowen 2024-03-20 11:45:40 -06:00
parent 844f4e3ea0
commit 6e8a98205d

View File

@ -1,8 +1,10 @@
import { LuCheckSquare, LuFileUp, LuTrash } from "react-icons/lu"; import { FaCircleCheck } from "react-icons/fa6";
import { useCallback } from "react"; import { useCallback } from "react";
import axios from "axios"; import axios from "axios";
import { Button } from "../ui/button"; import { Button } from "../ui/button";
import { isDesktop } from "react-device-detect"; import { isDesktop } from "react-device-detect";
import { FaCompactDisc } from "react-icons/fa";
import { HiTrash } from "react-icons/hi";
type ReviewActionGroupProps = { type ReviewActionGroupProps = {
selectedReviews: string[]; selectedReviews: string[];
@ -49,7 +51,7 @@ export default function ReviewActionGroup({
<div className="flex items-center gap-1 md:gap-2"> <div className="flex items-center gap-1 md:gap-2">
{selectedReviews.length == 1 && ( {selectedReviews.length == 1 && (
<Button <Button
className="flex items-center" className="p-2 flex items-center gap-2"
variant="secondary" variant="secondary"
size="sm" size="sm"
onClick={() => { onClick={() => {
@ -57,26 +59,26 @@ export default function ReviewActionGroup({
onClearSelected(); onClearSelected();
}} }}
> >
<LuFileUp className="mr-1" /> <FaCompactDisc />
{isDesktop && "Export"} {isDesktop && "Export"}
</Button> </Button>
)} )}
<Button <Button
className="flex items-center" className="p-2 flex items-center gap-2"
variant="secondary" variant="secondary"
size="sm" size="sm"
onClick={onMarkAsReviewed} onClick={onMarkAsReviewed}
> >
<LuCheckSquare className="mr-1" /> <FaCircleCheck />
{isDesktop && "Mark as reviewed"} {isDesktop && "Mark as reviewed"}
</Button> </Button>
<Button <Button
className="flex items-center" className="p-2 flex items-center gap-1"
variant="secondary" variant="secondary"
size="sm" size="sm"
onClick={onDelete} onClick={onDelete}
> >
<LuTrash className="mr-1" /> <HiTrash />
{isDesktop && "Delete"} {isDesktop && "Delete"}
</Button> </Button>
</div> </div>