toss / suspensive Goto Github PK
View Code? Open in Web Editor NEWPackages to use React Suspense & ErrorBoundary easily (one of Tanstack Query community resources)
Home Page: https://suspensive.org
License: MIT License
Packages to use React Suspense & ErrorBoundary easily (one of Tanstack Query community resources)
Home Page: https://suspensive.org
License: MIT License
Package name: suspensive/react
The test coverage for the AsyncBoundary
component is currently insufficient. The given test case performs a simple rendering test, but there are no tests that verify whether the key features of AsyncBoundary
work properly. Given that AsyncBoundary
is a critical component that manages async loading states and error handling, it's essential that comprehensive tests are in place.
I propose adding tests for the async loading and error handling aspects of the AsyncBoundary
component.
// suspensive test code
import { render } from '@testing-library/react'
describe('test', () => {
it('should test', () => {
const TEST_TEXT = 'suspensive'
const fixture = render(<div>{TEST_TEXT}</div>)
expect(fixture.getByText(TEST_TEXT)).toBeInTheDocument()
})
})
At present, our test code seems to exist only to fulfill the requirement of having test code. What we need is true testing that effectively validates our application's behavior. This will be instrumental in facilitating the next leap forward for our Suspensive service...
useSuspenseQuery
Package name:
@suspensive/react-query
I'm trying to update state from onSuccess
callback of the query this way
const Test = () => {
const [test, setTest] = useState(0);
useSuspensiveQuery({
queryKey: ['some-key'],
queryFn: somePromise,
onSuccess: () => {
setTest(1)
}
})
console.log(test); // it would be 0
}
State should be 1 on success.
See below
docs
Package name:
Package name: @suspensive/react
Implement fixing with compatiable react 17 or under with this library
https://www.npmjs.com/package/use-sync-external-store
react-redux's solution https://github.com/reduxjs/react-redux/blob/master/package.json#L77
Package name: entire package, root typescript version
Type script version 5 was actually released, so it would be good to apply it.
Upgrade entire typescript version
Package name:
Package name:
Package name:
https://docusaurus.io/docs/i18n/introduction
Package name: all
useSuspensiveQuery
Package name:
@suspensive/react-query
If useSuspensiveQuery
has enabled: boolean
param then it means data
may be undefined (DataType: TData | undefined
).
Howerver it is defined despite of enabled
param. It may breaks component if user try to get some inner data like data.someInnerKey
.
Uncaught TypeError: Cannot read properties of undefined
I guess the lib should mark data type as TData | undefined
and status "loading" | "success"
in case useSuspensiveQuery has enabled
param.
Package name:
suspensive/react
broken query triggers boundary but it does not refetch it on the next mount.
Query should be refetched on the second mount of the component
https://github.com/timsofteng/query-boundary-bug
suspensive
branch
steps:
yarn install && yarn dev
Open http://127.0.0.1:5173/one
Click to page two. See an error in query and in boundary.
Click to page one. Page one should be rendered ok.
Click to page two. Boundary is displayed but query does not refetch.
react
Package name: react
docs
Package name: docs
Package name: @suspensive/react
https://www.youngs-log.kr/react-query/query-key-structuring
Package name:
Package name: @suspensive/react-query
Package name:
Package name: @suspensive/react-query
Package name:
docs
Package name:
all
Package name: all
Package name:
Package name:
Package name:
> currently, we use stringified key yet, but next Pull Request, I want to change it suspenseCache's methods need to work with index of key with hierarchy like queryKey of @tanstack/query
I think this is need to be implemented in this Pull Request. so I change this Pull Request as draft. after that, I'll request review
Originally posted by @manudeli in #83 (comment)
Package name:
All the Edit this page
links on every page of the official documentation are incorrect.
For example, the Edit this page
link on Motivation page looks like this:
https://github.com/suspensive/react/docs/intro/motivation.i18n.md
The Edit this page
links in the pages below all come out as 'Not Found'.
Is document i18n
still WIP?
Package name:
Package name: @suspensive/react
Package name: @suspensive/react
all
Package name:
Package name: docs
Package name: @suspensive/react
Package name:
Package name:
Package name: react
Package name:
@suspensive/swr
Package name: swr
Package name:
All
Package name: all
Oh Thanks, you're right. different of isDifferentArray is limited different. I didn't think about this when I created this function. I made it by referring to the comparison operation of dependencyList of useEffect hook.
Isn't there a better name for this function? If there is a better name, I think it would be nice to make it an issue and work on it in the next PR.
It would be nice to change function name, too!
I think we should think of a good name!
Originally posted by @ChanhyukPark-Tech in #28 (comment)
All
Package name: all
Package name:
I'm actually using suspensive well because you provided me a good library. I'm looking forward to it more and more because you're continuing to update new features.
As a library user, I wonder what features have been added depending on the version. It would be nice if we could check the update log and so on somewhere other than PR or commit!
Package name: all
Package name:
Package name:
fallback: ReactNode | ((props: { error: Error; reset: (...args: unknown[]) => void }) => ReactNode)
fallback type has reset prop and it take arg as a factor. but It's not used anywhere
i think it works too
fallback: ReactNode | ((props: { error: Error; reset: () => void }) => ReactNode)
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.