sean Posts - Answer Overflow

sean

•Created by sean on 1/1/2025 in #support

How to use query.set (prev cache.set) to mutate async data for optimistic updates?

i’m trying to use the undocumented query.set to mutate async data for optimistic updates. it works for async data from createAsync that’s reactive to param change. however, when i manually revalidate the data (either by calling revalidate somewhere, or revalidating from an action), it fetches fresh data rather than using the query.set i called earlier when should i use query.set if i’m going use revalidate() in order get the data? calling revalidate is the only way to get the data as my query isn’t reactive to a param change i’m trying to do following

const data = createAsync(() => getData)
const createAction = action(async () => {
    const newData = createData()
    query.set(createData.key, newData)
    return reload({ revalidate: createData.key })
})

const create = useAction(createAction)

await create()

const data = createAsync(() => getData)
const createAction = action(async () => {
    const newData = createData()
    query.set(createData.key, newData)
    return reload({ revalidate: createData.key })
})

const create = useAction(createAction)

await create()

i’m expecting that it doesn’t create a new request, but rather use the data i set using query.set i’m using query.set to avoid fetching getData() again because i already got the same data when i called createData() is my usage correct? how do i properly use it to attain the behavior i described? (sorry for bad formatting, typing on a phone) thank you so much!!!

9 replies

SSolidJS

•Created by sean on 12/12/2024 in #support

Optimistically change URL and state without waiting for async to resolve

I have a list of <A/> in the sidebar. The pages that those <A/> link to have an async data using createAsync. The whole page component is wrapped in a Suspense boundary with a spinner fallback. Current behavior: when clicking a link, the URL and the state (in this case, the activeClass prop in the <A/>) stays the same until the whole request or the async data is resolved. While navigating, the page component displays the fallback spinner as it should, not the URL and and the <A/> state doesn't update. Ideal situation: URL changes and and page state is updated instantaneously without waiting for the request to resolve. Is there a way that the URL and state are automatically changed while navigating?

4 replies

SSolidJS

•Created by sean on 10/30/2024 in #support

How to avoid temporary undefined values in template literals in solid-meta?

In the browser the whole string gets displayed, but the data.name is undefined momentarily until the async data resolves. So the tab title goes from This -> undefined <- is undefined temporarily to This -> hello world <- is undefined temporarily. My intended behavior is that the title should not be displayed at all (or the hostname should be display) until everything in the string literal has resolved. Is there a way to not display the string at all until the data is resolved? Alternatively, is the below code correct - should I be using accessors / derived signals or should be just be using straight string literals (I found this to not be reactive)? I tried wrapping the meta tags with Suspense and I also tried wrapping them with <Show when={data()} /> but to no avail.

import { Meta, Title } from '@solidjs/meta'

const SomeComponent = () => {
  const data = createAsync(() => getData())
  const title = () => `This -> ${data().name} <- is undefined temporarily`
  return (
    <Title>{title()}</Title>
    <Meta property='og:title' content={title()} />
  )
}

import { Meta, Title } from '@solidjs/meta'

const SomeComponent = () => {
  const data = createAsync(() => getData())
  const title = () => `This -> ${data().name} <- is undefined temporarily`
  return (
    <Title>{title()}</Title>
    <Meta property='og:title' content={title()} />
  )
}

Some search engine webmasters tool started to see some undefined values in my strings, so I believe this is not the ideal behavior when it comes to meta tags.

3 replies

Gaming

Programming