mirror of
https://github.com/fosrl/pangolin.git
synced 2026-03-03 09:16:40 +00:00
Merge branch 'dev' into feat/device-approvals
This commit is contained in:
Fred KISSIE
@@ -62,6 +62,7 @@ export default function GeneralPage() {
|
||||
const [variant, setVariant] = useState<"oidc" | "google" | "azure">("oidc");
|
||||
const { isUnlocked } = useLicenseStatusContext();
|
||||
|
||||
const dashboardRedirectUrl = `${env.app.dashboardUrl}/auth/idp/${idpId}/oidc/callback`;
|
||||
const [redirectUrl, setRedirectUrl] = useState(
|
||||
`${env.app.dashboardUrl}/auth/idp/${idpId}/oidc/callback`
|
||||
);
|
||||
@@ -423,11 +424,18 @@ export default function GeneralPage() {
|
||||
<InfoSections cols={3}>
|
||||
<InfoSection>
|
||||
<InfoSectionTitle>
|
||||
{t("redirectUrl")}
|
||||
{t("orgIdpRedirectUrls")}
|
||||
</InfoSectionTitle>
|
||||
<InfoSectionContent>
|
||||
<CopyToClipboard text={redirectUrl} />
|
||||
</InfoSectionContent>
|
||||
{redirectUrl !== dashboardRedirectUrl && (
|
||||
<InfoSectionContent>
|
||||
<CopyToClipboard
|
||||
text={dashboardRedirectUrl}
|
||||
/>
|
||||
</InfoSectionContent>
|
||||
)}
|
||||
</InfoSection>
|
||||
</InfoSections>
|
||||
|
||||
|
||||
@@ -285,7 +285,7 @@ export default function Page() {
|
||||
<Button
|
||||
variant="outline"
|
||||
onClick={() => {
|
||||
router.push("/admin/idp");
|
||||
router.push(`/${params.orgId}/settings/idp`);
|
||||
}}
|
||||
>
|
||||
{t("idpSeeAll")}
|
||||
|
||||
@@ -1,17 +1,10 @@
|
||||
import { internal, priv } from "@app/lib/api";
|
||||
import { internal } from "@app/lib/api";
|
||||
import { authCookieHeader } from "@app/lib/api/cookies";
|
||||
import { AxiosResponse } from "axios";
|
||||
import SettingsSectionTitle from "@app/components/SettingsSectionTitle";
|
||||
import IdpTable, { IdpRow } from "@app/components/private/OrgIdpTable";
|
||||
import { getTranslations } from "next-intl/server";
|
||||
import { Alert, AlertDescription } from "@app/components/ui/alert";
|
||||
import { cache } from "react";
|
||||
import {
|
||||
GetOrgSubscriptionResponse,
|
||||
GetOrgTierResponse
|
||||
} from "@server/routers/billing/types";
|
||||
import { TierId } from "@server/lib/billing/tiers";
|
||||
import { build } from "@server/build";
|
||||
import { PaidFeaturesAlert } from "@app/components/PaidFeaturesAlert";
|
||||
|
||||
type OrgIdpPageProps = {
|
||||
params: Promise<{ orgId: string }>;
|
||||
@@ -35,21 +28,6 @@ export default async function OrgIdpPage(props: OrgIdpPageProps) {
|
||||
|
||||
const t = await getTranslations();
|
||||
|
||||
let subscriptionStatus: GetOrgTierResponse | null = null;
|
||||
try {
|
||||
const getSubscription = cache(() =>
|
||||
priv.get<AxiosResponse<GetOrgTierResponse>>(
|
||||
`/org/${params.orgId}/billing/tier`
|
||||
)
|
||||
);
|
||||
const subRes = await getSubscription();
|
||||
subscriptionStatus = subRes.data.data;
|
||||
} catch {}
|
||||
const subscribed =
|
||||
build === "enterprise"
|
||||
? true
|
||||
: subscriptionStatus?.tier === TierId.STANDARD;
|
||||
|
||||
return (
|
||||
<>
|
||||
<SettingsSectionTitle
|
||||
@@ -57,13 +35,7 @@ export default async function OrgIdpPage(props: OrgIdpPageProps) {
|
||||
description={t("idpManageDescription")}
|
||||
/>
|
||||
|
||||
{build === "saas" && !subscribed ? (
|
||||
<Alert variant="info" className="mb-6">
|
||||
<AlertDescription>
|
||||
{t("idpDisabled")} {t("subscriptionRequiredToUse")}
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
) : null}
|
||||
<PaidFeaturesAlert />
|
||||
|
||||
<IdpTable idps={idps} orgId={params.orgId} />
|
||||
</>
|
||||
|
||||
@@ -25,7 +25,7 @@ import { createElement, useEffect, useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
import { Input } from "@app/components/ui/input";
|
||||
import { InfoIcon, Terminal } from "lucide-react";
|
||||
import { ChevronDown, ChevronUp, InfoIcon, Terminal } from "lucide-react";
|
||||
import { Button } from "@app/components/ui/button";
|
||||
import CopyTextBox from "@app/components/CopyTextBox";
|
||||
import CopyToClipboard from "@app/components/CopyToClipboard";
|
||||
@@ -121,6 +121,7 @@ export default function Page() {
|
||||
const [olmCommand, setOlmCommand] = useState("");
|
||||
|
||||
const [createLoading, setCreateLoading] = useState(false);
|
||||
const [showAdvancedSettings, setShowAdvancedSettings] = useState(false);
|
||||
|
||||
const [clientDefaults, setClientDefaults] =
|
||||
useState<PickClientDefaultsResponse | null>(null);
|
||||
@@ -443,33 +444,54 @@ export default function Page() {
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="subnet"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>
|
||||
{t("clientAddress")}
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
autoComplete="off"
|
||||
placeholder={t(
|
||||
"subnetPlaceholder"
|
||||
<div className="flex items-center justify-end md:col-start-2">
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={() =>
|
||||
setShowAdvancedSettings(
|
||||
!showAdvancedSettings
|
||||
)
|
||||
}
|
||||
className="flex items-center gap-2"
|
||||
>
|
||||
{showAdvancedSettings ? (
|
||||
<ChevronUp className="h-4 w-4" />
|
||||
) : (
|
||||
<ChevronDown className="h-4 w-4" />
|
||||
)}
|
||||
{t("advancedSettings")}
|
||||
</Button>
|
||||
</div>
|
||||
{showAdvancedSettings && (
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="subnet"
|
||||
render={({ field }) => (
|
||||
<FormItem className="md:col-start-1 md:col-span-2">
|
||||
<FormLabel>
|
||||
{t("clientAddress")}
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
autoComplete="off"
|
||||
placeholder={t(
|
||||
"subnetPlaceholder"
|
||||
)}
|
||||
{...field}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
<FormDescription>
|
||||
{t(
|
||||
"addressDescription"
|
||||
)}
|
||||
{...field}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
<FormDescription>
|
||||
{t(
|
||||
"addressDescription"
|
||||
)}
|
||||
</FormDescription>
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</FormDescription>
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
)}
|
||||
</form>
|
||||
</Form>
|
||||
</SettingsSectionBody>
|
||||
|
||||
@@ -3,6 +3,7 @@ import { HorizontalTabs, type TabItem } from "@app/components/HorizontalTabs";
|
||||
import { verifySession } from "@app/lib/auth/verifySession";
|
||||
import OrgProvider from "@app/providers/OrgProvider";
|
||||
import OrgUserProvider from "@app/providers/OrgUserProvider";
|
||||
import OrgInfoCard from "@app/components/OrgInfoCard";
|
||||
|
||||
import { redirect } from "next/navigation";
|
||||
import { getTranslations } from "next-intl/server";
|
||||
@@ -68,7 +69,12 @@ export default async function GeneralSettingsPage({
|
||||
description={t("orgSettingsDescription")}
|
||||
/>
|
||||
|
||||
<HorizontalTabs items={navItems}>{children}</HorizontalTabs>
|
||||
<div className="space-y-6">
|
||||
<OrgInfoCard />
|
||||
<HorizontalTabs items={navItems}>
|
||||
{children}
|
||||
</HorizontalTabs>
|
||||
</div>
|
||||
</OrgUserProvider>
|
||||
</OrgProvider>
|
||||
</>
|
||||
|
||||
@@ -236,6 +236,7 @@ function DeleteForm({ org }: SectionFormProps) {
|
||||
}
|
||||
|
||||
function GeneralSectionForm({ org }: SectionFormProps) {
|
||||
const { updateOrg } = useOrgContext();
|
||||
const form = useForm({
|
||||
resolver: zodResolver(
|
||||
GeneralFormSchema.pick({
|
||||
@@ -269,6 +270,11 @@ function GeneralSectionForm({ org }: SectionFormProps) {
|
||||
// Update organization
|
||||
await api.post(`/org/${org.orgId}`, reqData);
|
||||
|
||||
// Update the org context to reflect the change in the info card
|
||||
updateOrg({
|
||||
name: data.name
|
||||
});
|
||||
|
||||
toast({
|
||||
title: t("orgUpdated"),
|
||||
description: t("orgUpdatedDescription")
|
||||
@@ -315,22 +321,6 @@ function GeneralSectionForm({ org }: SectionFormProps) {
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="subnet"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>{t("subnet")}</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} disabled={true} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
<FormDescription>
|
||||
{t("subnetDescription")}
|
||||
</FormDescription>
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</form>
|
||||
</Form>
|
||||
</SettingsSectionForm>
|
||||
|
||||
@@ -71,7 +71,7 @@ export default async function ClientResourcesPage(
|
||||
niceId: siteResource.niceId,
|
||||
tcpPortRangeString: siteResource.tcpPortRangeString || null,
|
||||
udpPortRangeString: siteResource.udpPortRangeString || null,
|
||||
disableIcmp: siteResource.disableIcmp || false,
|
||||
disableIcmp: siteResource.disableIcmp || false
|
||||
};
|
||||
}
|
||||
);
|
||||
|
||||
@@ -16,7 +16,6 @@ import { SwitchInput } from "@app/components/SwitchInput";
|
||||
import { Tag, TagInput } from "@app/components/tags/tag-input";
|
||||
import { Alert, AlertDescription, AlertTitle } from "@app/components/ui/alert";
|
||||
import { Button } from "@app/components/ui/button";
|
||||
import { CheckboxWithLabel } from "@app/components/ui/checkbox";
|
||||
import {
|
||||
Form,
|
||||
FormControl,
|
||||
@@ -184,9 +183,6 @@ export default function ResourceAuthenticationPage() {
|
||||
|
||||
const [ssoEnabled, setSsoEnabled] = useState(resource.sso);
|
||||
|
||||
const [autoLoginEnabled, setAutoLoginEnabled] = useState(
|
||||
resource.skipToIdpId !== null && resource.skipToIdpId !== undefined
|
||||
);
|
||||
const [selectedIdpId, setSelectedIdpId] = useState<number | null>(
|
||||
resource.skipToIdpId || null
|
||||
);
|
||||
@@ -243,19 +239,8 @@ export default function ResourceAuthenticationPage() {
|
||||
text: w.email
|
||||
}))
|
||||
);
|
||||
if (autoLoginEnabled && !selectedIdpId && orgIdps.length > 0) {
|
||||
setSelectedIdpId(orgIdps[0].idpId);
|
||||
}
|
||||
hasInitializedRef.current = true;
|
||||
}, [
|
||||
pageLoading,
|
||||
resourceRoles,
|
||||
resourceUsers,
|
||||
whitelist,
|
||||
autoLoginEnabled,
|
||||
selectedIdpId,
|
||||
orgIdps
|
||||
]);
|
||||
}, [pageLoading, resourceRoles, resourceUsers, whitelist, orgIdps]);
|
||||
|
||||
const [, submitUserRolesForm, loadingSaveUsersRoles] = useActionState(
|
||||
onSubmitUsersRoles,
|
||||
@@ -269,16 +254,6 @@ export default function ResourceAuthenticationPage() {
|
||||
const data = usersRolesForm.getValues();
|
||||
|
||||
try {
|
||||
// Validate that an IDP is selected if auto login is enabled
|
||||
if (autoLoginEnabled && !selectedIdpId) {
|
||||
toast({
|
||||
variant: "destructive",
|
||||
title: t("error"),
|
||||
description: t("selectIdpRequired")
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
const jobs = [
|
||||
api.post(`/resource/${resource.resourceId}/roles`, {
|
||||
roleIds: data.roles.map((i) => parseInt(i.id))
|
||||
@@ -288,7 +263,7 @@ export default function ResourceAuthenticationPage() {
|
||||
}),
|
||||
api.post(`/resource/${resource.resourceId}`, {
|
||||
sso: ssoEnabled,
|
||||
skipToIdpId: autoLoginEnabled ? selectedIdpId : null
|
||||
skipToIdpId: selectedIdpId
|
||||
})
|
||||
];
|
||||
|
||||
@@ -296,7 +271,7 @@ export default function ResourceAuthenticationPage() {
|
||||
|
||||
updateResource({
|
||||
sso: ssoEnabled,
|
||||
skipToIdpId: autoLoginEnabled ? selectedIdpId : null
|
||||
skipToIdpId: selectedIdpId
|
||||
});
|
||||
|
||||
updateAuthInfo({
|
||||
@@ -307,17 +282,18 @@ export default function ResourceAuthenticationPage() {
|
||||
title: t("resourceAuthSettingsSave"),
|
||||
description: t("resourceAuthSettingsSaveDescription")
|
||||
});
|
||||
await queryClient.invalidateQueries({
|
||||
predicate(query) {
|
||||
const resourceKey = resourceQueries.resourceClients({
|
||||
resourceId: resource.resourceId
|
||||
}).queryKey;
|
||||
return (
|
||||
query.queryKey[0] === resourceKey[0] &&
|
||||
query.queryKey[1] === resourceKey[1]
|
||||
);
|
||||
}
|
||||
});
|
||||
// invalidate resource queries
|
||||
await queryClient.invalidateQueries(
|
||||
resourceQueries.resourceUsers({
|
||||
resourceId: resource.resourceId
|
||||
})
|
||||
);
|
||||
await queryClient.invalidateQueries(
|
||||
resourceQueries.resourceRoles({
|
||||
resourceId: resource.resourceId
|
||||
})
|
||||
);
|
||||
|
||||
router.refresh();
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
@@ -397,7 +373,8 @@ export default function ResourceAuthenticationPage() {
|
||||
|
||||
api.post(`/resource/${resource.resourceId}/header-auth`, {
|
||||
user: null,
|
||||
password: null
|
||||
password: null,
|
||||
extendedCompatibility: null
|
||||
})
|
||||
.then(() => {
|
||||
toast({
|
||||
@@ -617,86 +594,53 @@ export default function ResourceAuthenticationPage() {
|
||||
)}
|
||||
|
||||
{ssoEnabled && allIdps.length > 0 && (
|
||||
<>
|
||||
<div className="space-y-2 mb-3">
|
||||
<CheckboxWithLabel
|
||||
label={t(
|
||||
"autoLoginExternalIdp"
|
||||
)}
|
||||
checked={autoLoginEnabled}
|
||||
onCheckedChange={(
|
||||
checked
|
||||
) => {
|
||||
setAutoLoginEnabled(
|
||||
checked as boolean
|
||||
<div className="space-y-2">
|
||||
<label className="text-sm font-medium">
|
||||
{t("defaultIdentityProvider")}
|
||||
</label>
|
||||
<Select
|
||||
onValueChange={(value) => {
|
||||
if (value === "none") {
|
||||
setSelectedIdpId(null);
|
||||
} else {
|
||||
setSelectedIdpId(
|
||||
parseInt(value)
|
||||
);
|
||||
if (
|
||||
checked &&
|
||||
allIdps.length > 0
|
||||
) {
|
||||
setSelectedIdpId(
|
||||
allIdps[0].id
|
||||
);
|
||||
} else {
|
||||
setSelectedIdpId(
|
||||
null
|
||||
);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
{t(
|
||||
"autoLoginExternalIdpDescription"
|
||||
)}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{autoLoginEnabled && (
|
||||
<div className="space-y-2">
|
||||
<label className="text-sm font-medium">
|
||||
{t("defaultIdentityProvider")}
|
||||
</label>
|
||||
<Select
|
||||
onValueChange={(
|
||||
value
|
||||
) =>
|
||||
setSelectedIdpId(
|
||||
parseInt(value)
|
||||
)
|
||||
}
|
||||
value={
|
||||
selectedIdpId
|
||||
? selectedIdpId.toString()
|
||||
: undefined
|
||||
}
|
||||
>
|
||||
<SelectTrigger className="w-full mt-1">
|
||||
<SelectValue
|
||||
placeholder={t(
|
||||
"selectIdpPlaceholder"
|
||||
)}
|
||||
/>
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{allIdps.map(
|
||||
(idp) => (
|
||||
<SelectItem
|
||||
key={
|
||||
idp.id
|
||||
}
|
||||
value={idp.id.toString()}
|
||||
>
|
||||
{
|
||||
idp.text
|
||||
}
|
||||
</SelectItem>
|
||||
)
|
||||
)}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
}
|
||||
}}
|
||||
value={
|
||||
selectedIdpId
|
||||
? selectedIdpId.toString()
|
||||
: "none"
|
||||
}
|
||||
>
|
||||
<SelectTrigger className="w-full mt-1">
|
||||
<SelectValue
|
||||
placeholder={t(
|
||||
"selectIdpPlaceholder"
|
||||
)}
|
||||
/>
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="none">
|
||||
{t("none")}
|
||||
</SelectItem>
|
||||
{allIdps.map((idp) => (
|
||||
<SelectItem
|
||||
key={idp.id}
|
||||
value={idp.id.toString()}
|
||||
>
|
||||
{idp.text}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
{t(
|
||||
"defaultIdentityProviderDescription"
|
||||
)}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</form>
|
||||
</Form>
|
||||
|
||||
@@ -11,6 +11,7 @@ import {
|
||||
FormMessage
|
||||
} from "@/components/ui/form";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Textarea } from "@/components/ui/textarea";
|
||||
import { useResourceContext } from "@app/hooks/useResourceContext";
|
||||
import {
|
||||
Credenza,
|
||||
@@ -41,7 +42,7 @@ import { createApiClient, formatAxiosError } from "@app/lib/api";
|
||||
import { finalizeSubdomainSanitize } from "@app/lib/subdomain-utils";
|
||||
import { UpdateResourceResponse } from "@server/routers/resource";
|
||||
import { AxiosResponse } from "axios";
|
||||
import { Globe } from "lucide-react";
|
||||
import { AlertCircle, Globe } from "lucide-react";
|
||||
import { useTranslations } from "next-intl";
|
||||
import { useParams, useRouter } from "next/navigation";
|
||||
import { toASCII, toUnicode } from "punycode";
|
||||
@@ -49,6 +50,378 @@ import { useActionState, useMemo, useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
import z from "zod";
|
||||
import { build } from "@server/build";
|
||||
import { useLicenseStatusContext } from "@app/hooks/useLicenseStatusContext";
|
||||
import { useSubscriptionStatusContext } from "@app/hooks/useSubscriptionStatusContext";
|
||||
import { Alert, AlertDescription } from "@app/components/ui/alert";
|
||||
import { RadioGroup, RadioGroupItem } from "@app/components/ui/radio-group";
|
||||
import {
|
||||
Tooltip,
|
||||
TooltipProvider,
|
||||
TooltipTrigger
|
||||
} from "@app/components/ui/tooltip";
|
||||
import { PaidFeaturesAlert } from "@app/components/PaidFeaturesAlert";
|
||||
import { GetResourceResponse } from "@server/routers/resource/getResource";
|
||||
import type { ResourceContextType } from "@app/contexts/resourceContext";
|
||||
|
||||
type MaintenanceSectionFormProps = {
|
||||
resource: GetResourceResponse;
|
||||
updateResource: ResourceContextType["updateResource"];
|
||||
};
|
||||
|
||||
function MaintenanceSectionForm({
|
||||
resource,
|
||||
updateResource
|
||||
}: MaintenanceSectionFormProps) {
|
||||
const { env } = useEnvContext();
|
||||
const t = useTranslations();
|
||||
const api = createApiClient({ env });
|
||||
const { isUnlocked } = useLicenseStatusContext();
|
||||
const subscription = useSubscriptionStatusContext();
|
||||
|
||||
const MaintenanceFormSchema = z.object({
|
||||
maintenanceModeEnabled: z.boolean().optional(),
|
||||
maintenanceModeType: z.enum(["forced", "automatic"]).optional(),
|
||||
maintenanceTitle: z.string().max(255).optional(),
|
||||
maintenanceMessage: z.string().max(2000).optional(),
|
||||
maintenanceEstimatedTime: z.string().max(100).optional()
|
||||
});
|
||||
|
||||
const maintenanceForm = useForm({
|
||||
resolver: zodResolver(MaintenanceFormSchema),
|
||||
defaultValues: {
|
||||
maintenanceModeEnabled: resource.maintenanceModeEnabled || false,
|
||||
maintenanceModeType: resource.maintenanceModeType || "automatic",
|
||||
maintenanceTitle:
|
||||
resource.maintenanceTitle || "We'll be back soon!",
|
||||
maintenanceMessage:
|
||||
resource.maintenanceMessage ||
|
||||
"We are currently performing scheduled maintenance. Please check back soon.",
|
||||
maintenanceEstimatedTime: resource.maintenanceEstimatedTime || ""
|
||||
},
|
||||
mode: "onChange"
|
||||
});
|
||||
|
||||
const isMaintenanceEnabled = maintenanceForm.watch(
|
||||
"maintenanceModeEnabled"
|
||||
);
|
||||
const maintenanceModeType = maintenanceForm.watch("maintenanceModeType");
|
||||
|
||||
const [, maintenanceFormAction, maintenanceSaveLoading] = useActionState(
|
||||
onMaintenanceSubmit,
|
||||
null
|
||||
);
|
||||
|
||||
async function onMaintenanceSubmit() {
|
||||
const isValid = await maintenanceForm.trigger();
|
||||
if (!isValid) return;
|
||||
|
||||
const data = maintenanceForm.getValues();
|
||||
|
||||
const res = await api
|
||||
.post<AxiosResponse<UpdateResourceResponse>>(
|
||||
`resource/${resource?.resourceId}`,
|
||||
{
|
||||
maintenanceModeEnabled: data.maintenanceModeEnabled,
|
||||
maintenanceModeType: data.maintenanceModeType,
|
||||
maintenanceTitle: data.maintenanceTitle || null,
|
||||
maintenanceMessage: data.maintenanceMessage || null,
|
||||
maintenanceEstimatedTime:
|
||||
data.maintenanceEstimatedTime || null
|
||||
}
|
||||
)
|
||||
.catch((e) => {
|
||||
toast({
|
||||
variant: "destructive",
|
||||
title: t("resourceErrorUpdate"),
|
||||
description: formatAxiosError(
|
||||
e,
|
||||
t("resourceErrorUpdateDescription")
|
||||
)
|
||||
});
|
||||
});
|
||||
|
||||
if (res && res.status === 200) {
|
||||
updateResource({
|
||||
maintenanceModeEnabled: data.maintenanceModeEnabled,
|
||||
maintenanceModeType: data.maintenanceModeType,
|
||||
maintenanceTitle: data.maintenanceTitle || null,
|
||||
maintenanceMessage: data.maintenanceMessage || null,
|
||||
maintenanceEstimatedTime: data.maintenanceEstimatedTime || null
|
||||
});
|
||||
|
||||
toast({
|
||||
title: t("resourceUpdated"),
|
||||
description: t("resourceUpdatedDescription")
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
const isSecurityFeatureDisabled = () => {
|
||||
const isEnterpriseNotLicensed = build === "enterprise" && !isUnlocked();
|
||||
const isSaasNotSubscribed =
|
||||
build === "saas" && !subscription?.isSubscribed();
|
||||
return isEnterpriseNotLicensed || isSaasNotSubscribed;
|
||||
};
|
||||
|
||||
if (!resource.http) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<SettingsSection>
|
||||
<SettingsSectionHeader>
|
||||
<SettingsSectionTitle>
|
||||
{t("maintenanceMode")}
|
||||
</SettingsSectionTitle>
|
||||
<SettingsSectionDescription>
|
||||
{t("maintenanceModeDescription")}
|
||||
</SettingsSectionDescription>
|
||||
</SettingsSectionHeader>
|
||||
|
||||
<SettingsSectionBody>
|
||||
<SettingsSectionForm>
|
||||
<Form {...maintenanceForm}>
|
||||
<form
|
||||
action={maintenanceFormAction}
|
||||
className="space-y-4"
|
||||
id="maintenance-settings-form"
|
||||
>
|
||||
<PaidFeaturesAlert></PaidFeaturesAlert>
|
||||
<FormField
|
||||
control={maintenanceForm.control}
|
||||
name="maintenanceModeEnabled"
|
||||
render={({ field }) => {
|
||||
const isDisabled =
|
||||
isSecurityFeatureDisabled() || resource.http === false;
|
||||
|
||||
return (
|
||||
<FormItem>
|
||||
<div className="flex items-center space-x-2">
|
||||
<FormControl>
|
||||
<TooltipProvider>
|
||||
<Tooltip>
|
||||
<TooltipTrigger
|
||||
asChild
|
||||
>
|
||||
<div className="flex items-center gap-2">
|
||||
<SwitchInput
|
||||
id="enable-maintenance"
|
||||
checked={
|
||||
field.value
|
||||
}
|
||||
label={t(
|
||||
"enableMaintenanceMode"
|
||||
)}
|
||||
disabled={
|
||||
isDisabled
|
||||
}
|
||||
onCheckedChange={(
|
||||
val
|
||||
) => {
|
||||
if (
|
||||
!isDisabled
|
||||
) {
|
||||
maintenanceForm.setValue(
|
||||
"maintenanceModeEnabled",
|
||||
val
|
||||
);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</TooltipTrigger>
|
||||
</Tooltip>
|
||||
</TooltipProvider>
|
||||
</FormControl>
|
||||
</div>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
|
||||
{isMaintenanceEnabled && (
|
||||
<div className="space-y-4">
|
||||
<FormField
|
||||
control={maintenanceForm.control}
|
||||
name="maintenanceModeType"
|
||||
render={({ field }) => (
|
||||
<FormItem className="space-y-3">
|
||||
<FormLabel>
|
||||
{t("maintenanceModeType")}
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<RadioGroup
|
||||
onValueChange={
|
||||
field.onChange
|
||||
}
|
||||
defaultValue={
|
||||
field.value
|
||||
}
|
||||
disabled={isSecurityFeatureDisabled()}
|
||||
className="flex flex-col space-y-1"
|
||||
>
|
||||
<FormItem className="flex items-start space-x-3 space-y-0">
|
||||
<FormControl>
|
||||
<RadioGroupItem value="automatic" />
|
||||
</FormControl>
|
||||
<div className="space-y-1 leading-none">
|
||||
<FormLabel className="font-normal">
|
||||
<strong>
|
||||
{t(
|
||||
"automatic"
|
||||
)}
|
||||
</strong>{" "}
|
||||
(
|
||||
{t(
|
||||
"recommended"
|
||||
)}
|
||||
)
|
||||
</FormLabel>
|
||||
<FormDescription>
|
||||
{t(
|
||||
"automaticModeDescription"
|
||||
)}
|
||||
</FormDescription>
|
||||
</div>
|
||||
</FormItem>
|
||||
<FormItem className="flex items-start space-x-3 space-y-0">
|
||||
<FormControl>
|
||||
<RadioGroupItem value="forced" />
|
||||
</FormControl>
|
||||
<div className="space-y-1 leading-none">
|
||||
<FormLabel className="font-normal">
|
||||
<strong>
|
||||
{t(
|
||||
"forced"
|
||||
)}
|
||||
</strong>
|
||||
</FormLabel>
|
||||
<FormDescription>
|
||||
{t(
|
||||
"forcedModeDescription"
|
||||
)}
|
||||
</FormDescription>
|
||||
</div>
|
||||
</FormItem>
|
||||
</RadioGroup>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
{maintenanceModeType === "forced" && (
|
||||
<Alert variant={"neutral"}>
|
||||
<AlertCircle className="h-4 w-4" />
|
||||
<AlertDescription>
|
||||
{t("forcedeModeWarning")}
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
)}
|
||||
|
||||
<FormField
|
||||
control={maintenanceForm.control}
|
||||
name="maintenanceTitle"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>
|
||||
{t("pageTitle")}
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
{...field}
|
||||
disabled={isSecurityFeatureDisabled()}
|
||||
placeholder="We'll be back soon!"
|
||||
/>
|
||||
</FormControl>
|
||||
<FormDescription>
|
||||
{t("pageTitleDescription")}
|
||||
</FormDescription>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={maintenanceForm.control}
|
||||
name="maintenanceMessage"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>
|
||||
{t(
|
||||
"maintenancePageMessage"
|
||||
)}
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<Textarea
|
||||
{...field}
|
||||
rows={4}
|
||||
disabled={isSecurityFeatureDisabled()}
|
||||
placeholder={t(
|
||||
"maintenancePageMessagePlaceholder"
|
||||
)}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormDescription>
|
||||
{t(
|
||||
"maintenancePageMessageDescription"
|
||||
)}
|
||||
</FormDescription>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={maintenanceForm.control}
|
||||
name="maintenanceEstimatedTime"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>
|
||||
{t(
|
||||
"maintenancePageTimeTitle"
|
||||
)}
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
{...field}
|
||||
disabled={isSecurityFeatureDisabled()}
|
||||
placeholder={t(
|
||||
"maintenanceTime"
|
||||
)}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormDescription>
|
||||
{t(
|
||||
"maintenanceEstimatedTimeDescription"
|
||||
)}
|
||||
</FormDescription>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</form>
|
||||
</Form>
|
||||
</SettingsSectionForm>
|
||||
</SettingsSectionBody>
|
||||
|
||||
<SettingsSectionFooter>
|
||||
<Button
|
||||
type="submit"
|
||||
loading={maintenanceSaveLoading}
|
||||
disabled={maintenanceSaveLoading}
|
||||
form="maintenance-settings-form"
|
||||
>
|
||||
{t("saveSettings")}
|
||||
</Button>
|
||||
</SettingsSectionFooter>
|
||||
</SettingsSection>
|
||||
);
|
||||
}
|
||||
|
||||
export default function GeneralForm() {
|
||||
const params = useParams();
|
||||
@@ -68,9 +441,16 @@ export default function GeneralForm() {
|
||||
);
|
||||
|
||||
const resourceFullDomainName = useMemo(() => {
|
||||
const url = new URL(resourceFullDomain);
|
||||
return url.hostname;
|
||||
}, [resourceFullDomain]);
|
||||
if (!resource.fullDomain) {
|
||||
return "";
|
||||
}
|
||||
try {
|
||||
const url = new URL(resourceFullDomain);
|
||||
return url.hostname;
|
||||
} catch {
|
||||
return "";
|
||||
}
|
||||
}, [resourceFullDomain, resource.fullDomain]);
|
||||
|
||||
const [selectedDomain, setSelectedDomain] = useState<{
|
||||
domainId: string;
|
||||
@@ -87,7 +467,7 @@ export default function GeneralForm() {
|
||||
name: z.string().min(1).max(255),
|
||||
niceId: z.string().min(1).max(255).optional(),
|
||||
domainId: z.string().optional(),
|
||||
proxyPort: z.int().min(1).max(65535).optional()
|
||||
proxyPort: z.number().int().min(1).max(65535).optional()
|
||||
})
|
||||
.refine(
|
||||
(data) => {
|
||||
@@ -106,6 +486,8 @@ export default function GeneralForm() {
|
||||
}
|
||||
);
|
||||
|
||||
type GeneralFormValues = z.infer<typeof GeneralFormSchema>;
|
||||
|
||||
const form = useForm({
|
||||
resolver: zodResolver(GeneralFormSchema),
|
||||
defaultValues: {
|
||||
@@ -163,9 +545,6 @@ export default function GeneralForm() {
|
||||
fullDomain: updated.fullDomain,
|
||||
proxyPort: data.proxyPort,
|
||||
domainId: data.domainId
|
||||
// ...(!resource.http && {
|
||||
// enableProxy: data.enableProxy
|
||||
// })
|
||||
});
|
||||
|
||||
toast({
|
||||
@@ -289,8 +668,12 @@ export default function GeneralForm() {
|
||||
<Input
|
||||
type="number"
|
||||
value={
|
||||
field.value ??
|
||||
""
|
||||
field.value !==
|
||||
undefined
|
||||
? String(
|
||||
field.value
|
||||
)
|
||||
: ""
|
||||
}
|
||||
onChange={(e) =>
|
||||
field.onChange(
|
||||
@@ -355,6 +738,13 @@ export default function GeneralForm() {
|
||||
</Button>
|
||||
</SettingsSectionFooter>
|
||||
</SettingsSection>
|
||||
|
||||
{build !== "oss" && (
|
||||
<MaintenanceSectionForm
|
||||
resource={resource}
|
||||
updateResource={updateResource}
|
||||
/>
|
||||
)}
|
||||
</SettingsContainer>
|
||||
|
||||
<Credenza
|
||||
|
||||
@@ -338,7 +338,7 @@ function ProxyResourceTargetsForm({
|
||||
<div
|
||||
className={`flex items-center gap-2 ${status === "healthy" ? "text-green-500" : status === "unhealthy" ? "text-destructive" : ""}`}
|
||||
>
|
||||
<Settings className="h-3 w-3" />
|
||||
<Settings className="h-4 w-4 text-foreground" />
|
||||
{getStatusText(status)}
|
||||
</div>
|
||||
</Button>
|
||||
|
||||
@@ -75,6 +75,7 @@ import { Switch } from "@app/components/ui/switch";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { useTranslations } from "next-intl";
|
||||
import { COUNTRIES } from "@server/db/countries";
|
||||
import { MAJOR_ASNS } from "@server/db/asns";
|
||||
import {
|
||||
Command,
|
||||
CommandEmpty,
|
||||
@@ -117,11 +118,14 @@ export default function ResourceRules(props: {
|
||||
const [countrySelectValue, setCountrySelectValue] = useState("");
|
||||
const [openAddRuleCountrySelect, setOpenAddRuleCountrySelect] =
|
||||
useState(false);
|
||||
const [openAddRuleAsnSelect, setOpenAddRuleAsnSelect] = useState(false);
|
||||
const router = useRouter();
|
||||
const t = useTranslations();
|
||||
const { env } = useEnvContext();
|
||||
const isMaxmindAvailable =
|
||||
env.server.maxmind_db_path && env.server.maxmind_db_path.length > 0;
|
||||
const isMaxmindAsnAvailable =
|
||||
env.server.maxmind_asn_path && env.server.maxmind_asn_path.length > 0;
|
||||
|
||||
const RuleAction = {
|
||||
ACCEPT: t("alwaysAllow"),
|
||||
@@ -133,7 +137,8 @@ export default function ResourceRules(props: {
|
||||
PATH: t("path"),
|
||||
IP: "IP",
|
||||
CIDR: t("ipAddressRange"),
|
||||
COUNTRY: t("country")
|
||||
COUNTRY: t("country"),
|
||||
ASN: "ASN"
|
||||
} as const;
|
||||
|
||||
const addRuleForm = useForm({
|
||||
@@ -172,6 +177,30 @@ export default function ResourceRules(props: {
|
||||
}, []);
|
||||
|
||||
async function addRule(data: z.infer<typeof addRuleSchema>) {
|
||||
// Normalize ASN value
|
||||
if (data.match === "ASN") {
|
||||
const originalValue = data.value.toUpperCase();
|
||||
|
||||
// Handle special "ALL" case
|
||||
if (originalValue === "ALL" || originalValue === "AS0") {
|
||||
data.value = "ALL";
|
||||
} else {
|
||||
// Remove AS prefix if present
|
||||
const normalized = originalValue.replace(/^AS/, "");
|
||||
if (!/^\d+$/.test(normalized)) {
|
||||
toast({
|
||||
variant: "destructive",
|
||||
title: "Invalid ASN",
|
||||
description:
|
||||
"ASN must be a number, optionally prefixed with 'AS' (e.g., AS15169 or 15169), or 'ALL'"
|
||||
});
|
||||
return;
|
||||
}
|
||||
// Add "AS" prefix for consistent storage
|
||||
data.value = "AS" + normalized;
|
||||
}
|
||||
}
|
||||
|
||||
const isDuplicate = rules.some(
|
||||
(rule) =>
|
||||
rule.action === data.action &&
|
||||
@@ -280,6 +309,8 @@ export default function ResourceRules(props: {
|
||||
return t("rulesMatchUrl");
|
||||
case "COUNTRY":
|
||||
return t("rulesMatchCountry");
|
||||
case "ASN":
|
||||
return "Enter an Autonomous System Number (e.g., AS15169 or 15169)";
|
||||
}
|
||||
}
|
||||
|
||||
@@ -505,12 +536,16 @@ export default function ResourceRules(props: {
|
||||
<Select
|
||||
defaultValue={row.original.match}
|
||||
onValueChange={(
|
||||
value: "CIDR" | "IP" | "PATH" | "COUNTRY"
|
||||
value: "CIDR" | "IP" | "PATH" | "COUNTRY" | "ASN"
|
||||
) =>
|
||||
updateRule(row.original.ruleId, {
|
||||
match: value,
|
||||
value:
|
||||
value === "COUNTRY" ? "US" : row.original.value
|
||||
value === "COUNTRY"
|
||||
? "US"
|
||||
: value === "ASN"
|
||||
? "AS15169"
|
||||
: row.original.value
|
||||
})
|
||||
}
|
||||
>
|
||||
@@ -526,6 +561,9 @@ export default function ResourceRules(props: {
|
||||
{RuleMatch.COUNTRY}
|
||||
</SelectItem>
|
||||
)}
|
||||
{isMaxmindAsnAvailable && (
|
||||
<SelectItem value="ASN">{RuleMatch.ASN}</SelectItem>
|
||||
)}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
)
|
||||
@@ -592,6 +630,93 @@ export default function ResourceRules(props: {
|
||||
</Command>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
) : row.original.match === "ASN" ? (
|
||||
<Popover>
|
||||
<PopoverTrigger asChild>
|
||||
<Button
|
||||
variant="outline"
|
||||
role="combobox"
|
||||
className="min-w-[200px] justify-between"
|
||||
>
|
||||
{row.original.value
|
||||
? (() => {
|
||||
const found = MAJOR_ASNS.find(
|
||||
(asn) =>
|
||||
asn.code ===
|
||||
row.original.value
|
||||
);
|
||||
return found
|
||||
? `${found.name} (${row.original.value})`
|
||||
: `Custom (${row.original.value})`;
|
||||
})()
|
||||
: "Select ASN"}
|
||||
<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent className="min-w-[200px] p-0">
|
||||
<Command>
|
||||
<CommandInput placeholder="Search ASNs or enter custom..." />
|
||||
<CommandList>
|
||||
<CommandEmpty>
|
||||
No ASN found. Enter a custom ASN below.
|
||||
</CommandEmpty>
|
||||
<CommandGroup>
|
||||
{MAJOR_ASNS.map((asn) => (
|
||||
<CommandItem
|
||||
key={asn.code}
|
||||
value={
|
||||
asn.name + " " + asn.code
|
||||
}
|
||||
onSelect={() => {
|
||||
updateRule(
|
||||
row.original.ruleId,
|
||||
{ value: asn.code }
|
||||
);
|
||||
}}
|
||||
>
|
||||
<Check
|
||||
className={`mr-2 h-4 w-4 ${
|
||||
row.original.value ===
|
||||
asn.code
|
||||
? "opacity-100"
|
||||
: "opacity-0"
|
||||
}`}
|
||||
/>
|
||||
{asn.name} ({asn.code})
|
||||
</CommandItem>
|
||||
))}
|
||||
</CommandGroup>
|
||||
</CommandList>
|
||||
</Command>
|
||||
<div className="border-t p-2">
|
||||
<Input
|
||||
placeholder="Enter custom ASN (e.g., AS15169)"
|
||||
defaultValue={
|
||||
!MAJOR_ASNS.find(
|
||||
(asn) =>
|
||||
asn.code === row.original.value
|
||||
)
|
||||
? row.original.value
|
||||
: ""
|
||||
}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === "Enter") {
|
||||
const value = e.currentTarget.value
|
||||
.toUpperCase()
|
||||
.replace(/^AS/, "");
|
||||
if (/^\d+$/.test(value)) {
|
||||
updateRule(
|
||||
row.original.ruleId,
|
||||
{ value: "AS" + value }
|
||||
);
|
||||
}
|
||||
}
|
||||
}}
|
||||
className="text-sm"
|
||||
/>
|
||||
</div>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
) : (
|
||||
<Input
|
||||
defaultValue={row.original.value}
|
||||
@@ -802,6 +927,13 @@ export default function ResourceRules(props: {
|
||||
}
|
||||
</SelectItem>
|
||||
)}
|
||||
{isMaxmindAsnAvailable && (
|
||||
<SelectItem value="ASN">
|
||||
{
|
||||
RuleMatch.ASN
|
||||
}
|
||||
</SelectItem>
|
||||
)}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</FormControl>
|
||||
@@ -924,6 +1056,142 @@ export default function ResourceRules(props: {
|
||||
</Command>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
) : addRuleForm.watch(
|
||||
"match"
|
||||
) === "ASN" ? (
|
||||
<Popover
|
||||
open={
|
||||
openAddRuleAsnSelect
|
||||
}
|
||||
onOpenChange={
|
||||
setOpenAddRuleAsnSelect
|
||||
}
|
||||
>
|
||||
<PopoverTrigger
|
||||
asChild
|
||||
>
|
||||
<Button
|
||||
variant="outline"
|
||||
role="combobox"
|
||||
aria-expanded={
|
||||
openAddRuleAsnSelect
|
||||
}
|
||||
className="w-full justify-between"
|
||||
>
|
||||
{field.value
|
||||
? MAJOR_ASNS.find(
|
||||
(
|
||||
asn
|
||||
) =>
|
||||
asn.code ===
|
||||
field.value
|
||||
)
|
||||
?.name +
|
||||
" (" +
|
||||
field.value +
|
||||
")" ||
|
||||
field.value
|
||||
: "Select ASN"}
|
||||
<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent className="w-full p-0">
|
||||
<Command>
|
||||
<CommandInput placeholder="Search ASNs or enter custom..." />
|
||||
<CommandList>
|
||||
<CommandEmpty>
|
||||
No
|
||||
ASN
|
||||
found.
|
||||
Use
|
||||
the
|
||||
custom
|
||||
input
|
||||
below.
|
||||
</CommandEmpty>
|
||||
<CommandGroup>
|
||||
{MAJOR_ASNS.map(
|
||||
(
|
||||
asn
|
||||
) => (
|
||||
<CommandItem
|
||||
key={
|
||||
asn.code
|
||||
}
|
||||
value={
|
||||
asn.name +
|
||||
" " +
|
||||
asn.code
|
||||
}
|
||||
onSelect={() => {
|
||||
field.onChange(
|
||||
asn.code
|
||||
);
|
||||
setOpenAddRuleAsnSelect(
|
||||
false
|
||||
);
|
||||
}}
|
||||
>
|
||||
<Check
|
||||
className={`mr-2 h-4 w-4 ${
|
||||
field.value ===
|
||||
asn.code
|
||||
? "opacity-100"
|
||||
: "opacity-0"
|
||||
}`}
|
||||
/>
|
||||
{
|
||||
asn.name
|
||||
}{" "}
|
||||
(
|
||||
{
|
||||
asn.code
|
||||
}
|
||||
|
||||
)
|
||||
</CommandItem>
|
||||
)
|
||||
)}
|
||||
</CommandGroup>
|
||||
</CommandList>
|
||||
</Command>
|
||||
<div className="border-t p-2">
|
||||
<Input
|
||||
placeholder="Enter custom ASN (e.g., AS15169)"
|
||||
onKeyDown={(
|
||||
e
|
||||
) => {
|
||||
if (
|
||||
e.key ===
|
||||
"Enter"
|
||||
) {
|
||||
const value =
|
||||
e.currentTarget.value
|
||||
.toUpperCase()
|
||||
.replace(
|
||||
/^AS/,
|
||||
""
|
||||
);
|
||||
if (
|
||||
/^\d+$/.test(
|
||||
value
|
||||
)
|
||||
) {
|
||||
field.onChange(
|
||||
"AS" +
|
||||
value
|
||||
);
|
||||
setOpenAddRuleAsnSelect(
|
||||
false
|
||||
);
|
||||
}
|
||||
}
|
||||
}}
|
||||
className="text-sm"
|
||||
/>
|
||||
</div>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
) : (
|
||||
<Input {...field} />
|
||||
)}
|
||||
|
||||
@@ -25,7 +25,7 @@ import { createElement, useEffect, useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
import { Input } from "@app/components/ui/input";
|
||||
import { InfoIcon, Terminal } from "lucide-react";
|
||||
import { ChevronDown, ChevronUp, InfoIcon, Terminal } from "lucide-react";
|
||||
import { Button } from "@app/components/ui/button";
|
||||
import CopyTextBox from "@app/components/CopyTextBox";
|
||||
import CopyToClipboard from "@app/components/CopyToClipboard";
|
||||
@@ -204,6 +204,7 @@ export default function Page() {
|
||||
const [createLoading, setCreateLoading] = useState(false);
|
||||
const [acceptClients, setAcceptClients] = useState(true);
|
||||
const [newtVersion, setNewtVersion] = useState("latest");
|
||||
const [showAdvancedSettings, setShowAdvancedSettings] = useState(false);
|
||||
|
||||
const [siteDefaults, setSiteDefaults] =
|
||||
useState<PickSiteDefaultsResponse | null>(null);
|
||||
@@ -727,45 +728,70 @@ WantedBy=default.target`
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
{form.watch("method") === "newt" && (
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="clientAddress"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>
|
||||
{t("siteAddress")}
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
autoComplete="off"
|
||||
value={
|
||||
clientAddress
|
||||
}
|
||||
onChange={(
|
||||
e
|
||||
) => {
|
||||
setClientAddress(
|
||||
e.target
|
||||
.value
|
||||
);
|
||||
field.onChange(
|
||||
e.target
|
||||
.value
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
<FormDescription>
|
||||
{t(
|
||||
"siteAddressDescription"
|
||||
)}
|
||||
</FormDescription>
|
||||
</FormItem>
|
||||
<div className="flex items-center justify-end md:col-start-2">
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={() =>
|
||||
setShowAdvancedSettings(
|
||||
!showAdvancedSettings
|
||||
)
|
||||
}
|
||||
className="flex items-center gap-2"
|
||||
>
|
||||
{showAdvancedSettings ? (
|
||||
<ChevronUp className="h-4 w-4" />
|
||||
) : (
|
||||
<ChevronDown className="h-4 w-4" />
|
||||
)}
|
||||
/>
|
||||
)}
|
||||
{t("advancedSettings")}
|
||||
</Button>
|
||||
</div>
|
||||
{form.watch("method") === "newt" &&
|
||||
showAdvancedSettings && (
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="clientAddress"
|
||||
render={({ field }) => (
|
||||
<FormItem className="md:col-start-1 md:col-span-2">
|
||||
<FormLabel>
|
||||
{t(
|
||||
"siteAddress"
|
||||
)}
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
autoComplete="off"
|
||||
value={
|
||||
clientAddress
|
||||
}
|
||||
onChange={(
|
||||
e
|
||||
) => {
|
||||
setClientAddress(
|
||||
e
|
||||
.target
|
||||
.value
|
||||
);
|
||||
field.onChange(
|
||||
e
|
||||
.target
|
||||
.value
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
<FormDescription>
|
||||
{t(
|
||||
"siteAddressDescription"
|
||||
)}
|
||||
</FormDescription>
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
)}
|
||||
</form>
|
||||
</Form>
|
||||
</SettingsSectionBody>
|
||||
@@ -885,7 +911,7 @@ WantedBy=default.target`
|
||||
? "squareOutlinePrimary"
|
||||
: "squareOutline"
|
||||
}
|
||||
className={`flex-1 min-w-[120px] ${platform === os ? "bg-primary/10" : ""} shadow-none`}
|
||||
className={`flex-1 min-w-30 ${platform === os ? "bg-primary/10" : ""} shadow-none`}
|
||||
onClick={() => {
|
||||
setPlatform(os);
|
||||
}}
|
||||
@@ -916,7 +942,7 @@ WantedBy=default.target`
|
||||
? "squareOutlinePrimary"
|
||||
: "squareOutline"
|
||||
}
|
||||
className={`flex-1 min-w-[120px] ${architecture === arch ? "bg-primary/10" : ""} shadow-none`}
|
||||
className={`flex-1 min-w-30 ${architecture === arch ? "bg-primary/10" : ""} shadow-none`}
|
||||
onClick={() =>
|
||||
setArchitecture(
|
||||
arch
|
||||
|
||||
Reference in New Issue
Block a user