Make OIDC clientId uneditable (#992)

* Move oidcClientId to bottom card and make it readOnly

* onChange not required for readonly field

Author: niwsa

src/sso/connections/EditConnection/oidc/index.lite.tsx

@@ -297,19 +297,6 @@ export default function EditOIDCConnection(props: EditOIDCConnectionProps) {
                 <Spacer y={6} />
               </Show>
             </Show>
-            <InputField
-              label='Client ID [OIDC Provider]'
-              id='oidcClientId'
-              required={true}
-              classNames={state.classes.inputField}
-              value={state.oidcConnection.oidcClientId || ''}
-              handleInputChange={state.handleChange}
-              aria-describedby='oidc-clientid-hint'
-            />
-            <div id='oidc-clientid-hint' class={defaultClasses.hint}>
-              ClientId of the app created on the OIDC Provider.
-            </div>
-            <Spacer y={6} />
             <SecretInputFormControl
               classNames={{ input: props.classNames?.secretInput }}
               label='Client Secret [OIDC Provider]'
@@ -463,7 +450,18 @@ export default function EditOIDCConnection(props: EditOIDCConnectionProps) {
                     copyDoneCallback={props.successCallback}
                     handleChange={state.handleChange}
                   />
+                  <Spacer y={6} />
+                  <InputField
+                    label='Client ID [OIDC Provider]'
+                    id='oidcClientId'
+                    required={true}
+                    readOnly
+                    classNames={state.classes.inputField}
+                    value={state.oidcConnection.oidcClientId || ''}
+                    aria-describedby='oidc-clientid-hint'
+                  />
                 </div>
+                <Spacer y={6} />
               </Card>
             </Show>
             <Spacer y={4} />