initial setup for viewing domain details

messages/en-US.json

@@ -1896,5 +1896,8 @@
     "certResolverDescription": "Select the certificate resolver to use for this resource.",
     "selectCertResolver": "Select Certificate Resolver",
     "enterCustomResolver": "Enter Custom Resolver",
-    "preferWildcardCert": "Prefer Wildcard Certificate"
+    "preferWildcardCert": "Prefer Wildcard Certificate",
+    "unverified": "Unverified",
+    "domainSetting": "DomainSetting",
+    "domainSettingDescription": "Configure settings for your domain"
 }

server/auth/actions.ts

@@ -81,6 +81,7 @@ export enum ActionsEnum {
     listClients = "listClients",
     getClient = "getClient",
     listOrgDomains = "listOrgDomains",
+    getDomain = "getDomain",
     createNewt = "createNewt",
     createIdp = "createIdp",
     updateIdp = "updateIdp",

server/routers/domain/getDomain.ts

@@ -0,0 +1,86 @@
+import { Request, Response, NextFunction } from "express";
+import { z } from "zod";
+import { db, domains } from "@server/db";
+import { eq, and } from "drizzle-orm";
+import response from "@server/lib/response";
+import HttpCode from "@server/types/HttpCode";
+import createHttpError from "http-errors";
+import logger from "@server/logger";
+import { fromError } from "zod-validation-error";
+import { OpenAPITags, registry } from "@server/openApi";
+import { domain } from "zod/v4/core/regexes";
+
+const getDomainSchema = z
+    .object({
+        domainId: z
+            .string()
+            .optional(),
+        orgId: z.string().optional()
+    })
+    .strict();
+
+async function query(domainId?: string, orgId?: string) {
+    if (domainId) {
+        const [res] = await db
+            .select()
+            .from(domains)
+            .where(eq(domains.domainId, domainId))
+            .limit(1);
+        return res;
+    }
+}
+
+export type GetDomainResponse = NonNullable<Awaited<ReturnType<typeof query>>>;
+
+registry.registerPath({
+    method: "get",
+    path: "/org/{orgId}/domain/{domainId}",
+    description: "Get a domain by domainId.",
+    tags: [OpenAPITags.Domain],
+    request: {
+        params: z.object({
+            domainId: z.string(),
+            orgId: z.string()
+        })
+    },
+    responses: {}
+});
+
+export async function getDomain(
+    req: Request,
+    res: Response,
+    next: NextFunction
+): Promise<any> {
+    try {
+        const parsedParams = getDomainSchema.safeParse(req.params);
+        if (!parsedParams.success) {
+            return next(
+                createHttpError(
+                    HttpCode.BAD_REQUEST,
+                    fromError(parsedParams.error).toString()
+                )
+            );
+        }
+
+        const { orgId, domainId } = parsedParams.data;
+
+        const domain = await query(domainId, orgId);
+
+        if (!domain) {
+            return next(createHttpError(HttpCode.NOT_FOUND, "Domain not found"));
+        }
+
+        return response<GetDomainResponse>(res, {
+            data: domain,
+            success: true,
+            error: false,
+            message: "Domain retrieved successfully",
+            status: HttpCode.OK
+        });
+    } catch (error) {
+        logger.error(error);
+        return next(
+            createHttpError(HttpCode.INTERNAL_SERVER_ERROR, "An error occurred")
+        );
+    }
+}

server/routers/domain/index.ts

@@ -1,4 +1,5 @@
 export * from "./listDomains";
 export * from "./createOrgDomain";
 export * from "./deleteOrgDomain";
-export * from "./restartOrgDomain";
+export * from "./restartOrgDomain";
+export * from "./getDomain";

server/routers/external.ts

@@ -302,6 +302,13 @@ authenticated.get(
     domain.listDomains
 );
 
+authenticated.get(
+    "/org/:orgId/domain/:domainId",
+    verifyOrgAccess,
+    verifyUserHasAction(ActionsEnum.getDomain),
+    domain.getDomain
+);
+
 authenticated.get(
     "/org/:orgId/invitations",
     verifyOrgAccess,

src/app/[orgId]/settings/domains/[domainId]/layout.tsx

@@ -0,0 +1,50 @@
+import { internal } from "@app/lib/api";
+import { AxiosResponse } from "axios";
+import { redirect } from "next/navigation";
+import { authCookieHeader } from "@app/lib/api/cookies";
+import SettingsSectionTitle from "@app/components/SettingsSectionTitle";
+import { getTranslations } from "next-intl/server";
+import { GetDomainResponse } from "@server/routers/domain/getDomain";
+import DomainProvider from "@app/providers/DomainProvider";
+import DomainInfoCard from "@app/components/DomainInfoCard";
+
+interface SettingsLayoutProps {
+    children: React.ReactNode;
+    params: Promise<{ domainId: string; orgId: string }>;
+}
+
+export default async function SettingsLayout(props: SettingsLayoutProps) {
+    const params = await props.params;
+
+    const { children } = props;
+
+    let domain = null;
+    try {
+        const res = await internal.get<AxiosResponse<GetDomainResponse>>(
+            `/org/${params.orgId}/domain/${params.domainId}`,
+            await authCookieHeader()
+        );
+        domain = res.data.data;
+        console.log(JSON.stringify(domain));
+    } catch {
+        redirect(`/${params.orgId}/settings/domains`);
+    }
+
+    const t = await getTranslations();
+
+
+    return (
+        <>
+            <SettingsSectionTitle
+                title={domain ? domain.baseDomain : t('domainSetting')}
+                description={t('domainSettingDescription')}
+            />
+
+            <DomainProvider domain={domain}>
+                <div className="space-y-6">
+                    <DomainInfoCard />
+                </div>
+            </DomainProvider>
+        </>
+    );
+}

src/app/[orgId]/settings/domains/[domainId]/page.tsx

@@ -0,0 +1,8 @@
+import { redirect } from "next/navigation";
+
+export default async function DomainPage(props: {
+    params: Promise<{ orgId: string; domainId: string }>;
+}) {
+    const params = await props.params;
+    redirect(`/${params.orgId}/settings/domains/${params.domainId}`);
+}

src/components/DomainInfoCard.tsx

@@ -0,0 +1,59 @@
+"use client";
+
+import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
+import { InfoIcon } from "lucide-react";
+import {
+    InfoSection,
+    InfoSectionContent,
+    InfoSections,
+    InfoSectionTitle
+} from "@app/components/InfoSection";
+import { useTranslations } from "next-intl";
+import { useEnvContext } from "@app/hooks/useEnvContext";
+import { useDomainContext } from "@app/hooks/useDomainContext";
+
+type DomainInfoCardProps = {};
+
+export default function DomainInfoCard({ }: DomainInfoCardProps) {
+    const { domain, updateDomain } = useDomainContext();
+    const t = useTranslations();
+    const { env } = useEnvContext();
+
+
+    return (
+        <Alert>
+            <AlertDescription>
+                <InfoSections cols={env.flags.enableClients ? 3 : 2}>
+                    <InfoSection>
+                        <InfoSectionTitle>
+                            {t("type")}
+                        </InfoSectionTitle>
+                        <InfoSectionContent>
+                            <span>
+                                {domain.type}
+                            </span>
+                        </InfoSectionContent>
+                    </InfoSection>
+                    <InfoSection>
+                        <InfoSectionTitle>
+                            {t("status")}
+                        </InfoSectionTitle>
+                        <InfoSectionContent>
+                            {domain.verified ? (
+                                <div className="text-green-500 flex items-center space-x-2">
+                                    <div className="w-2 h-2 bg-green-500 rounded-full"></div>
+                                    <span>{t("verified")}</span>
+                                </div>
+                            ) : (   
+                                <div className="text-neutral-500 flex items-center space-x-2">
+                                    <div className="w-2 h-2 bg-gray-500 rounded-full"></div>
+                                    <span>{t("unverified")}</span>
+                                </div>
+                            )}
+                        </InfoSectionContent>
+                    </InfoSection>
+                </InfoSections>
+            </AlertDescription>
+        </Alert>
+    );
+}

src/contexts/domainContext.ts

@@ -0,0 +1,11 @@
+import { GetDomainResponse } from "@server/routers/domain/getDomain";
+import { createContext } from "react";
+
+interface DomainContextType {
+    domain: GetDomainResponse;
+    updateDomain: (updatedDomain: Partial<GetDomainResponse>) => void;
+}
+
+const DomainContext = createContext<DomainContextType | undefined>(undefined);
+
+export default DomainContext;

src/hooks/useDomainContext.ts

@@ -0,0 +1,10 @@
+import DomainContext from "@app/contexts/domainContext";
+import { useContext } from "react";
+
+export function useDomainContext() {
+    const context = useContext(DomainContext);
+    if (context === undefined) {
+        throw new Error('useDomainContext must be used within a DomainProvider');
+    }
+    return context;
+}

src/providers/DomainProvider.tsx

@@ -0,0 +1,43 @@
+"use client";
+
+import { useState } from "react";
+import { useTranslations } from "next-intl";
+import { GetDomainResponse } from "@server/routers/domain/getDomain";
+import DomainContext from "@app/contexts/domainContext";
+
+interface DomainProviderProps {
+    children: React.ReactNode;
+    domain: GetDomainResponse;
+}
+
+export function DomainProvider({
+    children,
+    domain: serverDomain
+}: DomainProviderProps) {
+    const [domain, setDomain] = useState<GetDomainResponse>(serverDomain);
+
+    const t = useTranslations();
+
+    const updateDomain = (updatedDomain: Partial<GetDomainResponse>) => {
+        if (!domain) {
+            throw new Error(t('domainErrorNoUpdate'));
+        }
+        setDomain((prev) => {
+            if (!prev) {
+                return prev;
+            }
+            return {
+                ...prev,
+                ...updatedDomain
+            };
+        });
+    };
+
+    return (
+        <DomainContext.Provider value={{ domain, updateDomain }}>
+            {children}
+        </DomainContext.Provider>
+    );
+}
+
+export default DomainProvider;