From 19df8cca8f4d5eff776ea477b57c8e53c989f62e Mon Sep 17 00:00:00 2001 From: Alessio Koci Date: Thu, 16 Apr 2020 14:35:14 +0200 Subject: [PATCH 1/6] Update issue templates --- .github/ISSUE_TEMPLATE/bug_report.md | 32 ++++++++++++++++++++++ .github/ISSUE_TEMPLATE/feature_request.md | 20 ++++++++++++++ .github/ISSUE_TEMPLATE/generic-question.md | 10 +++++++ 3 files changed, 62 insertions(+) create mode 100644 .github/ISSUE_TEMPLATE/bug_report.md create mode 100644 .github/ISSUE_TEMPLATE/feature_request.md create mode 100644 .github/ISSUE_TEMPLATE/generic-question.md diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md new file mode 100644 index 0000000..23208b9 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/bug_report.md @@ -0,0 +1,32 @@ +--- +name: Bug report +about: Create a report to help us improve +title: '' +labels: bug +assignees: '' + +--- + +**[Required] Describe the bug** +A clear and concise description of what the bug is. + +**[Optional] To Reproduce** +Steps to reproduce the behavior: +1. Go to '...' +2. Click on '....' +3. Scroll down to '....' +4. See error + +**[Required] Expected behavior** +A clear and concise description of what you expected to happen. + +**[Optional] Screenshots** + If applicable, add screenshots to help explain your problem. + +**[Optional] Device (please complete the following information):** + - OS: [e.g. iOS, Android, Windows] + - Browser [e.g. chrome, safari] + - Version [e.g. 2.0.0] + +**[Optional] context** +Add any other context about the problem here. diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md new file mode 100644 index 0000000..895cc91 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/feature_request.md @@ -0,0 +1,20 @@ +--- +name: Feature request +about: Suggest an idea for this project +title: '' +labels: enhancement +assignees: '' + +--- + +**Is your feature request related to a problem? Please describe.** +A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] + +**Describe the solution you'd like** +A clear and concise description of what you want to happen, with an example or pseudo code + +**Describe alternatives you've considered** +A clear and concise description of any alternative solutions or features you've considered. + +**Additional context** +Add any other context or screenshots about the feature request here. diff --git a/.github/ISSUE_TEMPLATE/generic-question.md b/.github/ISSUE_TEMPLATE/generic-question.md new file mode 100644 index 0000000..3daf940 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/generic-question.md @@ -0,0 +1,10 @@ +--- +name: Generic Question +about: A generic question +title: '' +labels: question +assignees: '' + +--- + + From 851bdf853d33deeaf942d7273df6c164601355e9 Mon Sep 17 00:00:00 2001 From: Alessio Koci Date: Wed, 22 Apr 2020 22:41:49 +0200 Subject: [PATCH 2/6] feat: add worker controller with reactive status --- src/useWorker.ts | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/src/useWorker.ts b/src/useWorker.ts index 410cf7b..031f0fc 100644 --- a/src/useWorker.ts +++ b/src/useWorker.ts @@ -3,6 +3,11 @@ import createWorkerBlobUrl from './lib/createWorkerBlobUrl' import WORKER_STATUS from './lib/status' import { useDeepCallback } from './hook/useDeepCallback' +type WorkerController = { + status: WORKER_STATUS; + kill: Function; +} + type Options = { timeout?: number; dependencies?: string[]; @@ -120,6 +125,11 @@ export const useWorker = any>( return callWorker(...fnArgs) }, [callWorker]) + const workerController = { + status: workerStatus, + kill: killWorker, + } + React.useEffect(() => { worker.current = generateWorker() }, [generateWorker]) @@ -129,6 +139,6 @@ export const useWorker = any>( }, [killWorker]) return [ - workerHook, workerStatus, killWorker, - ] as [typeof workerHook, WORKER_STATUS, typeof killWorker] + workerHook, workerController, + ] as [typeof workerHook, WorkerController] } From 5c469b432cdbb0814a19c3a4f411ff882ff48d1f Mon Sep 17 00:00:00 2001 From: Alessio Koci Date: Wed, 22 Apr 2020 22:42:35 +0200 Subject: [PATCH 3/6] chore: update examples --- example/src/pages/Csv/index.js | 2 +- example/src/pages/ExternalScripts/index.js | 3 ++- example/src/pages/Sorting/index.js | 5 ++++- 3 files changed, 7 insertions(+), 3 deletions(-) diff --git a/example/src/pages/Csv/index.js b/example/src/pages/Csv/index.js index 25aae1a..202aec5 100644 --- a/example/src/pages/Csv/index.js +++ b/example/src/pages/Csv/index.js @@ -12,7 +12,7 @@ function App() { const [csvStatus, setCsvStatus] = React.useState(false); const [generateWorker] = useWorker(generateCsv); - const [csvWorker, csvWorkerStatus, killWorker] = useWorker(csvToJson); + const [csvWorker, { status: csvWorkerStatus, kill: killWorker }] = useWorker(csvToJson); React.useEffect(()=>{ console.log("WORKER:", csvWorkerStatus); diff --git a/example/src/pages/ExternalScripts/index.js b/example/src/pages/ExternalScripts/index.js index 4450e85..2f73da5 100644 --- a/example/src/pages/ExternalScripts/index.js +++ b/example/src/pages/ExternalScripts/index.js @@ -14,7 +14,8 @@ function App() { const { addToast } = useToasts(); const [sortStatus, setSortStatus] = React.useState(false); - const [sortWorker, sortWorkerStatus, killWorker] = useWorker(sortDates, { + + const [sortWorker, { status: sortWorkerStatus, kill: killWorker }] = useWorker(sortDates, { autoTerminate: false, // you should manually kill the worker using "killWorker()" dependencies: [ "https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.30.1/date_fns.js" diff --git a/example/src/pages/Sorting/index.js b/example/src/pages/Sorting/index.js index b2920f8..d0abcb7 100644 --- a/example/src/pages/Sorting/index.js +++ b/example/src/pages/Sorting/index.js @@ -14,7 +14,10 @@ function App() { const { addToast } = useToasts(); const [sortStatus, setSortStatus] = React.useState(false); - const [sortWorker, sortWorkerStatus, killWorker] = useWorker(bubleSort); + const [sortWorker, { + status: sortWorkerStatus, + kill: killWorker + }] = useWorker(bubleSort); React.useEffect(()=>{ console.log("WORKER:", sortWorkerStatus); From eed158e5c17c2f9697ae412c66f3fa303a6ed4df Mon Sep 17 00:00:00 2001 From: Alessio Koci Date: Sat, 25 Apr 2020 10:03:11 +0200 Subject: [PATCH 4/6] docs: rename dependencies with remoteDepsParser --- website/docs/examples/external.md | 2 +- website/docs/useworker.md | 12 ++++++------ 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/website/docs/examples/external.md b/website/docs/examples/external.md index 536a504..100d045 100644 --- a/website/docs/examples/external.md +++ b/website/docs/examples/external.md @@ -25,7 +25,7 @@ title: External Scripts const [sortWorker, sortWorkerStatus, killWorker] = useWorker(sortDates, { timeout: 5000, - dependencies: [ + remoteDependencies: [ "https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.30.1/date_fns.js" ] }); diff --git a/website/docs/useworker.md b/website/docs/useworker.md index 7c08fa7..0fed1f0 100644 --- a/website/docs/useworker.md +++ b/website/docs/useworker.md @@ -35,16 +35,16 @@ to view the values of `WORKER_STATUS` click here: [Status API](./workerstatus.md import { useWorker } from "@koale/useworker"; const [workerFn, workerStatus, workerTerminate] = useWorker(fn, { timeout: undefined, - dependencies: [] + remoteDependencies: [] }); ``` ## Options API -| Value | Type | Default | Description | -| ------------ | --------------- | --------- | ------------------------------------------------------------------------- | -| timeout | Number | undefined | the number of milliseconds before killing the worker | -| dependencies | Array of String | [] | an array that contains the external dependencies needed to run the worker | +| Value | Type | Default | Description | +| ------------------ | --------------- | --------- | ------------------------------------------------------------------------- | +| timeout | Number | undefined | the number of milliseconds before killing the worker | +| remoteDependencies | Array of String | [] | an array that contains the remote dependencies needed to run the worker | ## Options Example @@ -55,7 +55,7 @@ const fn = dates => dates.sort(dateFns.compareAsc) const [workerFn, workerStatus, workerTerminate] = useWorker(fn, { timeout: 50000 // 5 seconds - dependencies: [ + remoteDependencies: [ "https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.30.1/date_fns.js" // dateFns ] }); From c3585a25229ad7ae0cbc0d3a5b760ad262151c7e Mon Sep 17 00:00:00 2001 From: Alessio Koci Date: Sat, 25 Apr 2020 10:03:30 +0200 Subject: [PATCH 5/6] chore: rename dependencies with remoteDepsParser --- example/src/pages/ExternalScripts/index.js | 2 +- src/lib/createWorkerBlobUrl.ts | 4 ++-- src/lib/{depsParser.ts => remoteDepsParser.ts} | 8 ++++---- src/useWorker.ts | 8 ++++---- 4 files changed, 11 insertions(+), 11 deletions(-) rename src/lib/{depsParser.ts => remoteDepsParser.ts} (59%) diff --git a/example/src/pages/ExternalScripts/index.js b/example/src/pages/ExternalScripts/index.js index 2f73da5..c4c8cb0 100644 --- a/example/src/pages/ExternalScripts/index.js +++ b/example/src/pages/ExternalScripts/index.js @@ -17,7 +17,7 @@ function App() { const [sortWorker, { status: sortWorkerStatus, kill: killWorker }] = useWorker(sortDates, { autoTerminate: false, // you should manually kill the worker using "killWorker()" - dependencies: [ + remoteDependencies: [ "https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.30.1/date_fns.js" ], }); diff --git a/src/lib/createWorkerBlobUrl.ts b/src/lib/createWorkerBlobUrl.ts index 44217e0..bb3fe16 100644 --- a/src/lib/createWorkerBlobUrl.ts +++ b/src/lib/createWorkerBlobUrl.ts @@ -1,5 +1,5 @@ import jobRunner from './jobRunner' -import depsParser from './depsParser' +import remoteDepsParser from './remoteDepsParser' /** * Converts the "fn" function into the syntax needed to be executed within a web worker @@ -16,7 +16,7 @@ import depsParser from './depsParser' * .catch(postMessage(['ERROR', error])" */ const createWorkerBlobUrl = (fn: Function, deps: string[]) => { - const blobCode = `${depsParser(deps)}; onmessage=(${jobRunner})(${fn})` + const blobCode = `${remoteDepsParser(deps)}; onmessage=(${jobRunner})(${fn})` const blob = new Blob([blobCode], { type: 'text/javascript' }) const url = URL.createObjectURL(blob) return url diff --git a/src/lib/depsParser.ts b/src/lib/remoteDepsParser.ts similarity index 59% rename from src/lib/depsParser.ts rename to src/lib/remoteDepsParser.ts index 3e9dc4a..fea68c6 100644 --- a/src/lib/depsParser.ts +++ b/src/lib/remoteDepsParser.ts @@ -1,6 +1,6 @@ /** * - * Concatenates the dependencies into a comma separated string. + * Concatenates the remote dependencies into a comma separated string. * this string will then be passed as an argument to the "importScripts" function * * @param {Array.}} deps array of string @@ -8,13 +8,13 @@ * elements "deps" and "importScripts". * * @example - * depsParser(['demo1', 'demo2']) // return importScripts('demo1, demo2') + * remoteDepsParser(['http://js.com/1.js', 'http://js.com/2.js']) // return importScripts('http://js.com/1.js, http://js.com/2.js') */ -const depsParser = (deps: string[]) => { +const remoteDepsParser = (deps: string[]) => { if (deps.length === 0) return '' const depsString = (deps.map(dep => `${dep}`)).toString() return `importScripts('${depsString}')` } -export default depsParser +export default remoteDepsParser diff --git a/src/useWorker.ts b/src/useWorker.ts index 031f0fc..e4f385b 100644 --- a/src/useWorker.ts +++ b/src/useWorker.ts @@ -10,7 +10,7 @@ type WorkerController = { type Options = { timeout?: number; - dependencies?: string[]; + remoteDependencies?: string[]; autoTerminate?: boolean; } @@ -18,7 +18,7 @@ const PROMISE_RESOLVE = 'resolve' const PROMISE_REJECT = 'reject' const DEFAULT_OPTIONS: Options = { timeout: undefined, - dependencies: [], + remoteDependencies: [], autoTerminate: true, } @@ -65,11 +65,11 @@ export const useWorker = any>( const generateWorker = useDeepCallback(() => { const { - dependencies = DEFAULT_OPTIONS.dependencies, + remoteDependencies = DEFAULT_OPTIONS.remoteDependencies, timeout = DEFAULT_OPTIONS.timeout, } = options - const blobUrl = createWorkerBlobUrl(fn, dependencies!) + const blobUrl = createWorkerBlobUrl(fn, remoteDependencies!) const newWorker: Worker & { _url?: string } = new Worker(blobUrl) newWorker._url = blobUrl From c149441828e8ae86ad7837bfec0771a290feb087 Mon Sep 17 00:00:00 2001 From: Alessio Koci Date: Fri, 1 May 2020 12:41:27 +0200 Subject: [PATCH 6/6] chore: update 3.0.0-beta.3 --- package-lock.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index 9a77c3c..d87624e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "@koale/useworker", - "version": "3.0.0-beta.2", + "version": "3.0.0-beta.3", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index dd93005..c5ee22c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@koale/useworker", - "version": "3.0.0-beta.2", + "version": "3.0.0-beta.3", "types": "dist/index.d.ts", "source": "src/index.ts", "main": "dist/index.js",