54 lines
2 KiB
JavaScript
54 lines
2 KiB
JavaScript
import { convertToSnakeCase, convertToCamelCase } from '~/lib/utils/text_utility';
|
|
import { DEFAULT_TH_CLASSES } from './constants';
|
|
|
|
/**
|
|
* Deprecated: use thWidthPercent instead
|
|
* Generates the table header classes to be used for GlTable fields.
|
|
*
|
|
* @param {Number} width - The column width as a percentage.
|
|
* @returns {String} The classes to be used in GlTable fields object.
|
|
*/
|
|
export const thWidthClass = (width) => `gl-w-${width}p ${DEFAULT_TH_CLASSES}`;
|
|
|
|
/**
|
|
* Generates the table header class for width to be used for GlTable fields.
|
|
*
|
|
* @param {Number} width - The column width as a percentage. Only accepts values
|
|
* as defined in https://gitlab.com/gitlab-org/gitlab-ui/blob/main/src/scss/utility-mixins/sizing.scss
|
|
* @returns {String} The class to be used in GlTable fields object.
|
|
*/
|
|
export const thWidthPercent = (width) => `gl-w-${width}p`;
|
|
|
|
/**
|
|
* Converts a GlTable sort-changed event object into string format.
|
|
* This string can be used as a sort argument on GraphQL queries.
|
|
*
|
|
* @param {Object} - The table state context object.
|
|
* @returns {String} A string with the sort key and direction, for example 'NAME_DESC'.
|
|
*/
|
|
export const sortObjectToString = ({ sortBy, sortDesc }) => {
|
|
const sortingDirection = sortDesc ? 'DESC' : 'ASC';
|
|
const sortingColumn = convertToSnakeCase(sortBy).toUpperCase();
|
|
|
|
return `${sortingColumn}_${sortingDirection}`;
|
|
};
|
|
|
|
/**
|
|
* Converts a sort string into a sort state object that can be used to
|
|
* set the sort order on GlTable.
|
|
*
|
|
* @param {String} - The string with the sort key and direction, for example 'NAME_DESC'.
|
|
* @returns {Object} An object with the sortBy and sortDesc properties.
|
|
*/
|
|
export const sortStringToObject = (sortString) => {
|
|
let sortBy = null;
|
|
let sortDesc = null;
|
|
|
|
if (sortString && sortString.includes('_')) {
|
|
const [key, direction] = sortString.split(/_(ASC|DESC)$/);
|
|
sortBy = convertToCamelCase(key.toLowerCase());
|
|
sortDesc = direction === 'DESC';
|
|
}
|
|
|
|
return { sortBy, sortDesc };
|
|
};
|