plugins: HFS.debounceAsync + .useSnapState + .html
Massimo Melina committed
Jun 5, 2024 at 09:57 UTC
eff0f236ac8fed2911d499cb32229eb240769d37
3 files changed
+17
-6
dev-plugins.md
+10
-3
@@ -218,11 +218,12 @@ The HFS objects contains many properties:
218
- `reloadList`
219
- `logout`
220
- `prefixUrl: string` normally an empty string, it will be set in case a [reverse-proxy wants to mount HFS on a path](https://github.com/rejetto/hfs/wiki/Reverse-proxy).
221
-- `state` [object with many values in it](https://github.com/rejetto/hfs/blob/main/frontend/src/state.ts)
221
+- `state: StateObject` [object with many values in it](https://github.com/rejetto/hfs/blob/main/frontend/src/state.ts)
222
- `watchState: (key: string, callback)=>function`
223
- watch the `key` property of the state object above
224
- `callback(newValue)` will be called at each change
225
- use returned callback to stop watching
226
+- `useSnapState: () => StateObject` React hook version of the `state` object above
227
- `React` whole React object, as for `require('react')` (JSX syntax is not supported here)
228
- `h` shortcut for React.createElement
229
- `t` [translator function](https://github.com/rejetto/hfs/blob/main/frontend/src/i18n.ts)
@@ -232,13 +233,16 @@ The HFS objects contains many properties:
233
- `ToastType = 'error' | 'warning' | 'info' | 'success'`
234
- `dialogLib` this exposes all functions available in [dialog.ts](https://github.com/rejetto/hfs/blob/main/frontend/src/dialog.ts), for example alertDialog and newDialog. These are not documented yet, and subject to change without notification, but you can study the sources if you are interested in using them.
235
- `misc` many functions and constants available in [cross.ts](https://github.com/rejetto/hfs/blob/main/src/cross.ts). These are not documented, probably never will, and are subject to change without notifications, but you can study the sources if you are interested in using them.
235
-- `navigate: (uri: string): void` use this if you have to change the page address without causing reload
236
+- `navigate: (uri: string) => void` use this if you have to change the page address without causing reload
237
- `emit: (name: string, params?: object) => any[]` use this to emit a custom event. Prefix name with your plugin name to avoid conflicts.
238
- `Icon: ReactComponent` Properties:
239
- `name: string` refer to file `icons.ts` for names, but you can also enter an emoji instead.
240
- `useBatch: (worker, job) => any`
241
- `getNotifications(channel: string, cb: (eventName: string, data:any) => void)`
242
receive messages when the backend uses `notifyClient` on the same channel.
243
+- `html: (html: string) => ReactNode` convert html code to React
244
+- `debounceAsync: function` like lodash.debounce, but also avoids async invocations to overlap.
245
+ For details please refer to `src/debounceAsync.ts`.
246
247
The following properties are accessible only immediately at top-level; don't call it later in a callback.
248
- `getPluginConfig()` returns object of all config keys that are declared frontend-accessible by this plugin.
@@ -574,7 +578,7 @@ If you want to override a text regardless of the language, use the special langu
578
579
## API version history
580
577
-- 8.84 (v0.53.0)
581
+- 8.85 (v0.53.0)
582
- api.openDb
583
- frontend event: menuZip
584
- config.type:username
@@ -582,6 +586,9 @@ If you want to override a text regardless of the language, use the special langu
586
- frontend event "fileMenu": changed props format
587
- api.getConfig() without parameters
588
- api.notifyClient + HFS.getNotifications
589
+ - HFS.html
590
+ - HFS.useSnapState
591
+ - HFS.debounceAsync
592
- 8.72 (v0.52.0)
593
- HFS.toast
594
- HFS.misc functions
frontend/src/misc.ts
+6
-2
@@ -4,10 +4,10 @@ import React, { createElement as h } from 'react'
4
import { Spinner } from './components'
5
import { newDialog, toast } from './dialog'
6
import { Icon } from './icons'
7
-import { Dict, getHFS, HTTP_MESSAGES, useBatch } from '@hfs/shared'
7
+import { Dict, getHFS, Html, HTTP_MESSAGES, useBatch } from '@hfs/shared'
8
import * as misc from '../../src/cross'
9
import { apiCall, getNotifications, useApi } from '@hfs/shared/api'
10
-import { state } from './state'
10
+import { state, useSnapState } from './state'
11
import { t } from './i18n'
12
import * as dialogLib from './dialog'
13
import _ from 'lodash'
@@ -16,6 +16,7 @@ import { logout } from './login'
16
import { subscribeKey } from 'valtio/utils'
17
import { uploadState } from './upload'
18
import { fileShow } from './show'
19
+import { debounceAsync } from '../../src/debounceAsync'
20
export * from '@hfs/shared'
21
22
export function err2msg(err: number | Error) {
@@ -67,6 +68,9 @@ Object.assign(getHFS(), {
68
...tools,
69
emit: hfsEvent,
70
getNotifications,
71
+ debounceAsync,
72
+ useSnapState,
73
+ html: (html: string) => h(Html, {}, html),
74
onEvent(name: string, cb: (params:any, tools: any, output:any) => any) {
75
const key = 'hfs.' + name
76
document.addEventListener(key, wrapper)
src/const.ts
+1
-1
@@ -7,7 +7,7 @@ import { mkdirSync } from 'fs'
7
import { basename, dirname, join } from 'path'
8
export * from './cross-const'
9
10
-export const API_VERSION = 8.84
10
+export const API_VERSION = 8.85
11
export const COMPATIBLE_API_VERSION = 1 // while changes in the api are not breaking, this number stays the same, otherwise it is made equal to API_VERSION
12
export const HFS_REPO = 'rejetto/hfs'
13