add edit button to domain table

This commit is contained in:
Pallavi Kumari
2025-10-16 16:27:31 +05:30
parent 9d452efc7d
commit f102718901
2 changed files with 49 additions and 7 deletions

View File

@@ -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>
</>
);

View File

@@ -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>
);
}