hotshoe
hotshoe
Explore posts from servers
SSolidJSTtRPCDTDrizzle Team
PostsComments
SSolidJS
Created by hotshoe on 12/20/2023 in #support
Beta2: How do I render html attribute server-side
@gh680 , yes, saw that too. question is how to [dynamically] render attributes into root (html) element. SvelteKit provides transformPageChunk to handle this, and Remix give access full tree in root so it's a no-brainer.
4 replies
SSolidJS
Created by hotshoe on 9/23/2023 in #support
root.tsx & cookies
Did a little more reading and this seems to work, but, again, please lmk if a better or prescribed method for accomplishing the same, as this is very common use case. Thanks! 
// root.data.ts
import {
  createServerData$,
  useRequest,
  useServerContext,
} from "solid-start/server";
import { isServer } from "solid-js/web";

export default () => {
  const event = useRequest();
  if (isServer) {
    const cookie = event.request.headers.get("cookie");
    // parse it
    // return parsed cookie val;
  }
};
// root.data.ts
import {
  createServerData$,
  useRequest,
  useServerContext,
} from "solid-start/server";
import { isServer } from "solid-js/web";

export default () => {
  const event = useRequest();
  if (isServer) {
    const cookie = event.request.headers.get("cookie");
    // parse it
    // return parsed cookie val;
  }
};
// root.tsx
const data = useRouteData<T>();

// use it wherever
// root.tsx
const data = useRouteData<T>();

// use it wherever
`
2 replies
SSolidJS
Created by hotshoe on 3/4/2023 in #support
createServerData$ question
So is it correct to have to call the data returned by getRouteData before using it inside the component and, if so, why? Seems like something the framework should handle.
6 replies
SSolidJS
Created by hotshoe on 3/4/2023 in #support
createServerData$ question
I stand corrected, I need to call data() at the start of my component every time, else I get flaky behavior. If I run npm start on refreshed build in stead of npm dev then the data renders only sometimes (e.g., if I refresh page multiple times, renders around 10% of the time).
6 replies
SSolidJS
Created by hotshoe on 3/4/2023 in #support
createServerData$ question
I find it depends. If, instead, I return an array and iterate over it in For loop, then works as as I'd expect (i.e., without needing to call data()). Or, if I change the above example o return an int, then also works as expected. The docs are pretty light on showing how to apply data route data (presumably because it requires little/no explanation) When searching for createServerData examples, I came across this post where author states An important thing to note here is that we had to call user() at the beginning of the component. We need to do that because the route data doesn't get fetched until we call it explicitly. https://tahazsh.com/blog/building-a-solidjs-app-from-scratch/ This seems like an odd pattern to me, if true, and, again, I'm not finding it to be universally true.
6 replies
SSolidJS
Created by hotshoe on 3/3/2023 in #support
get cookie inside $server rpc call
worked like a charm. thank you so much!!!
5 replies
SSolidJS
Created by hotshoe on 3/1/2023 in #support
Can a Solid store contain class objects?
@._rb , Your suggestion works (in a store). Thank you!! The docs discourage usage so I didn't try, but leaves me in no worse shape (from caveat perspective than with Svelte, where everything is 2-way binding) and my use case is special case. Sorry to keep mentioning Svelte, btw, I'm developing my next project using both SK And SS to decide on my metafw of choice going fwd and heavily leaning towards SS -- just wish it was 1.0 then would be easy choice for me, which says a lot about how awesome SS is. Thanks again!
12 replies
SSolidJS
Created by hotshoe on 3/1/2023 in #support
Can a Solid store contain class objects?
Thx for the ptr @romanobro , the video certainly makes it clear that classes are not supported, and I re-checked the docs and found Classes are not wrapped, so objects like Date, HTMLElement, RegExp, Map, Set won't be granularly reactive as properties on a store. so, it seems I glossed over this. Too bad not supported 😦 as this is something Svelte handles by default (although, I much prefer Solid's reactivity model overall).
12 replies
SSolidJS
Created by hotshoe on 2/23/2023 in #support
invalidateAll
Thanks for the quick response. Yes, exactly what I was looking for. Much appreciated!!
4 replies
SSolidJS
Created by hotshoe on 2/21/2023 in #support
Any workarounds or guidance for circular dependency warnings?
I forgot to mention, I did try to externalize the modules in question like so (but has no effect): 
export default defineConfig({
    build: {
        rollupOptions: {
            external: ["@prisma/client", "@aws-sdk/client-s3", "@aws-sdk/s3-request-presigner"]
        }
    },
export default defineConfig({
    build: {
        rollupOptions: {
            external: ["@prisma/client", "@aws-sdk/client-s3", "@aws-sdk/s3-request-presigner"]
        }
    },
Again, realize vite issue but I've had zero luck, but since was I was able to resolve issue for same modules in SvelteKit (as mentioned above), wondering if there's a clean SS workaround.
2 replies
SSolidJS
Created by hotshoe on 2/19/2023 in #support
Breaking out proxied Stores object as a signal (while retaining reactivity)
thx again 🙂
9 replies
SSolidJS
Created by hotshoe on 2/19/2023 in #support
Breaking out proxied Stores object as a signal (while retaining reactivity)
Hi @ofabram , I'm able to get the behavior I'm seeking by calling back with with the proxied state object and using it to mutate using produce. It works well (so nice to have such fine grained control versus C = {...C} on collections!, and it's THE reason I'm hanging in there w/porting my SvelteKit project over to SS, and the transparency). It's not the design I had in mind, which is to call back with a string identifier -- and ignorance shouldn't drive design so that erks me -- but I'm ok for now and should be a much better place to revisit in a couple weeks time - once get more experience w/ Solid. The only selection API I see from docs is createSelector, which has different purpose that my use case (afaict). Is there another selection API to which you're referring? Thanks again!
9 replies
SSolidJS
Created by hotshoe on 2/19/2023 in #support
Breaking out proxied Stores object as a signal (while retaining reactivity)
Hi @ofabram , thanks for getting back! I'll take a closer look and see what I can learn/apply. Appreciate the response and suggestion -- I'll let u know how goes. TY :0)
9 replies
SSolidJS
Created by hotshoe on 2/18/2023 in #support
contextProvider using signal
Ty!! Sorry for the bother., but super appreciated!!
26 replies
SSolidJS
Created by hotshoe on 2/18/2023 in #support
contextProvider using signal
Agggggggh!!!!!
26 replies
SSolidJS
Created by hotshoe on 2/18/2023 in #support
contextProvider using signal
verified html el is reacting ok w/ some test code. 
// root.tsx
... 
export default function Root() {
  const [theme, setTheme] = useTheme();
  const [val, setVal] = createSignal<string>("light");
  return (
    <ThemeProvider>
      {/*
      <Html lang="en" data-theme={theme}> // Fails      
      <Html lang="en" data-theme={val()}> {/* Works! :-) */}
        <Head>
          <Title>SolidStart + AuthJS</Title>
          <Meta charset="utf-8" />
          <Meta name="viewport" content="width=device-width, initial-scale=1" />
        </Head>
        <Body>
          <button
            onClick={() => {
              setVal("dark"); // Works
            }}
          >
// root.tsx
... 
export default function Root() {
  const [theme, setTheme] = useTheme();
  const [val, setVal] = createSignal<string>("light");
  return (
    <ThemeProvider>
      {/*
      <Html lang="en" data-theme={theme}> // Fails      
      <Html lang="en" data-theme={val()}> {/* Works! :-) */}
        <Head>
          <Title>SolidStart + AuthJS</Title>
          <Meta charset="utf-8" />
          <Meta name="viewport" content="width=device-width, initial-scale=1" />
        </Head>
        <Body>
          <button
            onClick={() => {
              setVal("dark"); // Works
            }}
          >
This is really odd, because in index.tsx, same setup and calling pattern, but works 
// index.tsx
import { useTheme } from "~/providers/theme-provider";
...
export default function Home() {
  const [theme, setTheme] = useTheme();
....

  return (
    <main>
      <h1>{theme}</h1> {/* Works!! */}
// index.tsx
import { useTheme } from "~/providers/theme-provider";
...
export default function Home() {
  const [theme, setTheme] = useTheme();
....

  return (
    <main>
      <h1>{theme}</h1> {/* Works!! */}
26 replies
SSolidJS
Created by hotshoe on 2/18/2023 in #support
contextProvider using signal
let me do experiment to see if html reactive or now -- will get back in a few -- ty!
26 replies
SSolidJS
Created by hotshoe on 2/18/2023 in #support
contextProvider using signal
still no luck
26 replies
SSolidJS
Created by hotshoe on 2/18/2023 in #support
contextProvider using signal
y
26 replies