Skip to content

Fix look and feel for LDAP sync

Daniel Tian requested to merge 464104-clean-up-ldap-sync-ui into master

What does this MR do and why?

There are some positioning/spacing issues with the pages related to the LDAP sync feature. This MR fixes the following:

On the Settings -> LDAP Synchronization page, the following issues were fixed:

  1. A search bar is shown at the top, but it's disabled and not usable. It has been removed.
  2. The group selector dropdown always shows gray text even when a dropdown item is selected. It now shows gray text when the placeholder text is shown, and black text when a selection is made.
  3. When there are no synchronizations configured, the No sync configured text has no padding around it.
  4. When there are synchronizations configured, the Remove button is top aligned. It has been changed to center aligned.

Before:

No synchronizations configured Synchronizations configured
ksnip_20240529-175432 ksnip_20240529-175403

After:

No synchronizations configured Synchronizations configured
ksnip_20240529-181127 ksnip_20240529-180150

On the Manage -> Members page, an info alert is shown when LDAP synchronizations are configured. The following issues with it were fixed:

  1. There is no padding between the message and the bullet list below it. Padding has been added.
  2. There is no padding between the bullet list items. Padding has been added.
  3. The sync status message is top-aligned. It has been changed to center aligned.
  4. There is no padding between the sync button and the status message. Padding has been added.
Before After
ksnip_20240529-175808 ksnip_20240529-180120

How to set up and validate locally

  1. In your GDK root folder, edit gdk.yml and add the following top-level entry:
openldap:
  enabled: true
  1. Run gdk reconfigure, then restart your GDK.
  2. (optional) Go to <gdk_root>/gitlab-openldap, then run make clean default to populate the database with LDAP data.
  3. Go to any group -> Settings -> LDAP Synchronization.
  4. Verify that the design matches the MR description.
  5. Go to Manage -> Members.
  6. Verify that the alert design matches the MR description.

Related to #464104 (closed)

Edited by Daniel Tian

Merge request reports

Loading