diff --git a/src/components/Icon/icons.ts b/src/components/Icon/icons.ts index 223263b370..ece824936d 100644 --- a/src/components/Icon/icons.ts +++ b/src/components/Icon/icons.ts @@ -56,6 +56,7 @@ import { Search, Settings, Shield, + Split, Sprout, SquareArrowOutUpRight, Star, @@ -130,6 +131,7 @@ export const icons = { Save: Save, Search, SecurityScan: Shield, + Split, Sprout, Star, StickyNote, diff --git a/src/pages/Admin/Charity/Funds/FundItem.tsx b/src/pages/Admin/Charity/Funds/FundItem.tsx index d7a60dbb79..b31486709f 100644 --- a/src/pages/Admin/Charity/Funds/FundItem.tsx +++ b/src/pages/Admin/Charity/Funds/FundItem.tsx @@ -1,58 +1,124 @@ import type { FundItem as TFundItem } from "@better-giving/fundraiser"; +import Icon from "components/Icon"; +import Prompt from "components/Prompt"; import { appRoutes } from "constants/routes"; import { useAuthenticatedUser } from "contexts/Auth"; import { useErrorContext } from "contexts/ErrorContext"; +import { useModalContext } from "contexts/ModalContext"; import { Link } from "react-router-dom"; -import { useOptOutMutation } from "services/aws/endow-funds"; +import { + useApproveMutation, + useOptOutMutation, +} from "services/aws/endow-funds"; export const FundItem = (props: TFundItem & { endowId: number }) => { const user = useAuthenticatedUser(); const isActive = new Date().toISOString() <= props.expiration && props.active; const isEditor = user.funds.includes(props.id); const [optOut, { isLoading: isOptingOut }] = useOptOutMutation(); + const [approve, { isLoading: isApproving }] = useApproveMutation(); + const { showModal } = useModalContext(); const { handleError } = useErrorContext(); + const isApproved = props.approvers.includes(props.endowId); + return ( -
- {isActive ? "active" : "closed"} -
- - edit - +Approved
+