debian-mirror-gitlab/app/assets/javascripts/lib/utils/text_utility.js

402 lines
11 KiB
JavaScript
Raw Normal View History

2020-07-28 23:09:34 +05:30
import { isString, memoize } from 'lodash';
import {
TRUNCATE_WIDTH_DEFAULT_WIDTH,
TRUNCATE_WIDTH_DEFAULT_FONT_SIZE,
} from '~/lib/utils/constants';
2019-07-07 11:18:12 +05:30
2018-03-17 18:26:18 +05:30
/**
* Adds a , to a string composed by numbers, at every 3 chars.
*
* 2333 -> 2,333
* 232324 -> 232,324
*
* @param {String} text
* @returns {String}
*/
2018-05-09 12:01:36 +05:30
export const addDelimiter = text =>
2018-12-13 13:39:08 +05:30
text ? text.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') : text;
2017-09-10 17:25:29 +05:30
2018-03-17 18:26:18 +05:30
/**
* Returns '99+' for numbers bigger than 99.
*
* @param {Number} count
* @return {Number|String}
*/
export const highCountTrim = count => (count > 99 ? '99+' : count);
2017-08-17 22:00:37 +05:30
2018-03-17 18:26:18 +05:30
/**
2020-03-13 15:44:24 +05:30
* Converts first char to uppercase and replaces the given separator with spaces
* @param {String} string - The string to humanize
* @param {String} separator - The separator used to separate words (defaults to "_")
2018-03-17 18:26:18 +05:30
* @requires {String}
2020-03-13 15:44:24 +05:30
* @returns {String}
2018-03-17 18:26:18 +05:30
*/
2020-03-13 15:44:24 +05:30
export const humanize = (string, separator = '_') => {
const replaceRegex = new RegExp(separator, 'g');
return string.charAt(0).toUpperCase() + string.replace(replaceRegex, ' ').slice(1);
};
2017-08-17 22:00:37 +05:30
2018-03-17 18:26:18 +05:30
/**
* Replaces underscores with dashes
* @param {*} str
* @returns {String}
*/
export const dasherize = str => str.replace(/[_\s]+/g, '-');
2017-08-17 22:00:37 +05:30
2018-03-17 18:26:18 +05:30
/**
2019-12-26 22:10:19 +05:30
* Replaces whitespace and non-sluggish characters with a given separator
* @param {String} str - The string to slugify
* @param {String=} separator - The separator used to separate words (defaults to "-")
2018-03-17 18:26:18 +05:30
* @returns {String}
*/
2019-12-26 22:10:19 +05:30
export const slugify = (str, separator = '-') => {
2019-09-30 21:07:59 +05:30
const slug = str
.trim()
.toLowerCase()
2020-03-13 15:44:24 +05:30
.replace(/[^a-zA-Z0-9_.-]+/g, separator)
// Remove any duplicate separators or separator prefixes/suffixes
.split(separator)
.filter(Boolean)
.join(separator);
2019-09-30 21:07:59 +05:30
2019-12-26 22:10:19 +05:30
return slug === separator ? '' : slug;
2019-09-30 21:07:59 +05:30
};
2017-08-17 22:00:37 +05:30
2018-11-20 20:47:30 +05:30
/**
2019-12-26 22:10:19 +05:30
* Replaces whitespace and non-sluggish characters with underscores
2018-11-20 20:47:30 +05:30
* @param {String} str
* @returns {String}
*/
2019-12-26 22:10:19 +05:30
export const slugifyWithUnderscore = str => slugify(str, '_');
2018-11-20 20:47:30 +05:30
2018-03-17 18:26:18 +05:30
/**
* Truncates given text
*
* @param {String} string
* @param {Number} maxLength
* @returns {String}
*/
2020-07-28 23:09:34 +05:30
export const truncate = (string, maxLength) => {
if (string.length - 1 > maxLength) {
return `${string.substr(0, maxLength - 1)}`;
}
return string;
};
/**
* This function calculates the average char width. It does so by placing a string in the DOM and measuring the width.
* NOTE: This will cause a reflow and should be used sparsely!
* The default fontFamily is 'sans-serif' and 12px in ECharts, so that is the default basis for calculating the average with.
* https://echarts.apache.org/en/option.html#xAxis.nameTextStyle.fontFamily
* https://echarts.apache.org/en/option.html#xAxis.nameTextStyle.fontSize
* @param {Object} options
* @param {Number} options.fontSize style to size the text for measurement
* @param {String} options.fontFamily style of font family to measure the text with
* @param {String} options.chars string of chars to use as a basis for calculating average width
* @return {Number}
*/
const getAverageCharWidth = memoize(function getAverageCharWidth(options = {}) {
const {
fontSize = 12,
fontFamily = 'sans-serif',
// eslint-disable-next-line @gitlab/require-i18n-strings
chars = ' ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789',
} = options;
const div = document.createElement('div');
div.style.fontFamily = fontFamily;
div.style.fontSize = `${fontSize}px`;
// Place outside of view
div.style.position = 'absolute';
div.style.left = -1000;
div.style.top = -1000;
div.innerHTML = chars;
document.body.appendChild(div);
const width = div.clientWidth;
document.body.removeChild(div);
return width / chars.length / fontSize;
});
/**
* This function returns a truncated version of `string` if its estimated rendered width is longer than `maxWidth`,
* otherwise it will return the original `string`
* Inspired by https://bl.ocks.org/tophtucker/62f93a4658387bb61e4510c37e2e97cf
* @param {String} string text to truncate
* @param {Object} options
* @param {Number} options.maxWidth largest rendered width the text may have
* @param {Number} options.fontSize size of the font used to render the text
* @return {String} either the original string or a truncated version
*/
export const truncateWidth = (string, options = {}) => {
const {
maxWidth = TRUNCATE_WIDTH_DEFAULT_WIDTH,
fontSize = TRUNCATE_WIDTH_DEFAULT_FONT_SIZE,
} = options;
const { truncateIndex } = string.split('').reduce(
(memo, char, index) => {
let newIndex = index;
if (memo.width > maxWidth) {
newIndex = memo.truncateIndex;
}
return { width: memo.width + getAverageCharWidth() * fontSize, truncateIndex: newIndex };
},
{ width: 0, truncateIndex: 0 },
);
return truncate(string, truncateIndex);
};
2017-08-17 22:00:37 +05:30
2018-11-08 19:23:39 +05:30
/**
* Truncate SHA to 8 characters
*
* @param {String} sha
* @returns {String}
*/
2020-01-01 13:55:28 +05:30
export const truncateSha = sha => sha.substring(0, 8);
2018-11-08 19:23:39 +05:30
2019-03-02 22:35:43 +05:30
const ELLIPSIS_CHAR = '…';
export const truncatePathMiddleToLength = (text, maxWidth) => {
let returnText = text;
let ellipsisCount = 0;
while (returnText.length >= maxWidth) {
const textSplit = returnText.split('/').filter(s => s !== ELLIPSIS_CHAR);
2020-06-23 00:09:42 +05:30
if (textSplit.length === 0) {
// There are n - 1 path separators for n segments, so 2n - 1 <= maxWidth
const maxSegments = Math.floor((maxWidth + 1) / 2);
return new Array(maxSegments).fill(ELLIPSIS_CHAR).join('/');
}
2019-03-02 22:35:43 +05:30
const middleIndex = Math.floor(textSplit.length / 2);
returnText = textSplit
.slice(0, middleIndex)
.concat(
new Array(ellipsisCount + 1).fill().map(() => ELLIPSIS_CHAR),
textSplit.slice(middleIndex + 1),
)
.join('/');
ellipsisCount += 1;
}
return returnText;
};
2018-03-17 18:26:18 +05:30
/**
* Capitalizes first character
*
* @param {String} text
* @return {String}
*/
export function capitalizeFirstCharacter(text) {
return `${text[0].toUpperCase()}${text.slice(1)}`;
}
2017-08-17 22:00:37 +05:30
2018-11-18 11:00:15 +05:30
/**
* Returns the first character capitalized
*
* If falsey, returns empty string.
*
* @param {String} text
* @return {String}
*/
export function getFirstCharacterCapitalized(text) {
2018-12-13 13:39:08 +05:30
return text ? text.charAt(0).toUpperCase() : '';
2018-11-18 11:00:15 +05:30
}
2018-03-17 18:26:18 +05:30
/**
* Replaces all html tags from a string with the given replacement.
*
* @param {String} string
* @param {*} replace
* @returns {String}
*/
2018-10-15 14:42:47 +05:30
export const stripHtml = (string, replace = '') => {
if (!string) return string;
return string.replace(/<[^>]*>/g, replace);
};
2016-09-13 17:45:13 +05:30
2018-03-17 18:26:18 +05:30
/**
2020-04-08 14:13:33 +05:30
* Converts a snake_cased string to camelCase.
* Leading and trailing underscores are ignored.
2018-03-17 18:26:18 +05:30
*
2020-04-08 14:13:33 +05:30
* @param {String} string The snake_cased string to convert
* @returns {String} A camelCased version of the string
*
* @example
*
* // returns "aSnakeCasedString"
* convertToCamelCase('a_snake_cased_string')
*
* // returns "_leadingUnderscore"
* convertToCamelCase('_leading_underscore')
*
* // returns "trailingUnderscore_"
* convertToCamelCase('trailing_underscore_')
2018-03-17 18:26:18 +05:30
*/
2020-04-08 14:13:33 +05:30
export const convertToCamelCase = string =>
string.replace(/([a-z0-9])_([a-z0-9])/gi, (match, p1, p2) => `${p1}${p2.toUpperCase()}`);
2018-05-09 12:01:36 +05:30
2019-12-26 22:10:19 +05:30
/**
* Converts camelCase string to snake_case
*
* @param {*} string
*/
export const convertToSnakeCase = string =>
2020-06-23 00:09:42 +05:30
slugifyWithUnderscore((string.match(/([a-zA-Z][^A-Z]*)/g) || [string]).join(' '));
2019-12-26 22:10:19 +05:30
2018-05-09 12:01:36 +05:30
/**
* Converts a sentence to lower case from the second word onwards
* e.g. Hello World => Hello world
*
* @param {*} string
*/
export const convertToSentenceCase = string => {
const splitWord = string.split(' ').map((word, index) => (index > 0 ? word.toLowerCase() : word));
return splitWord.join(' ');
};
2018-11-08 19:23:39 +05:30
2020-03-13 15:44:24 +05:30
/**
* Converts a sentence to title case
* e.g. Hello world => Hello World
*
* @param {String} string
* @returns {String}
*/
export const convertToTitleCase = string => string.replace(/\b[a-z]/g, s => s.toUpperCase());
2020-11-24 15:15:51 +05:30
const unicodeConversion = [
[/[ÀÁÂÃÅĀĂĄ]/g, 'A'],
[/[Æ]/g, 'AE'],
[/[ÇĆĈĊČ]/g, 'C'],
[/[ÈÉÊËĒĔĖĘĚ]/g, 'E'],
[/[ÌÍÎÏĨĪĬĮİ]/g, 'I'],
[/[Ððĥħ]/g, 'h'],
[/[ÑŃŅŇʼn]/g, 'N'],
[/[ÒÓÔÕØŌŎŐ]/g, 'O'],
[/[ÙÚÛŨŪŬŮŰŲ]/g, 'U'],
[/[ÝŶŸ]/g, 'Y'],
[/[Þñþńņň]/g, 'n'],
[/[ߌŜŞŠ]/g, 'S'],
[/[àáâãåāăąĸ]/g, 'a'],
[/[æ]/g, 'ae'],
[/[çćĉċč]/g, 'c'],
[/[èéêëēĕėęě]/g, 'e'],
[/[ìíîïĩīĭį]/g, 'i'],
[/[òóôõøōŏő]/g, 'o'],
[/[ùúûũūŭůűų]/g, 'u'],
[/[ýÿŷ]/g, 'y'],
[/[ĎĐ]/g, 'D'],
[/[ďđ]/g, 'd'],
[/[ĜĞĠĢ]/g, 'G'],
[/[ĝğġģŊŋſ]/g, 'g'],
[/[ĤĦ]/g, 'H'],
[/[ıśŝşš]/g, 's'],
[/[IJ]/g, 'IJ'],
[/[ij]/g, 'ij'],
[/[Ĵ]/g, 'J'],
[/[ĵ]/g, 'j'],
[/[Ķ]/g, 'K'],
[/[ķ]/g, 'k'],
[/[ĹĻĽĿŁ]/g, 'L'],
[/[ĺļľŀł]/g, 'l'],
[/[Œ]/g, 'OE'],
[/[œ]/g, 'oe'],
[/[ŔŖŘ]/g, 'R'],
[/[ŕŗř]/g, 'r'],
[/[ŢŤŦ]/g, 'T'],
[/[ţťŧ]/g, 't'],
[/[Ŵ]/g, 'W'],
[/[ŵ]/g, 'w'],
[/[ŹŻŽ]/g, 'Z'],
[/[źżž]/g, 'z'],
[/ö/g, 'oe'],
[/ü/g, 'ue'],
[/ä/g, 'ae'],
// eslint-disable-next-line @gitlab/require-i18n-strings
[/Ö/g, 'Oe'],
// eslint-disable-next-line @gitlab/require-i18n-strings
[/Ü/g, 'Ue'],
// eslint-disable-next-line @gitlab/require-i18n-strings
[/Ä/g, 'Ae'],
];
/**
* Converts each non-ascii character in a string to
* it's ascii equivalent (if defined).
*
* e.g. "Dĭd söméònê äšk fœŕ Ůnĭċődę?" => "Did someone aesk foer Unicode?"
*
* @param {String} string
* @returns {String}
*/
export const convertUnicodeToAscii = string => {
let convertedString = string;
unicodeConversion.forEach(([regex, replacer]) => {
convertedString = convertedString.replace(regex, replacer);
});
return convertedString;
};
2018-11-08 19:23:39 +05:30
/**
* Splits camelCase or PascalCase words
* e.g. HelloWorld => Hello World
*
* @param {*} string
2018-12-13 13:39:08 +05:30
*/
export const splitCamelCase = string =>
2018-11-08 19:23:39 +05:30
string
2018-12-13 13:39:08 +05:30
.replace(/([A-Z]+)([A-Z][a-z])/g, ' $1 $2')
.replace(/([a-z\d])([A-Z])/g, '$1 $2')
.trim();
2019-07-07 11:18:12 +05:30
/**
* Intelligently truncates an item's namespace by doing two things:
* 1. Only include group names in path by removing the item name
* 2. Only include the first and last group names in the path
* when the namespace includes more than 2 groups
*
* @param {String} string A string namespace,
* i.e. "My Group / My Subgroup / My Project"
*/
export const truncateNamespace = (string = '') => {
2020-04-08 14:13:33 +05:30
if (string === null || !isString(string)) {
2019-07-07 11:18:12 +05:30
return '';
}
const namespaceArray = string.split(' / ');
if (namespaceArray.length === 1) {
return string;
}
namespaceArray.splice(-1, 1);
let namespace = namespaceArray.join(' / ');
if (namespaceArray.length > 2) {
namespace = `${namespaceArray[0]} / ... / ${namespaceArray.pop()}`;
}
return namespace;
};
2020-04-22 19:07:51 +05:30
/**
* Tests that the input is a String and has at least
* one non-whitespace character
* @param {String} obj The object to test
* @returns {Boolean}
*/
export const hasContent = obj => isString(obj) && obj.trim() !== '';