PrivateCoffee/tldraw
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

remove url state, to private (#1402)

Browse source 
This PR moves a hook to the private repo.

### Change Type

- [ ] `patch` — Bug Fix
- [ ] `minor` — New Feature
- [x] `major` — Breaking Change

### Release Notes

- [editor] remove `useUrlState`
This commit is contained in:
Steve Ruiz 2023-05-17 16:43:38 +01:00 committed by GitHub
parent 50bae6d4a1
commit 6573cb2fbe
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 0 additions and 86 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
packages/editor/api-report.md
View file

@ -2741,9 +2741,6 @@ export function useQuickReactor(name: string, reactFn: () => void, deps?: any[])
// @public (undocumented)
export function useReactor(name: string, reactFn: () => void, deps?: any[] | undefined): void;
// @public (undocumented)
export function useUrlState(changeUrl: (params: Params) => void): void;
// @internal (undocumented)
export const WAY_TOO_BIG_ARROW_BEND_FACTOR = 10;

1
packages/editor/src/index.ts
View file

@ -180,7 +180,6 @@ export { usePeerIds } from './lib/hooks/usePeerIds'
export { usePresence } from './lib/hooks/usePresence'
export { useQuickReactor } from './lib/hooks/useQuickReactor'
export { useReactor } from './lib/hooks/useReactor'
export { useUrlState } from './lib/hooks/useUrlState'
export { WeakMapCache } from './lib/utils/WeakMapCache'
export {
ACCEPTED_ASSET_TYPE,

82
packages/editor/src/lib/hooks/useUrlState.tsx
View file

@ -1,82 +0,0 @@
import { clamp } from '@tldraw/primitives'
import { Box2dModel, TLPageId } from '@tldraw/tlschema'
import { debounce } from '@tldraw/utils'
import { useEffect } from 'react'
import { react } from 'signia'
import { MAX_ZOOM, MIN_ZOOM } from '../constants'
import { useApp } from './useApp'
import { useEvent } from './useEvent'
const PARAMS = {
viewport: 'viewport',
page: 'page',
} as const
type Params = Record<keyof typeof PARAMS, string>
const viewportFromString = (str: string) => {
const [x, y, w, h] = str.split(',').map((n) => parseInt(n, 10))
return { x, y, w, h }
}
const viewportToString = (
{ x, y, w, h }: { x: number; y: number; w: number; h: number },
precision = 0
) => {
return `${x.toFixed(precision)},${y.toFixed(precision)},${w.toFixed(precision)},${h.toFixed(
precision
)}`
}
/** @public */
export function useUrlState(changeUrl: (params: Params) => void) {
const app = useApp()
const onChangeUrl = useEvent(changeUrl)
// Load initial data
useEffect(() => {
if (!app) return
const url = new URL(location.href)
if (url.searchParams.has(PARAMS.viewport)) {
const newViewportRaw = url.searchParams.get(PARAMS.viewport)
if (newViewportRaw) {
try {
const viewport = viewportFromString(newViewportRaw)
const { x, y, w, h } = viewport
const { w: sw, h: sh } = app.viewportScreenBounds
const zoom = clamp(Math.min(sw / w, sh / h), MIN_ZOOM, MAX_ZOOM)
app.setCamera(-x + (sw - w * zoom) / 2 / zoom, -y + (sh - h * zoom) / 2 / zoom, zoom)
} catch (err) {
console.error(err)
}
}
}
if (url.searchParams.has(PARAMS.page)) {
const newPageId = url.searchParams.get(PARAMS.page)
if (newPageId) {
if (app.store.has(newPageId as TLPageId)) {
app.setCurrentPageId(newPageId as TLPageId)
}
}
}
const handleChange = debounce((viewport: Box2dModel, pageId: TLPageId) => {
if (!viewport) return
if (!pageId) return
onChangeUrl({ [PARAMS.viewport]: viewportToString(viewport), [PARAMS.page]: pageId })
}, 500)
const unsubscribe = react('urlState', () => {
handleChange(app.viewportPageBounds, app.currentPageId)
})
return () => {
handleChange.cancel()
unsubscribe()
}
}, [app, onChangeUrl])
}