Calhistorian Comments - Answer Overflow

Calhistorian

Posts Comments

SSolidJS

•Created by Calhistorian on 9/17/2023 in #support

Problem duplicating a component navigating with dynamic routing

Nice! I have actually deprecated the feature until I could figure it out. Time to revisit.

5 replies

SSolidJS

•Created by Calhistorian on 2/1/2024 in #support

Placement of Context Providers and Routes (Router 10.10)

I will. Thanks

8 replies

SSolidJS

•Created by Calhistorian on 2/1/2024 in #support

Placement of Context Providers and Routes (Router 10.10)

I don't know if this helps, but for completeness for the thread and others down the line. I can't figure out why one provider works and the others do. Each provider plays a very small role -- settings, UI state, user, and some core shared data. 🤷‍♂️

8 replies

SSolidJS

•Created by Calhistorian on 2/1/2024 in #support

Placement of Context Providers and Routes (Router 10.10)

Interesting, I was just running some tests after doings some refactoring by fetching the provider data in its own component that wraps the <MainWindow> component. app.tsx

return (
  <Provider>
    <MainWindow> // <-- fetching data inside this component and setting to context stores of the providers.
      {props.children}
    </MainWindow>
  </Provider>
)

return (
  <Provider>
    <MainWindow> // <-- fetching data inside this component and setting to context stores of the providers.
      {props.children}
    </MainWindow>
  </Provider>
)

So it seems all the context providers are working except one. The logged output in the console is:

> Object  <-- provider not working
> Proxy(Object) <-- provider working
> Proxy(Object) <-- provider working
> Proxy(Object) <-- provider working
> Proxy(Object) <-- provider working

> Object  <-- provider not working
> Proxy(Object) <-- provider working
> Proxy(Object) <-- provider working
> Proxy(Object) <-- provider working
> Proxy(Object) <-- provider working

Each context is constructed in the exact same way using a Solid Store at its core:

const defaultContext = {...key:values}
const defaultContextValue = [state, methods]
const context = createContext(defaultContextValue)
export const Provider = () => {
  const [state, setState] = createStore(defaultContext)
  const actions = {
    ...methods
    }
  const contextValue = [state, actions]

return (
  <Context.Provider value={contextValue}>
    {props.children}
  </Context.Provider>
  )
}

export const useContext = () => useContext(context);

const defaultContext = {...key:values}
const defaultContextValue = [state, methods]
const context = createContext(defaultContextValue)
export const Provider = () => {
  const [state, setState] = createStore(defaultContext)
  const actions = {
    ...methods
    }
  const contextValue = [state, actions]

return (
  <Context.Provider value={contextValue}>
    {props.children}
  </Context.Provider>
  )
}

export const useContext = () => useContext(context);

8 replies

SSolidJS

•Created by Calhistorian on 2/1/2024 in #support

Placement of Context Providers and Routes (Router 10.10)

Thank you for the suggestion. No. Definitely not. Out of habit, I never destructure props. I know there is a lot of unknowns in the post itself, but my main concern is whether its ok to have the providers wrapping the router. The context providers are where I put the Electron IPC renderer handles and cache data from the main process. I thought perhaps maybe some race condition is an issue, but the evidence just isn't there that I can see. It is a data heavy application which is why I am concerned about having the context providers above the router.

8 replies

SSolidJS

•Created by Calhistorian on 2/1/2024 in #support

Placement of Context Providers and Routes (Router 10.10)

I am unable to access provider data in <Nav> or in route children. However, if I wrap the <HashRouter> in the providers it works just fine. Alternatively, I have added another component within <AppWindow> and fetched the context data in that component, but that doesn't work either. Is it ok to leave the providers above the <Router>? Or am I missing something?

8 replies

SSolidJS

•Created by Silvan on 11/15/2023 in #support

Nested Routing

Well the rest of my message is not necessary - great

9 replies

SSolidJS

•Created by Silvan on 11/15/2023 in #support

Nested Routing

@Silvan I have this precise setup using solid-router Here are the routes

<Route path="/settings" component={Settings}>
  <Route path="/" component={ProfileSettings} />
  <Route path="/accounts" component={AccountSettings} />
  <Route path="/appearance" component={AppearanceSettings} />
  <Route path="/keyboard" component={KeyboardSettings} />
  <Route path="/search" component={SearchSettings} />
  <Route path="/security" component={SecuritySettings} />
  <Route path="/sandbox" component={SandboxSettings} />
  <Route path="/about" component={About} />
  <Route path="/**" component={Error} />
</Route>

<Route path="/settings" component={Settings}>
  <Route path="/" component={ProfileSettings} />
  <Route path="/accounts" component={AccountSettings} />
  <Route path="/appearance" component={AppearanceSettings} />
  <Route path="/keyboard" component={KeyboardSettings} />
  <Route path="/search" component={SearchSettings} />
  <Route path="/security" component={SecuritySettings} />
  <Route path="/sandbox" component={SandboxSettings} />
  <Route path="/about" component={About} />
  <Route path="/**" component={Error} />
</Route>

9 replies

Gaming

Programming