2020-04-06 18:18:19 +00:00
|
|
|
/**
|
|
|
|
* @module TtlPicker2
|
|
|
|
* TtlPicker2 components are used to enable and select 'time to live' values. Use this TtlPicker2 instead of TtlPicker if you:
|
|
|
|
* - Want the TTL to be enabled or disabled
|
|
|
|
* - Want to have the time recalculated by default when the unit changes (eg 60s -> 1m)
|
|
|
|
*
|
|
|
|
* @example
|
|
|
|
* ```js
|
|
|
|
* <TtlPicker2 @onChange={{handleChange}} @time={{defaultTime}} @unit={{defaultUnit}}/>
|
|
|
|
* ```
|
|
|
|
* @param onChange {Function} - This function will be passed a TTL object, which includes enabled{bool}, seconds{number}, timeString{string}.
|
|
|
|
* @param label="Time to live (TTL)" {String} - Label is the main label that lives next to the toggle.
|
|
|
|
* @param helperTextDisabled="Allow tokens to be used indefinitely" {String} - This helper text is shown under the label when the toggle is switched off
|
|
|
|
* @param helperTextEnabled="Disable the use of the token after" {String} - This helper text is shown under the label when the toggle is switched on
|
2020-05-08 17:08:04 +00:00
|
|
|
* @param description="Longer description about this value, what it does, and why it is useful. Shows up in tooltip next to helpertext"
|
2020-04-06 18:18:19 +00:00
|
|
|
* @param time=30 {Number} - The time (in the default units) which will be adjustable by the user of the form
|
|
|
|
* @param unit="s" {String} - This is the unit key which will show by default on the form. Can be one of `s` (seconds), `m` (minutes), `h` (hours), `d` (days)
|
|
|
|
* @param recalculationTimeout=5000 {Number} - This is the time, in milliseconds, that `recalculateSeconds` will be be true after time is updated
|
2020-05-08 17:08:04 +00:00
|
|
|
* @param initialValue=null {String} - This is the value set initially (particularly from a string like '30h')
|
|
|
|
* @param initialEnabled=null {Boolean} - Set this value if you want the toggle on when component is mounted
|
2020-07-01 17:50:02 +00:00
|
|
|
* @param changeOnInit=false {Boolean} - set this value if you'd like the passed onChange function to be called on component initialization
|
2020-04-06 18:18:19 +00:00
|
|
|
*/
|
|
|
|
|
|
|
|
import { computed } from '@ember/object';
|
2020-04-20 15:17:50 +00:00
|
|
|
import { typeOf } from '@ember/utils';
|
|
|
|
import Duration from 'Duration.js';
|
2020-07-27 16:02:31 +00:00
|
|
|
import TtlForm from './ttl-form';
|
2020-04-06 18:18:19 +00:00
|
|
|
import layout from '../templates/components/ttl-picker2';
|
|
|
|
|
|
|
|
const secondsMap = {
|
|
|
|
s: 1,
|
|
|
|
m: 60,
|
|
|
|
h: 3600,
|
|
|
|
d: 86400,
|
|
|
|
};
|
2020-07-01 17:50:02 +00:00
|
|
|
const validUnits = ['s', 'm', 'h', 'd'];
|
2020-04-06 18:18:19 +00:00
|
|
|
const convertFromSeconds = (seconds, unit) => {
|
|
|
|
return seconds / secondsMap[unit];
|
|
|
|
};
|
|
|
|
|
2020-07-27 16:02:31 +00:00
|
|
|
export default TtlForm.extend({
|
2020-04-06 18:18:19 +00:00
|
|
|
layout,
|
|
|
|
enableTTL: false,
|
|
|
|
label: 'Time to live (TTL)',
|
|
|
|
helperTextDisabled: 'Allow tokens to be used indefinitely',
|
|
|
|
helperTextEnabled: 'Disable the use of the token after',
|
2020-05-08 17:08:04 +00:00
|
|
|
description: '',
|
2020-04-06 18:18:19 +00:00
|
|
|
time: 30,
|
2020-04-20 15:17:50 +00:00
|
|
|
unit: 's',
|
|
|
|
initialValue: null,
|
2020-07-01 17:50:02 +00:00
|
|
|
changeOnInit: false,
|
2020-04-20 15:17:50 +00:00
|
|
|
|
|
|
|
init() {
|
|
|
|
this._super(...arguments);
|
|
|
|
const value = this.initialValue;
|
2020-05-08 17:08:04 +00:00
|
|
|
const enable = this.initialEnabled;
|
2020-07-01 17:50:02 +00:00
|
|
|
const changeOnInit = this.changeOnInit;
|
2020-04-20 15:17:50 +00:00
|
|
|
// if initial value is unset use params passed in as defaults
|
|
|
|
if (!value && value !== 0) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2020-07-01 17:50:02 +00:00
|
|
|
let time = 30;
|
|
|
|
let unit = 's';
|
2020-05-08 17:08:04 +00:00
|
|
|
let setEnable = this.enableTTL;
|
|
|
|
if (!!enable || typeOf(enable) === 'boolean') {
|
|
|
|
// This allows non-boolean values passed in to be evaluated for truthiness
|
|
|
|
setEnable = !!enable;
|
|
|
|
}
|
2020-07-01 17:50:02 +00:00
|
|
|
|
2020-04-20 15:17:50 +00:00
|
|
|
if (typeOf(value) === 'number') {
|
2020-07-01 17:50:02 +00:00
|
|
|
// if the passed value is a number, assume unit is seconds
|
|
|
|
time = value;
|
2020-04-20 15:17:50 +00:00
|
|
|
} else {
|
|
|
|
try {
|
2020-07-01 17:50:02 +00:00
|
|
|
const seconds = Duration.parse(value).seconds();
|
|
|
|
const lastDigit = value.toString().substring(value.length - 1);
|
|
|
|
if (validUnits.indexOf(lastDigit) >= 0 && lastDigit !== 's') {
|
|
|
|
time = convertFromSeconds(seconds, lastDigit);
|
|
|
|
unit = lastDigit;
|
|
|
|
} else {
|
|
|
|
time = seconds;
|
|
|
|
}
|
2020-04-20 15:17:50 +00:00
|
|
|
} catch (e) {
|
2020-07-01 17:50:02 +00:00
|
|
|
// if parsing fails leave as default 30s
|
2020-04-20 15:17:50 +00:00
|
|
|
}
|
|
|
|
}
|
2020-07-01 17:50:02 +00:00
|
|
|
|
2020-04-20 15:17:50 +00:00
|
|
|
this.setProperties({
|
2020-07-01 17:50:02 +00:00
|
|
|
time,
|
|
|
|
unit,
|
2020-05-08 17:08:04 +00:00
|
|
|
enableTTL: setEnable,
|
2020-04-20 15:17:50 +00:00
|
|
|
});
|
2020-07-01 17:50:02 +00:00
|
|
|
|
|
|
|
if (changeOnInit) {
|
|
|
|
this.handleChange();
|
|
|
|
}
|
2020-04-20 15:17:50 +00:00
|
|
|
},
|
2020-05-08 17:08:04 +00:00
|
|
|
|
2020-04-06 18:18:19 +00:00
|
|
|
unitOptions: computed(function() {
|
|
|
|
return [
|
|
|
|
{ label: 'seconds', value: 's' },
|
|
|
|
{ label: 'minutes', value: 'm' },
|
|
|
|
{ label: 'hours', value: 'h' },
|
|
|
|
{ label: 'days', value: 'd' },
|
|
|
|
];
|
|
|
|
}),
|
2020-04-20 15:17:50 +00:00
|
|
|
handleChange() {
|
2020-04-06 18:18:19 +00:00
|
|
|
let { time, unit, enableTTL, seconds } = this.getProperties('time', 'unit', 'enableTTL', 'seconds');
|
2020-04-20 15:17:50 +00:00
|
|
|
const ttl = {
|
2020-04-06 18:18:19 +00:00
|
|
|
enabled: enableTTL,
|
|
|
|
seconds,
|
|
|
|
timeString: time + unit,
|
|
|
|
};
|
2020-04-20 15:17:50 +00:00
|
|
|
this.onChange(ttl);
|
|
|
|
},
|
2020-04-06 18:18:19 +00:00
|
|
|
|
|
|
|
helperText: computed('enableTTL', 'helperTextUnset', 'helperTextSet', function() {
|
|
|
|
return this.enableTTL ? this.helperTextEnabled : this.helperTextDisabled;
|
|
|
|
}),
|
2020-07-27 16:02:31 +00:00
|
|
|
|
2020-04-06 18:18:19 +00:00
|
|
|
recalculateSeconds: false,
|
|
|
|
actions: {
|
|
|
|
toggleEnabled() {
|
|
|
|
this.toggleProperty('enableTTL');
|
2020-04-20 15:17:50 +00:00
|
|
|
this.handleChange();
|
2020-04-06 18:18:19 +00:00
|
|
|
},
|
|
|
|
},
|
|
|
|
});
|