Content-Length: 371801 | pFad | https://github.com/sebadob/rauthy/commit/c89fb7fbacb002a202a8022d8318362ee4d6db73

AB Merge pull request #469 from sebadob/ui-ux-provider-config · sebadob/rauthy@c89fb7f · GitHub
Skip to content

Commit

Permalink
Merge pull request #469 from sebadob/ui-ux-provider-config
Browse files Browse the repository at this point in the history 
UI: improve UX for provider config
  • Loading branch information
@sebadob
sebadob authored Jun 12, 2024
2 parents 9a227c9 + 64e8790 commit c89fb7f
Showing 1 changed file with 34 additions and 20 deletions.
54 changes: 34 additions & 20 deletions frontend/src/components/admin/providers/ProviderTileAddNew.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,15 +74,15 @@
let formErrors = {};
const schemaConfig = yup.object().shape({
issuer: yup.string().trim().matches(REGEX_URI, "Can only contain URI safe characters, length max: 128"),
authorization_endpoint: yup.string().url(),
token_endpoint: yup.string().url(),
userinfo_endpoint: yup.string().url(),
issuer: yup.string().trim().matches(REGEX_URI, "Can only contain URI safe characters, length max: 128").required('Required'),
authorization_endpoint: yup.string().url().required('Required'),
token_endpoint: yup.string().url().required('Required'),
userinfo_endpoint: yup.string().url().required('Required'),
name: yup.string().trim().matches(REGEX_CLIENT_NAME, "Can only contain: 'a-zA-Z0-9À-ÿ- ', length max: 128"),
client_id: yup.string().trim().matches(REGEX_URI, "Can only contain URI safe characters, length max: 128"),
name: yup.string().trim().matches(REGEX_CLIENT_NAME, "Can only contain: 'a-zA-Z0-9À-ÿ- ', length max: 128").required('Required'),
client_id: yup.string().trim().matches(REGEX_URI, "Can only contain URI safe characters, length max: 128").required('Required'),
client_secret: yup.string().trim().max(256, "Max 256 characters"),
scope: yup.string().trim().matches(REGEX_PROVIDER_SCOPE, "Can only contain: 'a-zA-Z0-9-_/ ', length max: 128"),
scope: yup.string().trim().matches(REGEX_PROVIDER_SCOPE, "Can only contain: 'a-zA-Z0-9-_/ ', length max: 128").required('Required'),
root_pem: yup.string().trim().nullable().matches(REGEX_PEM, "Invalid PEM certificate"),
admin_claim_path: yup.string().trim().nullable().matches(REGEX_URI, "Can only contain URI safe characters, length max: 128"),
Expand Down Expand Up @@ -310,9 +310,15 @@
}
async function validateFormLookup() {
formErrors = {};
try {
await schemaLookup.validate(configLookup, {abortEarly: false});
formErrors = {};
if (!configLookup.issuer && !configLookup.metadata_url) {
formErrors.issuer = 'Required';
formErrors.metadata_url = formErrors.issuer;
return false;
}
return true;
} catch (err) {
formErrors = extractFormErrors(err);
Expand Down Expand Up @@ -366,9 +372,10 @@

{#if isOidc && !lookupSuccess}
<Input
type="url"
name="issuer"
bind:value={configLookup.issuer}
bind:error={formErrors.issuer}
autocomplete="off"
placeholder="Issuer URL"
on:input={validateFormLookup}
width={inputWidth}
Expand All @@ -382,9 +389,10 @@
</Button>
{:else if isAuto && !lookupSuccess}
<Input
type="url"
name="metadata"
bind:value={configLookup.metadata_url}
bind:error={formErrors.metadata_url}
autocomplete="off"
placeholder=".../.well-known/openid-configuration"
on:input={validateFormLookup}
width={inputWidth}
Expand Down Expand Up @@ -423,9 +431,10 @@
{/if}

<Input
type="url"
name="issuer"
bind:value={config.issuer}
bind:error={formErrors.issuer}
autocomplete="off"
placeholder="Issuer URL"
on:input={validateFormLookup}
width={inputWidth}
Expand All @@ -435,9 +444,10 @@
</Input>

<Input
type="url"
name="auth_endpoint"
bind:value={config.authorization_endpoint}
bind:error={formErrors.authorization_endpoint}
autocomplete="off"
placeholder="Authorization Endpoint"
on:input={validateFormLookup}
width={inputWidth}
Expand All @@ -447,9 +457,10 @@
</Input>

<Input
type="url"
name="token_endpoint"
bind:value={config.token_endpoint}
bind:error={formErrors.token_endpoint}
autocomplete="off"
placeholder="Token Endpoint"
on:input={validateFormLookup}
width={inputWidth}
Expand All @@ -459,9 +470,10 @@
</Input>

<Input
type="url"
name="userinfo_endpoint"
bind:value={config.userinfo_endpoint}
bind:error={formErrors.userinfo_endpoint}
autocomplete="off"
placeholder="Userinfo Endpoint"
on:input={validateFormLookup}
width={inputWidth}
Expand All @@ -486,9 +498,9 @@
Provide the values separated by space.
</div>
<Input
name="scope"
bind:value={config.scope}
bind:error={formErrors.scope}
autocomplete="off"
placeholder="openid profile email"
on:input={validateFormConfig}
width={inputWidth}
Expand All @@ -500,9 +512,9 @@
Client name for the Rauthy login form
</div>
<Input
name="client_name"
bind:value={config.name}
bind:error={formErrors.name}
autocomplete="off"
placeholder="Client Name"
on:input={validateFormConfig}
width={inputWidth}
Expand All @@ -514,6 +526,7 @@
Client ID given by the auth provider
</div>
<Input
name="client_id"
bind:value={config.client_id}
bind:error={formErrors.client_id}
autocomplete="off"
Expand All @@ -529,6 +542,7 @@
At least a client secret or PKCE is required.
</div>
<PasswordInput
name="client_secret"
bind:value={config.client_secret}
bind:error={formErrors.client_secret}
autocomplete="off"
Expand All @@ -546,19 +560,19 @@
</p>
</div>
<Input
name="admin_claim_path"
bind:value={config.admin_claim_path}
bind:error={formErrors.admin_claim_path}
autocomplete="off"
placeholder="$.roles.*"
on:input={validateFormConfig}
width={inputWidth}
>
ADMIN CLAIM PATH
</Input>
<Input
name="admin_claim_value"
bind:value={config.admin_claim_value}
bind:error={formErrors.admin_claim_value}
autocomplete="off"
placeholder="rauthy_admin"
on:input={validateFormConfig}
width={inputWidth}
Expand All @@ -573,19 +587,19 @@
</p>
</div>
<Input
name="mfa_claim_path"
bind:value={config.mfa_claim_path}
bind:error={formErrors.mfa_claim_path}
autocomplete="off"
placeholder="$.amr.*"
on:input={validateFormConfig}
width={inputWidth}
>
MFA CLAIM PATH
</Input>
<Input
name="mfa_claim_value"
bind:value={config.mfa_claim_value}
bind:error={formErrors.mfa_claim_value}
autocomplete="off"
placeholder="mfa"
on:input={validateFormConfig}
width={inputWidth}
Expand Down

0 comments on commit c89fb7f

Please sign in to comment.








ApplySandwichStrip

pFad - (p)hone/(F)rame/(a)nonymizer/(d)eclutterfier!      Saves Data!


--- a PPN by Garber Painting Akron. With Image Size Reduction included!

Fetched URL: https://github.com/sebadob/rauthy/commit/c89fb7fbacb002a202a8022d8318362ee4d6db73

Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy