Skip to content

refactor(Legend): abstract chart legend props

Andrei Stoicescu requested to merge astoicescu/abstractChartLegendProps into main

What does this MR do?

Abstracts legend props since they are repeated through multiple files

Possible approach

We could abstract these to a utility file that lives alongside the charts and then each component can just import them by default:

// ../../../utils/charts/utils

export const  legendAverageText = {
    type: String,
    required: false,
    default: LEGEND_AVERAGE_TEXT,
  };

export const legendMaxText=  {
    type: String,
    required: false,
    default: LEGEND_MAX_TEXT,
  };

export const legendMinText = {
    type: String,
    required: false,
    default: LEGEND_MIN_TEXT,
  };

export const legendCurrentText = {
    type: String,
    required: false,
    default: LEGEND_CURRENT_TEXT,
  };

export const legendLayout = {
    type: String,
    required: false,
    default: LEGEND_LAYOUT_INLINE,
    validator(layout) {
      return [LEGEND_LAYOUT_INLINE, LEGEND_LAYOUT_TABLE].indexOf(layout) !== -1;
    },
  };


// area.vue / line.vue / stacked_column.vue

import { legendAverageText, legendCurrentText, legendLayout, legendMaxText, legendMinText } from '../../../utils/charts/utils'

formatTooltipText: {
      type: Function,
      required: false,
      default: null,
    },
    legendMaxText,
    legendMinText,
    legendLayout,
    legendCurrentText,
    legendAverageText

This really helps cut down on the repeated code and lets us adhere to the open closed principal of the props being open to extension but closed for modification, which I think would be useful for the charts legend.

Does this MR meet the acceptance criteria?

Conformity

  • Code review guidelines.
  • GitLab UI's contributing guidlines.
  • If it changes a Pajamas-compliant component's look & feel, the MR has been reviewed by a UX designer.
  • If it changes GitLab UI's documentation guidelines, the MR has been reviewed by a Technical Writer.
  • If the MR changes a component's API, integration MR(s) have been opened in the following projects to ensure that the @gitlab/ui package can be upgraded quickly after the changes are released:
  • Added the ~"component:*" label(s) if applicable.

Merge request reports