From 9644fa96fe0bd1dd341e12569c83e1bbfafa2ca2 Mon Sep 17 00:00:00 2001 From: Tim Wilson Date: Mon, 3 Feb 2025 17:00:36 -0500 Subject: [PATCH 1/5] Update integration.prisma --- packages/prisma/schema/integration.prisma | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/prisma/schema/integration.prisma b/packages/prisma/schema/integration.prisma index 6ed99e219..63a9179ff 100644 --- a/packages/prisma/schema/integration.prisma +++ b/packages/prisma/schema/integration.prisma @@ -13,6 +13,8 @@ model Integration { verified Boolean @default(false) installUrl String? category String? + guideUrl String? + comingSoon Boolean @default(false) createdAt DateTime @default(now()) updatedAt DateTime @updatedAt From 021860521829596aa59bb55d1645949c8f57d632 Mon Sep 17 00:00:00 2001 From: Tim Wilson Date: Tue, 4 Feb 2025 11:41:50 -0500 Subject: [PATCH 2/5] Add "Coming Soon" and "Guide" integration cards --- apps/web/lib/types.ts | 2 + apps/web/lib/zod/schemas/integration.ts | 2 + apps/web/ui/integrations/integration-card.tsx | 67 ++++++++++++++++--- 3 files changed, 61 insertions(+), 10 deletions(-) diff --git a/apps/web/lib/types.ts b/apps/web/lib/types.ts index 1bb1dc008..05c553ae0 100644 --- a/apps/web/lib/types.ts +++ b/apps/web/lib/types.ts @@ -282,6 +282,8 @@ export type InstalledIntegrationProps = Pick< | "developer" | "description" | "verified" + | "comingSoon" + | "guideUrl" > & { installations: number; installed?: boolean; diff --git a/apps/web/lib/zod/schemas/integration.ts b/apps/web/lib/zod/schemas/integration.ts index 150a523f5..878af0415 100644 --- a/apps/web/lib/zod/schemas/integration.ts +++ b/apps/web/lib/zod/schemas/integration.ts @@ -14,6 +14,8 @@ export const integrationSchema = z.object({ screenshots: z.array(z.string()).nullish(), installUrl: z.string().nullish(), verified: z.boolean(), + guideUrl: z.string().nullish(), + comingSoon: z.boolean().nullish(), createdAt: z.date(), updatedAt: z.date(), installations: z.number().default(0), diff --git a/apps/web/ui/integrations/integration-card.tsx b/apps/web/ui/integrations/integration-card.tsx index 05f419f08..9c9641b26 100644 --- a/apps/web/ui/integrations/integration-card.tsx +++ b/apps/web/ui/integrations/integration-card.tsx @@ -5,13 +5,15 @@ import useWorkspace from "@/lib/swr/use-workspace"; import { InstalledIntegrationProps } from "@/lib/types"; import { DubCraftedShield, Tooltip } from "@dub/ui"; import { DUB_WORKSPACE_ID } from "@dub/utils"; +import { cn } from "@dub/utils/src"; +import { ArrowUpRight } from "lucide-react"; import Link from "next/link"; +import { HTMLProps, PropsWithChildren } from "react"; import { IntegrationLogo } from "./integration-logo"; export default function IntegrationCard( integration: InstalledIntegrationProps, ) { - const { slug } = useWorkspace(); const { integrations: activeIntegrations } = useIntegrations(); const installed = activeIntegrations?.some((i) => i.id === integration.id); @@ -19,15 +21,19 @@ export default function IntegrationCard( const dubCrafted = integration.projectId === DUB_WORKSPACE_ID; return ( - - {installed && ( -
- Enabled -
- )} + + {installed ? ( + Enabled + ) : integration.comingSoon ? ( + Coming Soon + ) : integration.guideUrl ? ( + + Guide +
+ +
+ + ) : undefined}

{integration.name} @@ -43,6 +49,47 @@ export default function IntegrationCard(

{integration.description}

+ + ); +} + +function Wrapper({ + integration, + children, +}: PropsWithChildren<{ + integration: InstalledIntegrationProps; +}>) { + const { slug } = useWorkspace(); + + const className = cn( + "group relative rounded-lg border border-gray-200 bg-white p-4 transition-[filter]", + integration.comingSoon ? "cursor-default" : "hover:drop-shadow-card-hover", + ); + + return integration.comingSoon ? ( +
{children}
+ ) : ( + + {children} ); } + +function Badge({ className, ...rest }: HTMLProps) { + return ( +
+ ); +} From 116adeb03cd7341ab193e41acaa40207c9f7e417 Mon Sep 17 00:00:00 2001 From: Steven Tey Date: Tue, 4 Feb 2025 19:39:55 -0800 Subject: [PATCH 3/5] Update integration.prisma --- packages/prisma/schema/integration.prisma | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/prisma/schema/integration.prisma b/packages/prisma/schema/integration.prisma index 63a9179ff..a5d7ee5d4 100644 --- a/packages/prisma/schema/integration.prisma +++ b/packages/prisma/schema/integration.prisma @@ -11,9 +11,9 @@ model Integration { logo String? screenshots Json? verified Boolean @default(false) - installUrl String? + installUrl String? @db.LongText + guideUrl String? @db.LongText category String? - guideUrl String? comingSoon Boolean @default(false) createdAt DateTime @default(now()) updatedAt DateTime @updatedAt From 01966146bfad46df533f6c0189680eccdc0d19a3 Mon Sep 17 00:00:00 2001 From: Steven Tey Date: Tue, 4 Feb 2025 19:51:59 -0800 Subject: [PATCH 4/5] redirects, fixes --- .../settings/integrations/[integrationSlug]/page.tsx | 10 +++++++++- apps/web/lib/actions/add-edit-integration.ts | 5 ++++- 2 files changed, 13 insertions(+), 2 deletions(-) diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/settings/integrations/[integrationSlug]/page.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/settings/integrations/[integrationSlug]/page.tsx index 45310557b..454d24672 100644 --- a/apps/web/app/app.dub.co/(dashboard)/[slug]/settings/integrations/[integrationSlug]/page.tsx +++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/settings/integrations/[integrationSlug]/page.tsx @@ -1,5 +1,5 @@ import { prisma } from "@dub/prisma"; -import { notFound } from "next/navigation"; +import { notFound, redirect } from "next/navigation"; import IntegrationPageClient from "./page-client"; export const revalidate = 0; @@ -48,6 +48,14 @@ export default async function IntegrationPage({ notFound(); } + if (integration.comingSoon) { + redirect(`/${params.slug}/settings/integrations`); + } + + if (integration.guideUrl) { + redirect(integration.guideUrl); + } + const installed = integration.installations.length > 0; const credentials = installed diff --git a/apps/web/lib/actions/add-edit-integration.ts b/apps/web/lib/actions/add-edit-integration.ts index 9462e40b4..798a52796 100644 --- a/apps/web/lib/actions/add-edit-integration.ts +++ b/apps/web/lib/actions/add-edit-integration.ts @@ -3,6 +3,7 @@ import { prisma } from "@dub/prisma"; import { DUB_WORKSPACE_ID, nanoid, R2_URL } from "@dub/utils"; import { waitUntil } from "@vercel/functions"; +import { createId } from "../api/utils"; import { deleteScreenshots } from "../integrations/utils"; import { isStored, storage } from "../storage"; import z from "../zod"; @@ -18,7 +19,7 @@ export const addEditIntegration = authActionClient }), ), ) - .action(async ({ parsedInput }) => { + .action(async ({ parsedInput, ctx }) => { const { id, workspaceId, ...integration } = parsedInput; // this is only available for Dub workspace for now @@ -75,7 +76,9 @@ export const addEditIntegration = authActionClient await prisma.integration.create({ data: { ...integration, + id: createId({ prefix: "int_" }), projectId: workspaceId, + userId: ctx.user.id, }, }); } From 1166cf4435b3b5682dbb0e99381e88ee58b2783d Mon Sep 17 00:00:00 2001 From: Steven Tey Date: Tue, 4 Feb 2025 20:00:33 -0800 Subject: [PATCH 5/5] order integrations --- .../settings/integrations/integrations-cards.tsx | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/apps/web/app/app.dub.co/(dashboard)/[slug]/settings/integrations/integrations-cards.tsx b/apps/web/app/app.dub.co/(dashboard)/[slug]/settings/integrations/integrations-cards.tsx index 3ca98057f..26cdcc563 100644 --- a/apps/web/app/app.dub.co/(dashboard)/[slug]/settings/integrations/integrations-cards.tsx +++ b/apps/web/app/app.dub.co/(dashboard)/[slug]/settings/integrations/integrations-cards.tsx @@ -50,6 +50,17 @@ export async function IntegrationsCards({ {} as Record, ); + // Sort integrations within each category + Object.keys(groupedIntegrations).forEach((category) => { + groupedIntegrations[category].sort((a, b) => { + // Put "coming soon" integrations at the end + if (a.comingSoon && !b.comingSoon) return 1; + if (!a.comingSoon && b.comingSoon) return -1; + // Sort by installation count in descending order + return (b._count.installations || 0) - (a._count.installations || 0); + }); + }); + const categories = Object.keys(groupedIntegrations).sort( (a, b) => CATEGORY_ORDER.indexOf(a as any) - CATEGORY_ORDER.indexOf(b as any),