auto open checkout modal

src/components/GenerateLicenseKeysTable.tsx

@@ -10,8 +10,8 @@ import { Badge } from "./ui/badge";
 import moment from "moment";
 import { DataTable } from "./ui/data-table";
 import { GeneratedLicenseKey } from "@server/routers/generatedLicense/types";
-import { useState } from "react";
-import { useRouter } from "next/navigation";
+import { useState, useEffect } from "react";
+import { useRouter, useSearchParams } from "next/navigation";
 import { toast } from "@app/hooks/useToast";
 import { createApiClient, formatAxiosError } from "@app/lib/api";
 import { useEnvContext } from "@app/hooks/useEnvContext";
@@ -29,12 +29,15 @@ function obfuscateLicenseKey(key: string): string {
     return `${firstPart}••••••••••••••••••••${lastPart}`;
 }
 
+const GENERATE_QUERY = "generate";
+
 export default function GenerateLicenseKeysTable({
     licenseKeys,
     orgId
 }: GnerateLicenseKeysTableProps) {
     const t = useTranslations();
     const router = useRouter();
+    const searchParams = useSearchParams();
 
     const { env } = useEnvContext();
     const api = createApiClient({ env });
@@ -42,6 +45,19 @@ export default function GenerateLicenseKeysTable({
     const [isRefreshing, setIsRefreshing] = useState(false);
     const [showGenerateForm, setShowGenerateForm] = useState(false);
 
+    useEffect(() => {
+        if (searchParams.get(GENERATE_QUERY) !== null) {
+            setShowGenerateForm(true);
+            const next = new URLSearchParams(searchParams);
+            next.delete(GENERATE_QUERY);
+            const qs = next.toString();
+            const url = qs
+                ? `${window.location.pathname}?${qs}`
+                : window.location.pathname;
+            window.history.replaceState(null, "", url);
+        }
+    }, [searchParams]);
+
     const handleLicenseGenerated = () => {
         // Refresh the data after license is generated
         refreshData();