Skip to content

Commit 15d02ca

Browse files
committed
fix(admin-ui): fix some ui issues
1 parent 636923d commit 15d02ca

File tree

8 files changed

+97
-52
lines changed

8 files changed

+97
-52
lines changed

admin-ui/app/routes/Apps/Gluu/GluuTypeAheadForDn.js

+7-3
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,8 @@ function GluuTypeAheadForDn({
2525
doc_category,
2626
doc_entry,
2727
allowNew = false,
28+
lsize = 4,
29+
rsize = 8,
2830
}) {
2931
const { t } = useTranslation()
3032
function getItemName(theOptions, item) {
@@ -34,14 +36,16 @@ function GluuTypeAheadForDn({
3436
return (
3537
<GluuTooltip doc_category={doc_category} doc_entry={doc_entry || name}>
3638
<FormGroup row>
37-
<GluuLabel label={label} size={4} required={required} />
38-
<Col sm={8}>
39+
<GluuLabel label={label} size={lsize} required={required} />
40+
<Col sm={rsize}>
3941
<Typeahead
4042
labelKey={(opt) => `${opt.name || getItemName(options, opt)}`}
4143
onChange={(selected) => {
4244
formik.setFieldValue(
4345
name,
44-
selected.map((item) => (item.customOption ? item.label : item.dn)),
46+
selected.map((item) =>
47+
item.customOption ? item.label : item.dn,
48+
),
4549
)
4650
}}
4751
id={name}

admin-ui/app/routes/Apps/Gluu/GluuTypeAheadWithAdd.js

+4-2
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@ function GluuTypeAheadWithAdd({
1717
validator,
1818
inputId,
1919
doc_category,
20+
lsize = 4,
21+
rsize = 8,
2022
}) {
2123
const [items, setItems] = useState(value)
2224
const [opts, setOpts] = useState(options)
@@ -44,9 +46,9 @@ function GluuTypeAheadWithAdd({
4446
return (
4547
<GluuTooltip doc_category={doc_category} doc_entry={name}>
4648
<FormGroup row>
47-
<GluuLabel label={label} size={4} />
49+
<GluuLabel label={label} size={lsize} />
4850
<Col
49-
sm={8}
51+
sm={rsize}
5052
style={{
5153
borderStyle: 'solid',
5254
borderRadius: '5px',

admin-ui/plugins/auth-server/components/Clients/ClientAdvancedPanel.js

+48-33
Original file line numberDiff line numberDiff line change
@@ -96,8 +96,8 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
9696
label="fields.allow_spontaneous_scopes"
9797
value={client.allowSpontaneousScopes}
9898
formik={formik}
99-
lsize={8}
100-
rsize={4}
99+
lsize={3}
100+
rsize={9}
101101
doc_category={DOC_CATEGORY}
102102
/>
103103
<GluuTypeAheadForDn
@@ -107,6 +107,8 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
107107
value={getScopeMapping(client.spontaneousScopes, scopes)}
108108
options={scopes}
109109
doc_category={DOC_CATEGORY}
110+
lsize={3}
111+
rsize={9}
110112
></GluuTypeAheadForDn>
111113

112114
<GluuInputRow
@@ -126,6 +128,8 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
126128
validator={uriValidator}
127129
inputId={request_uri_id}
128130
doc_category={DOC_CATEGORY}
131+
lsize={3}
132+
rsize={9}
129133
></GluuTypeAheadWithAdd>
130134
<GluuTypeAheadForDn
131135
name="defaultAcrValues"
@@ -134,6 +138,8 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
134138
value={getMapping(client.defaultAcrValues, scripts)}
135139
options={scripts}
136140
doc_category={DOC_CATEGORY}
141+
lsize={3}
142+
rsize={9}
137143
></GluuTypeAheadForDn>
138144
<GluuTypeAheadForDn
139145
name="authorizedAcrValues"
@@ -142,11 +148,13 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
142148
value={getMapping(client.authorizedAcrValues, scripts)}
143149
options={scripts}
144150
doc_category={DOC_CATEGORY}
151+
lsize={3}
152+
rsize={9}
145153
></GluuTypeAheadForDn>
146154
<GluuToogleRow
147155
name="defaultPromptLogin"
148-
lsize={9}
149-
rsize={3}
156+
lsize={3}
157+
rsize={9}
150158
formik={formik}
151159
label="fields.defaultPromptLogin"
152160
value={client.defaultPromptLogin}
@@ -160,36 +168,43 @@ function ClientAdvancedPanel({ client, scripts, formik, scopes }) {
160168
doc_category={DOC_CATEGORY}
161169
/>
162170

163-
{client.expirable && (
164-
<GluuToogleRow
165-
name="expirable"
166-
formik={formik}
167-
label="fields.is_expirable_client"
168-
value={client.expirable && client.expirable.length ? true : false}
169-
handler={handleExpirable}
170-
doc_category={DOC_CATEGORY}
171-
/>
172-
)}
173-
{client.expirable && client.expirable.length && (
174-
<FormGroup row>
175-
<GluuLabel label="client_expiration_date" size={5} />
176-
<Col sm={7}>
177-
<DatePicker
178-
id="expirationDate"
179-
name="expirationDate"
180-
showTimeSelect
181-
dateFormat="yyyy-MM-dd HH:mm:aa"
182-
timeFormat="HH:mm:aa"
183-
selected={client.expirationDate}
184-
peekNextMonth
185-
showMonthDropdown
186-
showYearDropdown
187-
dropdownMode="select"
188-
onChange={(e) => formik.setFieldValue('expirationDate', e)}
171+
<FormGroup row>
172+
<Col sm={6}>
173+
{client.expirable && (
174+
<GluuToogleRow
175+
name="expirable"
176+
formik={formik}
177+
label="fields.is_expirable_client"
178+
value={client.expirable && client.expirable.length ? true : false}
179+
handler={handleExpirable}
180+
doc_category={DOC_CATEGORY}
181+
lsize={6}
182+
rsize={6}
189183
/>
190-
</Col>
191-
</FormGroup>
192-
)}
184+
)}
185+
</Col>
186+
<Col sm={6}>
187+
{client.expirable && client.expirable.length && (
188+
<FormGroup row>
189+
<Col sm={12}>
190+
<DatePicker
191+
id="expirationDate"
192+
name="expirationDate"
193+
showTimeSelect
194+
dateFormat="yyyy-MM-dd HH:mm:aa"
195+
timeFormat="HH:mm:aa"
196+
selected={client.expirationDate}
197+
peekNextMonth
198+
showMonthDropdown
199+
showYearDropdown
200+
dropdownMode="select"
201+
onChange={(e) => formik.setFieldValue('expirationDate', e)}
202+
/>
203+
</Col>
204+
</FormGroup>
205+
)}
206+
</Col>
207+
</FormGroup>
193208
</Container>
194209
)
195210
}

admin-ui/plugins/auth-server/components/Clients/ClientBasicPanel.js

+10-2
Original file line numberDiff line numberDiff line change
@@ -138,8 +138,8 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
138138
formik={formik}
139139
value={client.tokenEndpointAuthMethod}
140140
values={tokenEndpointAuthMethod}
141-
lsize={6}
142-
rsize={6}
141+
lsize={3}
142+
rsize={9}
143143
name="tokenEndpointAuthMethod"
144144
doc_category={DOC_CATEGORY}
145145
/>
@@ -169,6 +169,8 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
169169
value={client.grantTypes}
170170
options={grantTypes}
171171
doc_category={DOC_CATEGORY}
172+
lsize={3}
173+
rsize={9}
172174
></GluuTypeAhead>
173175
<GluuTypeAhead
174176
name="responseTypes"
@@ -177,6 +179,8 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
177179
value={client.responseTypes}
178180
options={responseTypes}
179181
doc_category={DOC_CATEGORY}
182+
lsize={3}
183+
rsize={9}
180184
></GluuTypeAhead>
181185
<FormGroup row>
182186
<Col sm={6}>
@@ -230,6 +234,8 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
230234
validator={uriValidator}
231235
inputId={uri_id}
232236
doc_category={DOC_CATEGORY}
237+
lsize={3}
238+
rsize={9}
233239
></GluuTypeAheadWithAdd>
234240

235241
<GluuInputRow
@@ -246,6 +252,8 @@ const ClientBasicPanel = ({ client, scopes, formik, oidcConfiguration }) => {
246252
value={getScopeMapping(client.scopes, scopes)}
247253
options={scopes}
248254
doc_category={DOC_CATEGORY}
255+
lsize={3}
256+
rsize={9}
249257
></GluuTypeAheadForDn>
250258
</Container>
251259
)

admin-ui/plugins/auth-server/components/Clients/ClientCibaParUmaPanel.js

+2
Original file line numberDiff line numberDiff line change
@@ -123,6 +123,8 @@ function ClientCibaParUmaPanel({ client, scripts, formik }) {
123123
validator={uriValidator}
124124
inputId={claim_uri_id}
125125
doc_category={DOC_CATEGORY}
126+
lsize={3}
127+
rsize={9}
126128
></GluuTypeAheadWithAdd>
127129
</Container>
128130
)

admin-ui/plugins/auth-server/components/Clients/ClientLogoutPanel.js

+6-4
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,8 @@ function ClientLogoutPanel({ client, scripts, formik }) {
3838
formik={formik}
3939
value={client.frontChannelLogoutUri}
4040
doc_category={DOC_CATEGORY}
41+
lsize={4}
42+
rsize={8}
4143
/>
4244
<GluuTypeAheadWithAdd
4345
name="postLogoutRedirectUris"
@@ -67,15 +69,15 @@ function ClientLogoutPanel({ client, scripts, formik }) {
6769
label="fields.backchannelLogoutSessionRequired"
6870
value={client.backchannelLogoutSessionRequired}
6971
formik={formik}
70-
lsize={8}
71-
rsize={4}
72+
lsize={4}
73+
rsize={8}
7274
doc_category={DOC_CATEGORY}
7375
/>
7476

7577
<GluuToogleRow
7678
name="frontChannelLogoutSessionRequired"
77-
lsize={9}
78-
rsize={3}
79+
lsize={4}
80+
rsize={8}
7981
formik={formik}
8082
label="fields.frontChannelLogoutSessionRequired"
8183
value={client.frontChannelLogoutSessionRequired}

admin-ui/plugins/auth-server/components/Clients/ClientSoftwarePanel.js

+4
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,8 @@ function ClientSoftwarePanel({ client, scripts, formik }) {
6565
validator={emailValidator}
6666
inputId={contact_uri_id}
6767
doc_category={DOC_CATEGORY}
68+
lsize={3}
69+
rsize={9}
6870
></GluuTypeAheadWithAdd>
6971
<GluuTypeAheadWithAdd
7072
name="authorizedOrigins"
@@ -76,6 +78,8 @@ function ClientSoftwarePanel({ client, scripts, formik }) {
7678
validator={uriValidator}
7779
inputId={origin_uri_id}
7880
doc_category={DOC_CATEGORY}
81+
lsize={3}
82+
rsize={9}
7983
></GluuTypeAheadWithAdd>
8084

8185
<GluuInputRow

admin-ui/plugins/auth-server/components/Clients/ClientTokensPanel.js

+16-8
Original file line numberDiff line numberDiff line change
@@ -49,8 +49,8 @@ function ClientTokensPanel({ client, scripts, formik }) {
4949
<FormGroup row>
5050
<Col sm={12}>
5151
<FormGroup row>
52-
<GluuLabel label="fields.accessTokenAsJwt" size={6} />
53-
<Col sm={6}>
52+
<GluuLabel label="fields.accessTokenAsJwt" size={4} />
53+
<Col sm={8}>
5454
<RadioGroup
5555
row
5656
name="accessTokenAsJwt"
@@ -78,22 +78,22 @@ function ClientTokensPanel({ client, scripts, formik }) {
7878
</Col>
7979
</FormGroup>
8080
</Col>
81-
<Col sm={6}>
81+
<Col sm={12}>
8282
<GluuToogleRow
8383
name="includeClaimsInIdToken"
84-
lsize={9}
85-
rsize={3}
84+
lsize={4}
85+
rsize={8}
8686
formik={formik}
8787
label="fields.includeClaimsInIdToken"
8888
value={client.includeClaimsInIdToken}
8989
doc_category={DOC_CATEGORY}
9090
/>
9191
</Col>
92-
<Col sm={6}>
92+
<Col sm={12}>
9393
<GluuToogleRow
9494
name="requireAuthTime"
95-
lsize={9}
96-
rsize={3}
95+
lsize={4}
96+
rsize={8}
9797
formik={formik}
9898
label="fields.requireAuthTime"
9999
value={client.requireAuthTime}
@@ -119,6 +119,8 @@ function ClientTokensPanel({ client, scripts, formik }) {
119119
formik={formik}
120120
value={client.idTokenTokenBindingCnf}
121121
doc_category={DOC_CATEGORY}
122+
lsize={4}
123+
rsize={8}
122124
/>
123125
<GluuTypeAheadWithAdd
124126
name="additionalAudience"
@@ -138,6 +140,8 @@ function ClientTokensPanel({ client, scripts, formik }) {
138140
type="number"
139141
value={client.accessTokenLifetime}
140142
doc_category={DOC_CATEGORY}
143+
lsize={4}
144+
rsize={8}
141145
/>
142146
<GluuInputRow
143147
label="fields.refreshTokenLifetime"
@@ -146,6 +150,8 @@ function ClientTokensPanel({ client, scripts, formik }) {
146150
type="number"
147151
value={client.refreshTokenLifetime}
148152
doc_category={DOC_CATEGORY}
153+
lsize={4}
154+
rsize={8}
149155
/>
150156
<GluuInputRow
151157
label="fields.defaultMaxAge"
@@ -154,6 +160,8 @@ function ClientTokensPanel({ client, scripts, formik }) {
154160
type="number"
155161
value={client.defaultMaxAge}
156162
doc_category={DOC_CATEGORY}
163+
lsize={4}
164+
rsize={8}
157165
/>
158166
</Container>
159167
)

0 commit comments

Comments
 (0)