Merge branch 'dev' into clients-user

src/app/[orgId]/settings/sites/[niceId]/credentials/page.tsx

@@ -0,0 +1,193 @@
+"use client";
+
+import { useState } from "react";
+import {
+    SettingsContainer,
+    SettingsSection,
+    SettingsSectionBody,
+    SettingsSectionDescription,
+    SettingsSectionHeader,
+    SettingsSectionTitle
+} from "@app/components/Settings";
+import { Button } from "@app/components/ui/button";
+import { createApiClient, formatAxiosError } from "@app/lib/api";
+import { useEnvContext } from "@app/hooks/useEnvContext";
+import { toast } from "@app/hooks/useToast";
+import { useParams, useRouter } from "next/navigation";
+import { useTranslations } from "next-intl";
+import { PickSiteDefaultsResponse } from "@server/routers/site";
+import { useSiteContext } from "@app/hooks/useSiteContext";
+import { generateKeypair } from "../wireguardConfig";
+import RegenerateCredentialsModal from "@app/components/RegenerateCredentialsModal";
+import { useLicenseStatusContext } from "@app/hooks/useLicenseStatusContext";
+import { useSubscriptionStatusContext } from "@app/hooks/useSubscriptionStatusContext";
+import { build } from "@server/build";
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@app/components/ui/tooltip";
+
+export default function CredentialsPage() {
+    const { env } = useEnvContext();
+    const api = createApiClient({ env });
+    const { orgId } = useParams();
+    const router = useRouter();
+    const t = useTranslations();
+    const { site } = useSiteContext();
+
+    const [modalOpen, setModalOpen] = useState(false);
+    const [siteDefaults, setSiteDefaults] = useState<PickSiteDefaultsResponse | null>(null);
+    const [wgConfig, setWgConfig] = useState("");
+    const [publicKey, setPublicKey] = useState("");
+
+    const { licenseStatus, isUnlocked } = useLicenseStatusContext();
+    const subscription = useSubscriptionStatusContext();
+
+    const isSecurityFeatureDisabled = () => {
+        const isEnterpriseNotLicensed = build === "enterprise" && !isUnlocked();
+        const isSaasNotSubscribed =
+            build === "saas" && !subscription?.isSubscribed();
+        return isEnterpriseNotLicensed || isSaasNotSubscribed;
+    };
+
+
+    const hydrateWireGuardConfig = (
+        privateKey: string,
+        publicKey: string,
+        subnet: string,
+        address: string,
+        endpoint: string,
+        listenPort: string
+    ) => {
+        const config = `[Interface]
+Address = ${subnet}
+ListenPort = 51820
+PrivateKey = ${privateKey}
+
+[Peer]
+PublicKey = ${publicKey}
+AllowedIPs = ${address.split("/")[0]}/32
+Endpoint = ${endpoint}:${listenPort}
+PersistentKeepalive = 5`;
+        setWgConfig(config);
+        return config;
+    };
+
+    const handleConfirmRegenerate = async () => {
+        let generatedPublicKey = "";
+        let generatedWgConfig = "";
+
+        if (site?.type === "wireguard") {
+            const generatedKeypair = generateKeypair();
+            generatedPublicKey = generatedKeypair.publicKey;
+            setPublicKey(generatedPublicKey);
+
+            const res = await api.get(`/org/${orgId}/pick-site-defaults`);
+            if (res && res.status === 200) {
+                const data = res.data.data;
+                setSiteDefaults(data);
+
+                // generate config with the fetched data
+                generatedWgConfig = hydrateWireGuardConfig(
+                    generatedKeypair.privateKey,
+                    data.publicKey,
+                    data.subnet,
+                    data.address,
+                    data.endpoint,
+                    data.listenPort
+                );
+            }
+
+            await api.post(`/re-key/${site?.siteId}/regenerate-site-secret`, {
+                type: "wireguard",
+                subnet: res.data.data.subnet,
+                exitNodeId: res.data.data.exitNodeId,
+                pubKey: generatedPublicKey
+            });
+        }
+
+        if (site?.type === "newt") {
+            const res = await api.get(`/org/${orgId}/pick-site-defaults`);
+            if (res && res.status === 200) {
+                const data = res.data.data;
+                setSiteDefaults(data);
+
+                await api.post(`/re-key/${site?.siteId}/regenerate-site-secret`, {
+                    type: "newt",
+                    newtId: data.newtId,
+                    newtSecret: data.newtSecret
+                });
+            }
+        }
+
+        toast({
+            title: t("credentialsSaved"),
+            description: t("credentialsSavedDescription")
+        });
+
+        router.refresh();
+    };
+
+    const getCredentialType = () => {
+        if (site?.type === "wireguard") return "site-wireguard";
+        if (site?.type === "newt") return "site-newt";
+        return "site-newt";
+    };
+
+    const getCredentials = () => {
+        if (site?.type === "wireguard" && wgConfig) {
+            return { wgConfig };
+        }
+        if (site?.type === "newt" && siteDefaults) {
+            return {
+                Id: siteDefaults.newtId,
+                Secret: siteDefaults.newtSecret
+            };
+        }
+        return undefined;
+    };
+
+    return (
+        <SettingsContainer>
+            <SettingsSection>
+                <SettingsSectionHeader>
+                    <SettingsSectionTitle>
+                        {t("generatedcredentials")}
+                    </SettingsSectionTitle>
+                    <SettingsSectionDescription>
+                        {t("regenerateCredentials")}
+                    </SettingsSectionDescription>
+                </SettingsSectionHeader>
+
+                <SettingsSectionBody>
+                    <TooltipProvider>
+                        <Tooltip>
+                            <TooltipTrigger asChild>
+                                <div className="inline-block">
+                                    <Button
+                                        onClick={() => setModalOpen(true)}
+                                        disabled={isSecurityFeatureDisabled()}
+                                    >
+                                        {t("regeneratecredentials")}
+                                    </Button>
+                                </div>
+                            </TooltipTrigger>
+
+                            {isSecurityFeatureDisabled() && (
+                                <TooltipContent side="top">
+                                    {t("featureDisabledTooltip")}
+                                </TooltipContent>
+                            )}
+                        </Tooltip>
+                    </TooltipProvider>
+                </SettingsSectionBody>
+            </SettingsSection>
+
+            <RegenerateCredentialsModal
+                open={modalOpen}
+                onOpenChange={setModalOpen}
+                type={getCredentialType()}
+                onConfirmRegenerate={handleConfirmRegenerate}
+                dashboardUrl={env.app.dashboardUrl}
+                credentials={getCredentials()}
+            />
+        </SettingsContainer>
+    );
+}

src/app/[orgId]/settings/sites/[niceId]/general/page.tsx

@@ -15,7 +15,7 @@ import {
 import { Input } from "@/components/ui/input";
 import { useSiteContext } from "@app/hooks/useSiteContext";
 import { useForm } from "react-hook-form";
-import { toast } from "@app/hooks/useToast";
+import { toast, useToast } from "@app/hooks/useToast";
 import { useRouter } from "next/navigation";
 import {
     SettingsContainer,
@@ -36,7 +36,8 @@ import Link from "next/link";
 
 const GeneralFormSchema = z.object({
     name: z.string().nonempty("Name is required"),
-    dockerSocketEnabled: z.boolean().optional()
+    niceId: z.string().min(1).max(255).optional(),
+    dockerSocketEnabled: z.boolean().optional(),
 });
 
 type GeneralFormValues = z.infer<typeof GeneralFormSchema>;
@@ -46,20 +47,19 @@ export default function GeneralPage() {
 
     const { env } = useEnvContext();
     const api = createApiClient(useEnvContext());
-
-    const [loading, setLoading] = useState(false);
-    const [activeCidrTagIndex, setActiveCidrTagIndex] = useState<number | null>(
-        null
-    );
-
     const router = useRouter();
     const t = useTranslations();
+    const { toast } = useToast();
+
+    const [loading, setLoading] = useState(false);
+    const [activeCidrTagIndex, setActiveCidrTagIndex] = useState<number | null>(null);
 
     const form = useForm({
         resolver: zodResolver(GeneralFormSchema),
         defaultValues: {
             name: site?.name,
-            dockerSocketEnabled: site?.dockerSocketEnabled ?? false
+            niceId: site?.niceId || "",
+            dockerSocketEnabled: site?.dockerSocketEnabled ?? false,
         },
         mode: "onChange"
     });
@@ -67,31 +67,34 @@ export default function GeneralPage() {
     async function onSubmit(data: GeneralFormValues) {
         setLoading(true);
 
-        await api
-            .post(`/site/${site?.siteId}`, {
+        try {
+            await api.post(`/site/${site?.siteId}`, {
                 name: data.name,
-                dockerSocketEnabled: data.dockerSocketEnabled
-            })
-            .catch((e) => {
-                toast({
-                    variant: "destructive",
-                    title: t("siteErrorUpdate"),
-                    description: formatAxiosError(
-                        e,
-                        t("siteErrorUpdateDescription")
-                    )
-                });
+                niceId: data.niceId,
+                dockerSocketEnabled: data.dockerSocketEnabled,
             });
 
-        updateSite({
-            name: data.name,
-            dockerSocketEnabled: data.dockerSocketEnabled
-        });
+            updateSite({
+                name: data.name,
+                niceId: data.niceId,
+                dockerSocketEnabled: data.dockerSocketEnabled,
+            });
 
-        toast({
-            title: t("siteUpdated"),
-            description: t("siteUpdatedDescription")
-        });
+            if (data.niceId && data.niceId !== site?.niceId) {
+                router.replace(`/${site?.orgId}/settings/sites/${data.niceId}/general`);
+            }
+
+            toast({
+                title: t("siteUpdated"),
+                description: t("siteUpdatedDescription")
+            });
+        } catch (e) {
+            toast({
+                variant: "destructive",
+                title: t("siteErrorUpdate"),
+                description: formatAxiosError(e, t("siteErrorUpdateDescription"))
+            });
+        }
 
         setLoading(false);
 
@@ -132,6 +135,24 @@ export default function GeneralPage() {
                                     )}
                                 />
 
+                                <FormField
+                                    control={form.control}
+                                    name="niceId"
+                                    render={({ field }) => (
+                                        <FormItem>
+                                            <FormLabel>{t("identifier")}</FormLabel>
+                                            <FormControl>
+                                                <Input
+                                                    {...field}
+                                                    placeholder={t("enterIdentifier")}
+                                                    className="flex-1"
+                                                />
+                                            </FormControl>
+                                            <FormMessage />
+                                        </FormItem>
+                                    )}
+                                />
+
                                 {site && site.type === "newt" && (
                                     <FormField
                                         control={form.control}

src/app/[orgId]/settings/sites/[niceId]/layout.tsx

@@ -8,6 +8,7 @@ import { HorizontalTabs } from "@app/components/HorizontalTabs";
 import SettingsSectionTitle from "@app/components/SettingsSectionTitle";
 import SiteInfoCard from "../../../../../components/SiteInfoCard";
 import { getTranslations } from "next-intl/server";
+import { build } from "@server/build";
 
 interface SettingsLayoutProps {
     children: React.ReactNode;
@@ -35,14 +36,23 @@ export default async function SettingsLayout(props: SettingsLayoutProps) {
     const navItems = [
         {
             title: t('general'),
-            href: "/{orgId}/settings/sites/{niceId}/general"
-        }
+            href: `/${params.orgId}/settings/sites/${params.niceId}/general`,
+        },
+        ...(site.type !== 'local' && build === 'enterprise'
+            ? [
+                {
+                    title: t('credentials'),
+                    href: `/${params.orgId}/settings/sites/${params.niceId}/credentials`,
+                },
+            ]
+            : []),
     ];
 
+
     return (
         <>
             <SettingsSectionTitle
-                title={t('siteSetting', {siteName: site?.name})}
+                title={t('siteSetting', { siteName: site?.name })}
                 description={t('siteSettingDescription')}
             />