Romain
Romain
TTCTheo's Typesafe Cult
Created by Romain on 7/24/2023 in #questions
Migrate from nextjs supabase project to t3 stack
I recently discovered the t3 stack and made a project with it. I love it and I am wondering if it would be a great idea to migrate a current project using Nexjs, Supabase, Typescript and SWR to the T3 stack. However, this would takes some time for sure and there are a few question hanging around : - Does it mean I am loosing all my unit tests on my db (using pgtap) because prisma handle the schema ? - Do I have to replace these tests by something else ? - Do I lost all my RLS ? Is it safe ? Should I use another db maybe ? - Is it really scalable and will this stack last over time, or is it just a fad? (I said I am new, so I don't have the benefit of hindsight) I just want some opinion on that. Thanks in advance for your advice.
2 replies
TTCTheo's Typesafe Cult
Created by Romain on 7/21/2023 in #questions
download file from a folder
I have a folder on my machine with some reports. I want my connected users to be able to download these files. How can I create a protected api route that send the files, so it can be download from the client ? here is what I tried :
export const downloadFilesRouter = createTRPCRouter({
getFileContent: publicProcedure
.input(
z.object({
filename: z.string(),
})
)
.query(({ input }) => {
const { filename } = input;
const filePath = path.join(folderPath, filename);
const imageBuffer = readFileSync(filePath);
return imageBuffer;
}),
});
export const downloadFilesRouter = createTRPCRouter({
getFileContent: publicProcedure
.input(
z.object({
filename: z.string(),
})
)
.query(({ input }) => {
const { filename } = input;
const filePath = path.join(folderPath, filename);
const imageBuffer = readFileSync(filePath);
return imageBuffer;
}),
});
on the client :
const FileDownloadList: React.FC = () => {
const data = api.downloadFiles.getFileContent.useQuery({
filename: "file1.txt",
});
console.log(data);

return (
<div>
...
</div>
);
};

export default FileDownloadList;
const FileDownloadList: React.FC = () => {
const data = api.downloadFiles.getFileContent.useQuery({
filename: "file1.txt",
});
console.log(data);

return (
<div>
...
</div>
);
};

export default FileDownloadList;
The result : an error "TRPCClientError: Unable to transform response from server" and the data is undefined
6 replies
TTCTheo's Typesafe Cult
Created by Romain on 7/20/2023 in #questions
example repo testing with playwright
Hellp, I am looking for a repo testing using playwright and something to mock the api responses like msw. Do you guys know one ?
2 replies
TTCTheo's Typesafe Cult
Created by Romain on 7/10/2023 in #questions
Rewriting all mongodb queries ?
I am using the t3 stack to create a dashboard on an existing project. The data comes from mongodb and there are already a lot of aggregation pipeline written for python. But using prisma with mongodb, I cannot use these pipelines because the groupby for instance is incompatible with aggregates. I need to use groupBy() from prisma. Does this imply I have to rewritte all the queries only for that project ? (because only prisma use that) If there is no way to use the normal aggregation pipelines of mongodb with prisma, can someon explain me why did they make it like that ?
3 replies
TTCTheo's Typesafe Cult
Created by Romain on 7/9/2023 in #questions
Zod enums vs Native enums
From what I understood from the documentation of Zod, enum should be use as followed :
const FishEnum = z.enum(["Salmon", "Tuna", "Trout"]);
type FishEnum = z.infer<typeof FishEnum>;

// to use it
const someFish = FishEnum.parse("Salmon");
// to validate
const VALUES = ["Salmon", "Tuna", "Trout"] as const;
const FishEnum = z.enum(VALUES);
const FishEnum = z.enum(["Salmon", "Tuna", "Trout"]);
type FishEnum = z.infer<typeof FishEnum>;

// to use it
const someFish = FishEnum.parse("Salmon");
// to validate
const VALUES = ["Salmon", "Tuna", "Trout"] as const;
const FishEnum = z.enum(VALUES);
But it is also possible to use native enums :
export enum Countries {
Maroc = "Maroc",
Tunisie = "Tunisie",
Egypte = "Egypte",
}

// to use it
const someCountry = Countries.Maroc;
// to validate
const country = z.nativeEnum(Countries);
export enum Countries {
Maroc = "Maroc",
Tunisie = "Tunisie",
Egypte = "Egypte",
}

// to use it
const someCountry = Countries.Maroc;
// to validate
const country = z.nativeEnum(Countries);
Using native enums seems more easy so, why would I use zod enums ? Have I missed something ?
6 replies
TTCTheo's Typesafe Cult
Created by Romain on 7/6/2023 in #questions
Zustand or Jotai for a Dashboard app ?
The doc of the t3 stack talks about Zustand and Jotai in its other recommendations : https://create.t3.gg/en/other-recs I am starting a project with the t3 stack (first time ^^) and it's my first time hearing about jotai and zustand. I am going to build a dashboard for data visualization, and there cannot be more than one route. I believe a state manager is great for this kind of app, but I see people saying to use jotai if the project is simple, and zustand if it is more complex. From your experience, when should you use these library ?
8 replies
TTCTheo's Typesafe Cult
Created by Romain on 7/6/2023 in #questions
Do we need a fetcher like SWR with the t3 stack
It isn't mention in the documentation so I was wondering, do we need a fetcher with tRPC ? It's my first time using this stack, but in my previous experiences, not using a fetcher became a nightmare. I don't want to send request I don't need to. So how does it work with this stack, what is the good practice ?
6 replies