diff --git a/frontend/src/components/connections/ConnectedApps.tsx b/frontend/src/components/connections/ConnectedApps.tsx index 7d0ab7d0c..fab3f0670 100644 --- a/frontend/src/components/connections/ConnectedApps.tsx +++ b/frontend/src/components/connections/ConnectedApps.tsx @@ -1,4 +1,4 @@ -import { CableIcon, TrashIcon } from "lucide-react"; +import { CableIcon, ExternalLinkIcon, TrashIcon } from "lucide-react"; import { useRef, useState } from "react"; import { Link } from "react-router-dom"; import { CustomPagination } from "src/components/CustomPagination"; @@ -7,6 +7,7 @@ import Loading from "src/components/Loading"; import ResponsiveButton from "src/components/ResponsiveButton"; import AlbyConnectionCard from "src/components/connections/AlbyConnectionCard"; import AppCard from "src/components/connections/AppCard"; +import { ExternalLinkButton } from "src/components/ui/custom/external-link-button"; import { ALBY_ACCOUNT_APP_NAME, LIST_APPS_LIMIT, @@ -100,7 +101,20 @@ function ConnectedApps() { className="grid grid-cols-1 lg:grid-cols-2 gap-4 items-stretch app-list" > {otherApps.map((app, index) => ( - + + View + + ) : undefined + } + /> ))} )} diff --git a/frontend/src/screens/apps/AppDetails.tsx b/frontend/src/screens/apps/AppDetails.tsx index 0ff8ed67a..5f9f14b16 100644 --- a/frontend/src/screens/apps/AppDetails.tsx +++ b/frontend/src/screens/apps/AppDetails.tsx @@ -15,6 +15,7 @@ import { CheckCircleIcon, ChevronDownIcon, EllipsisIcon, + ExternalLinkIcon, InfoIcon, PlusIcon, SquarePenIcon, @@ -190,6 +191,8 @@ function AppInternal({ app, refetchApp, capabilities }: AppInternalProps) { const appStoreApp = getAppStoreApp(app); const connectedApps = useAppsForAppStoreApp(appStoreApp); + const subscriptionId = app?.metadata?.zapplanner_subscription_id; + return ( <>
@@ -265,6 +268,20 @@ function AppInternal({ app, refetchApp, capabilities }: AppInternalProps) { )} + {typeof subscriptionId === "string" && + subscriptionId && ( + + + + View + + + )} + {appStoreApp && ( )} +
Connection Details
+
Recurring Payments
{zapplannerApps.map((app, index) => ( - - View - - ) : undefined - } - /> + ))}