diff --git a/apps/web/ui/modals/link-builder/utm-templates-combo.tsx b/apps/web/ui/modals/link-builder/utm-templates-combo.tsx index fb2f7752ab..9d494aca23 100644 --- a/apps/web/ui/modals/link-builder/utm-templates-combo.tsx +++ b/apps/web/ui/modals/link-builder/utm-templates-combo.tsx @@ -3,9 +3,10 @@ import useWorkspace from "@/lib/swr/use-workspace"; import { UtmTemplateProps } from "@/lib/types"; import { UTM_PARAMETERS } from "@/ui/links/utm-builder"; -import { Combobox, Tooltip } from "@dub/ui"; -import { Note } from "@dub/ui/src/icons"; +import { Button, Combobox, Tooltip } from "@dub/ui"; +import { DiamondTurnRight } from "@dub/ui/src/icons"; import { fetcher, getParamsFromURL } from "@dub/utils"; +import { useRouter } from "next/navigation"; import { Fragment } from "react"; import { useFormContext } from "react-hook-form"; import { toast } from "sonner"; @@ -83,8 +84,8 @@ export function UTMTemplatesCombo({ }} placeholder="Templates" searchPlaceholder="Load or save a template..." - emptyState="No templates found" - icon={Note} + emptyState={} + icon={DiamondTurnRight} createLabel={(search) => `Save new template: "${search}"`} onCreate={async (search) => { try { @@ -121,3 +122,27 @@ export function UTMTemplatesCombo({ /> ); } + +const NoUTMTemplatesFound = () => { + const router = useRouter(); + const { slug } = useWorkspace(); + + return ( +
+
+ +
+

No UTM templates found

+

+ Add a UTM template to easily create links with the same UTM parameters. +

+
+
+
+ ); +};