calvin.erfmann/pangolin
1
0
Fork 0
mirror of https://github.com/fosrl/pangolin.git synced 2026-05-11 14:54:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

🚧 auth methods

Browse Source
This commit is contained in:
Fred KISSIE
2026-03-03 02:11:05 +01:00
parent 5c280b024e
commit 8a54fb7f23
1 changed files with 166 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

282
src/components/resource-policy/EditPolicyForm.tsx
View File

@@ -281,8 +281,8 @@ export function EditPolicyForm({ hidePolicyNameForm }: EditPolicyFormProps) {
allUsers={allUsers} allUsers={allUsers}
allIdps={allIdps} allIdps={allIdps}
/> />
<PolicyAuthMethodsSection />
{/* {/*
<PolicyAuthMethodsSection form={form} />
<PolicyOtpEmailSection <PolicyOtpEmailSection
form={form} form={form}
emailEnabled={env.email.emailEnabled} emailEnabled={env.email.emailEnabled}
@@ -429,8 +429,6 @@ export function PolicyUsersRolesSection({
const api = createApiClient(useEnvContext()); const api = createApiClient(useEnvContext());
console.log({ policy });
const form = useForm({ const form = useForm({
resolver: zodResolver( resolver: zodResolver(
createPolicySchema.pick({ createPolicySchema.pick({
@@ -736,15 +734,24 @@ const setHeaderAuthSchema = z.object({
extendedCompatibility: z.boolean() extendedCompatibility: z.boolean()
}); });
type PolicyAuthMethodsSectionProps = { export function PolicyAuthMethodsSection() {
form: UseFormReturn<PolicyFormValues, any, any>; const { policy } = useResourcePolicyContext();
};
const api = createApiClient(useEnvContext());
const form = useForm({
resolver: zodResolver(
createPolicySchema.pick({
password: true,
pincode: true,
headerAuth: true
})
),
defaultValues: {}
});
export function PolicyAuthMethodsSection({
form
}: PolicyAuthMethodsSectionProps) {
const t = useTranslations(); const t = useTranslations();
const [isOpen, setIsOpen] = useState(false); const [isExpanded, setIsExpanded] = useState(false);
const [isSetPasswordOpen, setIsSetPasswordOpen] = useState(false); const [isSetPasswordOpen, setIsSetPasswordOpen] = useState(false);
const [isSetPincodeOpen, setIsSetPincodeOpen] = useState(false); const [isSetPincodeOpen, setIsSetPincodeOpen] = useState(false);
const [isSetHeaderAuthOpen, setIsSetHeaderAuthOpen] = useState(false); const [isSetHeaderAuthOpen, setIsSetHeaderAuthOpen] = useState(false);
@@ -768,7 +775,18 @@ export function PolicyAuthMethodsSection({
defaultValues: { user: "", password: "", extendedCompatibility: true } defaultValues: { user: "", password: "", extendedCompatibility: true }
}); });
if (!isOpen) { const [, formAction, isSubmitting] = useActionState(onSubmit, null);
async function onSubmit() {
const isValid = await form.trigger();
if (!isValid) return;
const payload = form.getValues();
console.log({ payload });
}
if (!isExpanded) {
return ( return (
<SettingsSection> <SettingsSection>
<SettingsSectionHeader> <SettingsSectionHeader>
@@ -783,7 +801,7 @@ export function PolicyAuthMethodsSection({
<Button <Button
type="button" type="button"
variant="outline" variant="outline"
onClick={() => setIsOpen(true)} onClick={() => setIsExpanded(true)}
> >
<Plus className="mr-2 h-4 w-4" /> <Plus className="mr-2 h-4 w-4" />
{t("resourcePolicyAuthMethodAdd")} {t("resourcePolicyAuthMethodAdd")}
@@ -1050,110 +1068,142 @@ export function PolicyAuthMethodsSection({
</CredenzaContent> </CredenzaContent>
</Credenza> </Credenza>
<SettingsSection> <Form {...form}>
<SettingsSectionHeader> <form action={() => {}}>
<SettingsSectionTitle> <SettingsSection>
{t("resourceAuthMethods")} <SettingsSectionHeader>
</SettingsSectionTitle> <SettingsSectionTitle>
<SettingsSectionDescription> {t("resourceAuthMethods")}
{t("resourcePolicyAuthMethodsDescription")} </SettingsSectionTitle>
</SettingsSectionDescription> <SettingsSectionDescription>
</SettingsSectionHeader> {t("resourcePolicyAuthMethodsDescription")}
<SettingsSectionBody> </SettingsSectionDescription>
<SettingsSectionForm> </SettingsSectionHeader>
{/* Password row */} <SettingsSectionBody>
<div className="flex items-center justify-between border rounded-md p-2 mb-4"> <SettingsSectionForm>
<div {/* Password row */}
className={`flex items-center ${password ? "text-green-500" : ""} text-sm space-x-2`} <div className="flex items-center justify-between border rounded-md p-2 mb-4">
> <div
<Key size="14" /> className={`flex items-center ${password ? "text-green-500" : ""} text-sm space-x-2`}
<span> >
{t("resourcePasswordProtection", { <Key size="14" />
status: password <span>
? t("enabled") {t("resourcePasswordProtection", {
: t("disabled") status: password
})} ? t("enabled")
</span> : t("disabled")
</div> })}
<Button </span>
type="button" </div>
variant="secondary" <Button
size="sm" type="button"
onClick={ variant="secondary"
password size="sm"
? () => form.setValue("password", null) onClick={
: () => setIsSetPasswordOpen(true) password
} ? () =>
> form.setValue(
{password "password",
? t("passwordRemove") null
: t("passwordAdd")} )
</Button> : () =>
</div> setIsSetPasswordOpen(true)
}
>
{password
? t("passwordRemove")
: t("passwordAdd")}
</Button>
</div>
{/* Pincode row */} {/* Pincode row */}
<div className="flex items-center justify-between border rounded-md p-2"> <div className="flex items-center justify-between border rounded-md p-2">
<div <div
className={`flex items-center ${pincode ? "text-green-500" : ""} space-x-2 text-sm`} className={`flex items-center ${pincode ? "text-green-500" : ""} space-x-2 text-sm`}
> >
<Binary size="14" /> <Binary size="14" />
<span> <span>
{t("resourcePincodeProtection", { {t("resourcePincodeProtection", {
status: pincode status: pincode
? t("enabled") ? t("enabled")
: t("disabled") : t("disabled")
})} })}
</span> </span>
</div> </div>
<Button <Button
type="button" type="button"
variant="secondary" variant="secondary"
size="sm" size="sm"
onClick={ onClick={
pincode pincode
? () => form.setValue("pincode", null) ? () =>
: () => setIsSetPincodeOpen(true) form.setValue(
} "pincode",
> null
{pincode ? t("pincodeRemove") : t("pincodeAdd")} )
</Button> : () =>
</div> setIsSetPincodeOpen(true)
}
>
{pincode
? t("pincodeRemove")
: t("pincodeAdd")}
</Button>
</div>
{/* Header auth row */} {/* Header auth row */}
<div className="flex items-center justify-between border rounded-md p-2"> <div className="flex items-center justify-between border rounded-md p-2">
<div <div
className={`flex items-center ${headerAuth ? "text-green-500" : ""} space-x-2 text-sm`} className={`flex items-center ${headerAuth ? "text-green-500" : ""} space-x-2 text-sm`}
> >
<Bot size="14" /> <Bot size="14" />
<span> <span>
{headerAuth {headerAuth
? t( ? t(
"resourceHeaderAuthProtectionEnabled" "resourceHeaderAuthProtectionEnabled"
) )
: t( : t(
"resourceHeaderAuthProtectionDisabled" "resourceHeaderAuthProtectionDisabled"
)} )}
</span> </span>
</div> </div>
<Button
type="button"
variant="secondary"
size="sm"
onClick={
headerAuth
? () =>
form.setValue(
"headerAuth",
null
)
: () =>
setIsSetHeaderAuthOpen(
true
)
}
>
{headerAuth
? t("headerAuthRemove")
: t("headerAuthAdd")}
</Button>
</div>
</SettingsSectionForm>
</SettingsSectionBody>
<div className="flex py-6 justify-end">
<Button <Button
type="button" type="submit"
variant="secondary" loading={isSubmitting}
size="sm" disabled={isSubmitting}
onClick={
headerAuth
? () =>
form.setValue("headerAuth", null)
: () => setIsSetHeaderAuthOpen(true)
}
> >
{headerAuth {t("saveSettings")}
? t("headerAuthRemove")
: t("headerAuthAdd")}
</Button> </Button>
</div> </div>
</SettingsSectionForm> </SettingsSection>
</SettingsSectionBody> </form>
</SettingsSection> </Form>
</> </>
); );
} }
@@ -1170,13 +1220,13 @@ export function PolicyOtpEmailSection({
emailEnabled emailEnabled
}: PolicyOtpEmailSectionProps) { }: PolicyOtpEmailSectionProps) {
const t = useTranslations(); const t = useTranslations();
const [isOpen, setIsOpen] = useState(false); const [isExpanded, setIsExpanded] = useState(false);
const [whitelistEnabled, setWhitelistEnabled] = useState(false); const [whitelistEnabled, setWhitelistEnabled] = useState(false);
const [activeEmailTagIndex, setActiveEmailTagIndex] = useState< const [activeEmailTagIndex, setActiveEmailTagIndex] = useState<
number | null number | null
>(null); >(null);
if (!isOpen) { if (!isExpanded) {
return ( return (
<SettingsSection> <SettingsSection>
<SettingsSectionHeader> <SettingsSectionHeader>
@@ -1191,7 +1241,7 @@ export function PolicyOtpEmailSection({
<Button <Button
type="button" type="button"
variant="outline" variant="outline"
onClick={() => setIsOpen(true)} onClick={() => setIsExpanded(true)}
> >
<Plus className="mr-2 h-4 w-4" /> <Plus className="mr-2 h-4 w-4" />
{t("resourcePolicyOtpEmailAdd")} {t("resourcePolicyOtpEmailAdd")}
@@ -1332,7 +1382,7 @@ export function PolicyRulesSection({
isMaxmindAsnAvailable isMaxmindAsnAvailable
}: PolicyRulesSectionProps) { }: PolicyRulesSectionProps) {
const t = useTranslations(); const t = useTranslations();
const [isOpen, setIsOpen] = useState(false); const [isExpanded, setIsExpanded] = useState(false);
const [rules, setRules] = useState<LocalRule[]>([]); const [rules, setRules] = useState<LocalRule[]>([]);
const [rulesEnabled, setRulesEnabled] = useState(false); const [rulesEnabled, setRulesEnabled] = useState(false);
const [openAddRuleCountrySelect, setOpenAddRuleCountrySelect] = const [openAddRuleCountrySelect, setOpenAddRuleCountrySelect] =
@@ -1829,7 +1879,7 @@ export function PolicyRulesSection({
state: { pagination: { pageIndex: 0, pageSize: 1000 } } state: { pagination: { pageIndex: 0, pageSize: 1000 } }
}); });
if (!isOpen) { if (!isExpanded) {
return ( return (
<SettingsSection> <SettingsSection>
<SettingsSectionHeader> <SettingsSectionHeader>
@@ -1844,7 +1894,7 @@ export function PolicyRulesSection({
<Button <Button
type="button" type="button"
variant="outline" variant="outline"
onClick={() => setIsOpen(true)} onClick={() => setIsExpanded(true)}
> >
<Plus className="mr-2 h-4 w-4" /> <Plus className="mr-2 h-4 w-4" />
{t("resourcePolicyRulesAdd")} {t("resourcePolicyRulesAdd")}