dion Posts - Answer Overflow

dion

Explore posts from servers

•Created by dion on 6/26/2024 in #help

Possible bug with nested query + reverse access

I have a pretty nested query.

// fails
const result = await tx.query.projectinternalcost.findMany({
  with: {
    projectinternalcostitem: {
      with: {
          projecttransactionitems: {
              with: {
              projecttransaction: true //<- reverse many-to-one relation
              }
          },
          itemcategory: true
     },
  }
});

// fails
const result = await tx.query.projectinternalcost.findMany({
  with: {
    projectinternalcostitem: {
      with: {
          projecttransactionitems: {
              with: {
              projecttransaction: true //<- reverse many-to-one relation
              }
          },
          itemcategory: true
     },
  }
});

It results in this error:

[0]   code: '42703',
[0]   detail: 'There is a column named "projecttransaction_id" in table "project_projectinternalcosts_projectinternalcostitems_projecttr", but it cannot be referenced from this part of the query.',
[0]   hint: 'To reference that column, you must mark this subquery with LATERAL.',

[0]   code: '42703',
[0]   detail: 'There is a column named "projecttransaction_id" in table "project_projectinternalcosts_projectinternalcostitems_projecttr", but it cannot be referenced from this part of the query.',
[0]   hint: 'To reference that column, you must mark this subquery with LATERAL.',

I can make the query work if i go one level down:

// works
const result = await tx.query.projectinternalcostitem.findMany({
  with: {
    projecttransactionitems: {
      with: {
    projecttransaction: true
       }
    },
    itemcategory: true
    }
});

// works
const result = await tx.query.projectinternalcostitem.findMany({
  with: {
    projecttransactionitems: {
      with: {
    projecttransaction: true
       }
    },
    itemcategory: true
    }
});

Or alternatively if i remove the reverse access:

// works
const result = await tx.query.projectinternalcost.findMany({
  with: {
    projectinternalcostitem: {
      with: {
          projecttransactionitems: true,
          itemcategory: true
     },
  }
});

// works
const result = await tx.query.projectinternalcost.findMany({
  with: {
    projectinternalcostitem: {
      with: {
          projecttransactionitems: true,
          itemcategory: true
     },
  }
});

Hope you guys can assist me with this!

3 replies

RRefine

•Created by foreign-sapphire on 6/4/2024 in #ask-any-question

Bearer token for keycloak

Hi, am a little lost with the documentation as there doesn't seem to be much information on how the login works for the keycloak abstraction. This was what my project was generated with:

    const authProvider: AuthProvider = {
        login: async () => {
            signIn('keycloak', {
                callbackUrl: to ? to.toString() : '/',
                redirect: true
            });

            return {
                success: true
            };
        },
        logout: async () => {
            signOut({
                redirect: true,
                callbackUrl: '/login'
            });

            return {
                success: true
            };
        },
        onError: async (error) => {
            if (error.response?.status === 401) {
                return {
                    logout: true
                };
            }

            return {
                error
            };
        },
        check: async () => {
            if (status === 'unauthenticated') {
                return {
                    authenticated: false,
                    redirectTo: '/login'
                };
            }

            return {
                authenticated: true
            };
        },
        getPermissions: async () => {
            return null;
        },
        getIdentity: async () => {
            if (data?.user) {
                const { user } = data;
                return {
                    name: user.name,
                    avatar: user.image
                };
            }

            return null;
        }
    };

    const authProvider: AuthProvider = {
        login: async () => {
            signIn('keycloak', {
                callbackUrl: to ? to.toString() : '/',
                redirect: true
            });

            return {
                success: true
            };
        },
        logout: async () => {
            signOut({
                redirect: true,
                callbackUrl: '/login'
            });

            return {
                success: true
            };
        },
        onError: async (error) => {
            if (error.response?.status === 401) {
                return {
                    logout: true
                };
            }

            return {
                error
            };
        },
        check: async () => {
            if (status === 'unauthenticated') {
                return {
                    authenticated: false,
                    redirectTo: '/login'
                };
            }

            return {
                authenticated: true
            };
        },
        getPermissions: async () => {
            return null;
        },
        getIdentity: async () => {
            if (data?.user) {
                const { user } = data;
                return {
                    name: user.name,
                    avatar: user.image
                };
            }

            return null;
        }
    };

I am also utilizing a simple-rest server.

'use client';

import dataProviderSimpleRest from '@refinedev/simple-rest';

const API_URL = 'http://localhost:3000/api';

export const dataProvider = dataProviderSimpleRest(API_URL);

'use client';

import dataProviderSimpleRest from '@refinedev/simple-rest';

const API_URL = 'http://localhost:3000/api';

export const dataProvider = dataProviderSimpleRest(API_URL);

Where does it store the auth token? And how can i pass this auth token in my simple-rest provider?

5 replies

DTDrizzle Team

•Created by dion on 3/15/2024 in #help

drizzle-zod not infering jsonb type properly

I have the following table

export const dataQueryRun = pgTable('data_query_run', {
    ...
    parameters: jsonb('parameters').notNull().$type<Record<string, unknown>>(),
        ...
});

export const dataQueryRun = pgTable('data_query_run', {
    ...
    parameters: jsonb('parameters').notNull().$type<Record<string, unknown>>(),
        ...
});

And i use drizzle-zod to do the following types:

const selectDataQueryRunSchema = createSelectSchema(dataQueryRun, {
    logs: z.array(z.string())
});
export type TDataQueryRun = z.infer<typeof selectDataQueryRunSchema>;

const selectDataQueryRunSchema = createSelectSchema(dataQueryRun, {
    logs: z.array(z.string())
});
export type TDataQueryRun = z.infer<typeof selectDataQueryRunSchema>;

I get this:

type TDataQueryRun = {
   ...
    parameters: ((string | number | boolean | {
        [key: string]: Json;
    } | Json[]) & (string | ... 4 more ... | undefined)) | null;
}

type TDataQueryRun = {
   ...
    parameters: ((string | number | boolean | {
        [key: string]: Json;
    } | Json[]) & (string | ... 4 more ... | undefined)) | null;
}

instead of this:

type TDataQueryRun = {
   ...
    parameters: Record<string,unknown>
}

type TDataQueryRun = {
   ...
    parameters: Record<string,unknown>
}

Does anybody know why and how to fix this?

2 replies

DTDrizzle Team

•Created by dion on 11/28/2023 in #help

Infering custom types

I am following the guide https://orm.drizzle.team/docs/custom-types#examples referenced here to create a custom JSONb schema. However, when i create an insert schema, the customtype field is of zod any

2 replies

SSolidJS

•Created by dion on 11/4/2023 in #support

hydration mismatch when wrapping component in a suspense

I am trying to render a loading ui when data is being collected on the server:

function SectionA(props: { expanded: boolean }) {
  const apps = useRouteData<typeof routeData>();
  return (
     <div>
      <Label>Applications</Label>
      <Suspense fallback={<div>Loading apps...</div>}>
        <For each={apps()} fallback={<div>No apps yet</div>}>
          {(app) => (
            <App app={app}/>
          )}
        </For>
      </Suspense>
     </div>
  );
}

function SectionA(props: { expanded: boolean }) {
  const apps = useRouteData<typeof routeData>();
  return (
     <div>
      <Label>Applications</Label>
      <Suspense fallback={<div>Loading apps...</div>}>
        <For each={apps()} fallback={<div>No apps yet</div>}>
          {(app) => (
            <App app={app}/>
          )}
        </For>
      </Suspense>
     </div>
  );
}

For context this is routeData that i defined on the parent route:

export const routeData = ({ params }: RouteDataArgs) => {
  return createServerData$(
    async ([organizationId], event) => {
      await new Promise((resolve) => setTimeout(resolve, 5000));
      // removed for brievity
      return applications;
    },
    { key: () => [params.id] }
  );
};

export const routeData = ({ params }: RouteDataArgs) => {
  return createServerData$(
    async ([organizationId], event) => {
      await new Promise((resolve) => setTimeout(resolve, 5000));
      // removed for brievity
      return applications;
    },
    { key: () => [params.id] }
  );
};

Observation: 1. When i put a delay of 5 seconds, and reload the page, a GET request is sent to the server the page will show that it's loading for 5 seconds 2. Once the 5 seconds is up, a POST request is sent to that page's routeData, then it loads for another 5 seconds. 3. This is the time when the error below appears. The suspense will now also show the loading fallback.

sidebar.tsx:211 Error: Hydration Mismatch. Unable to find DOM nodes for hydration key: 0-0-0-0-0-0-0-0-0-1-0-0-0-0-0-2-0-0-1-3-0-3-0-f0

sidebar.tsx:211 Error: Hydration Mismatch. Unable to find DOM nodes for hydration key: 0-0-0-0-0-0-0-0-0-1-0-0-0-0-0-2-0-0-1-3-0-3-0-f0

4. Once the 5 seconds is up, then the page now shows the correct data. TLDR, i have two questions: - why is there a total delay of 10 seconds to load the data in when i only put a delay of 5 seconds - why is there a hydration mismatch error

3 replies

SSolidJS

•Created by dion on 11/4/2023 in #support

getting route parameters severside

Is there a way to obtain route parameters on the serversides? I know that we can use useParam on the client, but i wish to fetch some data on the server. Any help would be greatly appreciated!

2 replies

SSolidJS

•Created by dion on 11/2/2023 in #support

whats the use case of routeData and useRouteData

From my understanding, it seems possible to directly get the data needed using ‘createServerData$’ to fetch the data on the server, or is that an anti-pattern? From the docs, it seems that routeData is called once per route, but in most apps that i’ve built, i usually do the data fetching at the component that needs it. I.E, i’ll have pass it down as props.

2 replies

SSolidJS

•Created by dion on 11/2/2023 in #support

How do we determine what's client side code and what's serverside code

As the title say, i'm unsure how to seggregate my code, or the right way to think about this framework. Any resource would help indefinitely! Thanks!

2 replies

TtRPC

•Created by dion on 11/2/2023 in #❓-help

forwarding headers in solidjs

I have a setup with solidstart, and im trying to forward the client headeres to ttrpc. Here's my setup:

// This is not forwarding the client headers.
export const trpc = createTRPCProxyClient<IAppRouter>({
  links: [
    httpBatchLink({
      url: `${getBaseUrl()}/api/trpc`,
      headers() {
        // how to forward client headers?
        const heads = new Map(); // <-- specifically this part
        return Object.fromEntries(heads);
      },
    }),
  ],
});

// This is not forwarding the client headers.
export const trpc = createTRPCProxyClient<IAppRouter>({
  links: [
    httpBatchLink({
      url: `${getBaseUrl()}/api/trpc`,
      headers() {
        // how to forward client headers?
        const heads = new Map(); // <-- specifically this part
        return Object.fromEntries(heads);
      },
    }),
  ],
});

This is how i'm calling the trpc client from my component:

export const routeData = () => {
  return createServerData$(async () => {
    const organizations =
      await trpc.organization.getOrganizationsByUser.query();
    return organizations;
  });
};

const Page: VoidComponent = () => {
  const organizations = useRouteData<typeof routeData>();
  return (
    <div>
      Organizations
    </div>
  );
};

export default Page;

export const routeData = () => {
  return createServerData$(async () => {
    const organizations =
      await trpc.organization.getOrganizationsByUser.query();
    return organizations;
  });
};

const Page: VoidComponent = () => {
  const organizations = useRouteData<typeof routeData>();
  return (
    <div>
      Organizations
    </div>
  );
};

export default Page;

Is there a way to forward the headers received by the handler?

1 replies

SSolidJS

•Created by dion on 11/1/2023 in #support

Request data not consistent between createServerData$ and API route

I have a lucia x trpc x solidstart project setup. TLDR: I'm observing that the event passed to my createServerData$ and the event that is passed to my API handler is different. Here's my project structure:

src
|--auth
|--routes
|  |--(auth)
|  |  |--login.tsx <-- this one has access to the right cookie
|  |-- api
|  |  |--trpc
|  |  |  |--[trpc].ts <-- this one does not have access to the cookie even though login.tsx already has
|--api

src
|--auth
|--routes
|  |--(auth)
|  |  |--login.tsx <-- this one has access to the right cookie
|  |-- api
|  |  |--trpc
|  |  |  |--[trpc].ts <-- this one does not have access to the cookie even though login.tsx already has
|--api

Here's how my API handler for trpc has been setup src/routes/trpc/[trpc].ts

const handler = async ({ request, params }: APIEvent) =>
  {
    const cookie = parseCookie(request.headers.get("Cookie") ?? "");
    console.log(cookie); <-- this logs as {}
  };

export const GET = handler;
export const POST = handler;

const handler = async ({ request, params }: APIEvent) =>
  {
    const cookie = parseCookie(request.headers.get("Cookie") ?? "");
    console.log(cookie); <-- this logs as {}
  };

export const GET = handler;
export const POST = handler;

The cookie here is logged as {} On the other hand, in another route, src/routes/(auth)/signin.ts

export const routeData = () => {
  return createServerData$(async (_, event) => {
    const authRequest = auth.handleRequest(event.request);
    const session = await authRequest.validate();
    const cookie = parseCookie(event.request.headers.get("Cookie") ?? "");
    console.log(cookie); <-- This logs out the auth details
  });
};

const Page = () => {
  return (
    <div class="w-full h-screen items-center flex justify-center">
    ...
    </div>
  );
};

export default Page;

export const routeData = () => {
  return createServerData$(async (_, event) => {
    const authRequest = auth.handleRequest(event.request);
    const session = await authRequest.validate();
    const cookie = parseCookie(event.request.headers.get("Cookie") ?? "");
    console.log(cookie); <-- This logs out the auth details
  });
};

const Page = () => {
  return (
    <div class="w-full h-screen items-center flex justify-center">
    ...
    </div>
  );
};

export default Page;

The console logs out the authentication details. I'm confused as to why this is the behaviour since I thought both routeData and API routes are accessing the same request

2 replies

SSolidJS

•Created by dion on 10/31/2023 in #support

Unable to find modules

Hey guys, new to solidjs and SSR frameworks in general. I'm testing out a solidstart template generated using a community tool called "Create JD app". This allows me to quickly spin up a boilerplate project similar to create-t3-app. The problem is that I'm facing this runtime error:

An error occured while server rendering /:

    Cannot find module '@/server/auth' imported from '......../src/routes/api/auth/[...solidauth].ts'

An error occured while server rendering /:

    Cannot find module '@/server/auth' imported from '......../src/routes/api/auth/[...solidauth].ts'

Doing a build results in the following error:

Error: [vite]: Rollup failed to resolve import "@/utils/trpc" from "........../src/root.tsx". This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`

Error: [vite]: Rollup failed to resolve import "@/utils/trpc" from "........../src/root.tsx". This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`

Here's my vite config file:

import solid from "solid-start/vite";
import { defineConfig } from "vite";
import vercel from "solid-start-vercel";

export default defineConfig(() => {
  return {
    plugins: [solid({ ssr: true, adapter: vercel({ edge: false }) })],
  };
});

import solid from "solid-start/vite";
import { defineConfig } from "vite";
import vercel from "solid-start-vercel";

export default defineConfig(() => {
  return {
    plugins: [solid({ ssr: true, adapter: vercel({ edge: false }) })],
  };
});

I would love to know what is happening, since there's no errors that are being thrown by my editor, not sure of where to start...

3 replies

DTDrizzle Team

•Created by dion on 9/26/2023 in #help

Class inheritance (Inherits keyword)

Is there anyway to easily replicate this behaviour in drizzle?

-- Creating the parent table `person`
CREATE TABLE person (
    id SERIAL PRIMARY KEY,
    name VARCHAR(100),
    birth_date DATE
);

-- Creating the child table `student` which inherits from `person`
CREATE TABLE student (
    grade_level VARCHAR(15)
) INHERITS (person);

-- Creating another child table `staff` which inherits from `person`
CREATE TABLE staff (
    position VARCHAR(50)
) INHERITS (person);

-- Creating the parent table `person`
CREATE TABLE person (
    id SERIAL PRIMARY KEY,
    name VARCHAR(100),
    birth_date DATE
);

-- Creating the child table `student` which inherits from `person`
CREATE TABLE student (
    grade_level VARCHAR(15)
) INHERITS (person);

-- Creating another child table `staff` which inherits from `person`
CREATE TABLE staff (
    position VARCHAR(50)
) INHERITS (person);

Inserting Data:

INSERT INTO student (name, birth_date, grade_level) VALUES ('John Doe', '2000-01-01', 'Sophomore');
INSERT INTO staff (name, birth_date, position) VALUES ('Alice Smith', '1980-05-15', 'Manager');

INSERT INTO student (name, birth_date, grade_level) VALUES ('John Doe', '2000-01-01', 'Sophomore');
INSERT INTO staff (name, birth_date, position) VALUES ('Alice Smith', '1980-05-15', 'Manager');

Querying Data:

SELECT * FROM person;

SELECT * FROM person;

This will return all rows from both student and staff tables.

7 replies

Gaming

Programming