riccardolardi
riccardolardi
Explore posts from servers
TTCTheo's Typesafe Cult
Created by riccardolardi on 6/7/2023 in #questions
React guarantee updated state variable
I see. My usecase is a bit different than in the contrived example I gave. The state is in a context and is checked somewhere else, not directly referenced. It does "seem" to work so far
15 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 6/7/2023 in #questions
React guarantee updated state variable
why?
15 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 6/7/2023 in #questions
React guarantee updated state variable
@barry thanks. Ugly hack would be to use a setTimeout to bypass react state update cycle
15 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 4/22/2023 in #questions
Prisma nested write issue
8 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 4/22/2023 in #questions
Prisma nested write issue
@joerambo sure here you go
prisma.application.create({
data: {
form: {
connect: {
id: input.formId,
},
},
title: input.content["application-title"],
content: input.content,
applicant: {
connectOrCreate: {
where: {
email: input.content["applicant-email"],
},
create: {
fullname: input.content["applicant-fullname"],
email: input.content["applicant-email"],
address: input.content["applicant-address"],
phone: input.content["applicant-phone"],
},
},
},
},
});
prisma.application.create({
data: {
form: {
connect: {
id: input.formId,
},
},
title: input.content["application-title"],
content: input.content,
applicant: {
connectOrCreate: {
where: {
email: input.content["applicant-email"],
},
create: {
fullname: input.content["applicant-fullname"],
email: input.content["applicant-email"],
address: input.content["applicant-address"],
phone: input.content["applicant-phone"],
},
},
},
},
});
8 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 4/22/2023 in #questions
Prisma nested write issue
I figured it out with the help of Prisma support:
When performing a create operation, data is the type of XOR<ApplicationCreateInput,ApplicationUncheckedCreateInput > which means you can either provide ApplicationCreateInput which will have all nested relations specified or you can directly provide the ID as in the case of applicantId field but you can’t mix them. So you will need to use the fields specified in ApplicationUncheckedCreateInput in order to create it. Also, Unchecked input types allow you to perform some operations that Prisma considers dangerous like directly writing foreign keys. Prisma allows you to choose either a safe or an unchecked input type when doing operations like create. In this case, Prisma wants you to perform the create action using the Unchecked input type.
When performing a create operation, data is the type of XOR<ApplicationCreateInput,ApplicationUncheckedCreateInput > which means you can either provide ApplicationCreateInput which will have all nested relations specified or you can directly provide the ID as in the case of applicantId field but you can’t mix them. So you will need to use the fields specified in ApplicationUncheckedCreateInput in order to create it. Also, Unchecked input types allow you to perform some operations that Prisma considers dangerous like directly writing foreign keys. Prisma allows you to choose either a safe or an unchecked input type when doing operations like create. In this case, Prisma wants you to perform the create action using the Unchecked input type.
8 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 4/22/2023 in #questions
Prisma nested write issue
@joerambo the error still remains. I'm completely dazzled why this doesn't work
8 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 3/31/2023 in #questions
Global data fetching
You can't use gSSP / gSP in _app.tsx (where one could pass data down to children or store it in global state for everyone to consume)
10 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 3/31/2023 in #questions
Global data fetching
This makes sense for client-side data fetching but what if I needed the data already on server side to populate the pages / components before getting the response back?
10 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 3/30/2023 in #questions
Basic app architecture question for Auth/session state retrieval & storage
@barry I solved the infinite loop problem using useEffect see my updated original question. Now the question is just about the pattern really. Whether this is a common pattern and if there's a better practice of handling such case
33 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 3/30/2023 in #questions
Basic app architecture question for Auth/session state retrieval & storage
no because it's outside of supabase <SessionContextProvider>. That's why I use the renderless <AuthStateGrabber> component
33 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 3/30/2023 in #questions
Basic app architecture question for Auth/session state retrieval & storage
no. just a different table
33 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 3/30/2023 in #questions
Basic app architecture question for Auth/session state retrieval & storage
it's a renderless component
33 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 3/30/2023 in #questions
Basic app architecture question for Auth/session state retrieval & storage
33 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 3/30/2023 in #questions
Basic app architecture question for Auth/session state retrieval & storage
My point is I'm storing additional user data somewhere else, in a different table whose data is not exposed by any auth helper method
33 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 3/30/2023 in #questions
Basic app architecture question for Auth/session state retrieval & storage
Sorry, I was abstracting away the TS code and did an error. Code is corrected now
33 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 3/30/2023 in #questions
Basic app architecture question for Auth/session state retrieval & storage
The store:
export interface AuthStore {
session: Session | null;
profile: Profile | null;
setAuthData: (session: Session | null, profile: Profile | null) => void;
}

export const useAuthStore = create<AuthStore>()((set, get) => ({
session: null,
profile: null,
setAuthData: (session, profile) => set(() => ({ session, profile })),
}));
export interface AuthStore {
session: Session | null;
profile: Profile | null;
setAuthData: (session: Session | null, profile: Profile | null) => void;
}

export const useAuthStore = create<AuthStore>()((set, get) => ({
session: null,
profile: null,
setAuthData: (session, profile) => set(() => ({ session, profile })),
}));
33 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 3/30/2023 in #questions
Basic app architecture question for Auth/session state retrieval & storage
My first implementation looks like this:
// _app.tsx
import { useAuth } from "~/store";

const AuthStateGrabber = () => {
const session = useSession();
const profile =
api.profiles.getById.useQuery({ id: session?.user.id }).data || null;
const setAuthData = useAuth((state) => state.setAuthData);

useEffect(() => {
setAuthData(session, profile);
}, [session, profile, setAuthData]);

return null;
};

const MyApp: AppType<{
initialSession: Session;
}> = ({ Component, pageProps }) => {
const [supabaseClient] = useState(() => createBrowserSupabaseClient());

return (
<SessionContextProvider
supabaseClient={supabaseClient}
initialSession={pageProps.initialSession}
>
<AuthStateGrabber />
<LayoutDefault>
<Component {...pageProps} />
</LayoutDefault>
</SessionContextProvider>
);
};

export default api.withTRPC(MyApp);
// _app.tsx
import { useAuth } from "~/store";

const AuthStateGrabber = () => {
const session = useSession();
const profile =
api.profiles.getById.useQuery({ id: session?.user.id }).data || null;
const setAuthData = useAuth((state) => state.setAuthData);

useEffect(() => {
setAuthData(session, profile);
}, [session, profile, setAuthData]);

return null;
};

const MyApp: AppType<{
initialSession: Session;
}> = ({ Component, pageProps }) => {
const [supabaseClient] = useState(() => createBrowserSupabaseClient());

return (
<SessionContextProvider
supabaseClient={supabaseClient}
initialSession={pageProps.initialSession}
>
<AuthStateGrabber />
<LayoutDefault>
<Component {...pageProps} />
</LayoutDefault>
</SessionContextProvider>
);
};

export default api.withTRPC(MyApp);
33 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 3/24/2023 in #questions
Best practice for Tailwind class merging? twMerge?
@mattddean thanks - may I ask whether you know why using twMerge directly doesn't work in T3?
4 replies
TTCTheo's Typesafe Cult
Created by riccardolardi on 3/24/2023 in #questions
Server Side Redirect based on tRPC/Prisma query
Ok thanks a lot I'll check it out!
10 replies