How to display pdf from firebase storage link in react instead of downloading.?

Question

I want to display a pdf/img stored in firebase storage in my react project.when i put my link in iframe it starts downloading instead of displaying.how can i stop that download and display it. I tried setting metadata object property contentDisposition: "inline" but got no luck.

module.exports.imageValidationAndUpload = async (image, path) => {
  try {
    console.log("Image in base 64", image);
    const bucket = admin.storage().bucket();
    const mimeType = image.match(/data:([a-zA-Z0-9]+\/[a-zA-Z0-9-.+]+).*,.*/)
      ? image.match(/data:([a-zA-Z0-9]+\/[a-zA-Z0-9-.+]+).*,.*/)[1]
      : null;
    const fileExtension = mime.extension(mimeType);
    console.log("fileExtension", fileExtension);
    const fileName = nanoid() + `.${fileExtension}`;
    console.log("Mime type", mimeType);
    let base64EncodedImageString;
    if (mimeType === "application/pdf") {
      base64EncodedImageString = image.replace(
        /^data:application\/pdf+;base64,/,
        ""
      );
    } else {
      base64EncodedImageString = image.replace(/^data:image\/\w+;base64,/, "");
    }
    const imageBuffer = Buffer.from(base64EncodedImageString, "base64");
    const result = await validateCauseImageFile(imageBuffer.length, mimeType);

    if (result.success) {
      const token = nanoid();
      const options = {
        gzip: true,
        metadata: {
          contentType: mimeType,
          contentDisposition: "inline",
          metadata: {
            firebaseStorageDownloadTokens: token,
            contentDisposition: "inline",
          },
        },
      };
      const filePath = `${path ? path : "images/"}` + fileName;
      const file = bucket.file(filePath);
      await file.save(imageBuffer, options);
      // const response = await file.getSignedUrl({
      //   action: "read",
      //   expires: "03-17-2025", // this is an arbitrary date
      // });
      await bucket.file(filePath).makePublic();
      const [metadata] = await file.getMetadata();
      console.log("metadata", metadata);
      const fileURL = metadata.mediaLink;

      return { success: true, url: fileURL };
    } else if (image.match(imageStorageUrlMatch)) {
      return { success: true, url: image };
    } else {
      const errorObject = { status: 403, message: result.message };
      throw errorObject;
    }
  } catch (err) {
    console.log("show error message : ", err.message);
    return { success: false, message: err.message };
  }
};

Kindly provide me the solution. Thanks!