From 0ff9ac34b348c061429e448d4a85ad87710e2e90 Mon Sep 17 00:00:00 2001
From: ap-justin <89639563+ap-justin@users.noreply.github.com>
Date: Mon, 23 Sep 2024 14:11:58 +0800
Subject: [PATCH] Program name in donation records (#3316)

* add programName in intent

* add in desktop table

* add in mobile

* bump version
---
 .../donation/Steps/Submit/Crypto/DirectMode.tsx    |  5 ++++-
 .../Steps/Submit/DAFCheckout/ChariotCheckout.tsx   |  1 +
 .../Submit/StripeCheckout/Paypal/Checkout.tsx      |  5 ++++-
 .../Steps/Submit/StripeCheckout/StripeCheckout.tsx |  5 ++++-
 .../Admin/Charity/Donations/DonationsTable.tsx     |  2 ++
 src/pages/Admin/Charity/Donations/Row.tsx          | 13 +++++++++++++
 src/pages/Admin/Charity/Donations/Table.tsx        |  1 +
 src/pages/UserDashboard/Donations/MobileTable.tsx  | 14 ++++++++++++++
 src/pages/UserDashboard/Donations/Table.tsx        | 11 +++++++++++
 src/services/aws/aws.ts                            |  2 +-
 src/types/aws/ap/donations.ts                      |  2 ++
 src/types/aws/apes/donation.ts                     |  1 +
 12 files changed, 58 insertions(+), 4 deletions(-)

diff --git a/src/components/donation/Steps/Submit/Crypto/DirectMode.tsx b/src/components/donation/Steps/Submit/Crypto/DirectMode.tsx
index bc5751063d..5208b61bd9 100644
--- a/src/components/donation/Steps/Submit/Crypto/DirectMode.tsx
+++ b/src/components/donation/Steps/Submit/Crypto/DirectMode.tsx
@@ -46,7 +46,10 @@ export default function DirectMode({ donation, classes = "" }: Props) {
         ? honorary.tributeNotif
         : undefined,
     }),
-    ...(details.program.value && { programId: details.program.value }),
+    ...(details.program.value && {
+      programId: details.program.value,
+      programName: details.program.label,
+    }),
   });
 
   const totalDisplayAmount = roundToCents(
diff --git a/src/components/donation/Steps/Submit/DAFCheckout/ChariotCheckout.tsx b/src/components/donation/Steps/Submit/DAFCheckout/ChariotCheckout.tsx
index 5cbbb1f6aa..58c38c3b60 100644
--- a/src/components/donation/Steps/Submit/DAFCheckout/ChariotCheckout.tsx
+++ b/src/components/donation/Steps/Submit/DAFCheckout/ChariotCheckout.tsx
@@ -303,6 +303,7 @@ export default function ChariotCheckout(props: DafCheckoutStep) {
                 source: props.init.source,
                 ...(props.details.program.value && {
                   programId: props.details.program.value,
+                  programName: props.details.program.label,
                 }),
                 ...(meta.honoraryFullName && {
                   inHonorOf: meta.honoraryFullName,
diff --git a/src/components/donation/Steps/Submit/StripeCheckout/Paypal/Checkout.tsx b/src/components/donation/Steps/Submit/StripeCheckout/Paypal/Checkout.tsx
index 32e3aa89ce..747d3d1470 100644
--- a/src/components/donation/Steps/Submit/StripeCheckout/Paypal/Checkout.tsx
+++ b/src/components/donation/Steps/Submit/StripeCheckout/Paypal/Checkout.tsx
@@ -98,7 +98,10 @@ export default function Checkout(props: StripeCheckoutStep) {
           ...(honorary.honoraryFullName && {
             inHonorOf: honorary.honoraryFullName,
           }),
-          ...(details.program.value && { programId: details.program.value }),
+          ...(details.program.value && {
+            programId: details.program.value,
+            programName: details.program.label,
+          }),
         }).unwrap()
       }
     />
diff --git a/src/components/donation/Steps/Submit/StripeCheckout/StripeCheckout.tsx b/src/components/donation/Steps/Submit/StripeCheckout/StripeCheckout.tsx
index 88a0927f10..b72d2c48cd 100644
--- a/src/components/donation/Steps/Submit/StripeCheckout/StripeCheckout.tsx
+++ b/src/components/donation/Steps/Submit/StripeCheckout/StripeCheckout.tsx
@@ -51,7 +51,10 @@ export default function StripeCheckout(props: StripeCheckoutStep) {
         ? honorary.tributeNotif
         : undefined,
     }),
-    ...(details.program.value && { programId: details.program.value }),
+    ...(details.program.value && {
+      programId: details.program.value,
+      programName: details.program.label,
+    }),
   });
 
   return (
diff --git a/src/pages/Admin/Charity/Donations/DonationsTable.tsx b/src/pages/Admin/Charity/Donations/DonationsTable.tsx
index e204016f21..2d7a0bfe61 100644
--- a/src/pages/Admin/Charity/Donations/DonationsTable.tsx
+++ b/src/pages/Admin/Charity/Donations/DonationsTable.tsx
@@ -55,6 +55,7 @@ export default function DonationsTable({ classes = "" }) {
                       const amt = amount(d.splitLiqPct, d.finalAmountUsd);
                       return fill({
                         date: new Date(d.date).toLocaleDateString(),
+                        programName: d.programName,
                         appUsed:
                           d.appUsed === "bg-widget"
                             ? "Donation Form"
@@ -102,6 +103,7 @@ const csvHeaders: {
   label: string;
 }[] = [
   { key: "date", label: "Datetime" },
+  { key: "programName", label: "Program" },
   { key: "appUsed", label: "Donation Origin" },
   { key: "paymentMethod", label: "Donation Type" },
   { key: "isRecurring", label: "Recurring Donation" },
diff --git a/src/pages/Admin/Charity/Donations/Row.tsx b/src/pages/Admin/Charity/Donations/Row.tsx
index b6c732a709..0b168f0220 100644
--- a/src/pages/Admin/Charity/Donations/Row.tsx
+++ b/src/pages/Admin/Charity/Donations/Row.tsx
@@ -1,7 +1,9 @@
 import ExtLink from "components/ExtLink";
 import Icon from "components/Icon";
 import { Cells } from "components/TableSection";
+import { appRoutes } from "constants/routes";
 import { getTxUrl, humanize, maskAddress, roundDownToNum } from "helpers";
+import { Link } from "react-router-dom";
 import type { Donation } from "types/aws";
 
 export default function Row(
@@ -17,6 +19,17 @@ export default function Row(
         {new Date(props.date).toLocaleDateString()}
       </span>
 
+      {props.programId ? (
+        <Link
+          className="text-blue hover:text-blue-d1"
+          to={`${appRoutes.profile}/${props.recipientId}/program/${props.programId}`}
+        >
+          {props.programName}
+        </Link>
+      ) : (
+        <>--</>
+      )}
+
       <>{props.appUsed === "bg-widget" ? "Donation Form" : "Marketplace"}</>
       <>{props.paymentMethod ?? "--"}</>
       <>{props.isRecurring ? "Yes" : "No"}</>
diff --git a/src/pages/Admin/Charity/Donations/Table.tsx b/src/pages/Admin/Charity/Donations/Table.tsx
index 5309b4939b..24e16de567 100644
--- a/src/pages/Admin/Charity/Donations/Table.tsx
+++ b/src/pages/Admin/Charity/Donations/Table.tsx
@@ -43,6 +43,7 @@ export default function Table({
           >
             Date
           </HeaderButton>
+          <>Program</>
           <HeaderButton
             onClick={handleHeaderClick("appUsed")}
             _activeSortKey={sortKey}
diff --git a/src/pages/UserDashboard/Donations/MobileTable.tsx b/src/pages/UserDashboard/Donations/MobileTable.tsx
index ded575c092..490cae5015 100644
--- a/src/pages/UserDashboard/Donations/MobileTable.tsx
+++ b/src/pages/UserDashboard/Donations/MobileTable.tsx
@@ -5,9 +5,11 @@ import {
 } from "@headlessui/react";
 import ExtLink from "components/ExtLink";
 import Icon, { DrawerIcon } from "components/Icon";
+import { appRoutes } from "constants/routes";
 import { humanize } from "helpers";
 import useSort from "hooks/useSort";
 import type { PropsWithChildren } from "react";
+import { Link } from "react-router-dom";
 import type { Donation } from "types/aws";
 import IntentResumer from "./IntentResumer";
 import LoadMoreBtn from "./LoadMoreBtn";
@@ -69,6 +71,18 @@ export default function MobileTable({
                 </div>
               </DisclosureButton>
               <DisclosurePanel className="w-full divide-y divide-blue-l2">
+                <Row title="Program">
+                  {row.programId ? (
+                    <Link
+                      className="text-blue hover:text-blue-d1"
+                      to={`${appRoutes.profile}/${row.recipientId}/program/${row.programId}`}
+                    >
+                      {row.programName}
+                    </Link>
+                  ) : (
+                    <>--</>
+                  )}
+                </Row>
                 <Row title="Donation Type" className="capitalize">
                   {donationMethod(
                     row.paymentMethod ?? { id: row.viaId, name: row.viaName }
diff --git a/src/pages/UserDashboard/Donations/Table.tsx b/src/pages/UserDashboard/Donations/Table.tsx
index 42fd0c3b6d..f7f26890fe 100644
--- a/src/pages/UserDashboard/Donations/Table.tsx
+++ b/src/pages/UserDashboard/Donations/Table.tsx
@@ -46,6 +46,7 @@ export default function Table({
           >
             Recipient
           </HeaderButton>
+          <>Program</>
           <HeaderButton
             onClick={handleHeaderClick("date")}
             _activeSortKey={sortKey}
@@ -124,6 +125,16 @@ export default function Table({
                 </span>
                 <Icon type="ExternalLink" className="w-5 h-5" />
               </Link>
+              {row.programId ? (
+                <Link
+                  className="text-blue hover:text-blue-d1"
+                  to={`${appRoutes.profile}/${row.recipientId}/program/${row.programId}`}
+                >
+                  {row.programName}
+                </Link>
+              ) : (
+                <>--</>
+              )}
               <>{new Date(row.date).toLocaleDateString()}</>
               <span className="capitalize">
                 {donationMethod(
diff --git a/src/services/aws/aws.ts b/src/services/aws/aws.ts
index 3287ed6fc7..a2fd515043 100644
--- a/src/services/aws/aws.ts
+++ b/src/services/aws/aws.ts
@@ -226,7 +226,7 @@ export const aws = createApi({
       providesTags: ["donations"],
       query: (params) => {
         return {
-          url: `${v(1)}/donations`,
+          url: `${v(2)}/donations`,
           params,
           headers: { authorization: TEMP_JWT },
         };
diff --git a/src/types/aws/ap/donations.ts b/src/types/aws/ap/donations.ts
index deb3c87770..bb016663b9 100644
--- a/src/types/aws/ap/donations.ts
+++ b/src/types/aws/ap/donations.ts
@@ -37,6 +37,8 @@ export namespace Donation {
     /** endow id  */
     recipientId: number;
     recipientName: string;
+    programId?: string;
+    programName?: string;
 
     //details
     /** ISODate string */
diff --git a/src/types/aws/apes/donation.ts b/src/types/aws/apes/donation.ts
index ccb3e532ff..7bc2922016 100644
--- a/src/types/aws/apes/donation.ts
+++ b/src/types/aws/apes/donation.ts
@@ -48,6 +48,7 @@ type TributeNotif = {
 export interface DonationIntent {
   transactionId?: string;
   programId?: string;
+  programName?: string;
   amount: number;
   tipAmount: number;
   feeAllowance: number;