More homogeneous storybook setup
This commit is contained in:
Joseph Garrone
parent
e011fb094c
commit
ba4d9675a8
@ -1,15 +1,17 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { Meta, StoryObj } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "account.ftl";
|
const pageId = "account.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta = {
|
const meta = {
|
||||||
title: "account/Account",
|
title: `account/${pageId}`,
|
||||||
component: PageStory
|
component: PageStory,
|
||||||
|
parameters
|
||||||
} satisfies Meta<typeof PageStory>;
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
type Story = StoryObj<typeof meta>;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|||||||
@ -1,173 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import { Meta } from "@storybook/react";
|
|
||||||
import { createPageStory } from "../createPageStory";
|
|
||||||
|
|
||||||
const { PageStory } = createPageStory({
|
|
||||||
pageId: "totp.ftl"
|
|
||||||
});
|
|
||||||
|
|
||||||
const meta = {
|
|
||||||
title: "account/Authenticator",
|
|
||||||
component: PageStory
|
|
||||||
} satisfies Meta<typeof PageStory>;
|
|
||||||
export default meta;
|
|
||||||
|
|
||||||
export const Default = () => (
|
|
||||||
<PageStory
|
|
||||||
kcContext={{
|
|
||||||
totp: {
|
|
||||||
enabled: false,
|
|
||||||
totpSecretEncoded: "HE4W MSTC OBKU CY2M ONXF OV3Q NYYU I3SH",
|
|
||||||
totpSecret: "99fJbpUAcLsnWWpn1DnG",
|
|
||||||
manualUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=manual",
|
|
||||||
totpSecretQrCode:
|
|
||||||
"iVBORw0KGgoAAAANSUhEUgAAAPYAAAD2AQAAAADNaUdlAAACk0lEQVR4Xu2YQY6DMAxFjViw5AjcBC6GBBIXozfJEbpkger53wEKqOpmFvaikQYNeVRyHPvbiejXscp95jp+/D5zHT9+n7kO8qeIFDqKzjJo9dC1wUSPP7yG4IPq41lq9ZK+keLZSwXDGwMhOCZgdX4sBVD1qld+GYg/h6ScreBuIDo5FKfVM7Z8aWs9PB2E2/73DdOlwUrK9Ck+HDnzB7ziR8fjlD/OPI8pVQwCi899TkNw2M+tp9XSLFKPIq2UySIhBB906fCQTicFwiv1EUG6+d+bl4zPIYnUk5oIcS69/evPYStUp6P0dJhD/mhauijcth76mOsfw+GFrbfXKJx7LW2N15kijuWIMCYicLQOCEimDp1c0L8PzCLTs3/d+ZQLyl6VqeSIT9nz25szf2ZybHgC31yrXEQIbqaPjX0k9GqWy0N/nLkagsHWNXR0LZwsR357c0pjC6fm+meu5f6f6oszz/qj7GpYCdHf0LVH/gTgtJ/5bVavPJ9svwnBS9qaqwoHOh3G7Ln++HIIDgpKYpFW00dlkX7ruz836THBWQpzd23/xeDsFVroz15fRjsfMyaC8JX2Y8PZf+VIoKff+uTO6WSIUIfSkrl9/rbfnbPr30R8hnMtXA/98ea5lx4ZlSMgQlMsEnb73XnP+yNl/SuR3/lzTSZHMTirMpMcXjWr0U5Mp/rnzmk/TsXkC2/iKEJ5TRG4DZ5KrP/C0RiVmkp+5I8zN1uh2vv9Vs+bzJ4947Y+bz6wl6ZIcv87ZaU2+6PwnoKdb7VYmrf9Z02MxCmNdmparbVJtrA4nA+e9LgIS6dzfvly7j+4XWIuPJp8iE9PbvkzJHYNabt/o5MP+535t/Hj95nr+PH7zHX8m/8B+RAnloz5pi4AAAAASUVORK5CYII=",
|
|
||||||
policy: {
|
|
||||||
type: "totp"
|
|
||||||
},
|
|
||||||
qrUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=qr",
|
|
||||||
otpCredentials: []
|
|
||||||
},
|
|
||||||
messagesPerField: {},
|
|
||||||
stateChecker: "ihTeSAMfNsobnPjYiktV8DY-5T4sVzVdrEZRdwfMm8Y",
|
|
||||||
realm: {
|
|
||||||
userManagedAccessAllowed: true,
|
|
||||||
internationalizationEnabled: false
|
|
||||||
},
|
|
||||||
url: {
|
|
||||||
totpUrl: "http://localhost:8080/realms/myrealm/account/totp"
|
|
||||||
},
|
|
||||||
keycloakifyVersion: "9.6.1",
|
|
||||||
themeVersion: "1.0.10",
|
|
||||||
themeType: "account",
|
|
||||||
themeName: "keycloakify",
|
|
||||||
pageId: "totp.ftl"
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
|
|
||||||
export const WithTotpEnabled = () => (
|
|
||||||
<PageStory
|
|
||||||
kcContext={{
|
|
||||||
totp: {
|
|
||||||
enabled: true,
|
|
||||||
totpSecretEncoded: "G55E MZKC JFUD MQLT MFIF EVSB JFLG M6SO",
|
|
||||||
totpSecret: "7zFeBIh6AsaPRVAIVfzN",
|
|
||||||
manualUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=manual",
|
|
||||||
supportedApplications: ["totpAppFreeOTPName", "totpAppMicrosoftAuthenticatorName", "totpAppGoogleName"],
|
|
||||||
totpSecretQrCode:
|
|
||||||
"iVBORw0KGgoAAAANSUhEUgAAAPYAAAD2AQAAAADNaUdlAAACo0lEQVR4Xu2YPY6DMBCFJ6JwyRF8k+RiSCBxsXATjkDpAmX2vTGBwErbbDFTZIps4s8rmfl9RvRPW+W6crYvv66c7cuvK2cjX0Tkho9yW/q5PHSc5QYA62PwXnWqmzrRSUdNL+mygRC8kzQZWhqVO1CRds3YHopnfUkzp2c7ZAY+GIdXywOb0qsdJMXiFn9serYrncxNv/PDkdfUzObk/eNaX368mnl1kML8RH1vFoGzargA1DM/VeWhOpf9+by5iL5Q0NaEUETslHiSIz+dOc4q0tqBrcg7IsnpnZ8BeLmjqjFa4Fps4vlR3484nFHH6OP8o1cTc4I/Q3D4Uqw1TjpkeHqc2R/Rjvb89OUUDAL/CpycOf/o6fUjP505/phrOf8wn+tolsxyD8GZnzyrJSScrNyEcXhHJwrBh2yj2fShPlFB2PQxn935aK1HIB1G1nczm8+P+nbmC7si+zell53a4i97fnhz5Gddxc9iSgLPpPifGn9vDqN0YBL0lpozdx7nd+dDHSiFXkV+NlZO85Efzvzda8yrwkylvlEbhxE4bTJpiCEIkWNHbxD/w/++fJMOVX8p5Q70F0V2EI4LsUWd+ov6Wtgu5aM/OXNIf6jWbKq6zmekA77t88WZr5lXO6vvWaj6kbNo4nv/ceaon0TpYPqrmNJhue/x9+ZKLchbO+cLPrb+aI09BLeob1en2nqkKsUYfOvatSGa/ircmD7i78rNmJoYzXwIKh228z3+ztzef+Cb6S/lSxoWOXM2CO/ZuvlqARtLvX8u1Ie6+d+bd/X9pdS3lrrF/8jPCPytv9AVIbfvddxE4iNFLKL+hH/xCNudKgTvGX/r33ars/y062gQjljfWN8cyKm+f2NPOvqTL//Lvvy6crYvv66c7d/8B/9RFjk6Tp30AAAAAElFTkSuQmCC",
|
|
||||||
policy: {
|
|
||||||
type: "totp",
|
|
||||||
algorithm: "HmacSHA1"
|
|
||||||
},
|
|
||||||
qrUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=qr",
|
|
||||||
otpCredentials: [
|
|
||||||
{
|
|
||||||
id: "7afaaf7d-f2d5-44f5-a966-e5297f0b2b7a",
|
|
||||||
userLabel: "mobile"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
message: {
|
|
||||||
summary: "Mobile authenticator configured.",
|
|
||||||
type: "success"
|
|
||||||
},
|
|
||||||
url: {
|
|
||||||
totpUrl: "http://localhost:8080/realms/myrealm/account/totp"
|
|
||||||
},
|
|
||||||
messagesPerField: {},
|
|
||||||
stateChecker: "0UvyCNJHRJXmdahtRmn0tTPCU2nwLtWBUfPaaX1qb4g",
|
|
||||||
realm: {
|
|
||||||
userManagedAccessAllowed: true,
|
|
||||||
internationalizationEnabled: false
|
|
||||||
},
|
|
||||||
keycloakifyVersion: "9.6.1",
|
|
||||||
themeVersion: "1.0.10",
|
|
||||||
themeType: "account",
|
|
||||||
themeName: "keycloakify",
|
|
||||||
pageId: "totp.ftl"
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
|
|
||||||
export const WithManualMode = () => (
|
|
||||||
<PageStory
|
|
||||||
kcContext={{
|
|
||||||
mode: "manual",
|
|
||||||
totp: {
|
|
||||||
enabled: false,
|
|
||||||
totpSecretEncoded: "KZ5H CYTW GBVV ASDE JRXG MMCK HAZU E6TX",
|
|
||||||
totpSecret: "Vzqbv0kPHdLnf0J83Bzw",
|
|
||||||
manualUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=manual",
|
|
||||||
totpSecretQrCode:
|
|
||||||
"iVBORw0KGgoAAAANSUhEUgAAAPYAAAD2AQAAAADNaUdlAAACpklEQVR4Xu2YQa6rMAxFXTFgyBLYSbsxJJC6sb6dZAkdMkDNv8cBStHTm/yBM2ikIpqTgePY1w6W/xyLnWc+x5efZz7Hl59nPgf8aWaXPFl+2ZhbzfWaGPTT3yr4mPPPs8nty4ZeKxfzRQ6q4IO1P8zq0c/iffvqtIlLTfw5psxsK3f7JirjTHDqWpQ3T9fC/fytn2956u32bNJv8RHIyZ/n0MvJh8cpvwJ5GffkQaBNYPo2auCyv30YVmtitm4yu1qT5mtXCR9svsqXeih1/I1IbZHLKniTskxPOvCGSB3Wud2/0Vz+5YH9uHZAvzORUAlXaXmY9FHxyZuWI0L5sfs3lkt1vDTbtVtM8bmovrCT26o/0bxozVAWIY3IuTLpsvk3mDNeRv9QqrJWEp+25Xc01/uMVudHpySiE3PXklN1cLSm8yCgKmuWICUIxip4vqM6Y+kalNX3hJNtz+9orgOXQ60noZPrd/H5u74E86I/pfXXm/obXPvOr2juVW8o9nsTS77T5Ix18CZ71sh+qQ7n3+LzY32J5WptXt291Bdaf8tcVw76Hcvpqr31R3CUOri7Q79r4ap61+5O12XoT1leOrFK+HZ/asga/sr0tz5F85wozWq4aMKcP1DK3f54Ttfv+a0iqG1wCU2H/iGWl156IionQYWmngTpan84H9aGy+8nl7I8J5ejOnjP0SNCC/0/lVpydKyPwZz7u/Xef80ouaRHHt7PP5j74BJFfBpJ3vLp460/wdxtxX5KM6XPMvktJ6/7i+YjvfRS/Gs3za3218LJH5qwzKKf7fzd3fXwEWmkf5WTKS3JN1YRTxKhiY9IC6mzUKmP/g3knL8cqoeUiKvJL/EZyT1/sJ/vg+X7G07e7Q/mf40vP898ji8/z3yO/+b/ANUwOXCzdQgqAAAAAElFTkSuQmCC",
|
|
||||||
policy: {
|
|
||||||
type: "totp",
|
|
||||||
algorithm: "HmacSHA1"
|
|
||||||
},
|
|
||||||
qrUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=qr",
|
|
||||||
otpCredentials: []
|
|
||||||
},
|
|
||||||
messagesPerField: {},
|
|
||||||
stateChecker: "HiBl2ADzLwKwQS813LOEig1Ymm4xpEu_NacYtWJIuHU",
|
|
||||||
realm: {
|
|
||||||
userManagedAccessAllowed: true,
|
|
||||||
internationalizationEnabled: false
|
|
||||||
},
|
|
||||||
url: {
|
|
||||||
totpUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=manual"
|
|
||||||
},
|
|
||||||
keycloakifyVersion: "9.6.1",
|
|
||||||
themeVersion: "1.0.10",
|
|
||||||
themeType: "account",
|
|
||||||
themeName: "keycloakify",
|
|
||||||
pageId: "totp.ftl"
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
|
|
||||||
export const MoreThanOneTotpProviders = () => (
|
|
||||||
<PageStory
|
|
||||||
kcContext={{
|
|
||||||
totp: {
|
|
||||||
enabled: true,
|
|
||||||
totpSecretEncoded: "G55E MZKC JFUD MQLT MFIF EVSB JFLG M6SO",
|
|
||||||
totpSecret: "7zFeBIh6AsaPRVAIVfzN",
|
|
||||||
manualUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=manual",
|
|
||||||
supportedApplications: ["totpAppFreeOTPName", "totpAppMicrosoftAuthenticatorName", "totpAppGoogleName"],
|
|
||||||
totpSecretQrCode:
|
|
||||||
"iVBORw0KGgoAAAANSUhEUgAAAPYAAAD2AQAAAADNaUdlAAACo0lEQVR4Xu2YPY6DMBCFJ6JwyRF8k+RiSCBxsXATjkDpAmX2vTGBwErbbDFTZIps4s8rmfl9RvRPW+W6crYvv66c7cuvK2cjX0Tkho9yW/q5PHSc5QYA62PwXnWqmzrRSUdNL+mygRC8kzQZWhqVO1CRds3YHopnfUkzp2c7ZAY+GIdXywOb0qsdJMXiFn9serYrncxNv/PDkdfUzObk/eNaX368mnl1kML8RH1vFoGzargA1DM/VeWhOpf9+by5iL5Q0NaEUETslHiSIz+dOc4q0tqBrcg7IsnpnZ8BeLmjqjFa4Fps4vlR3484nFHH6OP8o1cTc4I/Q3D4Uqw1TjpkeHqc2R/Rjvb89OUUDAL/CpycOf/o6fUjP505/phrOf8wn+tolsxyD8GZnzyrJSScrNyEcXhHJwrBh2yj2fShPlFB2PQxn935aK1HIB1G1nczm8+P+nbmC7si+zell53a4i97fnhz5Gddxc9iSgLPpPifGn9vDqN0YBL0lpozdx7nd+dDHSiFXkV+NlZO85Efzvzda8yrwkylvlEbhxE4bTJpiCEIkWNHbxD/w/++fJMOVX8p5Q70F0V2EI4LsUWd+ov6Wtgu5aM/OXNIf6jWbKq6zmekA77t88WZr5lXO6vvWaj6kbNo4nv/ceaon0TpYPqrmNJhue/x9+ZKLchbO+cLPrb+aI09BLeob1en2nqkKsUYfOvatSGa/ircmD7i78rNmJoYzXwIKh228z3+ztzef+Cb6S/lSxoWOXM2CO/ZuvlqARtLvX8u1Ie6+d+bd/X9pdS3lrrF/8jPCPytv9AVIbfvddxE4iNFLKL+hH/xCNudKgTvGX/r33ars/y062gQjljfWN8cyKm+f2NPOvqTL//Lvvy6crYvv66c7d/8B/9RFjk6Tp30AAAAAElFTkSuQmCC",
|
|
||||||
policy: {
|
|
||||||
type: "totp",
|
|
||||||
algorithm: "HmacSHA1"
|
|
||||||
},
|
|
||||||
qrUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=qr",
|
|
||||||
otpCredentials: [
|
|
||||||
{
|
|
||||||
id: "7afaaf7d-f2d5-44f5-a966-e5297f0b2b7a",
|
|
||||||
userLabel: "Samsung S23"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "fbe22500-d979-45a3-9666-84c99e27958e",
|
|
||||||
userLabel: "Apple Iphone 15"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
url: {
|
|
||||||
totpUrl: "http://localhost:8080/realms/myrealm/account/totp"
|
|
||||||
},
|
|
||||||
messagesPerField: {},
|
|
||||||
stateChecker: "0UvyCNJHRJXmdahtRmn0tTPCU2nwLtWBUfPaaX1qb4g",
|
|
||||||
realm: {
|
|
||||||
userManagedAccessAllowed: true,
|
|
||||||
internationalizationEnabled: false
|
|
||||||
},
|
|
||||||
keycloakifyVersion: "9.6.1",
|
|
||||||
themeVersion: "1.0.10",
|
|
||||||
themeType: "account",
|
|
||||||
themeName: "keycloakify",
|
|
||||||
pageId: "totp.ftl"
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
@ -1,34 +1,41 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { Meta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "federatedIdentity.ftl";
|
const pageId = "federatedIdentity.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta = {
|
const meta = {
|
||||||
title: "account/FederatedIdentity",
|
title: `account/${pageId}`,
|
||||||
component: PageStory
|
component: PageStory,
|
||||||
|
parameters
|
||||||
} satisfies Meta<typeof PageStory>;
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
export const NotConnected = () => (
|
export const Default: Story = {
|
||||||
<PageStory
|
render: () => <PageStory />
|
||||||
kcContext={{
|
};
|
||||||
pageId: "federatedIdentity.ftl",
|
|
||||||
federatedIdentity: {
|
export const NotConnected: Story = {
|
||||||
identities: [
|
render: () => (
|
||||||
{
|
<PageStory
|
||||||
providerId: "google",
|
kcContext={{
|
||||||
displayName: "keycloak-oidc",
|
pageId: "federatedIdentity.ftl",
|
||||||
connected: false
|
federatedIdentity: {
|
||||||
}
|
identities: [
|
||||||
],
|
{
|
||||||
removeLinkPossible: true
|
providerId: "google",
|
||||||
}
|
displayName: "keycloak-oidc",
|
||||||
}}
|
connected: false
|
||||||
/>
|
}
|
||||||
);
|
],
|
||||||
|
removeLinkPossible: true
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { Meta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "log.ftl";
|
const pageId = "log.ftl";
|
||||||
|
|
||||||
@ -9,346 +9,350 @@ const { PageStory } = createPageStory({
|
|||||||
});
|
});
|
||||||
|
|
||||||
const meta = {
|
const meta = {
|
||||||
title: "account/Log",
|
title: `account/${pageId}`,
|
||||||
component: PageStory
|
component: PageStory
|
||||||
} satisfies Meta<typeof PageStory>;
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => (
|
type Story = StoryObj<typeof meta>;
|
||||||
<PageStory
|
|
||||||
kcContext={{
|
export const Default: Story = {
|
||||||
log: {
|
render: () => (
|
||||||
events: [
|
<PageStory
|
||||||
{
|
kcContext={{
|
||||||
date: "2024-04-26T12:29:08Z",
|
log: {
|
||||||
ipAddress: "127.0.0.1",
|
events: [
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-26T12:29:08Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-26T12:10:56Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-26T12:10:56Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-26T11:57:34Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "account",
|
{
|
||||||
details: [],
|
date: "2024-04-26T11:57:34Z",
|
||||||
event: "update totp"
|
ipAddress: "127.0.0.1",
|
||||||
},
|
client: "account",
|
||||||
{
|
details: [],
|
||||||
date: "2024-04-26T11:57:21Z",
|
event: "update totp"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "account",
|
{
|
||||||
details: [],
|
date: "2024-04-26T11:57:21Z",
|
||||||
event: "update totp"
|
ipAddress: "127.0.0.1",
|
||||||
},
|
client: "account",
|
||||||
{
|
details: [],
|
||||||
date: "2024-04-26T11:56:56Z",
|
event: "update totp"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "account",
|
{
|
||||||
details: [],
|
date: "2024-04-26T11:56:56Z",
|
||||||
event: "remove totp"
|
ipAddress: "127.0.0.1",
|
||||||
},
|
client: "account",
|
||||||
{
|
details: [],
|
||||||
date: "2024-04-26T11:56:55Z",
|
event: "remove totp"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "account",
|
{
|
||||||
details: [],
|
date: "2024-04-26T11:56:55Z",
|
||||||
event: "remove totp"
|
ipAddress: "127.0.0.1",
|
||||||
},
|
client: "account",
|
||||||
{
|
details: [],
|
||||||
date: "2024-04-26T11:56:41Z",
|
event: "remove totp"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "account",
|
{
|
||||||
details: [],
|
date: "2024-04-26T11:56:41Z",
|
||||||
event: "update totp"
|
ipAddress: "127.0.0.1",
|
||||||
},
|
client: "account",
|
||||||
{
|
details: [],
|
||||||
date: "2024-04-26T11:56:36Z",
|
event: "update totp"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "account",
|
{
|
||||||
details: [],
|
date: "2024-04-26T11:56:36Z",
|
||||||
event: "update totp"
|
ipAddress: "127.0.0.1",
|
||||||
},
|
client: "account",
|
||||||
{
|
details: [],
|
||||||
date: "2024-04-26T11:32:54Z",
|
event: "update totp"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-26T11:32:54Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-26T09:42:54Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-26T09:42:54Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-26T09:42:52Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-26T09:42:52Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-26T09:42:40Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-26T09:42:40Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-26T09:42:09Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-26T09:42:09Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "false",
|
key: "auth_method"
|
||||||
key: "remember_me"
|
},
|
||||||
},
|
{
|
||||||
{
|
value: "false",
|
||||||
value: "john.doe",
|
key: "remember_me"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-26T09:24:17Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [],
|
date: "2024-04-26T09:24:17Z",
|
||||||
event: "logout"
|
ipAddress: "127.0.0.1",
|
||||||
},
|
client: "keycloakify-frontend",
|
||||||
{
|
details: [],
|
||||||
date: "2024-04-26T09:23:54Z",
|
event: "logout"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-26T09:23:54Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-26T09:23:50Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-26T09:23:50Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-26T09:23:47Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "account",
|
{
|
||||||
details: [
|
date: "2024-04-26T09:23:47Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "account",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-26T09:23:15Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [],
|
date: "2024-04-26T09:23:15Z",
|
||||||
event: "logout"
|
ipAddress: "127.0.0.1",
|
||||||
},
|
client: "keycloakify-frontend",
|
||||||
{
|
details: [],
|
||||||
date: "2024-04-26T09:23:06Z",
|
event: "logout"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-26T09:23:06Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-26T09:22:53Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [],
|
date: "2024-04-26T09:22:53Z",
|
||||||
event: "logout"
|
ipAddress: "127.0.0.1",
|
||||||
},
|
client: "keycloakify-frontend",
|
||||||
{
|
details: [],
|
||||||
date: "2024-04-26T09:21:29Z",
|
event: "logout"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-26T09:21:29Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "false",
|
key: "auth_method"
|
||||||
key: "remember_me"
|
},
|
||||||
},
|
{
|
||||||
{
|
value: "false",
|
||||||
value: "john.doe",
|
key: "remember_me"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-26T09:17:32Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-26T09:17:32Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-18T11:19:09Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-18T11:19:09Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-18T11:18:50Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "keycloakify-frontend",
|
{
|
||||||
details: [
|
date: "2024-04-18T11:18:50Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "keycloakify-frontend",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
},
|
}
|
||||||
{
|
],
|
||||||
date: "2024-04-18T11:18:24Z",
|
event: "login"
|
||||||
ipAddress: "127.0.0.1",
|
},
|
||||||
client: "account",
|
{
|
||||||
details: [
|
date: "2024-04-18T11:18:24Z",
|
||||||
{
|
ipAddress: "127.0.0.1",
|
||||||
value: "openid-connect",
|
client: "account",
|
||||||
key: "auth_method"
|
details: [
|
||||||
},
|
{
|
||||||
{
|
value: "openid-connect",
|
||||||
value: "john.doe",
|
key: "auth_method"
|
||||||
key: "username"
|
},
|
||||||
}
|
{
|
||||||
],
|
value: "john.doe",
|
||||||
event: "login"
|
key: "username"
|
||||||
}
|
}
|
||||||
]
|
],
|
||||||
}
|
event: "login"
|
||||||
}}
|
}
|
||||||
/>
|
]
|
||||||
);
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|||||||
@ -1,24 +1,31 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { Meta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "password.ftl";
|
const pageId = "password.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta = {
|
const meta = {
|
||||||
title: "account/Password",
|
title: `account/${pageId}`,
|
||||||
component: PageStory
|
component: PageStory,
|
||||||
|
parameters
|
||||||
} satisfies Meta<typeof PageStory>;
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
export const WithMessage = () => (
|
export const Default: Story = {
|
||||||
<PageStory
|
render: () => <PageStory />
|
||||||
kcContext={{
|
};
|
||||||
message: { type: "success", summary: "This is a test message" }
|
|
||||||
}}
|
export const WithMessage: Story = {
|
||||||
/>
|
render: () => (
|
||||||
);
|
<PageStory
|
||||||
|
kcContext={{
|
||||||
|
message: { type: "success", summary: "This is a test message" }
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|||||||
@ -1,55 +1,62 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { Meta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "sessions.ftl";
|
const pageId = "sessions.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta = {
|
const meta = {
|
||||||
title: "account/Sessions",
|
title: `account/${pageId}`,
|
||||||
component: PageStory
|
component: PageStory,
|
||||||
|
parameters
|
||||||
} satisfies Meta<typeof PageStory>;
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => (
|
type Story = StoryObj<typeof meta>;
|
||||||
<PageStory
|
|
||||||
kcContext={{
|
|
||||||
sessions: {
|
|
||||||
sessions: [
|
|
||||||
{
|
|
||||||
expires: "2024-04-26T18:14:19Z",
|
|
||||||
clients: ["account"],
|
|
||||||
ipAddress: "172.20.0.1",
|
|
||||||
started: "2024-04-26T08:14:19Z",
|
|
||||||
lastAccess: "2024-04-26T08:30:54Z",
|
|
||||||
id: "af835e30-4821-43b1-b4f7-e732d3cc15d2"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
expires: "2024-04-26T18:14:09Z",
|
|
||||||
clients: ["security-admin-console", "account"],
|
|
||||||
ipAddress: "172.20.0.1",
|
|
||||||
started: "2024-04-26T08:14:09Z",
|
|
||||||
lastAccess: "2024-04-26T08:15:14Z",
|
|
||||||
id: "60a9d8b8-617d-441e-8643-08c3fe30e231"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
stateChecker: "xQ7EOgFrLi4EvnJ8dbXKhwFGWk_bkOp0X89mhilt1os"
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
|
|
||||||
export const WithError = () => (
|
export const Default: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
url: { passwordUrl: "/auth/realms/keycloakify/account/password" },
|
kcContext={{
|
||||||
stateChecker: "xQ7EOgFrLi4EvnJ8dbXKhwFGWk_bkOp0X89mhilt1os",
|
sessions: {
|
||||||
message: {
|
sessions: [
|
||||||
summary: "Invalid existing password.",
|
{
|
||||||
type: "error"
|
expires: "2024-04-26T18:14:19Z",
|
||||||
}
|
clients: ["account"],
|
||||||
}}
|
ipAddress: "172.20.0.1",
|
||||||
/>
|
started: "2024-04-26T08:14:19Z",
|
||||||
);
|
lastAccess: "2024-04-26T08:30:54Z",
|
||||||
|
id: "af835e30-4821-43b1-b4f7-e732d3cc15d2"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
expires: "2024-04-26T18:14:09Z",
|
||||||
|
clients: ["security-admin-console", "account"],
|
||||||
|
ipAddress: "172.20.0.1",
|
||||||
|
started: "2024-04-26T08:14:09Z",
|
||||||
|
lastAccess: "2024-04-26T08:15:14Z",
|
||||||
|
id: "60a9d8b8-617d-441e-8643-08c3fe30e231"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
stateChecker: "xQ7EOgFrLi4EvnJ8dbXKhwFGWk_bkOp0X89mhilt1os"
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
|
export const WithError: Story = {
|
||||||
|
render: () => (
|
||||||
|
<PageStory
|
||||||
|
kcContext={{
|
||||||
|
url: { passwordUrl: "/auth/realms/keycloakify/account/password" },
|
||||||
|
stateChecker: "xQ7EOgFrLi4EvnJ8dbXKhwFGWk_bkOp0X89mhilt1os",
|
||||||
|
message: {
|
||||||
|
summary: "Invalid existing password.",
|
||||||
|
type: "error"
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|||||||
@ -1,105 +1,187 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { Meta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "totp.ftl";
|
const pageId = "totp.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({
|
||||||
|
pageId
|
||||||
|
});
|
||||||
|
|
||||||
const meta = {
|
const meta = {
|
||||||
title: "account/Authenticator",
|
title: `account/${pageId}`,
|
||||||
component: PageStory
|
component: PageStory,
|
||||||
|
parameters
|
||||||
} satisfies Meta<typeof PageStory>;
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => (
|
type Story = StoryObj<typeof meta>;
|
||||||
<PageStory
|
|
||||||
kcContext={{
|
|
||||||
totp: {
|
|
||||||
enabled: false,
|
|
||||||
totpSecretEncoded: "HB2W ESCK KJKF K5DC GJQX S5RQ I5AX CZ2U",
|
|
||||||
totpSecret: "8ubHJRTUtb2ayv0GAqgT",
|
|
||||||
manualUrl: "http://localhost:8080/realms/master/account/totp?mode=manual",
|
|
||||||
supportedApplications: ["totpAppFreeOTPName", "totpAppMicrosoftAuthenticatorName", "totpAppGoogleName"],
|
|
||||||
totpSecretQrCode:
|
|
||||||
"iVBORw0KGgoAAAANSUhEUgAAAPYAAAD2AQAAAADNaUdlAAACoUlEQVR4Xu2YPW7DMAxGGWTImCP4JvbFAtiAL+bcxEfI6MEI+z3Kzl+BLh2oIRwEV08FJIr8SMX8T1vtc+bdvvxz5t2+/HPm3eA3Mzvc+jm+fDoPzXIQkPV18N79ejvOWnRpTlcf/XTVV4Aq+MU0uzZaZI12rZVml4YzVcQHDTrEYufBKuQaZEfX1TvDWhEv98+ty79dGX7HRx438ofQfB04Th08jNS+us+n+1l/XbfZKrgcumj/trRnpfak0Dw54Xp/nC+Xy5bOB7x6dDxt1sq5j/tP52vkd5Ee+Xc1JfnKmergxKdcOyOSCgLik5xXEtXBtXVVvTFcC+pdV6+YqIVT+rpNf4hKjqMgXdo9frO5ldAM1dFJfA7+1O9srqiM4W6otuYQIZ0pvivg8mWUvo6q14VImuTocf/JXFq4cP8lPifld/jXidQqOL0CX0V66L9a6Y9Pu34nc7XW8qoQQ9GfcghVwiq4kStqDdl1hGZpZ3f/ZnN9qyCHkTrWq4nl/l/8n8tVmieL1lpFhiDw0uQ84jeXl4ahp+tay/1r6/ai3/kchxKQI6njyCX64zg8n2s4RZEhIDkJ5ZD9b/mTzZnVq2mmMFP/RjJpwNObf7M5qa0Lj9K837/kvKuEu1ov6p9EiEXkd8ei+57f+VwJPSCSfSnNWkR8PvefytFvK/1riPiIEkXM1sGl39qrWlcEm9K3OXnXn2wO4qcFhWZ02uFk2dO/uTwMJx9ostn6Q4mq4LzvDmoSqXqzE5+8BHiOVsJ7arH661ZFuixCGp/+z+ZsWF+ROuR3I9faS39YBS82F9d2rpWkUzWchqFFdWitS5C+9F+5vC/3T/9Fkl8Y+H3BN/9mc/KHRwrxGa9iePnHGvhf9uWfM+/25Z8z7/Zv/gPV7u6J7fyCcQAAAABJRU5ErkJggg==",
|
|
||||||
qrUrl: "http://localhost:8080/realms/master/account/totp?mode=qr",
|
|
||||||
otpCredentials: []
|
|
||||||
},
|
|
||||||
url: {
|
|
||||||
resourcesPath: "/resources/ueycc/account/keycloakify-starter",
|
|
||||||
resourceUrl: "http://localhost:8080/realms/master/account/resource",
|
|
||||||
resourcesCommonPath: "/resources/ueycc/account/keycloakify-starter/resources-common",
|
|
||||||
logUrl: "http://localhost:8080/realms/master/account/log",
|
|
||||||
socialUrl: "http://localhost:8080/realms/master/account/identity",
|
|
||||||
accountUrl: "http://localhost:8080/realms/master/account/",
|
|
||||||
sessionsUrl: "http://localhost:8080/realms/master/account/sessions",
|
|
||||||
totpUrl: "http://localhost:8080/realms/master/account/totp",
|
|
||||||
applicationsUrl: "http://localhost:8080/realms/master/account/applications",
|
|
||||||
passwordUrl: "http://localhost:8080/realms/master/account/password"
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
|
|
||||||
export const WithTotpEnabled = () => (
|
export const Default: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
totp: {
|
kcContext={{
|
||||||
enabled: true,
|
totp: {
|
||||||
totpSecretEncoded: "HB2W ESCK KJKF K5DC GJQX S5RQ I5AX CZ2U",
|
enabled: false,
|
||||||
totpSecret: "8ubHJRTUtb2ayv0GAqgT",
|
totpSecretEncoded: "HE4W MSTC OBKU CY2M ONXF OV3Q NYYU I3SH",
|
||||||
manualUrl: "http://localhost:8080/realms/master/account/totp?mode=manual",
|
totpSecret: "99fJbpUAcLsnWWpn1DnG",
|
||||||
supportedApplications: ["totpAppFreeOTPName", "totpAppMicrosoftAuthenticatorName", "totpAppGoogleName"],
|
manualUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=manual",
|
||||||
totpSecretQrCode:
|
totpSecretQrCode:
|
||||||
"iVBORw0KGgoAAAANSUhEUgAAAPYAAAD2AQAAAADNaUdlAAACoUlEQVR4Xu2YPW7DMAxGGWTImCP4JvbFAtiAL+bcxEfI6MEI+z3Kzl+BLh2oIRwEV08FJIr8SMX8T1vtc+bdvvxz5t2+/HPm3eA3Mzvc+jm+fDoPzXIQkPV18N79ejvOWnRpTlcf/XTVV4Aq+MU0uzZaZI12rZVml4YzVcQHDTrEYufBKuQaZEfX1TvDWhEv98+ty79dGX7HRx438ofQfB04Th08jNS+us+n+1l/XbfZKrgcumj/trRnpfak0Dw54Xp/nC+Xy5bOB7x6dDxt1sq5j/tP52vkd5Ee+Xc1JfnKmergxKdcOyOSCgLik5xXEtXBtXVVvTFcC+pdV6+YqIVT+rpNf4hKjqMgXdo9frO5ldAM1dFJfA7+1O9srqiM4W6otuYQIZ0pvivg8mWUvo6q14VImuTocf/JXFq4cP8lPifld/jXidQqOL0CX0V66L9a6Y9Pu34nc7XW8qoQQ9GfcghVwiq4kStqDdl1hGZpZ3f/ZnN9qyCHkTrWq4nl/l/8n8tVmieL1lpFhiDw0uQ84jeXl4ahp+tay/1r6/ai3/kchxKQI6njyCX64zg8n2s4RZEhIDkJ5ZD9b/mTzZnVq2mmMFP/RjJpwNObf7M5qa0Lj9K837/kvKuEu1ov6p9EiEXkd8ei+57f+VwJPSCSfSnNWkR8PvefytFvK/1riPiIEkXM1sGl39qrWlcEm9K3OXnXn2wO4qcFhWZ02uFk2dO/uTwMJx9ostn6Q4mq4LzvDmoSqXqzE5+8BHiOVsJ7arH661ZFuixCGp/+z+ZsWF+ROuR3I9faS39YBS82F9d2rpWkUzWchqFFdWitS5C+9F+5vC/3T/9Fkl8Y+H3BN/9mc/KHRwrxGa9iePnHGvhf9uWfM+/25Z8z7/Zv/gPV7u6J7fyCcQAAAABJRU5ErkJggg==",
|
"iVBORw0KGgoAAAANSUhEUgAAAPYAAAD2AQAAAADNaUdlAAACk0lEQVR4Xu2YQY6DMAxFjViw5AjcBC6GBBIXozfJEbpkger53wEKqOpmFvaikQYNeVRyHPvbiejXscp95jp+/D5zHT9+n7kO8qeIFDqKzjJo9dC1wUSPP7yG4IPq41lq9ZK+keLZSwXDGwMhOCZgdX4sBVD1qld+GYg/h6ScreBuIDo5FKfVM7Z8aWs9PB2E2/73DdOlwUrK9Ck+HDnzB7ziR8fjlD/OPI8pVQwCi899TkNw2M+tp9XSLFKPIq2UySIhBB906fCQTicFwiv1EUG6+d+bl4zPIYnUk5oIcS69/evPYStUp6P0dJhD/mhauijcth76mOsfw+GFrbfXKJx7LW2N15kijuWIMCYicLQOCEimDp1c0L8PzCLTs3/d+ZQLyl6VqeSIT9nz25szf2ZybHgC31yrXEQIbqaPjX0k9GqWy0N/nLkagsHWNXR0LZwsR357c0pjC6fm+meu5f6f6oszz/qj7GpYCdHf0LVH/gTgtJ/5bVavPJ9svwnBS9qaqwoHOh3G7Ln++HIIDgpKYpFW00dlkX7ruz836THBWQpzd23/xeDsFVroz15fRjsfMyaC8JX2Y8PZf+VIoKff+uTO6WSIUIfSkrl9/rbfnbPr30R8hnMtXA/98ea5lx4ZlSMgQlMsEnb73XnP+yNl/SuR3/lzTSZHMTirMpMcXjWr0U5Mp/rnzmk/TsXkC2/iKEJ5TRG4DZ5KrP/C0RiVmkp+5I8zN1uh2vv9Vs+bzJ4947Y+bz6wl6ZIcv87ZaU2+6PwnoKdb7VYmrf9Z02MxCmNdmparbVJtrA4nA+e9LgIS6dzfvly7j+4XWIuPJp8iE9PbvkzJHYNabt/o5MP+535t/Hj95nr+PH7zHX8m/8B+RAnloz5pi4AAAAASUVORK5CYII=",
|
||||||
qrUrl: "http://localhost:8080/realms/master/account/totp?mode=qr",
|
policy: {
|
||||||
otpCredentials: []
|
type: "totp"
|
||||||
},
|
},
|
||||||
url: {
|
qrUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=qr",
|
||||||
resourcesPath: "/resources/ueycc/account/keycloakify-starter",
|
otpCredentials: []
|
||||||
resourceUrl: "http://localhost:8080/realms/master/account/resource",
|
},
|
||||||
resourcesCommonPath: "/resources/ueycc/account/keycloakify-starter/resources-common",
|
messagesPerField: {},
|
||||||
logUrl: "http://localhost:8080/realms/master/account/log",
|
stateChecker: "ihTeSAMfNsobnPjYiktV8DY-5T4sVzVdrEZRdwfMm8Y",
|
||||||
socialUrl: "http://localhost:8080/realms/master/account/identity",
|
realm: {
|
||||||
accountUrl: "http://localhost:8080/realms/master/account/",
|
userManagedAccessAllowed: true,
|
||||||
sessionsUrl: "http://localhost:8080/realms/master/account/sessions",
|
internationalizationEnabled: false
|
||||||
totpUrl: "http://localhost:8080/realms/master/account/totp",
|
},
|
||||||
applicationsUrl: "http://localhost:8080/realms/master/account/applications",
|
url: {
|
||||||
passwordUrl: "http://localhost:8080/realms/master/account/password"
|
totpUrl: "http://localhost:8080/realms/myrealm/account/totp"
|
||||||
}
|
},
|
||||||
}}
|
keycloakifyVersion: "9.6.1",
|
||||||
/>
|
themeVersion: "1.0.10",
|
||||||
);
|
themeType: "account",
|
||||||
|
themeName: "keycloakify",
|
||||||
|
pageId: "totp.ftl"
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
export const WithManualMode = () => (
|
export const WithTotpEnabled: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
mode: "manual",
|
kcContext={{
|
||||||
totp: {
|
totp: {
|
||||||
enabled: false,
|
enabled: true,
|
||||||
totpSecretEncoded: "HB2W ESCK KJKF K5DC GJQX S5RQ I5AX CZ2U",
|
totpSecretEncoded: "G55E MZKC JFUD MQLT MFIF EVSB JFLG M6SO",
|
||||||
totpSecret: "8ubHJRTUtb2ayv0GAqgT",
|
totpSecret: "7zFeBIh6AsaPRVAIVfzN",
|
||||||
manualUrl: "http://localhost:8080/realms/master/account/totp?mode=manual",
|
manualUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=manual",
|
||||||
supportedApplications: ["totpAppFreeOTPName", "totpAppMicrosoftAuthenticatorName", "totpAppGoogleName"],
|
supportedApplications: ["totpAppFreeOTPName", "totpAppMicrosoftAuthenticatorName", "totpAppGoogleName"],
|
||||||
totpSecretQrCode:
|
totpSecretQrCode:
|
||||||
"iVBORw0KGgoAAAANSUhEUgAAAPYAAAD2AQAAAADNaUdlAAACoUlEQVR4Xu2YPW7DMAxGGWTImCP4JvbFAtiAL+bcxEfI6MEI+z3Kzl+BLh2oIRwEV08FJIr8SMX8T1vtc+bdvvxz5t2+/HPm3eA3Mzvc+jm+fDoPzXIQkPV18N79ejvOWnRpTlcf/XTVV4Aq+MU0uzZaZI12rZVml4YzVcQHDTrEYufBKuQaZEfX1TvDWhEv98+ty79dGX7HRx438ofQfB04Th08jNS+us+n+1l/XbfZKrgcumj/trRnpfak0Dw54Xp/nC+Xy5bOB7x6dDxt1sq5j/tP52vkd5Ee+Xc1JfnKmergxKdcOyOSCgLik5xXEtXBtXVVvTFcC+pdV6+YqIVT+rpNf4hKjqMgXdo9frO5ldAM1dFJfA7+1O9srqiM4W6otuYQIZ0pvivg8mWUvo6q14VImuTocf/JXFq4cP8lPifld/jXidQqOL0CX0V66L9a6Y9Pu34nc7XW8qoQQ9GfcghVwiq4kStqDdl1hGZpZ3f/ZnN9qyCHkTrWq4nl/l/8n8tVmieL1lpFhiDw0uQ84jeXl4ahp+tay/1r6/ai3/kchxKQI6njyCX64zg8n2s4RZEhIDkJ5ZD9b/mTzZnVq2mmMFP/RjJpwNObf7M5qa0Lj9K837/kvKuEu1ov6p9EiEXkd8ei+57f+VwJPSCSfSnNWkR8PvefytFvK/1riPiIEkXM1sGl39qrWlcEm9K3OXnXn2wO4qcFhWZ02uFk2dO/uTwMJx9ostn6Q4mq4LzvDmoSqXqzE5+8BHiOVsJ7arH661ZFuixCGp/+z+ZsWF+ROuR3I9faS39YBS82F9d2rpWkUzWchqFFdWitS5C+9F+5vC/3T/9Fkl8Y+H3BN/9mc/KHRwrxGa9iePnHGvhf9uWfM+/25Z8z7/Zv/gPV7u6J7fyCcQAAAABJRU5ErkJggg==",
|
"iVBORw0KGgoAAAANSUhEUgAAAPYAAAD2AQAAAADNaUdlAAACo0lEQVR4Xu2YPY6DMBCFJ6JwyRF8k+RiSCBxsXATjkDpAmX2vTGBwErbbDFTZIps4s8rmfl9RvRPW+W6crYvv66c7cuvK2cjX0Tkho9yW/q5PHSc5QYA62PwXnWqmzrRSUdNL+mygRC8kzQZWhqVO1CRds3YHopnfUkzp2c7ZAY+GIdXywOb0qsdJMXiFn9serYrncxNv/PDkdfUzObk/eNaX368mnl1kML8RH1vFoGzargA1DM/VeWhOpf9+by5iL5Q0NaEUETslHiSIz+dOc4q0tqBrcg7IsnpnZ8BeLmjqjFa4Fps4vlR3484nFHH6OP8o1cTc4I/Q3D4Uqw1TjpkeHqc2R/Rjvb89OUUDAL/CpycOf/o6fUjP505/phrOf8wn+tolsxyD8GZnzyrJSScrNyEcXhHJwrBh2yj2fShPlFB2PQxn935aK1HIB1G1nczm8+P+nbmC7si+zell53a4i97fnhz5Gddxc9iSgLPpPifGn9vDqN0YBL0lpozdx7nd+dDHSiFXkV+NlZO85Efzvzda8yrwkylvlEbhxE4bTJpiCEIkWNHbxD/w/++fJMOVX8p5Q70F0V2EI4LsUWd+ov6Wtgu5aM/OXNIf6jWbKq6zmekA77t88WZr5lXO6vvWaj6kbNo4nv/ceaon0TpYPqrmNJhue/x9+ZKLchbO+cLPrb+aI09BLeob1en2nqkKsUYfOvatSGa/ircmD7i78rNmJoYzXwIKh228z3+ztzef+Cb6S/lSxoWOXM2CO/ZuvlqARtLvX8u1Ie6+d+bd/X9pdS3lrrF/8jPCPytv9AVIbfvddxE4iNFLKL+hH/xCNudKgTvGX/r33ars/y062gQjljfWN8cyKm+f2NPOvqTL//Lvvy6crYvv66c7d/8B/9RFjk6Tp30AAAAAElFTkSuQmCC",
|
||||||
qrUrl: "http://localhost:8080/realms/master/account/totp?mode=qr",
|
policy: {
|
||||||
otpCredentials: []
|
type: "totp",
|
||||||
},
|
algorithm: "HmacSHA1"
|
||||||
url: {
|
},
|
||||||
resourcesPath: "/resources/ueycc/account/keycloakify-starter",
|
qrUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=qr",
|
||||||
resourceUrl: "http://localhost:8080/realms/master/account/resource",
|
otpCredentials: [
|
||||||
resourcesCommonPath: "/resources/ueycc/account/keycloakify-starter/resources-common",
|
{
|
||||||
logUrl: "http://localhost:8080/realms/master/account/log",
|
id: "7afaaf7d-f2d5-44f5-a966-e5297f0b2b7a",
|
||||||
socialUrl: "http://localhost:8080/realms/master/account/identity",
|
userLabel: "mobile"
|
||||||
accountUrl: "http://localhost:8080/realms/master/account/",
|
}
|
||||||
sessionsUrl: "http://localhost:8080/realms/master/account/sessions",
|
]
|
||||||
totpUrl: "http://localhost:8080/realms/master/account/totp",
|
},
|
||||||
applicationsUrl: "http://localhost:8080/realms/master/account/applications",
|
message: {
|
||||||
passwordUrl: "http://localhost:8080/realms/master/account/password"
|
summary: "Mobile authenticator configured.",
|
||||||
}
|
type: "success"
|
||||||
}}
|
},
|
||||||
/>
|
url: {
|
||||||
);
|
totpUrl: "http://localhost:8080/realms/myrealm/account/totp"
|
||||||
|
},
|
||||||
|
messagesPerField: {},
|
||||||
|
stateChecker: "0UvyCNJHRJXmdahtRmn0tTPCU2nwLtWBUfPaaX1qb4g",
|
||||||
|
realm: {
|
||||||
|
userManagedAccessAllowed: true,
|
||||||
|
internationalizationEnabled: false
|
||||||
|
},
|
||||||
|
keycloakifyVersion: "9.6.1",
|
||||||
|
themeVersion: "1.0.10",
|
||||||
|
themeType: "account",
|
||||||
|
themeName: "keycloakify",
|
||||||
|
pageId: "totp.ftl"
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
|
export const WithManualMode: Story = {
|
||||||
|
render: () => (
|
||||||
|
<PageStory
|
||||||
|
kcContext={{
|
||||||
|
mode: "manual",
|
||||||
|
totp: {
|
||||||
|
enabled: false,
|
||||||
|
totpSecretEncoded: "KZ5H CYTW GBVV ASDE JRXG MMCK HAZU E6TX",
|
||||||
|
totpSecret: "Vzqbv0kPHdLnf0J83Bzw",
|
||||||
|
manualUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=manual",
|
||||||
|
totpSecretQrCode:
|
||||||
|
"iVBORw0KGgoAAAANSUhEUgAAAPYAAAD2AQAAAADNaUdlAAACpklEQVR4Xu2YQa6rMAxFXTFgyBLYSbsxJJC6sb6dZAkdMkDNv8cBStHTm/yBM2ikIpqTgePY1w6W/xyLnWc+x5efZz7Hl59nPgf8aWaXPFl+2ZhbzfWaGPTT3yr4mPPPs8nty4ZeKxfzRQ6q4IO1P8zq0c/iffvqtIlLTfw5psxsK3f7JirjTHDqWpQ3T9fC/fytn2956u32bNJv8RHIyZ/n0MvJh8cpvwJ5GffkQaBNYPo2auCyv30YVmtitm4yu1qT5mtXCR9svsqXeih1/I1IbZHLKniTskxPOvCGSB3Wud2/0Vz+5YH9uHZAvzORUAlXaXmY9FHxyZuWI0L5sfs3lkt1vDTbtVtM8bmovrCT26o/0bxozVAWIY3IuTLpsvk3mDNeRv9QqrJWEp+25Xc01/uMVudHpySiE3PXklN1cLSm8yCgKmuWICUIxip4vqM6Y+kalNX3hJNtz+9orgOXQ60noZPrd/H5u74E86I/pfXXm/obXPvOr2juVW8o9nsTS77T5Ix18CZ71sh+qQ7n3+LzY32J5WptXt291Bdaf8tcVw76Hcvpqr31R3CUOri7Q79r4ap61+5O12XoT1leOrFK+HZ/asga/sr0tz5F85wozWq4aMKcP1DK3f54Ttfv+a0iqG1wCU2H/iGWl156IionQYWmngTpan84H9aGy+8nl7I8J5ejOnjP0SNCC/0/lVpydKyPwZz7u/Xef80ouaRHHt7PP5j74BJFfBpJ3vLp460/wdxtxX5KM6XPMvktJ6/7i+YjvfRS/Gs3za3218LJH5qwzKKf7fzd3fXwEWmkf5WTKS3JN1YRTxKhiY9IC6mzUKmP/g3knL8cqoeUiKvJL/EZyT1/sJ/vg+X7G07e7Q/mf40vP898ji8/z3yO/+b/ANUwOXCzdQgqAAAAAElFTkSuQmCC",
|
||||||
|
policy: {
|
||||||
|
type: "totp",
|
||||||
|
algorithm: "HmacSHA1"
|
||||||
|
},
|
||||||
|
qrUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=qr",
|
||||||
|
otpCredentials: []
|
||||||
|
},
|
||||||
|
messagesPerField: {},
|
||||||
|
stateChecker: "HiBl2ADzLwKwQS813LOEig1Ymm4xpEu_NacYtWJIuHU",
|
||||||
|
realm: {
|
||||||
|
userManagedAccessAllowed: true,
|
||||||
|
internationalizationEnabled: false
|
||||||
|
},
|
||||||
|
url: {
|
||||||
|
totpUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=manual"
|
||||||
|
},
|
||||||
|
keycloakifyVersion: "9.6.1",
|
||||||
|
themeVersion: "1.0.10",
|
||||||
|
themeType: "account",
|
||||||
|
themeName: "keycloakify",
|
||||||
|
pageId: "totp.ftl"
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
|
export const MoreThanOneTotpProviders: Story = {
|
||||||
|
render: () => (
|
||||||
|
<PageStory
|
||||||
|
kcContext={{
|
||||||
|
totp: {
|
||||||
|
enabled: true,
|
||||||
|
totpSecretEncoded: "G55E MZKC JFUD MQLT MFIF EVSB JFLG M6SO",
|
||||||
|
totpSecret: "7zFeBIh6AsaPRVAIVfzN",
|
||||||
|
manualUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=manual",
|
||||||
|
supportedApplications: ["totpAppFreeOTPName", "totpAppMicrosoftAuthenticatorName", "totpAppGoogleName"],
|
||||||
|
totpSecretQrCode:
|
||||||
|
"iVBORw0KGgoAAAANSUhEUgAAAPYAAAD2AQAAAADNaUdlAAACo0lEQVR4Xu2YPY6DMBCFJ6JwyRF8k+RiSCBxsXATjkDpAmX2vTGBwErbbDFTZIps4s8rmfl9RvRPW+W6crYvv66c7cuvK2cjX0Tkho9yW/q5PHSc5QYA62PwXnWqmzrRSUdNL+mygRC8kzQZWhqVO1CRds3YHopnfUkzp2c7ZAY+GIdXywOb0qsdJMXiFn9serYrncxNv/PDkdfUzObk/eNaX368mnl1kML8RH1vFoGzargA1DM/VeWhOpf9+by5iL5Q0NaEUETslHiSIz+dOc4q0tqBrcg7IsnpnZ8BeLmjqjFa4Fps4vlR3484nFHH6OP8o1cTc4I/Q3D4Uqw1TjpkeHqc2R/Rjvb89OUUDAL/CpycOf/o6fUjP505/phrOf8wn+tolsxyD8GZnzyrJSScrNyEcXhHJwrBh2yj2fShPlFB2PQxn935aK1HIB1G1nczm8+P+nbmC7si+zell53a4i97fnhz5Gddxc9iSgLPpPifGn9vDqN0YBL0lpozdx7nd+dDHSiFXkV+NlZO85Efzvzda8yrwkylvlEbhxE4bTJpiCEIkWNHbxD/w/++fJMOVX8p5Q70F0V2EI4LsUWd+ov6Wtgu5aM/OXNIf6jWbKq6zmekA77t88WZr5lXO6vvWaj6kbNo4nv/ceaon0TpYPqrmNJhue/x9+ZKLchbO+cLPrb+aI09BLeob1en2nqkKsUYfOvatSGa/ircmD7i78rNmJoYzXwIKh228z3+ztzef+Cb6S/lSxoWOXM2CO/ZuvlqARtLvX8u1Ie6+d+bd/X9pdS3lrrF/8jPCPytv9AVIbfvddxE4iNFLKL+hH/xCNudKgTvGX/r33ars/y062gQjljfWN8cyKm+f2NPOvqTL//Lvvy6crYvv66c7d/8B/9RFjk6Tp30AAAAAElFTkSuQmCC",
|
||||||
|
policy: {
|
||||||
|
type: "totp",
|
||||||
|
algorithm: "HmacSHA1"
|
||||||
|
},
|
||||||
|
qrUrl: "http://localhost:8080/realms/myrealm/account/totp?mode=qr",
|
||||||
|
otpCredentials: [
|
||||||
|
{
|
||||||
|
id: "7afaaf7d-f2d5-44f5-a966-e5297f0b2b7a",
|
||||||
|
userLabel: "Samsung S23"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "fbe22500-d979-45a3-9666-84c99e27958e",
|
||||||
|
userLabel: "Apple Iphone 15"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
url: {
|
||||||
|
totpUrl: "http://localhost:8080/realms/myrealm/account/totp"
|
||||||
|
},
|
||||||
|
messagesPerField: {},
|
||||||
|
stateChecker: "0UvyCNJHRJXmdahtRmn0tTPCU2nwLtWBUfPaaX1qb4g",
|
||||||
|
realm: {
|
||||||
|
userManagedAccessAllowed: true,
|
||||||
|
internationalizationEnabled: false
|
||||||
|
},
|
||||||
|
keycloakifyVersion: "9.6.1",
|
||||||
|
themeVersion: "1.0.10",
|
||||||
|
themeType: "account",
|
||||||
|
themeName: "keycloakify",
|
||||||
|
pageId: "totp.ftl"
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|||||||
@ -1,19 +1,31 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { getKcContext, type KcContext } from "./kcContext";
|
import type { KcContext } from "./kcContext";
|
||||||
|
import { getKcContextMock } from "./kcContextMock";
|
||||||
import KcApp from "./KcApp";
|
import KcApp from "./KcApp";
|
||||||
import type { DeepPartial } from "../../dist/tools/DeepPartial";
|
import type { DeepPartial } from "../../dist/tools/DeepPartial";
|
||||||
|
|
||||||
export function createPageStory<PageId extends KcContext["pageId"]>(params: { pageId: PageId }) {
|
export function createPageStory<PageId extends KcContext["pageId"]>(params: { pageId: PageId }) {
|
||||||
const { pageId } = params;
|
const { pageId } = params;
|
||||||
|
|
||||||
function PageStory(params: { kcContext?: DeepPartial<Extract<KcContext, { pageId: PageId }>> }) {
|
function PageStory(props: { kcContext?: DeepPartial<Extract<KcContext, { pageId: PageId }>> }) {
|
||||||
const { kcContext } = getKcContext({
|
const { kcContext: overrides } = props;
|
||||||
mockPageId: pageId,
|
|
||||||
storyPartialKcContext: params.kcContext
|
const kcContextMock = getKcContextMock({
|
||||||
|
pageId,
|
||||||
|
overrides
|
||||||
});
|
});
|
||||||
|
|
||||||
return <KcApp kcContext={kcContext} />;
|
return <KcApp kcContext={kcContextMock} />;
|
||||||
}
|
}
|
||||||
|
|
||||||
return { PageStory };
|
return { PageStory };
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export const parameters = {
|
||||||
|
viewMode: "story",
|
||||||
|
previewTabs: {
|
||||||
|
"storybook/docs/panel": {
|
||||||
|
hidden: true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|||||||
@ -1,7 +1,10 @@
|
|||||||
import { createGetKcContext } from "../../dist/login";
|
import { ExtendKcContext } from "../../dist/login";
|
||||||
|
|
||||||
export const { getKcContext } = createGetKcContext();
|
export type KcContextExtraProperties = {};
|
||||||
|
|
||||||
const { kcContext } = getKcContext();
|
export type KcContextExtraPropertiesPerPage = {};
|
||||||
|
|
||||||
export type KcContext = NonNullable<typeof kcContext>;
|
export type KcContext = ExtendKcContext<
|
||||||
|
KcContextExtraProperties,
|
||||||
|
KcContextExtraPropertiesPerPage
|
||||||
|
>;
|
||||||
|
|||||||
10
stories/login/kcContextMock.ts
Normal file
10
stories/login/kcContextMock.ts
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
import { createGetKcContextMock } from "../../dist/login";
|
||||||
|
import { KcContextExtraProperties, KcContextExtraPropertiesPerPage } from "./kcContext";
|
||||||
|
|
||||||
|
const kcContextExtraProperties: KcContextExtraProperties = {};
|
||||||
|
const kcContextExtraPropertiesPerPage: KcContextExtraPropertiesPerPage = {};
|
||||||
|
|
||||||
|
export const { getKcContextMock } = createGetKcContextMock({
|
||||||
|
kcContextExtraProperties,
|
||||||
|
kcContextExtraPropertiesPerPage
|
||||||
|
});
|
||||||
@ -1,25 +1,31 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "error.ftl";
|
const pageId = "error.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
export const WithAnotherMessage = () => (
|
export const Default: Story = {
|
||||||
<PageStory
|
render: () => <PageStory />
|
||||||
kcContext={{
|
};
|
||||||
message: { summary: "With another error message" }
|
|
||||||
}}
|
export const WithAnotherMessage: Story = {
|
||||||
/>
|
render: () => (
|
||||||
);
|
<PageStory
|
||||||
|
kcContext={{
|
||||||
|
message: { summary: "With another error message" }
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "idp-review-user-profile.ftl";
|
const pageId = "idp-review-user-profile.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,81 +1,95 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "info.ftl";
|
const pageId = "info.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => (
|
type Story = StoryObj<typeof meta>;
|
||||||
<PageStory
|
|
||||||
kcContext={{
|
|
||||||
message: {
|
|
||||||
summary: "Server info message",
|
|
||||||
type: "info"
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
|
|
||||||
export const WithWarning = () => (
|
export const Default: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
message: {
|
kcContext={{
|
||||||
summary: "Server warning message",
|
message: {
|
||||||
type: "warning"
|
summary: "Server info message",
|
||||||
}
|
type: "info"
|
||||||
}}
|
}
|
||||||
/>
|
}}
|
||||||
);
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
export const WithError = () => (
|
export const WithWarning: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
message: {
|
kcContext={{
|
||||||
summary: "Server error message",
|
message: {
|
||||||
type: "error"
|
summary: "Server warning message",
|
||||||
}
|
type: "warning"
|
||||||
}}
|
}
|
||||||
/>
|
}}
|
||||||
);
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
export const WithSuccess = () => (
|
export const WithError: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
message: {
|
kcContext={{
|
||||||
summary: "Server success message",
|
message: {
|
||||||
type: "success"
|
summary: "Server error message",
|
||||||
}
|
type: "error"
|
||||||
}}
|
}
|
||||||
/>
|
}}
|
||||||
);
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
export const WithLinkBack = () => (
|
export const WithSuccess: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
message: {
|
kcContext={{
|
||||||
summary: "Server message"
|
message: {
|
||||||
},
|
summary: "Server success message",
|
||||||
actionUri: undefined
|
type: "success"
|
||||||
}}
|
}
|
||||||
/>
|
}}
|
||||||
);
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
export const WithRequiredActions = () => (
|
export const WithLinkBack: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
message: {
|
kcContext={{
|
||||||
summary: "Server message"
|
message: {
|
||||||
},
|
summary: "Server message"
|
||||||
requiredActions: ["CONFIGURE_TOTP", "UPDATE_PROFILE", "VERIFY_EMAIL"]
|
},
|
||||||
}}
|
actionUri: undefined
|
||||||
/>
|
}}
|
||||||
);
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
|
export const WithRequiredActions: Story = {
|
||||||
|
render: () => (
|
||||||
|
<PageStory
|
||||||
|
kcContext={{
|
||||||
|
message: {
|
||||||
|
summary: "Server message"
|
||||||
|
},
|
||||||
|
requiredActions: ["CONFIGURE_TOTP", "UPDATE_PROFILE", "VERIFY_EMAIL"]
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|||||||
@ -1,165 +1,185 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login.ftl";
|
const pageId = "login.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
export const WithoutPasswordField = () => (
|
export const Default: Story = {
|
||||||
<PageStory
|
render: () => <PageStory />
|
||||||
kcContext={{
|
};
|
||||||
realm: { password: false }
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
|
|
||||||
export const WithoutRegistration = () => (
|
export const WithoutPasswordField: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
realm: { registrationAllowed: false }
|
kcContext={{
|
||||||
}}
|
realm: { password: false }
|
||||||
/>
|
}}
|
||||||
);
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
export const WithoutRememberMe = () => (
|
export const WithoutRegistration: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
realm: { rememberMe: false }
|
kcContext={{
|
||||||
}}
|
realm: { registrationAllowed: false }
|
||||||
/>
|
}}
|
||||||
);
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
export const WithoutPasswordReset = () => (
|
export const WithoutRememberMe: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
realm: { resetPasswordAllowed: false }
|
kcContext={{
|
||||||
}}
|
realm: { rememberMe: false }
|
||||||
/>
|
}}
|
||||||
);
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
export const WithEmailAsUsername = () => (
|
export const WithoutPasswordReset: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
realm: { loginWithEmailAllowed: false }
|
kcContext={{
|
||||||
}}
|
realm: { resetPasswordAllowed: false }
|
||||||
/>
|
}}
|
||||||
);
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
export const WithPresetUsername = () => (
|
export const WithEmailAsUsername: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
login: { username: "max.mustermann@mail.com" }
|
kcContext={{
|
||||||
}}
|
realm: { loginWithEmailAllowed: false }
|
||||||
/>
|
}}
|
||||||
);
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
export const WithImmutablePresetUsername = () => (
|
export const WithPresetUsername: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
auth: {
|
kcContext={{
|
||||||
attemptedUsername: "max.mustermann@mail.com",
|
login: { username: "max.mustermann@mail.com" }
|
||||||
showUsername: true
|
}}
|
||||||
},
|
/>
|
||||||
usernameHidden: true,
|
)
|
||||||
message: {
|
};
|
||||||
type: "info",
|
|
||||||
summary: "Please re-authenticate to continue"
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
|
|
||||||
export const WithSocialProviders = () => (
|
export const WithImmutablePresetUsername: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
social: {
|
kcContext={{
|
||||||
displayInfo: true,
|
auth: {
|
||||||
providers: [
|
attemptedUsername: "max.mustermann@mail.com",
|
||||||
{
|
showUsername: true
|
||||||
loginUrl: "google",
|
},
|
||||||
alias: "google",
|
usernameHidden: true,
|
||||||
providerId: "google",
|
message: {
|
||||||
displayName: "Google"
|
type: "info",
|
||||||
},
|
summary: "Please re-authenticate to continue"
|
||||||
{
|
}
|
||||||
loginUrl: "microsoft",
|
}}
|
||||||
alias: "microsoft",
|
/>
|
||||||
providerId: "microsoft",
|
)
|
||||||
displayName: "Microsoft"
|
};
|
||||||
},
|
|
||||||
{
|
export const WithSocialProviders: Story = {
|
||||||
loginUrl: "facebook",
|
render: () => (
|
||||||
alias: "facebook",
|
<PageStory
|
||||||
providerId: "facebook",
|
kcContext={{
|
||||||
displayName: "Facebook"
|
social: {
|
||||||
},
|
displayInfo: true,
|
||||||
{
|
providers: [
|
||||||
loginUrl: "instagram",
|
{
|
||||||
alias: "instagram",
|
loginUrl: "google",
|
||||||
providerId: "instagram",
|
alias: "google",
|
||||||
displayName: "Instagram"
|
providerId: "google",
|
||||||
},
|
displayName: "Google"
|
||||||
{
|
},
|
||||||
loginUrl: "twitter",
|
{
|
||||||
alias: "twitter",
|
loginUrl: "microsoft",
|
||||||
providerId: "twitter",
|
alias: "microsoft",
|
||||||
displayName: "Twitter"
|
providerId: "microsoft",
|
||||||
},
|
displayName: "Microsoft"
|
||||||
{
|
},
|
||||||
loginUrl: "linkedin",
|
{
|
||||||
alias: "linkedin",
|
loginUrl: "facebook",
|
||||||
providerId: "linkedin",
|
alias: "facebook",
|
||||||
displayName: "LinkedIn"
|
providerId: "facebook",
|
||||||
},
|
displayName: "Facebook"
|
||||||
{
|
},
|
||||||
loginUrl: "stackoverflow",
|
{
|
||||||
alias: "stackoverflow",
|
loginUrl: "instagram",
|
||||||
providerId: "stackoverflow",
|
alias: "instagram",
|
||||||
displayName: "Stackoverflow"
|
providerId: "instagram",
|
||||||
},
|
displayName: "Instagram"
|
||||||
{
|
},
|
||||||
loginUrl: "github",
|
{
|
||||||
alias: "github",
|
loginUrl: "twitter",
|
||||||
providerId: "github",
|
alias: "twitter",
|
||||||
displayName: "Github"
|
providerId: "twitter",
|
||||||
},
|
displayName: "Twitter"
|
||||||
{
|
},
|
||||||
loginUrl: "gitlab",
|
{
|
||||||
alias: "gitlab",
|
loginUrl: "linkedin",
|
||||||
providerId: "gitlab",
|
alias: "linkedin",
|
||||||
displayName: "Gitlab"
|
providerId: "linkedin",
|
||||||
},
|
displayName: "LinkedIn"
|
||||||
{
|
},
|
||||||
loginUrl: "bitbucket",
|
{
|
||||||
alias: "bitbucket",
|
loginUrl: "stackoverflow",
|
||||||
providerId: "bitbucket",
|
alias: "stackoverflow",
|
||||||
displayName: "Bitbucket"
|
providerId: "stackoverflow",
|
||||||
},
|
displayName: "Stackoverflow"
|
||||||
{
|
},
|
||||||
loginUrl: "paypal",
|
{
|
||||||
alias: "paypal",
|
loginUrl: "github",
|
||||||
providerId: "paypal",
|
alias: "github",
|
||||||
displayName: "PayPal"
|
providerId: "github",
|
||||||
},
|
displayName: "Github"
|
||||||
{
|
},
|
||||||
loginUrl: "openshift",
|
{
|
||||||
alias: "openshift",
|
loginUrl: "gitlab",
|
||||||
providerId: "openshift",
|
alias: "gitlab",
|
||||||
displayName: "OpenShift"
|
providerId: "gitlab",
|
||||||
}
|
displayName: "Gitlab"
|
||||||
]
|
},
|
||||||
}
|
{
|
||||||
}}
|
loginUrl: "bitbucket",
|
||||||
/>
|
alias: "bitbucket",
|
||||||
);
|
providerId: "bitbucket",
|
||||||
|
displayName: "Bitbucket"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
loginUrl: "paypal",
|
||||||
|
alias: "paypal",
|
||||||
|
providerId: "paypal",
|
||||||
|
displayName: "PayPal"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
loginUrl: "openshift",
|
||||||
|
alias: "openshift",
|
||||||
|
providerId: "openshift",
|
||||||
|
displayName: "OpenShift"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|||||||
@ -1,38 +1,46 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login-config-totp.ftl";
|
const pageId = "login-config-totp.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
export const WithManualSetUp = () => (
|
export const Default: Story = {
|
||||||
<PageStory
|
render: () => <PageStory />
|
||||||
kcContext={{
|
};
|
||||||
mode: "manual"
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
|
|
||||||
export const WithError = () => (
|
export const WithManualSetUp: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
messagesPerField: {
|
kcContext={{
|
||||||
get: (fieldName: string) => (fieldName === "totp" ? "Invalid TOTP" : undefined),
|
mode: "manual"
|
||||||
exists: (fieldName: string) => fieldName === "totp",
|
}}
|
||||||
existsError: (fieldName: string) => fieldName === "totp",
|
/>
|
||||||
printIfExists: <T,>(fieldName: string, x: T) => (fieldName === "totp" ? x : undefined)
|
)
|
||||||
}
|
};
|
||||||
}}
|
|
||||||
/>
|
export const WithError: Story = {
|
||||||
);
|
render: () => (
|
||||||
|
<PageStory
|
||||||
|
kcContext={{
|
||||||
|
messagesPerField: {
|
||||||
|
get: (fieldName: string) => (fieldName === "totp" ? "Invalid TOTP" : undefined),
|
||||||
|
exists: (fieldName: string) => fieldName === "totp",
|
||||||
|
existsError: (fieldName: string) => fieldName === "totp",
|
||||||
|
printIfExists: <T,>(fieldName: string, x: T) => (fieldName === "totp" ? x : undefined)
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login-oauth2-device-verify-user-code.ftl";
|
const pageId = "login-oauth2-device-verify-user-code.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login-idp-link-confirm.ftl";
|
const pageId = "login-idp-link-confirm.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login-idp-link-email.ftl";
|
const pageId = "login-idp-link-email.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login-oauth-grant.ftl";
|
const pageId = "login-oauth-grant.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login-otp.ftl";
|
const pageId = "login-otp.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login-page-expired.ftl";
|
const pageId = "login-page-expired.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login-password.ftl";
|
const pageId = "login-password.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,28 +1,34 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login-reset-password.ftl";
|
const pageId = "login-reset-password.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
export const WithEmailAsUsername = () => (
|
export const Default: Story = {
|
||||||
<PageStory
|
render: () => <PageStory />
|
||||||
kcContext={{
|
};
|
||||||
realm: {
|
|
||||||
loginWithEmailAllowed: true,
|
export const WithEmailAsUsername: Story = {
|
||||||
registrationEmailAsUsername: true
|
render: () => (
|
||||||
}
|
<PageStory
|
||||||
}}
|
kcContext={{
|
||||||
/>
|
realm: {
|
||||||
);
|
loginWithEmailAllowed: true,
|
||||||
|
registrationEmailAsUsername: true
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login-update-password.ftl";
|
const pageId = "login-update-password.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login-update-profile.ftl";
|
const pageId = "login-update-profile.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,28 +1,34 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login-username.ftl";
|
const pageId = "login-username.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
export const WithEmailAsUsername = () => (
|
export const Default: Story = {
|
||||||
<PageStory
|
render: () => <PageStory />
|
||||||
kcContext={{
|
};
|
||||||
realm: {
|
|
||||||
loginWithEmailAllowed: true,
|
export const WithEmailAsUsername: Story = {
|
||||||
registrationEmailAsUsername: true
|
render: () => (
|
||||||
}
|
<PageStory
|
||||||
}}
|
kcContext={{
|
||||||
/>
|
realm: {
|
||||||
);
|
loginWithEmailAllowed: true,
|
||||||
|
registrationEmailAsUsername: true
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "login-verify-email.ftl";
|
const pageId = "login-verify-email.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "logout-confirm.ftl";
|
const pageId = "logout-confirm.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,92 +1,106 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "register.ftl";
|
const pageId = "register.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
export const WithFieldError = () => (
|
export const Default: Story = {
|
||||||
<PageStory
|
render: () => <PageStory />
|
||||||
kcContext={{
|
};
|
||||||
profile: {
|
|
||||||
attributes: [
|
|
||||||
{
|
|
||||||
name: "email",
|
|
||||||
value: "max.mustermann@gmail.com"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
messagesPerField: {
|
|
||||||
existsError: (fieldName: string) => fieldName === "email",
|
|
||||||
exists: (fieldName: string) => fieldName === "email",
|
|
||||||
get: (fieldName: string) => (fieldName === "email" ? "I don't like your email address" : undefined),
|
|
||||||
printIfExists: <T,>(fieldName: string, x: T) => (fieldName === "email" ? x : undefined)
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
|
|
||||||
export const WithEmailAsUsername = () => (
|
export const WithFieldError: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
realm: {
|
kcContext={{
|
||||||
registrationEmailAsUsername: true
|
profile: {
|
||||||
}
|
attributes: [
|
||||||
}}
|
{
|
||||||
/>
|
name: "email",
|
||||||
);
|
value: "max.mustermann@gmail.com"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
messagesPerField: {
|
||||||
|
existsError: (fieldName: string) => fieldName === "email",
|
||||||
|
exists: (fieldName: string) => fieldName === "email",
|
||||||
|
get: (fieldName: string) => (fieldName === "email" ? "I don't like your email address" : undefined),
|
||||||
|
printIfExists: <T,>(fieldName: string, x: T) => (fieldName === "email" ? x : undefined)
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
export const WithoutPassword = () => (
|
export const WithEmailAsUsername: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
passwordRequired: false
|
kcContext={{
|
||||||
}}
|
realm: {
|
||||||
/>
|
registrationEmailAsUsername: true
|
||||||
);
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|
||||||
export const WithRecaptcha = () => (
|
export const WithoutPassword: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
recaptchaRequired: true,
|
kcContext={{
|
||||||
recaptchaSiteKey: "foobar"
|
passwordRequired: false
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
);
|
)
|
||||||
|
};
|
||||||
|
|
||||||
export const WithPresets = () => (
|
export const WithRecaptcha: Story = {
|
||||||
<PageStory
|
render: () => (
|
||||||
kcContext={{
|
<PageStory
|
||||||
profile: {
|
kcContext={{
|
||||||
attributes: [
|
recaptchaRequired: true,
|
||||||
{
|
recaptchaSiteKey: "foobar"
|
||||||
name: "firstName",
|
}}
|
||||||
value: "Max"
|
/>
|
||||||
},
|
)
|
||||||
{
|
};
|
||||||
name: "lastName",
|
|
||||||
value: "Mustermann"
|
export const WithPresets: Story = {
|
||||||
},
|
render: () => (
|
||||||
{
|
<PageStory
|
||||||
name: "email",
|
kcContext={{
|
||||||
value: "max.mustermann@gmail.com"
|
profile: {
|
||||||
},
|
attributes: [
|
||||||
{
|
{
|
||||||
name: "username",
|
name: "firstName",
|
||||||
value: "max.mustermann"
|
value: "Max"
|
||||||
}
|
},
|
||||||
]
|
{
|
||||||
}
|
name: "lastName",
|
||||||
}}
|
value: "Mustermann"
|
||||||
/>
|
},
|
||||||
);
|
{
|
||||||
|
name: "email",
|
||||||
|
value: "max.mustermann@gmail.com"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "username",
|
||||||
|
value: "max.mustermann"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "saml-post-form.ftl";
|
const pageId = "saml-post-form.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,40 +1,46 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "select-authenticator.ftl";
|
const pageId = "select-authenticator.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
export const WithDifferentAuthenticationMethods = () => (
|
export const Default: Story = {
|
||||||
<PageStory
|
render: () => <PageStory />
|
||||||
kcContext={{
|
};
|
||||||
auth: {
|
|
||||||
authenticationSelections: [
|
export const WithDifferentAuthenticationMethods: Story = {
|
||||||
{
|
render: () => (
|
||||||
authExecId: "25697c4e-0c80-4f2c-8eb7-2c16347e8e8d",
|
<PageStory
|
||||||
displayName: "auth-username-password-form-display-name",
|
kcContext={{
|
||||||
helpText: "auth-username-password-form-help-text",
|
auth: {
|
||||||
iconCssClass: "kcAuthenticatorPasswordClass"
|
authenticationSelections: [
|
||||||
},
|
{
|
||||||
{
|
authExecId: "25697c4e-0c80-4f2c-8eb7-2c16347e8e8d",
|
||||||
authExecId: "4cb60872-ce0d-4c8f-a806-e651ed77994b",
|
displayName: "auth-username-password-form-display-name",
|
||||||
displayName: "webauthn-passwordless-display-name",
|
helpText: "auth-username-password-form-help-text",
|
||||||
helpText: "webauthn-passwordless-help-text",
|
iconCssClass: "kcAuthenticatorPasswordClass"
|
||||||
iconCssClass: "kcAuthenticatorWebAuthnPasswordlessClass"
|
},
|
||||||
}
|
{
|
||||||
]
|
authExecId: "4cb60872-ce0d-4c8f-a806-e651ed77994b",
|
||||||
}
|
displayName: "webauthn-passwordless-display-name",
|
||||||
}}
|
helpText: "webauthn-passwordless-help-text",
|
||||||
/>
|
iconCssClass: "kcAuthenticatorWebAuthnPasswordlessClass"
|
||||||
);
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "terms.ftl";
|
const pageId = "terms.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "update-email.ftl";
|
const pageId = "update-email.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
@ -1,17 +1,21 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import type { ComponentMeta } from "@storybook/react";
|
import type { Meta, StoryObj } from "@storybook/react";
|
||||||
import { createPageStory, parameters } from "../createPageStory";
|
import { createPageStory, parameters } from "../createPageStory";
|
||||||
|
|
||||||
const pageId = "webauthn-authenticate.ftl";
|
const pageId = "webauthn-authenticate.ftl";
|
||||||
|
|
||||||
const { PageStory } = createPageStory({ pageId });
|
const { PageStory } = createPageStory({ pageId });
|
||||||
|
|
||||||
const meta: ComponentMeta<any> = {
|
const meta = {
|
||||||
title: `login/${pageId}`,
|
title: `login/${pageId}`,
|
||||||
component: PageStory,
|
component: PageStory,
|
||||||
parameters
|
parameters
|
||||||
};
|
} satisfies Meta<typeof PageStory>;
|
||||||
|
|
||||||
export default meta;
|
export default meta;
|
||||||
|
|
||||||
export const Default = () => <PageStory />;
|
type Story = StoryObj<typeof meta>;
|
||||||
|
|
||||||
|
export const Default: Story = {
|
||||||
|
render: () => <PageStory />
|
||||||
|
};
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user