From f10271890144224cba8f9e2e4025368ecd5b2b47 Mon Sep 17 00:00:00 2001
From: Pallavi Kumari <pallavilpmt1995@gmail.com>
Date: Thu, 16 Oct 2025 16:27:31 +0530
Subject: [PATCH] add edit button to domain table

---
 src/app/[orgId]/settings/domains/page.tsx |  2 +-
 src/components/DomainsTable.tsx           | 54 ++++++++++++++++++++---
 2 files changed, 49 insertions(+), 7 deletions(-)

diff --git a/src/app/[orgId]/settings/domains/page.tsx b/src/app/[orgId]/settings/domains/page.tsx
index cb587d92..2c667b3a 100644
--- a/src/app/[orgId]/settings/domains/page.tsx
+++ b/src/app/[orgId]/settings/domains/page.tsx
@@ -60,7 +60,7 @@ export default async function DomainsPage(props: Props) {
                     title={t("domains")}
                     description={t("domainsDescription")}
                 />
-                <DomainsTable domains={domains} />
+                <DomainsTable domains={domains} orgId={org.org.orgId} />
             </OrgProvider>
         </>
     );
diff --git a/src/components/DomainsTable.tsx b/src/components/DomainsTable.tsx
index 02f1854d..51aa951a 100644
--- a/src/components/DomainsTable.tsx
+++ b/src/components/DomainsTable.tsx
@@ -3,7 +3,7 @@
 import { ColumnDef } from "@tanstack/react-table";
 import { DomainsDataTable } from "@app/components/DomainsDataTable";
 import { Button } from "@app/components/ui/button";
-import { ArrowUpDown } from "lucide-react";
+import { ArrowRight, ArrowUpDown, MoreHorizontal } from "lucide-react";
 import { useState } from "react";
 import ConfirmDeleteDialog from "@app/components/ConfirmDeleteDialog";
 import { formatAxiosError } from "@app/lib/api";
@@ -15,6 +15,8 @@ import { useTranslations } from "next-intl";
 import CreateDomainForm from "@app/components/CreateDomainForm";
 import { useToast } from "@app/hooks/useToast";
 import { useOrgContext } from "@app/hooks/useOrgContext";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "./ui/dropdown-menu";
+import Link from "next/link";
 
 export type DomainRow = {
     domainId: string;
@@ -30,9 +32,10 @@ export type DomainRow = {
 
 type Props = {
     domains: DomainRow[];
+    orgId: string;
 };
 
-export default function DomainsTable({ domains }: Props) {
+export default function DomainsTable({ domains, orgId }: Props) {
     const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
     const [isCreateModalOpen, setIsCreateModalOpen] = useState(false);
     const [selectedDomain, setSelectedDomain] = useState<DomainRow | null>(
@@ -207,12 +210,51 @@ export default function DomainsTable({ domains }: Props) {
                             >
                                 {isRestarting
                                     ? t("restarting", {
-                                          fallback: "Restarting..."
-                                      })
+                                        fallback: "Restarting..."
+                                    })
                                     : t("restart", { fallback: "Restart" })}
                             </Button>
                         )}
-                        <Button
+                        <div className="flex items-center justify-end gap-2">
+                            <DropdownMenu>
+                                <DropdownMenuTrigger asChild>
+                                    <Button variant="ghost" className="h-8 w-8 p-0">
+                                        <span className="sr-only">Open menu</span>
+                                        <MoreHorizontal className="h-4 w-4" />
+                                    </Button>
+                                </DropdownMenuTrigger>
+                                <DropdownMenuContent align="end">
+                                    <Link
+                                        className="block w-full"
+                                        href={`/${orgId}/settings/domains/${domain.domainId}`}
+                                    >
+                                        <DropdownMenuItem>
+                                            {t("viewSettings")}
+                                        </DropdownMenuItem>
+                                    </Link>
+                                    <DropdownMenuItem
+                                        onClick={() => {
+                                            setSelectedDomain(domain);
+                                            setIsDeleteModalOpen(true);
+                                        }}
+                                    >
+                                        <span className="text-red-500">
+                                            {t("delete")}
+                                        </span>
+                                    </DropdownMenuItem>
+                                </DropdownMenuContent>
+                            </DropdownMenu>
+
+                            <Link
+                                href={`/${orgId}/settings/domains/${domain.domainId}`}
+                            >
+                                <Button variant={"secondary"} size="sm">
+                                    {t("edit")}
+                                    <ArrowRight className="ml-2 w-4 h-4" />
+                                </Button>
+                            </Link>
+                        </div>
+                        {/* <Button
                             variant="secondary"
                             size="sm"
                             disabled={domain.configManaged}
@@ -222,7 +264,7 @@ export default function DomainsTable({ domains }: Props) {
                             }}
                         >
                             {t("delete")}
-                        </Button>
+                        </Button> */}
                     </div>
                 );
             }