digital-asset/daml
1
1
Fork 0
mirror of https://github.com/digital-asset/daml.git synced 2024-09-20 01:07:18 +03:00
Code Issues Projects Releases Wiki Activity

@daml/react: Initialize loading indicators of hooks with true (#6196)

Browse Source 
Having them set to `false` when they will immediately bet set to `true`
does not make too much sense. This allows for simplifying uses of
`useFetchByKey` where the key is know to always be present since you
can now operate under the assumption that the contract is never `null`
when the loading indicator is `false`.

This fixes #6171.

CHANGELOG_BEGIN
- @daml/react: Initialize the loading indicators of ``useQuery``,
  ``useFetchByKey`` and their streaming variants with ``true``. This
  removes a glitch where the loading indicator was ``false`` for a very
  brief moment when components using these hooks were mounted although
  no data had been loaded yet. Code using these hooks does not need to
  adapted in response to this change.
CHANGELOG_END
This commit is contained in:
Martin Huschenbett 2020-06-03 12:52:36 +02:00 committed by GitHub
parent 8fa28023e2
commit d637e4fa7f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
language-support/ts/daml-react/hooks.ts
View File

@ -71,7 +71,7 @@ export function useQuery<T extends object, K, I extends string>(template: Templa
export function useQuery<T extends object, K, I extends string>(template: Template<T, K, I>): QueryResult<T, K, I>
export function useQuery<T extends object, K, I extends string>(template: Template<T, K, I>, queryFactory?: () => Query<T>, queryDeps?: readonly unknown[]): QueryResult<T, K, I> {
const state = useDamlState();
const [result, setResult] = useState<QueryResult<T, K, I>>({contracts: [], loading: false});
const [result, setResult] = useState<QueryResult<T, K, I>>({contracts: [], loading: true});
useEffect(() => {
setResult({contracts: [], loading: true});
const query = queryFactory ? queryFactory() : undefined;
@ -115,7 +115,7 @@ export type FetchResult<T extends object, K, I extends string> = {
*/
export function useFetchByKey<T extends object, K, I extends string>(template: Template<T, K, I>, keyFactory: () => K, keyDeps: readonly unknown[]): FetchResult<T, K, I> {
const state = useDamlState();
const [result, setResult] = useState<FetchResult<T, K, I>>({contract: null, loading: false});
const [result, setResult] = useState<FetchResult<T, K, I>>({contract: null, loading: true});
useEffect(() => {
const key = keyFactory();
setResult({contract: null, loading: true});
@ -147,7 +147,7 @@ export function useFetchByKey<T extends object, K, I extends string>(template: T
export function useStreamQuery<T extends object, K, I extends string>(template: Template<T, K, I>, queryFactory: () => Query<T>, queryDeps: readonly unknown[]): QueryResult<T, K, I>
export function useStreamQuery<T extends object, K, I extends string>(template: Template<T, K, I>): QueryResult<T, K, I>
export function useStreamQuery<T extends object, K, I extends string>(template: Template<T, K, I>, queryFactory?: () => Query<T>, queryDeps?: readonly unknown[]): QueryResult<T, K, I> {
const [result, setResult] = useState<QueryResult<T, K, I>>({contracts: [], loading: false});
const [result, setResult] = useState<QueryResult<T, K, I>>({contracts: [], loading: true});
const state = useDamlState();
useEffect(() => {
setResult({contracts: [], loading: true});
@ -183,7 +183,7 @@ export function useStreamQuery<T extends object, K, I extends string>(template:
* @return The matching (unique) contract.
*/
export function useStreamFetchByKey<T extends object, K, I extends string>(template: Template<T, K, I>, keyFactory: () => K, keyDeps: readonly unknown[]): FetchResult<T, K, I> {
const [result, setResult] = useState<FetchResult<T, K, I>>({contract: null, loading: false});
const [result, setResult] = useState<FetchResult<T, K, I>>({contract: null, loading: true});
const state = useDamlState();
useEffect(() => {
setResult({contract: null, loading: true});