add conditional check

Author: devkiran

apps/web/app/(ee)/partners.dub.co/(dashboard)/invoices/[payoutId]/route.tsx

@@ -61,6 +61,14 @@ export const GET = withPartnerProfile(async ({ partner, params }) => {
     });
   }
 
+  if (!["completed", "processing"].includes(payout.status)) {
+    throw new DubApiError({
+      code: "unauthorized",
+      message:
+        "This payout is not completed yet, hence no invoice is generated.",
+    });
+  }
+
   const invoiceMetadata = [
     {
       label: "Program",

apps/web/app/(ee)/partners.dub.co/(dashboard)/settings/payouts/payout-details-sheet.tsx

@@ -89,18 +89,20 @@ function PayoutDetailsSheetContent({ payout }: PayoutDetailsSheetProps) {
             })}
           </strong>
 
-          <Tooltip content="View invoice">
-            <div className="flex h-5 w-5 items-center justify-center rounded-md transition-colors duration-150 hover:border hover:border-neutral-200 hover:bg-neutral-100">
-              <Link
-                href={`/invoices/${payout.id}`}
-                className="text-neutral-700"
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                <InvoiceDollar className="size-4" />
-              </Link>
-            </div>
-          </Tooltip>
+          {["completed", "processing"].includes(payout.status) && (
+            <Tooltip content="View invoice">
+              <div className="flex h-5 w-5 items-center justify-center rounded-md transition-colors duration-150 hover:border hover:border-neutral-200 hover:bg-neutral-100">
+                <Link
+                  href={`/invoices/${payout.id}`}
+                  className="text-neutral-700"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  <InvoiceDollar className="size-4" />
+                </Link>
+              </div>
+            </Tooltip>
+          )}
         </div>
       ),
 

apps/web/app/(ee)/partners.dub.co/(dashboard)/settings/payouts/payout-table.tsx

@@ -103,19 +103,22 @@ export function PayoutTable() {
               payoutsEnabled={Boolean(partner?.payoutsEnabledAt)}
               minPayoutAmount={row.original.program.minPayoutAmount}
             />
-            <Tooltip content="View invoice">
-              <div className="flex h-5 w-5 items-center justify-center rounded-md transition-colors duration-150 hover:border hover:border-neutral-200 hover:bg-neutral-100">
-                <Link
-                  href={`/invoices/${row.original.id}`}
-                  className="text-neutral-700"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  onClick={(e) => e.stopPropagation()}
-                >
-                  <InvoiceDollar className="size-4" />
-                </Link>
-              </div>
-            </Tooltip>
+
+            {["completed", "processing"].includes(row.original.status) && (
+              <Tooltip content="View invoice">
+                <div className="flex h-5 w-5 items-center justify-center rounded-md transition-colors duration-150 hover:border hover:border-neutral-200 hover:bg-neutral-100">
+                  <Link
+                    href={`/invoices/${row.original.id}`}
+                    className="text-neutral-700"
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    onClick={(e) => e.stopPropagation()}
+                  >
+                    <InvoiceDollar className="size-4" />
+                  </Link>
+                </div>
+              </Tooltip>
+            )}
           </div>
         ),
       },