Skip to content

Resolve "Implement feature flags list page"

Hiru Fernando requested to merge 17-implement-feature-flags-list-page into main

What does this MR do and why?

This MR creates feature flags YAML file which is then converted into a feature flag table using Hugo template. This is to match the same functionality that nanoc currently has.

Files that contain the main logic are,

  1. build_feature_flags.go - this file will grab all the available feature flags for both GitLab products GitLab Community Edition and Enterprise Edition and GitLab Enterprise Edition only by traversing through these two directories: ../gitlab/config/feature_flags and ../gitlab/ee/config/feature_flags. Once collected, the feature flag information is categorized by product in yaml format (resulting file is called feature_flag.yml). This method is called during build.go call.
  2. feature_flags_tables.html - this file is where the table is actually rendered. The logic loops through the yaml file (that is stored under /data/) and creates the two tables for the two products. Here additional sorting classes are added for columns that can be sorted. The sorting can only work if following is given for the column header class="sortable" data-sort="string" or class="sortable" data-sort="number" (NOTE: data-sort can either be a string or a number).
  3. feature_flags.html (this is the shortcode we can use) - this file calls the partial in point 2 ^.
  4. table_helpers.js - this file creates sorting logic helpers in which it adds and removes sorting classes (i.e if ascending in one column, other columns sorting are not affected and only allows sorting for one column at a time).
  5. main.js - everything stays the same except, sorting functionality is added here because in Hugo, it was extremely hard to sort yaml data especially sorting versions which have numbers like 17.10 which hugo saves as 17.1 (tried with turning it into a map, but order was not retained).

Feature flags table can be rendered by adding shortcode {{< feature-flags >}}

Screenshots, screen recordings, or links to review app

Table render in example markdown content file, http://localhost:1313/testFFlags/

image

How to set up and validate locally

Numbered steps to set up and validate the change are strongly suggested.

  1. Configure a local GitLab Docs environment: https://gitlab.com/gitlab-org/technical-writing-group/gitlab-docs-hugo/-/blob/main/doc/setup.md.
  2. In the content directory, create a test file called testFFlags.md. In there just call the shortcode {{< feature-flags >}}.
  3. Run make view and go to link http://localhost:1313/testFFlags/. It will render two feature flag tables (1 for each product).

Merge request acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Closes #17 (closed)

Edited by Hiru Fernando

Merge request reports

Loading