Don't expand search result itself when focusing it

This commit is contained in:
jos 2017-09-08 10:29:09 +02:00
parent 99cc07577d
commit 598fe63d80
8 changed files with 27 additions and 29 deletions

1
.gitignore vendored
View File

@ -1,4 +1,5 @@
.idea .idea
.vscode
dist dist
lib lib
downloads downloads

View File

@ -8,7 +8,7 @@ import { getInnerText, insideRect, findParentWithAttribute } from '../utils/domU
import { stringConvert, valueType, isUrl } from '../utils/typeUtils' import { stringConvert, valueType, isUrl } from '../utils/typeUtils'
import { compileJSONPointer } from '../jsonData' import { compileJSONPointer } from '../jsonData'
import type { PropertyData, JSONData, SearchResultStatus } from '../types' import type { PropertyData, JSONData, SearchResultStatus, Path } from '../types'
export default class JSONNode extends Component { export default class JSONNode extends Component {
static URL_TITLE = 'Ctrl+Click or Ctrl+Enter to open url' static URL_TITLE = 'Ctrl+Click or Ctrl+Enter to open url'
@ -165,7 +165,7 @@ export default class JSONNode extends Component {
} }
// TODO: simplify the method renderProperty // TODO: simplify the method renderProperty
renderProperty (prop: ?PropertyData, index: ?number, data: JSONData, options: {escapeUnicode: boolean, isPropertyEditable: (path: string) => boolean}) { renderProperty (prop: ?PropertyData, index: ?number, data: JSONData, options: {escapeUnicode: boolean, isPropertyEditable: (Path) => boolean}) {
const isIndex = typeof index === 'number' const isIndex = typeof index === 'number'
if (!prop && !isIndex) { if (!prop && !isIndex) {

View File

@ -2,7 +2,7 @@
import JSONNode from './JSONNode' import JSONNode from './JSONNode'
import type { PropertyData, JSONData } from '../types' import type { PropertyData, JSONData, Path } from '../types'
/** /**
* JSONNodeForm * JSONNodeForm

View File

@ -262,6 +262,8 @@ export default class TextMode extends Component {
// do nothing... // do nothing...
} }
findKeyBinding = createFindKeyBinding(KEY_BINDINGS)
handleKeyDown = (event) => { handleKeyDown = (event) => {
const keyBinding = this.findKeyBinding(event) const keyBinding = this.findKeyBinding(event)
const action = this.keyDownActions[keyBinding] const action = this.keyDownActions[keyBinding]
@ -382,4 +384,3 @@ export default class TextMode extends Component {
} }
// TODO: define propTypes // TODO: define propTypes

View File

@ -6,6 +6,7 @@ import Ajv from 'ajv'
import { updateIn, getIn, setIn } from '../utils/immutabilityHelpers' import { updateIn, getIn, setIn } from '../utils/immutabilityHelpers'
import { parseJSON } from '../utils/jsonUtils' import { parseJSON } from '../utils/jsonUtils'
import { allButLast } from '../utils/arrayUtils'
import { enrichSchemaError } from '../utils/schemaUtils' import { enrichSchemaError } from '../utils/schemaUtils'
import { import {
jsonToData, dataToJson, toDataPath, patchData, pathExists, jsonToData, dataToJson, toDataPath, patchData, pathExists,
@ -189,7 +190,7 @@ export default class TreeMode extends Component {
]) ])
} }
renderMenu (searchResults: Array) { renderMenu (searchResults: [] | null) {
let items = [ let items = [
h('button', { h('button', {
key: 'expand-all', key: 'expand-all',
@ -277,6 +278,8 @@ export default class TreeMode extends Component {
return [] return []
} }
findKeyBinding = createFindKeyBinding(KEY_BINDINGS)
handleKeyDown = (event) => { handleKeyDown = (event) => {
const keyBinding = this.findKeyBinding(event) const keyBinding = this.findKeyBinding(event)
const action = this.keyDownActions[keyBinding] const action = this.keyDownActions[keyBinding]
@ -408,7 +411,7 @@ export default class TreeMode extends Component {
this.setState({ this.setState({
search: { text, active }, search: { text, active },
data: expandPath(this.state.data, active.path) data: expandPath(this.state.data, allButLast(active.path))
}) })
// scroll to active search result (on next tick, after this path has been expanded) // scroll to active search result (on next tick, after this path has been expanded)
@ -429,7 +432,7 @@ export default class TreeMode extends Component {
this.setState({ this.setState({
search: setIn(this.state.search, ['active'], next), search: setIn(this.state.search, ['active'], next),
data: expandPath(this.state.data, next && next.path) data: next ? expandPath(this.state.data, allButLast(next.path)) : this.state.data
}) })
// scroll to the active result (on next tick, after this path has been expanded) // scroll to the active result (on next tick, after this path has been expanded)
@ -453,7 +456,7 @@ export default class TreeMode extends Component {
this.setState({ this.setState({
search: setIn(this.state.search, ['active'], previous), search: setIn(this.state.search, ['active'], previous),
data: expandPath(this.state.data, previous && previous.path) data: previous ? expandPath(this.state.data, allButLast(previous.path)) : this.state.data
}) })
// scroll to the active result (on next tick, after this path has been expanded) // scroll to the active result (on next tick, after this path has been expanded)
@ -757,5 +760,4 @@ export default class TreeMode extends Component {
} }
} }
// TODO: describe PropTypes // TODO: describe PropTypes

View File

@ -54,7 +54,7 @@ export default class Search extends Component {
]) ])
} }
renderResultsCount (searchResults : Array) { renderResultsCount (searchResults : []) {
if (!searchResults) { if (!searchResults) {
return null return null
} }

View File

@ -7,6 +7,7 @@
import { setIn, updateIn, getIn, deleteIn, insertAt } from './utils/immutabilityHelpers' import { setIn, updateIn, getIn, deleteIn, insertAt } from './utils/immutabilityHelpers'
import { isObject } from './utils/typeUtils' import { isObject } from './utils/typeUtils'
import { last, allButLast } from './utils/arrayUtils'
import isEqual from 'lodash/isEqual' import isEqual from 'lodash/isEqual'
import type { import type {
@ -14,6 +15,8 @@ import type {
JSONPatch, JSONPatchAction, PatchOptions, JSONPatchResult JSONPatch, JSONPatchAction, PatchOptions, JSONPatchResult
} from './types' } from './types'
type RecurseCallback = (value: JSONData, path: Path, root: JSONData) => JSONData
/** /**
* Expand function which will expand all nodes * Expand function which will expand all nodes
* @param {Path} path * @param {Path} path
@ -519,7 +522,7 @@ export function expand (data: JSONData, callback: Path | (Path) => boolean, expa
// console.log('expand', callback, expand) // console.log('expand', callback, expand)
if (typeof callback === 'function') { if (typeof callback === 'function') {
return transform (data, function (value, path) { return transform(data, function (value: JSONData, path: Path, root: JSONData) : JSONData {
if (value.type === 'Array' || value.type === 'Object') { if (value.type === 'Array' || value.type === 'Object') {
if (callback(path)) { if (callback(path)) {
return setIn(value, ['expanded'], expanded) return setIn(value, ['expanded'], expanded)
@ -694,8 +697,6 @@ export function containsCaseInsensitive (text: string, search: string): boolean
return String(text).toLowerCase().indexOf(search.toLowerCase()) !== -1 return String(text).toLowerCase().indexOf(search.toLowerCase()) !== -1
} }
type RecurseCallback = (JSONData, Path, JSONData) => JSONData
/** /**
* Recursively transform JSONData: a recursive "map" function * Recursively transform JSONData: a recursive "map" function
* @param {JSONData} data * @param {JSONData} data
@ -714,7 +715,7 @@ export function transform (data: JSONData, callback: RecurseCallback) {
* @param {function(value: JSONData, path: Path, root: JSONData)} callback * @param {function(value: JSONData, path: Path, root: JSONData)} callback
* @return {JSONData} Returns the transformed data * @return {JSONData} Returns the transformed data
*/ */
function recurseTransform (value: JSONData, path: Path, root: JSONData, callback: RecurseCallback) : JSONData{ function recurseTransform (value: JSONData, path: Path, root: JSONData, callback: RecurseCallback) : JSONData {
let updatedValue = callback(value, path, root) let updatedValue = callback(value, path, root)
if (value.type === 'Array') { if (value.type === 'Array') {
@ -912,17 +913,3 @@ let _id = 0
function createUniqueId (array) { function createUniqueId (array) {
return Math.max(...array.map(item => item.id)) + 1 return Math.max(...array.map(item => item.id)) + 1
} }
/**
* Returns the last item of an array
*/
function last (array: []): any {
return array[array.length - 1]
}
/**
* Returns a copy of the array having the last item removed
*/
function allButLast (array: []): any {
return array.slice(0, array.length - 1)
}

View File

@ -7,6 +7,13 @@ export function last (array) {
return array[array.length - 1] return array[array.length - 1]
} }
/**
* Returns a copy of the array having the last item removed
*/
export function allButLast (array: []): [] {
return array.slice(0, -1)
}
/** /**
* Comparator to sort an array in ascending order * Comparator to sort an array in ascending order
* *