pingdotgg/uploadthing

[misc]: Module '"uploadthing/client"' has no exported member 'UploadFileResponse'.ts(2305)

muke5hy opened this issue · 10 comments

I understand that this issue may be closed if it should be filed in another category

  • I understand

My issue

Getting error

Module '"uploadthing/client"' has no exported member 'UploadFileResponse'.ts(2305)
Uploadthings version

"@uploadthing/react": "^6.7.2",
"uploadthing": "^6.13.2",

This is how I am importing the UploadFileResponse


'use client';
import { OurFileRouter } from '@/app/api/uploadthing/core';
import { UploadDropzone } from '@uploadthing/react';
import { Trash } from 'lucide-react';
import Image from 'next/image';
import { UploadFileResponse } from 'uploadthing/client';
import { IMG_MAX_LIMIT } from './forms/product-form';
import { Button } from '@/components/ui/button';
import { useToast } from '@/components/ui/use-toast';

interface ImageUploadProps {
  onChange?: any;
  onRemove: (value: UploadFileResponse[]) => void;
  value: UploadFileResponse[];
}

export default function FileUpload({
  onChange,
  onRemove,
  value
}: ImageUploadProps) {
  const { toast } = useToast();
  const onDeleteFile = (key: string) => {
    const files = value;
    let filteredFiles = files.filter((item) => item.key !== key);
    onRemove(filteredFiles);
  };
  const onUpdateFile = (newFiles: UploadFileResponse[]) => {
    onChange([...value, ...newFiles]);
  };

When I build the project I get following error


./src/components/file-upload.tsx:6:10
Type error: Module '"uploadthing/client"' has no exported member 'UploadFileResponse'.

  4 | import { Trash } from 'lucide-react';
  5 | import Image from 'next/image';
> 6 | import { UploadFileResponse } from 'uploadthing/client';
    |          ^
  7 | import { IMG_MAX_LIMIT } from './forms/product-form';
  8 | import { Button } from '@/components/ui/button';
  9 | import { useToast } from '@/components/ui/use-toast';
 ELIFECYCLE  Command failed with exit code 1.
 ```
 
 Not sure what I am doing wrong here. 

PLease provide more information including reproduction steps, package versions, etc.

You likely have incompatible versions of uploadthing and @uploadthing/react.

Make sure that you're within the accepted peer dependency ranges

You likely have incompatible versions of uploadthing and @uploadthing/react.

Make sure that you're within the accepted peer dependency ranges

I have updated with few more details. Which version should I use?

PLease provide more information including reproduction steps, package versions, etc.

I have updated the question with more details.

Oh, I see. That type doesn't really exist. We use it in the documentation to explain the shape of the data provided to the onUploadComplete function. Docs might be a bit unclear on that. cc @juliusmarminge

(I think) that exists but it might have been renamed since it existed both on the server and client before

ClientUploadedFileData,

(I think) that exists but it might have been renamed since it existed both on the server and client before

ClientUploadedFileData,

Great, thanks for reply. But how do I use it. I tried following.

import type { ClientUploadedFileData } from 'uploadthing/client';

But still getting following error while building.

./src/components/file-upload.tsx:6:15
Type error: Module '"uploadthing/client"' declares 'ClientUploadedFileData' locally, but it is not exported.

  4 | import { Trash } from 'lucide-react';
  5 | import Image from 'next/image';
> 6 | import type { ClientUploadedFileData } from 'uploadthing/client';
    |               ^
  7 | import { IMG_MAX_LIMIT } from './forms/product-form';
  8 | import { Button } from './ui/button';
  9 | import { useToast } from './ui/use-toast';
 ELIFECYCLE  Command failed with exit code 1.
 ```

import it from uploadthing/types

This issue has been automatically marked as stale because it has not had any activity for 10 days. It will be closed in 5 days if no further activity occurs.

This issue has been closed because it has not had any activity for 5 days since being marked as stale.