Skip to content

Commit

Permalink
feat: use URL instead of path/params [breaking change]
Browse files Browse the repository at this point in the history
This uses the native [URL](-like) object instead of separate path/params.

[URL]: https://developer.mozilla.org/en-US/docs/Web/API/URL
  • Loading branch information
laggingreflex committed Oct 30, 2018
1 parent 1aa2ff9 commit 639d382
Show file tree
Hide file tree
Showing 4 changed files with 42 additions and 68 deletions.
2 changes: 1 addition & 1 deletion src/index.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
export { params, path, setParams, setPath } from './url'
export { url } from './url'
export { storage, setStorage } from './storage'
export { default as scheduler } from './scheduler'
54 changes: 40 additions & 14 deletions src/url.js
Original file line number Diff line number Diff line change
@@ -1,25 +1,51 @@
import { observable, observe } from '@nx-js/observer-util'
import scheduler from './scheduler'
import { toQuery, toParams, toPathArray, toPathString } from './utils'

export const params = observable(toParams(location.search))
export const path = observable(toPathArray(location.pathname))
export const url = observable(createUrl())

export function setParams (newParams) {
for (let key of Object.keys(params)) {
delete params[key]
const unWritableKeys = ['origin', 'searchParams']

observe(syncUrl, { scheduler })

function createUrl (href = location.href) {
const url = new URL(href)
const ret = {}
for (const key in url) {
ret[key] = url[key]
}
Object.assign(params, newParams)
ret.params = createParams(url.searchParams)
return ret
}

export function setPath (newPath) {
path.length = 0
path.push(...newPath)
function createParams (searchParams) {
/* Convert URLSearchParams object into plain key-value object */
return Array.from(searchParams.entries()).reduce((params, [key, value]) => ({
...params,
[key]: value
}), {})
}

function syncUrl () {
const url = toPathString(path) + toQuery(params) + location.hash
history.replaceState(history.state, '', url)
function updateParams (params, searchParams) {
/* Update the URLSearchParams object from plain key-value object */
for (const key in params) {
searchParams.set(key, params[key])
}
}

observe(syncUrl, { scheduler })
function updateUrl (oldUrl, href = oldUrl.href) {
const newUrl = new URL(href)
for (const key in newUrl) {
if (unWritableKeys.includes(key)) continue
newUrl[key] = oldUrl[key]
/* URL does internal adjustments, like automatically add "#" to .hash (even if the user hadn't) */
/* So the updated properties need to be copied back for consistency and expected behaviour */
oldUrl[key] = newUrl[key]
}
updateParams(oldUrl.params, newUrl.searchParams)
return createUrl(newUrl.href)
}

function syncUrl () {
const newUrl = updateUrl(url)
history.replaceState(history.state, '', newUrl.href)
}
47 changes: 0 additions & 47 deletions src/utils.js

This file was deleted.

7 changes: 1 addition & 6 deletions types/index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,5 @@ declare module 'react-easy-params' {
}

const storage: ObjectObject
const params: PrimitiveObject
const path: Array<primitive>

function setParams(obj: PrimitiveObject): void
function setStorage(obj: ObjectObject): void
function setPath(array: Array<primitive>): void
const url: ObjectObject
}

0 comments on commit 639d382

Please sign in to comment.