mirror of
https://github.com/balena-io/etcher.git
synced 2025-07-18 16:56:32 +00:00
Convert middle-ellipsis.js to typescript
Change-type: patch
This commit is contained in:
parent
b4a60cfee2
commit
255fae3a90
@ -29,7 +29,7 @@ const {
|
|||||||
StepNameButton
|
StepNameButton
|
||||||
} = require('./../../styled-components')
|
} = require('./../../styled-components')
|
||||||
const { Txt } = require('rendition')
|
const { Txt } = require('rendition')
|
||||||
const middleEllipsis = require('./../../utils/middle-ellipsis')
|
const { middleEllipsis } = require('./../../utils/middle-ellipsis')
|
||||||
const { bytesToClosestUnit } = require('./../../../../shared/units')
|
const { bytesToClosestUnit } = require('./../../../../shared/units')
|
||||||
|
|
||||||
const TargetDetail = styled((props) => (
|
const TargetDetail = styled((props) => (
|
||||||
|
@ -45,7 +45,7 @@ const {
|
|||||||
const {
|
const {
|
||||||
Modal
|
Modal
|
||||||
} = require('rendition')
|
} = require('rendition')
|
||||||
const middleEllipsis = require('../../utils/middle-ellipsis')
|
const { middleEllipsis } = require('../../utils/middle-ellipsis')
|
||||||
const SVGIcon = require('../svg-icon/svg-icon.jsx')
|
const SVGIcon = require('../svg-icon/svg-icon.jsx')
|
||||||
const { default: styled } = require('styled-components')
|
const { default: styled } = require('styled-components')
|
||||||
|
|
||||||
|
@ -34,7 +34,7 @@ import * as store from '../../models/store';
|
|||||||
import { open as openExternal } from '../../os/open-external/services/open-external';
|
import { open as openExternal } from '../../os/open-external/services/open-external';
|
||||||
import { ThemedProvider } from '../../styled-components';
|
import { ThemedProvider } from '../../styled-components';
|
||||||
import { colors } from '../../theme';
|
import { colors } from '../../theme';
|
||||||
import * as middleEllipsis from '../../utils/middle-ellipsis';
|
import { middleEllipsis } from '../../utils/middle-ellipsis';
|
||||||
|
|
||||||
import { bytesToClosestUnit } from '../../../../shared/units';
|
import { bytesToClosestUnit } from '../../../../shared/units';
|
||||||
|
|
||||||
|
@ -1,68 +0,0 @@
|
|||||||
/*
|
|
||||||
* Copyright 2016 Juan Cruz Viotti. https://github.com/jviotti
|
|
||||||
* Copyright 2018 balena.io
|
|
||||||
*
|
|
||||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
||||||
* you may not use this file except in compliance with the License.
|
|
||||||
* You may obtain a copy of the License at
|
|
||||||
*
|
|
||||||
* http://www.apache.org/licenses/LICENSE-2.0
|
|
||||||
*
|
|
||||||
* Unless required by applicable law or agreed to in writing, software
|
|
||||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
* See the License for the specific language governing permissions and
|
|
||||||
* limitations under the License.
|
|
||||||
*/
|
|
||||||
|
|
||||||
'use strict'
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @summary Truncate text from the middle with an ellipsis
|
|
||||||
* @public
|
|
||||||
* @function
|
|
||||||
*
|
|
||||||
* @param {String} input - input string
|
|
||||||
* @param {Number} limit - output limit
|
|
||||||
* @returns {String} truncated string
|
|
||||||
*
|
|
||||||
* @throws Will throw if `limit` < 3
|
|
||||||
*
|
|
||||||
* @example
|
|
||||||
* middleEllipsis('MyVeryLongString', 5)
|
|
||||||
* > 'My\u2026ng'
|
|
||||||
*/
|
|
||||||
module.exports = (input, limit) => {
|
|
||||||
const MIDDLE_ELLIPSIS_CHARACTER = '\u2026'
|
|
||||||
const MINIMUM_LENGTH = 3
|
|
||||||
|
|
||||||
// We can't provide a 100% expected result if the limit is less than 3. For example:
|
|
||||||
//
|
|
||||||
// If the limit == 2:
|
|
||||||
// Should we display the first at last character without an ellipses in the middle?
|
|
||||||
// Should we display just one character and an ellipses before or after?
|
|
||||||
// Should we display nothing at all?
|
|
||||||
//
|
|
||||||
// If the limit == 1:
|
|
||||||
// Should we display just one character?
|
|
||||||
// Should we display just an ellipses?
|
|
||||||
// Should we display nothing at all?
|
|
||||||
//
|
|
||||||
// Etc.
|
|
||||||
if (limit < MINIMUM_LENGTH) {
|
|
||||||
throw new Error('middleEllipsis: Limit should be at least 3')
|
|
||||||
}
|
|
||||||
|
|
||||||
// Do nothing, the string doesn't need truncation.
|
|
||||||
if (input.length <= limit) {
|
|
||||||
return input
|
|
||||||
}
|
|
||||||
|
|
||||||
/* eslint-disable no-magic-numbers */
|
|
||||||
const lengthOfTheSidesAfterTruncation = Math.floor((limit - 1) / 2)
|
|
||||||
const finalLeftPart = input.slice(0, lengthOfTheSidesAfterTruncation)
|
|
||||||
const finalRightPart = input.slice(input.length - lengthOfTheSidesAfterTruncation)
|
|
||||||
/* eslint-enable no-magic-numbers */
|
|
||||||
|
|
||||||
return finalLeftPart + MIDDLE_ELLIPSIS_CHARACTER + finalRightPart
|
|
||||||
}
|
|
51
lib/gui/app/utils/middle-ellipsis.ts
Normal file
51
lib/gui/app/utils/middle-ellipsis.ts
Normal file
@ -0,0 +1,51 @@
|
|||||||
|
/*
|
||||||
|
* Copyright 2016 Juan Cruz Viotti. https://github.com/jviotti
|
||||||
|
* Copyright 2018 balena.io
|
||||||
|
*
|
||||||
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||||
|
* you may not use this file except in compliance with the License.
|
||||||
|
* You may obtain a copy of the License at
|
||||||
|
*
|
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
*
|
||||||
|
* Unless required by applicable law or agreed to in writing, software
|
||||||
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||||
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||||
|
* See the License for the specific language governing permissions and
|
||||||
|
* limitations under the License.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @summary Truncate text from the middle with an ellipsis
|
||||||
|
*/
|
||||||
|
export function middleEllipsis(input: string, limit: number): string {
|
||||||
|
// We can't provide a 100% expected result if the limit is less than 3. For example:
|
||||||
|
//
|
||||||
|
// If the limit == 2:
|
||||||
|
// Should we display the first at last character without an ellipses in the middle?
|
||||||
|
// Should we display just one character and an ellipses before or after?
|
||||||
|
// Should we display nothing at all?
|
||||||
|
//
|
||||||
|
// If the limit == 1:
|
||||||
|
// Should we display just one character?
|
||||||
|
// Should we display just an ellipses?
|
||||||
|
// Should we display nothing at all?
|
||||||
|
//
|
||||||
|
// Etc.
|
||||||
|
if (limit < 3) {
|
||||||
|
throw new Error('middleEllipsis: Limit should be at least 3');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Do nothing, the string doesn't need truncation.
|
||||||
|
if (input.length <= limit) {
|
||||||
|
return input;
|
||||||
|
}
|
||||||
|
|
||||||
|
const lengthOfTheSidesAfterTruncation = Math.floor((limit - 1) / 2);
|
||||||
|
const finalLeftPart = input.slice(0, lengthOfTheSidesAfterTruncation);
|
||||||
|
const finalRightPart = input.slice(
|
||||||
|
input.length - lengthOfTheSidesAfterTruncation,
|
||||||
|
);
|
||||||
|
|
||||||
|
return finalLeftPart + '…' + finalRightPart;
|
||||||
|
}
|
@ -18,8 +18,8 @@
|
|||||||
'use strict'
|
'use strict'
|
||||||
|
|
||||||
const m = require('mochainon')
|
const m = require('mochainon')
|
||||||
const middleEllipsis = require('../../../lib/gui/app/utils/middle-ellipsis')
|
// eslint-disable-next-line node/no-missing-require
|
||||||
console.log(middleEllipsis)
|
const { middleEllipsis } = require('../../../lib/gui/app/utils/middle-ellipsis')
|
||||||
|
|
||||||
describe('Browser: MiddleEllipsis', function () {
|
describe('Browser: MiddleEllipsis', function () {
|
||||||
describe('.middleEllipsis()', function () {
|
describe('.middleEllipsis()', function () {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user