Skip to content

Commit 6f2e9a1

Browse files
committed
[IMPL] usePromiseSuspensible hook
1 parent 185208f commit 6f2e9a1

18 files changed

Lines changed: 335 additions & 10 deletions

apps/react-tools-demo/.eslintrc.cjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ module.exports = {
2323
"react-hooks/exhaustive-deps": [
2424
"warn",
2525
{
26-
"additionalHooks": "(useMemoCompare|useMemoDeepCompare|useCallbackCompare|useCallbackDeepCompare|useLayoutEffectCompare|useLayoutEffectDeepCompare|useInsertionEffectCompare|useInsertionEffectDeepCompare|useEffectCompare|useEffectDeepCompare)"
26+
"additionalHooks": "(useMemoCompare|useMemoDeepCompare|useCallbackCompare|useCallbackDeepCompare|useLayoutEffectCompare|useLayoutEffectDeepCompare|useInsertionEffectCompare|useInsertionEffectDeepCompare|useEffectCompare|useEffectDeepCompare|usePromiseSuspensible)"
2727
}
2828
]
2929
},
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import { Suspense } from "react"
2+
import { usePromiseSuspensible } from "../../../../../../packages/react-tools/src";
3+
4+
/**
5+
The _Delayed_ component uses _usePromiseSuspensible_ to call a promise that resolves with an array of number or reject: if promise has been resolved, array number is rendered, otherwise an alert is invocked. Delayed component is returned from _UsePromiseSuspensible_ component.
6+
*/
7+
const Delayed = () => {
8+
const data = usePromiseSuspensible(() => {
9+
return new Promise<number[]>((res, rej) => {
10+
console.log("called")
11+
setTimeout(() => {
12+
Math.random() > 0.5
13+
? res([1, 2, 3, 4, 5])
14+
: rej();
15+
},4000)
16+
}).catch(() => alert("Error throwed by promise"))
17+
}, []);
18+
19+
return <pre>{JSON.stringify(data)}</pre>;
20+
}
21+
22+
export const UsePromiseSuspensible = () => {
23+
return <Suspense fallback="loading...">
24+
<Delayed/>
25+
</Suspense>
26+
}

apps/react-tools-demo/src/constants/components.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,8 @@ export const COMPONENTS = [
117117
"useMediaDevices",
118118
"useDisplayMedia",
119119
"useWebWorker",
120-
"useWebWorkerFn"
120+
"useWebWorkerFn",
121+
"usePromiseSuspensible"
121122
]
122123
],
123124
//UTILS
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
# alphanumericCompare
2+
Function which, given two strings, the type of comparison to be verified, and optional options, performs the comparison between the two strings and returns a boolean indicating whether the indicated comparison is respected or not.
3+
4+
## API
5+
6+
```tsx
7+
alphanumericCompare(string1: string, string2: string, compareType?: "<" | ">" | "=" | ">=" | "<=", opts?: Intl.CollatorOptions)
8+
```
9+
10+
> ### Params
11+
>
12+
> - __string1__: _string_
13+
first string to compare.
14+
> - __string2__: _string_
15+
second string to compare.
16+
> - __compareType__: _"<" | ">" | "=" | ">=" | "<="_
17+
type of compare to verify.
18+
> - __opts__: _Intl.CollatorOptions_
19+
options object to execute compare.
20+
>
21+
22+
> ### Returns
23+
>
24+
> __result__: boolean that indicates whether the indicated comparison is respected or not.
25+
> - _boolean_
26+
>
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
# convertingStringCase
2+
Function that given a string, a case type, and an optional delimiter, returns the string in the specified case or empty string.
3+
4+
## API
5+
6+
```tsx
7+
convertingStringCase({string, caseType, delimiter}:{ string?: string, caseType: "pascalCase" | "snakeCase" | "kebabCase" | "camelCase", delimiter?: "upperCase" | "lowerCase" | string}): string
8+
```
9+
10+
> ### Params
11+
>
12+
> - __param__: _Object_
13+
object
14+
> - __param.string?__: _string|undefined_
15+
string to the which change case.
16+
> - __param.caseType__: _"pascalCase" | "snakeCase" | "kebabCase" | "camelCase"_
17+
selected case to change string.
18+
> - __param.delemiter?__: _"upperCase" | "lowerCase" | string_
19+
optional delemiter for case that support it.
20+
>
21+
22+
> ### Returns
23+
>
24+
> __result__: string with changed case or empty string.
25+
> - _string_
26+
>
Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
# defaultSerializer
2+
Function to serialize any type of value.
3+
4+
## API
5+
6+
```tsx
7+
defaultSerializer<T>(target: T)
8+
```
9+
10+
> ### Params
11+
>
12+
> - __target__: _T_
13+
>
14+
15+
> ### Returns
16+
>
17+
>
18+
> - _string_
19+
>
Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
# getBase64
2+
Function to obtain a Base64 from value specified if supported, otherwise throw an Error.
3+
4+
## API
5+
6+
```tsx
7+
getBase64<T>(target: string | Blob | ArrayBuffer | HTMLCanvasElement | HTMLImageElement | T | T[], options?: ToDataURLOptions | UseBase64ObjectOptions<T>): Promise<string>
8+
```
9+
10+
> ### Params
11+
>
12+
> - __target__: _target: string | Blob | ArrayBuffer | HTMLCanvasElement | HTMLImageElement | T | T[]_
13+
> - __options?__: _ToDataURLOptions | UseBase64ObjectOptions<T>_
14+
>
15+
16+
> ### Returns
17+
>
18+
>
19+
> - _string_
20+
>
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
# getKeyObjectFromValue
2+
Function that given an object and a value, returns the corrispondent key of this value or undefined.
3+
4+
## API
5+
6+
```tsx
7+
getKeyObjectFromValue<T extends Record<string, unknown>, E extends string|number|symbol = keyof T>(object: T, value?: unknown): E | undefined
8+
```
9+
10+
> ### Params
11+
>
12+
> - __object__: _Record<string,unknown>_
13+
object from which get key by a value.
14+
> - __value__: _unknown_
15+
value of the object
16+
>
17+
18+
> ### Returns
19+
>
20+
> __key__: object key for the given value.
21+
> - _keyof Record<string,unknown>|undefined_
22+
>
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# getObjectFromDottedString
2+
Function that, given a path, a value and an optional object, returns an object with as many properties as there are in the path, assigning the value passed to the last one specified.
3+
4+
## API
5+
6+
```tsx
7+
getObjectFromDottedString<T, E extends Record<string, unknown>>(path: string, value: T, object?: E): E
8+
```
9+
10+
> ### Params
11+
>
12+
> - __path__: _string_
13+
string value separated by dot, indicating that path where assign the passed value.
14+
> - __value__: _unknown_
15+
value to assign to the property specified in path.
16+
> - __object?__: _Record<string,unknown>_
17+
optional object that will be used as start object.
18+
>
19+
20+
> ### Returns
21+
>
22+
> __result__: object create by path and value indicated.
23+
> - _Record<string, unknown>_
24+
>
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# mergeObjects
2+
Function that, given two objects version, merges them into a single one. Via an optional parameter _forceUndefinedValue_ you can define how undefined values are treated.
3+
4+
## API
5+
6+
```tsx
7+
mergeObjects<T extends Record<string,unknown>>(oldObj: T, newObj: RecursivePartial<T>, forceUndefinedValue?: boolean): T
8+
```
9+
10+
> ### Params
11+
>
12+
> - __oldObj__: _Record<string,unknown>_
13+
previous object version.
14+
> - __newObj__: _RecursivePartial<Record<string,unknown>>_
15+
new object version.
16+
> - __forceUndefinedValue=false?__: _boolean_
17+
boolean to indicate how treat undefined value.
18+
>
19+
20+
> ### Returns
21+
>
22+
> __result__: mergedObject
23+
> - _Record<string, unknown>_
24+
>

0 commit comments

Comments
 (0)