How to remove an image from a Figma widget?

I’m building a Figma widget with typescript. The widget lets me upload the image but won’t let me remove the image from the widget. Does anybody know what I’m missing?

if (props.imageString == '') {
      return (
        <FileUploadDropzone
          onSelectedFiles={handleSelectedFiles}
        >
          <Text align="center">
            <Muted>Click or Drop Your Image Here</Muted>
          </Text>

        </FileUploadDropzone>
      )
    }

    if (props.imageString && props.imageString !== '') {
      return (
        <Fragment>
          <div className={styles.uploadedFileArea}>
            <Text align="center">
              <Muted>Remove Image</Muted>
            </Text>
            <IconCross32 />
          </div>
        </Fragment>
      )
    }

    return null

A few questions:

  • What library are you using for the FileUploadDropzone?
  • There should likely be some sort of handler on the Text component (similar to the onSelectedFiles={handleSelectedFiles} handler on the FileUploadDropzone component) that handles clicks on that text and removes the image. You might check the documentation for the library you’re using for examples to this effect.