Uncaught ReferenceError: useState is not defined

[kirandash]

I get TypeError useState not defined if I remove setState from my component.

Ex: let's say I want to use the widget only to upload picture but not set any state on success. or if i want to use it on an RSC, it can't be done at the moment.

codepen with issue: https://codepen.io/kirandash/pen/WNaVqXY?editors=0011

[ljwagerfield]

Your CodePen's code (attached below) references useState but does not import it, which is why you're receiving useState is not defined in your CodePen.

If you add it at the top, then the error will go away.

If you're experiencing a different error, please let me know, but as it stands with your CodePen, I can't see any erroneous behavior or bugs: I would expect that error to happen.

const { useEffect } = React // add useState here to make error go away.

// ---------------------------
// Configure react-uploader...
// ---------------------------

// import { Uploader } from "uploader"
const uploader = Uploader({ apiKey: "free" });
const uploaderOptions = {
  multi: true,

  // Comment out this line & use 'onUpdate' instead of 
  // 'onComplete' to have the dropzone close after upload.
  showFinishButton: true,

  styles: {
    colors: {
      primary: "#377dff"
    }
  }
}

// --------------------
// Create a dropzone...
// --------------------

const MyDropzone = ({setFiles}) => 
  <UploadDropzone uploader={uploader}
                  options={uploaderOptions}
                  onUpdate={files => 
                    console.log(`Files: ${files
                           .map(x => x.fileUrl)
                           .join("\n")}`)
                  }
                  onComplete={() => {}}
                  width="600px"
                  height="375px" />

// -----------------------------
// Display the uploaded files...
// -----------------------------

const MyUploadedFiles = ({files}) => files.map(file => {
  // Tip: save 'filePath' to your DB (not 'fileUrl').
  const filePath = file.filePath 
  // "raw" for un-transformed file.
  const fileUrl  = uploader.url(filePath, "thumbnail")
  return (
    <p key={fileUrl}>
      <a href={fileUrl} target="_blank">{fileUrl}</a>
    </p>
  );
})

// ----------------------
// Run the application...
// ----------------------

const MyApp = () => {
  const [files, setFiles] = useState([])
  return (
    <>
      {files.length 
         ? <MyUploadedFiles files={files} /> 
         : <MyDropzone setFiles={setFiles} />
      }
      <a className="developed_by" href="https://upload.io/uploader" target="_blank">
        Powered by Upload.io
      </a>
    </>
  );
}

ReactDOM.render(
  <MyApp />,
  document.getElementById('root')
);

[kirandash]

Yeah, I think I missed that

Thanks for your time.