diff --git a/src/components/modals/SortModal.svelte b/src/components/modals/SortModal.svelte index 7238fa7..1f97d75 100644 --- a/src/components/modals/SortModal.svelte +++ b/src/components/modals/SortModal.svelte @@ -10,6 +10,8 @@ import { sortArray, sortObjectKeys } from '../../logic/sort.js' import { sortModalState } from './sortModalState.js' import { compileJSONPointer } from '../../utils/jsonPointer.js' + import { get } from 'lodash-es' + import { getIn } from '../../utils/immutabilityHelpers.js' export let id export let json @@ -22,7 +24,7 @@ $: json $: jsonIsArray = Array.isArray(json) $: paths = jsonIsArray ? getNestedPaths(json) : undefined - $: properties = paths?.map(pathToOption) + $: properties = paths ? paths.map(pathToOption) : undefined const asc = { value: 1, @@ -34,8 +36,8 @@ } const directions = [asc, desc] - let selectedProperty = sortModalState[stateId]?.selectedProperty || undefined - let selectedDirection = sortModalState[stateId]?.selectedDirection || asc + let selectedProperty = (sortModalState[stateId] && sortModalState[stateId].selectedProperty) || undefined + let selectedDirection = (sortModalState[stateId] && sortModalState[stateId].selectedDirection) || asc $: { // if there is only one option, select it and do not render the select box diff --git a/src/components/modals/TransformModal.scss b/src/components/modals/TransformModal.scss index 3a37714..cc4cf3a 100644 --- a/src/components/modals/TransformModal.scss +++ b/src/components/modals/TransformModal.scss @@ -5,6 +5,12 @@ .description { padding-bottom: $padding; + + code { + background: $background-gray; + font-family: $font-family-mono; + font-size: $font-size-mono; + } } label { diff --git a/src/components/modals/TransformModal.svelte b/src/components/modals/TransformModal.svelte index 847d4b3..5af48e7 100644 --- a/src/components/modals/TransformModal.svelte +++ b/src/components/modals/TransformModal.svelte @@ -8,6 +8,8 @@ import { transformModalState } from './transformModalState.js' import { DEBOUNCE_DELAY, MAX_PREVIEW_CHARACTERS } from '../../constants.js' import { truncate } from '../../utils/stringUtils.js' + import * as _ from 'lodash-es' + import { getIn } from '../../utils/immutabilityHelpers.js' export let id export let json @@ -20,14 +22,15 @@ let stateId = `${id}:${compileJSONPointer(rootPath)}` - let query = transformModalState[stateId]?.query || DEFAULT_QUERY + let query = (transformModalState[stateId] && transformModalState[stateId].query) || DEFAULT_QUERY let previewHasError = false let preview = '' function evalTransform(json, query) { - // FIXME: replace unsafe eval with a JS based query language + // FIXME: replace unsafe new Function with a JS based query language // As long as we don't persist or fetch queries, there is no security risk. - const queryFn = eval(`(${query})`) + // TODO: only import the most relevant subset of lodash instead of the full library? + const queryFn = new Function('_', `'use strict'; return (${query})`)(_) return queryFn(json) } @@ -86,6 +89,12 @@
_.map
, _.filter
,
+ _.orderBy
, _.sortBy
, _.groupBy
,
+ _.pick
, _.uniq
, _.get
, etcetera.
+