Skip to content

Commit

Permalink
feat(admin-ui): improvement in oidc client info in view mode #375
Browse files Browse the repository at this point in the history
  • Loading branch information
@syntrydy
syntrydy committed Aug 23, 2022
1 parent 640cd8f commit dbd9f11
Show file tree
Hide file tree
Showing 16 changed files with 138 additions and 20 deletions.
2 changes: 2 additions & 0 deletions admin-ui/app/routes/Apps/Gluu/GluuBooleanSelectBox.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ function GluuBooleanSelectBox({
lsize,
rsize,
doc_category,
disabled,
}) {
const { t } = useTranslation()
return (
Expand All @@ -27,6 +28,7 @@ function GluuBooleanSelectBox({
data-testid={name}
defaultValue={value}
onChange={formik.handleChange}
disabled={disabled}
>
<option value="false">{t('options.false')}</option>
<option value="true">{t('options.true')}</option>
Expand Down
3 changes: 2 additions & 1 deletion admin-ui/app/routes/Apps/Gluu/GluuInputRow.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ function GluuInputRow({
lsize,
rsize,
doc_category,
disabled = false,
disabled,
}) {
const [customType, setCustomType] = useState(null)

Expand Down Expand Up @@ -58,6 +58,7 @@ GluuInputRow.defaultProps = {
lsize: 3,
rsize: 9,
required: false,
disabled: false,
}

export default GluuInputRow
3 changes: 3 additions & 0 deletions admin-ui/app/routes/Apps/Gluu/GluuSelectRow.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ function GluuSelectRow({
lsize,
rsize,
doc_category,
disabled,
}) {
const { t } = useTranslation()
return (
Expand All @@ -28,6 +29,7 @@ function GluuSelectRow({
name={name}
defaultValue={value}
onChange={formik.handleChange}
disabled={disabled}
>
<option value="">{t('actions.choose')}...</option>
{values.map((item, key) => (
Expand All @@ -47,6 +49,7 @@ GluuSelectRow.defaultProps = {
values: [],
lsize: 3,
rsize: 9,
disabled: false,
}

export default GluuSelectRow
3 changes: 2 additions & 1 deletion admin-ui/app/routes/Apps/Gluu/GluuToogle.js
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,14 @@
import React from 'react'
import Toggle from 'react-toggle'
function GluuToogle({ name, formik, value, handler }) {
function GluuToogle({ name, formik, value, handler, disabled }) {
return (
<Toggle
name={name}
data-testid={name}
defaultChecked={value}
onClick={handler}
onChange={formik.handleChange}
disabled={disabled}
/>
)
}
Expand Down
3 changes: 3 additions & 0 deletions admin-ui/app/routes/Apps/Gluu/GluuToogleRow.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ function GluuToogleRow({
handler,
rsize,
doc_category ="no_category",
disabled
}) {
return (
<GluuTooltip doc_category={doc_category} doc_entry={name}>
Expand All @@ -26,6 +27,7 @@ function GluuToogleRow({
handler={handler}
formik={formik}
value={value}
disabled={disabled}
/>
</Col>
</FormGroup>
Expand All @@ -35,6 +37,7 @@ function GluuToogleRow({
GluuToogleRow.defaultProps = {
lsize: 3,
rsize: 9,
disabled: false,
}

export default GluuToogleRow
9 changes: 9 additions & 0 deletions admin-ui/app/routes/Apps/Gluu/GluuTypeAhead.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@ function GluuTypeAhead({
onChange = null,
lsize = 4,
rsize = 8,
disabled,
}) {
const { t } = useTranslation()
return (
Expand All @@ -41,6 +42,7 @@ function GluuTypeAhead({
<Col sm={rsize}>
<Typeahead
allowNew
disabled={disabled}
ref={forwardRef}
emptyLabel=""
labelKey={name}
Expand Down Expand Up @@ -69,4 +71,11 @@ function GluuTypeAhead({
)
}

GluuTypeAhead.defaultProps = {
lsize: 4,
rsize: 8,
required: false,
disabled: false,
}

export default GluuTypeAhead
11 changes: 11 additions & 0 deletions admin-ui/app/routes/Apps/Gluu/GluuTypeAheadWithAdd.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ function GluuTypeAheadWithAdd({
doc_category,
lsize = 4,
rsize = 8,
disabled,
}) {
const [items, setItems] = useState(value)
const [opts, setOpts] = useState(options)
Expand Down Expand Up @@ -61,13 +62,15 @@ function GluuTypeAheadWithAdd({
<Input
placeholder={placeholder}
id={inputId}
disabled={disabled}
data-testid="new_entry"
aria-label="new_entry"
/>
</Col>
<Button
color={`primary-${selectedTheme}`}
type="button"
disabled={disabled}
style={applicationStyle.buttonStyle}
onClick={addItem}
>
Expand All @@ -79,6 +82,7 @@ function GluuTypeAheadWithAdd({
<Typeahead
emptyLabel=""
labelKey={name}
disabled={disabled}
onChange={(selected) => {
handleChange(name, selected)
}}
Expand All @@ -96,4 +100,11 @@ function GluuTypeAheadWithAdd({
)
}

GluuTypeAheadWithAdd.defaultProps = {
lsize: 4,
rsize: 8,
required: false,
disabled: false,
}

export default GluuTypeAheadWithAdd
14 changes: 12 additions & 2 deletions admin-ui/plugins/auth-server/components/Clients/ClientAdvancedPanel.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,9 @@ import GluuTypeAheadWithAdd from 'Routes/Apps/Gluu/GluuTypeAheadWithAdd'
import { useTranslation } from 'react-i18next'
import DatePicker from 'react-datepicker'
import ClientShowSpontaneousScopes from './ClientShowSpontaneousScopes'
import { useSelector } from 'react-redux'
const DOC_CATEGORY = 'openid_client'

function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
function ClientAdvancedPanel({ client, scripts, formik, view_only }) {
const { t } = useTranslation()
const request_uri_id = 'request_uri_id'
const requestUris = []
Expand Down Expand Up @@ -74,6 +73,7 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
type="select"
id="subjectType"
name="subjectType"
disabled={view_only}
defaultValue={client.subjectType}
onChange={formik.handleChange}
>
Expand All @@ -93,6 +93,7 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
label="fields.persist_client_authorizations"
value={client.persistClientAuthorizations}
doc_category={DOC_CATEGORY}
disabled={view_only}
/>
<GluuBooleanSelectBox
name="allowSpontaneousScopes"
Expand All @@ -102,6 +103,7 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
lsize={3}
rsize={9}
doc_category={DOC_CATEGORY}
disabled={view_only}
/>
<GluuTypeAheadForDn
name="spontaneousScopes"
Expand All @@ -114,6 +116,7 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
doc_category={DOC_CATEGORY}
lsize={3}
rsize={9}
disabled={view_only}
></GluuTypeAheadForDn>
{client.inum && (
<FormGroup row>
Expand All @@ -134,6 +137,7 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
formik={formik}
value={client.initiateLoginUri}
doc_category={DOC_CATEGORY}
disabled={view_only}
/>
<GluuTypeAheadWithAdd
name="requestUris"
Expand All @@ -147,6 +151,7 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
doc_category={DOC_CATEGORY}
lsize={3}
rsize={9}
disabled={view_only}
></GluuTypeAheadWithAdd>
<GluuTypeAheadForDn
name="defaultAcrValues"
Expand All @@ -157,6 +162,7 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
doc_category={DOC_CATEGORY}
lsize={3}
rsize={9}
disabled={view_only}
></GluuTypeAheadForDn>
<GluuTypeAheadForDn
name="authorizedAcrValues"
Expand All @@ -167,6 +173,7 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
doc_category={DOC_CATEGORY}
lsize={3}
rsize={9}
disabled={view_only}
></GluuTypeAheadForDn>
<GluuToogleRow
name="jansDefaultPromptLogin"
Expand All @@ -176,13 +183,15 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
label="fields.defaultPromptLogin"
value={client.jansDefaultPromptLogin}
doc_category={DOC_CATEGORY}
disabled={view_only}
/>
<GluuInputRow
label="fields.tls_client_auth_subject_dn"
name="tlsClientAuthSubjectDn"
formik={formik}
value={client.tlsClientAuthSubjectDn}
doc_category={DOC_CATEGORY}
disabled={view_only}
/>

<FormGroup row>
Expand All @@ -197,6 +206,7 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
doc_category={DOC_CATEGORY}
lsize={6}
rsize={6}
disabled={view_only}
/>
)}
</Col>
Expand Down
18 changes: 16 additions & 2 deletions admin-ui/plugins/auth-server/components/Clients/ClientBasicPanel.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ import GluuSelectRow from 'Routes/Apps/Gluu/GluuSelectRow'
import { useTranslation } from 'react-i18next'
const DOC_CATEGORY = 'openid_client'

const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration, view_only }) => {
const { t } = useTranslation()
const uri_id = 'redirect_uri'
const post_uri_id = 'post_uri_id'
Expand Down Expand Up @@ -83,7 +83,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
style={{ backgroundColor: '#F5F5F5' }}
id="inum"
name="inum"
disabled
disabled={view_only}
value={client.inum}
/>
</Col>
Expand All @@ -96,6 +96,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
formik={formik}
value={client.clientName || client.displayName}
doc_category={DOC_CATEGORY}
disabled={view_only}
/>
<GluuTooltip doc_category={DOC_CATEGORY} doc_entry="clientSecret">
<FormGroup row>
Expand All @@ -115,6 +116,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
type={showClientSecret ? 'text' : 'password'}
value={client.clientSecret}
onChange={formik.handleChange}
disabled={view_only}
/>
<IconButton
onClick={handleClickShowClientSecret}
Expand All @@ -132,6 +134,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
formik={formik}
value={client.description}
doc_category={DOC_CATEGORY}
disabled={view_only}
/>
<GluuSelectRow
label="fields.token_endpoint_auth_method"
Expand All @@ -142,6 +145,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
rsize={9}
name="tokenEndpointAuthMethod"
doc_category={DOC_CATEGORY}
disabled={view_only}
/>

<FormGroup row>
Expand All @@ -152,6 +156,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
type="select"
id="subjectType"
name="subjectType"
disabled={view_only}
defaultValue={client.subjectType}
onChange={formik.handleChange}
>
Expand All @@ -168,6 +173,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
formik={formik}
value={client.sectorIdentifierUri}
doc_category={DOC_CATEGORY}
disabled={view_only}
/>
<GluuTypeAhead
name="grantTypes"
Expand All @@ -178,6 +184,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
doc_category={DOC_CATEGORY}
lsize={3}
rsize={9}
disabled={view_only}
></GluuTypeAhead>
<GluuTypeAhead
name="responseTypes"
Expand All @@ -188,6 +195,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
doc_category={DOC_CATEGORY}
lsize={3}
rsize={9}
disabled={view_only}
></GluuTypeAhead>
<FormGroup row>
<Col sm={6}>
Expand All @@ -199,6 +207,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
doc_category={DOC_CATEGORY}
lsize={9}
rsize={3}
disabled={view_only}
/>
</Col>
<Col sm={6}>
Expand All @@ -210,6 +219,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
label="fields.is_trusted_client"
value={client.trustedClient}
doc_category={DOC_CATEGORY}
disabled={view_only}
/>
</Col>
</FormGroup>
Expand All @@ -223,6 +233,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
name="applicationType"
defaultValue={client.applicationType}
onChange={formik.handleChange}
disabled={view_only}
>
<option value="">{t('actions.choose')}...</option>
<option>web</option>
Expand All @@ -243,6 +254,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
doc_category={DOC_CATEGORY}
lsize={3}
rsize={9}
disabled={view_only}
></GluuTypeAheadWithAdd>

<GluuInputRow
Expand All @@ -251,6 +263,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
formik={formik}
value={client.redirectUrisRegex}
doc_category={DOC_CATEGORY}
disabled={view_only}
/>
<GluuTypeAheadForDn
name="scopes"
Expand All @@ -261,6 +274,7 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
doc_category={DOC_CATEGORY}
lsize={3}
rsize={9}
disabled={view_only}
></GluuTypeAheadForDn>
</Container>
)
Expand Down
Loading

1 comment on commit dbd9f11

@harryandriyan
Copy link
Contributor

Choose a reason for hiding this comment

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

@syntrydy I've added small comments and suggestions, kindly check it out, Thanks!

Please sign in to comment.