Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add legacy application token section #6783

Closed
wants to merge 6 commits into from
Closed

Add legacy application token section #6783

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
79bace0
Add legacy application token section.
mpmadhavig Aug 16, 2024
f357ee5
Add changeset.
mpmadhavig Aug 16, 2024
9c4a9ac
Address PR comments.
mpmadhavig Aug 16, 2024
934a4d4
Add new pageheader prop.
mpmadhavig Aug 21, 2024
79753a3
Add i18 components.
mpmadhavig Aug 26, 2024
05165c3
Add banner implementation.
mpmadhavig Aug 26, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions .changeset/ninety-feet-flow.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
---
"@wso2is/admin.applications.v1": patch
"@wso2is/i18n": patch
---

Introduce UI for legacy app token section.
138 changes: 137 additions & 1 deletion features/admin.applications.v1/components/forms/inbound-oidc-form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,8 @@
* under the License.
*/

import Alert from "@oxygen-ui/react/Alert";
import AlertTitle from "@oxygen-ui/react/AlertTitle";
import Box from "@oxygen-ui/react/Box";
import Chip from "@oxygen-ui/react/Chip";
import { AppState, ConfigReducerStateInterface } from "@wso2is/admin.core.v1";
Expand Down Expand Up @@ -215,6 +217,9 @@ export const InboundOIDCForm: FunctionComponent<InboundOIDCFormPropsInterface> =
const { isOrganizationManagementEnabled } = useGlobalVariables();
const [ isEncryptionEnabled, setEncryptionEnable ] = useState(false);
const [ isPublicClient, setPublicClient ] = useState<boolean>(false);
const useClientIdAsSubClaimForAppTokens: boolean = initialValues.useClientIdAsSubClaimForAppTokens;
const omitUsernameInIntrospectionRespForAppTokens: boolean
= initialValues.omitUsernameInIntrospectionRespForAppTokens;
const [ callBackUrls, setCallBackUrls ] = useState("");
const [ audienceUrls, setAudienceUrls ] = useState("");
const [ showURLError, setShowURLError ] = useState(false);
Expand Down Expand Up @@ -290,6 +295,8 @@ export const InboundOIDCForm: FunctionComponent<InboundOIDCFormPropsInterface> =
const requestObjectEncryptionMethod: MutableRefObject<HTMLElement> = useRef<HTMLElement>();
const subjectToken: MutableRefObject<HTMLElement> = useRef<HTMLElement>();
const applicationSubjectTokenExpiryInSeconds: MutableRefObject<HTMLElement> = useRef<HTMLElement>();
const useClientIdAsSubClaimForAppTokensElement: MutableRefObject<HTMLElement> = useRef<HTMLElement>();
const omitUsernameInIntrospectionRespForAppTokensElement: MutableRefObject<HTMLElement> = useRef<HTMLElement>();

const [ isSPAApplication, setSPAApplication ] = useState<boolean>(false);
const [ isOIDCWebApplication, setOIDCWebApplication ] = useState<boolean>(false);
Expand Down Expand Up @@ -1353,6 +1360,8 @@ export const InboundOIDCForm: FunctionComponent<InboundOIDCFormPropsInterface> =
}
inboundConfigFormValues = {
...inboundConfigFormValues,
omitUsernameInIntrospectionRespForAppTokens:
values.get("omitUsernameInIntrospectionRespForAppTokens")?.length > 0,
pushAuthorizationRequest: {
requirePushAuthorizationRequest: values.get("requirePushAuthorizationRequest")?.length > 0
},
Expand All @@ -1366,7 +1375,8 @@ export const InboundOIDCForm: FunctionComponent<InboundOIDCFormPropsInterface> =
subject: {
sectorIdentifierUri: initialValues?.subject?.sectorIdentifierUri,
subjectType: initialValues?.subject?.subjectType
}
},
useClientIdAsSubClaimForAppTokens: values.get("useClientIdAsSubClaimForAppTokens")?.length > 0
};

// If the app is not a newly created, add `clientId` & `clientSecret`.
Expand Down Expand Up @@ -2566,6 +2576,130 @@ export const InboundOIDCForm: FunctionComponent<InboundOIDCFormPropsInterface> =
</>
) }

{ /* Legacy Application Tokens */ }
{
(!omitUsernameInIntrospectionRespForAppTokens
|| !useClientIdAsSubClaimForAppTokens)
&& (
<Grid.Row columns={ 2 }>
<Grid.Column mobile={ 16 } tablet={ 16 } computer={ 16 }>
<Divider />
<Divider hidden />
</Grid.Column>
<Grid.Column mobile={ 16 } tablet={ 16 } computer={ 16 }>
<Heading as="h4">
{ t("applications:forms.inboundOIDC.sections" +
".legacyApplicationTokens.heading") }
</Heading>
<Divider hidden />
{
(
<Alert severity="warning">
<AlertTitle
className="alert-title">
<Trans components={ { strong: <strong/> } } >Note:</Trans>
</AlertTitle>
<Trans
i18nKey={ t("actions:fields.authentication.info.message") }
>
You are currently using an outdated behavior for application tokens.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Better if we can get the text reviewed by the doc team?

Please follow the below guideline before migrating to the new behavior.
<ol>
<li>
<strong>Client Application Changes:</strong>
<p>Update your client application to no longer use the&nbsp;
<code>sub</code> attribute to refer to the application
owner&apos;s user ID in the application token.</p>
</li>
<li>
<strong>Introspection Response Updates:</strong>
<p>Modify your application to stop relying on the&nbsp;
<code>username</code> field in the introspection endpoint
response for application tokens, as this claim will no
longer be included.</p>
</li>
</ol>
</Trans>
</Alert>
)
}
{
!useClientIdAsSubClaimForAppTokens && (
<>
<Field
ref={ useClientIdAsSubClaimForAppTokensElement }
name="useClientIdAsSubClaimForAppTokens"
required={ false }
type="checkbox"
disabled={ false }
value={
initialValues?.useClientIdAsSubClaimForAppTokens ?
[ "useClientIdAsSubClaimForAppTokens" ]
: [] }
readOnly={ readOnly }
data-componentId={
`${ componentId }-use-client-id-as-sub-claim-for-app-tokens` }
children={ [
{
label: t("applications:forms.inboundOIDC.sections."
+ "legacyApplicationTokens.fields"
+ ".useClientIdAsSubClaimForAppTokens.label"),
value: "useClientIdAsSubClaimForAppTokens"
}
] }
/>
<Hint>
{ t("applications:forms.inboundOIDC.sections.legacyApplicationTokens."
+ "fields.useClientIdAsSubClaimForAppTokens.hint") }
</Hint>
</>
)
}
{
(!omitUsernameInIntrospectionRespForAppTokens
&& !useClientIdAsSubClaimForAppTokens) &&
(
<Divider hidden />
)
}
{
(!omitUsernameInIntrospectionRespForAppTokens) &&
(
<>
<Field
ref={ omitUsernameInIntrospectionRespForAppTokensElement }
name="omitUsernameInIntrospectionRespForAppTokens"
required={ false }
type="checkbox"
disabled={ false }
value={
initialValues?.omitUsernameInIntrospectionRespForAppTokens ?
[ "omitUsernameInIntrospectionRespForAppTokens" ]
: [] }
readOnly={ readOnly }
data-componentId={
`${ componentId }-omit-username-in-introspection-resp-for-app-tokens` }
children={ [
{
label: t("applications:forms.inboundOIDC.sections"
+ ".legacyApplicationTokens.fields."
+ "omitUsernameInIntrospectionRespForAppTokens.label"),
value: "omitUsernameInIntrospectionRespForAppTokens"
}
] }
/>
<Hint>
{ t("applications:forms.inboundOIDC.sections.legacyApplicationTokens."
+ "fields.omitUsernameInIntrospectionRespForAppTokens.hint") }
</Hint>
</>
)
}
</Grid.Column>
</Grid.Row>
)
}

{ /* Access Token */ }
{
!isSystemApplication
Expand Down Expand Up @@ -4377,6 +4511,7 @@ InboundOIDCForm.defaultProps = {
},
idToken: undefined,
logout: undefined,
omitUsernameInIntrospectionRespForAppTokens: undefined,
pkce: {
mandatory: false,
supportPlainTransformAlgorithm: false
Expand All @@ -4386,6 +4521,7 @@ InboundOIDCForm.defaultProps = {
scopeValidators: [],
state: undefined,
subjectToken: undefined,
useClientIdAsSubClaimForAppTokens: undefined,
validateRequestObjectSignature: undefined
}
};
2 changes: 2 additions & 0 deletions ...lications.v1/components/settings/attribute-management/advance-attribute-settings.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -127,6 +127,7 @@ describe("Advance attribute settings in the attributes tab of Application Edit v
},
isFAPIApplication: false,
logout: {},
omitUsernameInIntrospectionRespForAppTokens: false,
pkce: { mandatory: true, supportPlainTransformAlgorithm: false },
publicClient: true,
pushAuthorizationRequest: { requirePushAuthorizationRequest: false },
Expand All @@ -139,6 +140,7 @@ describe("Advance attribute settings in the attributes tab of Application Edit v
applicationSubjectTokenExpiryInSeconds: 180,
enable: false
},
useClientIdAsSubClaimForAppTokens: false,
validateRequestObjectSignature: false
} }
data-testid={ "advanced-attribute-settings-form" }
Expand Down
2 changes: 2 additions & 0 deletions features/admin.applications.v1/models/application-inbound.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -193,6 +193,8 @@ export interface OIDCDataInterface {
subject?: SubjectConfigInterface;
isFAPIApplication?: boolean;
hybridFlow?: HybridFlowConfigurationInterface;
useClientIdAsSubClaimForAppTokens?: boolean;
omitUsernameInIntrospectionRespForAppTokens?: boolean;
}

/**
Expand Down
16 changes: 16 additions & 0 deletions features/admin.applications.v1/pages/application-edit.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,3 +19,19 @@
.application-branding-link {
cursor: pointer;
}

.ignore-once-button {
color: #788997;
}

.banner-detail-card {
border: 0;
border-top-left-radius: 0;
border-top-right-radius: 0;
background: #fff;
}

.application-outdated-alert-expanded-view {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
Loading
Loading