elpupper Posts - Answer Overflow

elpupper

Explore posts from servers

CC#CDCloudflare Developers TTCTheo's Typesafe Cult

•Created by elpupper on 7/10/2023 in #questions

R2 Presigned URL

I'm trying to figure out how or if I can somehow have the Object thats put in the presigned URL to have a expiration time as well and not only the url.

81 replies

TTCTheo's Typesafe Cult

•Created by elpupper on 7/6/2023 in #questions

Prisma not connecting to DB in amplify

Hey guys so i got the following schema

model Images {
    id      Int    @id @default(autoincrement())
    user    User   @relation(fields: [userId], references: [id])
    model   Model  @relation(fields: [modelId], references: [id])
    modelId Int
    userId  String
    image   String
}

model Images {
    id      Int    @id @default(autoincrement())
    user    User   @relation(fields: [userId], references: [id])
    model   Model  @relation(fields: [modelId], references: [id])
    modelId Int
    userId  String
    image   String
}

and in one of my api endpoints i am doing

        await prisma.images.create({
            data: {
                user: {
                    connect: {
                        id: userId,
                    },
                },
                model: {
                    connect: {
                        id: modelId,
                    },
                },
                image: fileName,
            },
        });

        await prisma.images.create({
            data: {
                user: {
                    connect: {
                        id: userId,
                    },
                },
                model: {
                    connect: {
                        id: modelId,
                    },
                },
                image: fileName,
            },
        });

this works perfectly locally and nothing goes wrong but then when i pushed it to prod i kept getting Internal Server Error I added a try catch block to see what the error is and it gave me {"error":{"clientVersion":"4.7.1"}} I dont know what im doing wrong. any ideas?

220 replies

TTCTheo's Typesafe Cult

•Created by elpupper on 7/4/2023 in #questions

t3 turbo env vars

So I have a secret key that i am using in one of my api routes. Everything works fine but when i go to deploy in AWS amplify it doesnt work. I added it to the environment variables... I tried building with-env not sure why its not working. Also have this issue with my cloudflare envs in amplify.

const s3 = new S3({
    // All of these are undefined for some reason in amplify :/
    endpoint: process.env.CLOUDFLARE_R2_URL,
    accessKeyId: process.env.CLOUDFLARE_KEY_ID,
    secretAccessKey: process.env.CLOUDFLARE_SECRET_KEY,
    signatureVersion: "v4",
});

const s3 = new S3({
    // All of these are undefined for some reason in amplify :/
    endpoint: process.env.CLOUDFLARE_R2_URL,
    accessKeyId: process.env.CLOUDFLARE_KEY_ID,
    secretAccessKey: process.env.CLOUDFLARE_SECRET_KEY,
    signatureVersion: "v4",
});

47 replies

TTCTheo's Typesafe Cult

•Created by elpupper on 6/17/2023 in #questions

Tracking request/useMutation progress

I have a tRPC endpoint that takes in images in base64, and in the frontend i want the user to be able to watch the progress of the files being uploaded. Not sure on how to really do that. is there a function im missing? I tried looking at the documentation and cant find what im looking for.

205 replies

TTCTheo's Typesafe Cult

•Created by elpupper on 6/10/2023 in #questions

Using JSZip with Zod and tRPC

I am making a uploadRouter for my website where a user can upload 5-10 images. I want to be able to zip those image and then upload it to a r2 endpoint. I never really worked with zipping and image schemas in Zod and tRPC so im not sure on what to do. Here is what I have so far

import { router, publicProcedure, protectedProcedure } from "../trpc";
import { z } from "zod";
import JSZip from "jszip";

const MAX_FILE_SIZE = 5000000;
const ACCEPTED_IMAGE_TYPES = ["image/jpeg", "image/jpg", "image/png", "image/webp"];

const imageSchema = z.object({
    image: z
        .any()
        .refine((file) => file?.size <= MAX_FILE_SIZE, 'Maximum file size is 50MB')
        .refine((file) => ACCEPTED_IMAGE_TYPES.includes(file?.type), 'Unsupported file type')
})

export const uploadRouter = router({
    upload: protectedProcedure
        .input(imageSchema.array().min(5).max(10))
        .mutation(({ ctx, input }) => {

            const zip = new JSZip();
            const remoteZips = input.map((image) => {
                // ERROR HERE
                zip.file(image.name, image)
            });
            
        })
})

import { router, publicProcedure, protectedProcedure } from "../trpc";
import { z } from "zod";
import JSZip from "jszip";

const MAX_FILE_SIZE = 5000000;
const ACCEPTED_IMAGE_TYPES = ["image/jpeg", "image/jpg", "image/png", "image/webp"];

const imageSchema = z.object({
    image: z
        .any()
        .refine((file) => file?.size <= MAX_FILE_SIZE, 'Maximum file size is 50MB')
        .refine((file) => ACCEPTED_IMAGE_TYPES.includes(file?.type), 'Unsupported file type')
})

export const uploadRouter = router({
    upload: protectedProcedure
        .input(imageSchema.array().min(5).max(10))
        .mutation(({ ctx, input }) => {

            const zip = new JSZip();
            const remoteZips = input.map((image) => {
                // ERROR HERE
                zip.file(image.name, image)
            });
            
        })
})

This is the error im getting

No overload matches this call.
  Overload 1 of 4, '(path: string, data: null, options?: (JSZipFileOptions & { dir: true; }) | undefined): JSZip', gave the following error.
    Argument of type '{ image?: any; }' is not assignable to parameter of type 'null'.
  Overload 2 of 4, '(path: string, data: string | number[] | Uint8Array | ArrayBuffer | Blob | ReadableStream | Promise<string | number[] | Uint8Array | ArrayBuffer | Blob | ReadableStream>, options?: JSZipFileOptions | undefined): JSZip', gave the following error.
    Argument of type '{ image?: any; }' is not assignable to parameter of type 'string | number[] | Uint8Array | ArrayBuffer | Blob | ReadableStream | Promise<string | number[] |

No overload matches this call.
  Overload 1 of 4, '(path: string, data: null, options?: (JSZipFileOptions & { dir: true; }) | undefined): JSZip', gave the following error.
    Argument of type '{ image?: any; }' is not assignable to parameter of type 'null'.
  Overload 2 of 4, '(path: string, data: string | number[] | Uint8Array | ArrayBuffer | Blob | ReadableStream | Promise<string | number[] | Uint8Array | ArrayBuffer | Blob | ReadableStream>, options?: JSZipFileOptions | undefined): JSZip', gave the following error.
    Argument of type '{ image?: any; }' is not assignable to parameter of type 'string | number[] | Uint8Array | ArrayBuffer | Blob | ReadableStream | Promise<string | number[] |

124 replies

TTCTheo's Typesafe Cult

•Created by elpupper on 5/30/2023 in #questions

@next/font turbo t3

You might be using incompatible version of @next/font (13.4.4) and next (13.1.6). what version should i use? Also in the future where can i find the compatible versions? I ran pnpm --filter nextjs add @next/font

23 replies

TTCTheo's Typesafe Cult

•Created by elpupper on 5/20/2023 in #questions

t3-turbo packages

How do I install packages for expo and/or nextjs? I'm using pnpm. I tried to do pnpm i [package] -w then tried to pnpm expo install [package] inside the expo folder but no luck

Unable to resolve "@react-navigation/native" from "..\..\node_modules\@react-navigation\native-stack\src\navigators\createNativeStackNavigator.tsx"

20 replies

TTCTheo's Typesafe Cult

•Created by elpupper on 4/23/2023 in #questions

How can i remove the parameter

I want to remove the parameter createdAt cause its of type date.

117 replies

TTCTheo's Typesafe Cult

•Created by elpupper on 4/14/2023 in #questions

TRPC and PRISMA id type

Currently im trying to delete a object using id in prisma using trpc.

    delete: privateProcedure.input(
        z.object({
            id: z.string().cuid(),
        }),
    ).mutation(async ({ ctx, input }) => {
        const post = await ctx.prisma.teacher.delete({
            where: {
                id: input.id,
            },
        });
    }),

    delete: privateProcedure.input(
        z.object({
            id: z.string().cuid(),
        }),
    ).mutation(async ({ ctx, input }) => {
        const post = await ctx.prisma.teacher.delete({
            where: {
                id: input.id,
            },
        });
    }),

but im getting this error

❌ tRPC failed on teachers.delete: [
  {
    "code": "invalid_type",
    "expected": "object",
    "received": "string",
    "path": [],
    "message": "Expected object, received string"
  }
]

❌ tRPC failed on teachers.delete: [
  {
    "code": "invalid_type",
    "expected": "object",
    "received": "string",
    "path": [],
    "message": "Expected object, received string"
  }
]

Here is the schema

model Teacher {
    id        String   @id @default(cuid())
    createdAt DateTime @default(now())

    name      String
    email     String
    role      String
    phone     String
    dob       String

    authorId  String
}

model Teacher {
    id        String   @id @default(cuid())
    createdAt DateTime @default(now())

    name      String
    email     String
    role      String
    phone     String
    dob       String

    authorId  String
}

33 replies

TTCTheo's Typesafe Cult

•Created by elpupper on 4/13/2023 in #questions

Replace fetch with trpc useQuery

    async function load({ signal }: { signal: AbortSignal }) {
        const res = await fetch("https://swapi.py4e.com/api/people/?search", {
            signal,
        });
        const json = await res.json();
        return {
            items: json.results,
        };
    }
    async function sort(...)
    const list = useAsyncList({ load, sort });

    async function load({ signal }: { signal: AbortSignal }) {
        const res = await fetch("https://swapi.py4e.com/api/people/?search", {
            signal,
        });
        const json = await res.json();
        return {
            items: json.results,
        };
    }
    async function sort(...)
    const list = useAsyncList({ load, sort });

I tried to just replace everything in the load function with

    const { data } = api.teachers.getAll.useQuery();
    return {
        items: data,
    }

    const { data } = api.teachers.getAll.useQuery();
    return {
        items: data,
    }

to my surprise this didn't work the objects look the same in console when i did console.log() I do get a red line tho in const list

Type '({ signal }: { signal: AbortSignal; }) => Promise<{ items: Teacher[] | undefined; }>' is not assignable to type 'AsyncListLoadFunction<any, string>'.
  Type 'Promise<{ items: Teacher[] | undefined; }>' is not assignable to type 'AsyncListStateUpdate<any, string> | Promise<AsyncListStateUpdate<any, string>>'.
    Type 'Promise<{ items: Teacher[] | undefined; }>' is not assignable to type 'Promise<AsyncListStateUpdate<any, string>>'.
      Type '{ items: Teacher[] | undefined; }' is not assignable to type 'AsyncListStateUpdate<any, string>'.
        Types of property 'items' are incompatible.
          Type 'Teacher[] | undefined' is not assignable to type 'Iterable<any>'.
            Type 'undefined' is not assignable to type 'Iterable<any>'.ts(2322)
types.d.ts(109, 5): The expected type comes from property 'load' which is declared here on type 'AsyncListOptions<any, string>'

Type '({ signal }: { signal: AbortSignal; }) => Promise<{ items: Teacher[] | undefined; }>' is not assignable to type 'AsyncListLoadFunction<any, string>'.
  Type 'Promise<{ items: Teacher[] | undefined; }>' is not assignable to type 'AsyncListStateUpdate<any, string> | Promise<AsyncListStateUpdate<any, string>>'.
    Type 'Promise<{ items: Teacher[] | undefined; }>' is not assignable to type 'Promise<AsyncListStateUpdate<any, string>>'.
      Type '{ items: Teacher[] | undefined; }' is not assignable to type 'AsyncListStateUpdate<any, string>'.
        Types of property 'items' are incompatible.
          Type 'Teacher[] | undefined' is not assignable to type 'Iterable<any>'.
            Type 'undefined' is not assignable to type 'Iterable<any>'.ts(2322)
types.d.ts(109, 5): The expected type comes from property 'load' which is declared here on type 'AsyncListOptions<any, string>'

6 replies

Gaming

Programming