Reactjs – Embedded a PDF in my application, but it tells me to manually open it

I have a React app where I get a URL from my server that contains a PDF, and while I can view it, a team member of mine sees it differently. The strange thing is that, for them, it opens normally in other browsers (firefox, safari), but not on Chrome. For me, it works across browsers.

I’m using the library, react-pdfobject

Example (normal):

This is what they see:

Here is my code:

import { PDFObject } from 'react-pdfobject';

// ....
return (
  <>
    <Modal
      {...props}
      width="auto"
      styles={{ body: { height: window.innerHeight - 300 } }}
      onOk={() => {
        if (!data?.me.signatures.length) {
          setNoSignatureModalOpen(true);
          return;
        }
        bulkSignSignableDocuments();
      }}
      okText="Sign"
    >
      <Typography.Title level={4} style={{ textAlign: 'center' }}>
        Review and approve the {documentCount} {documentCount > 1 ? 'documents' : 'document'}{' '}
        you've selected to sign:
      </Typography.Title>
      <div style={{ display: 'flex', height: '100%' }}>
        <DocumentList
          setSelectedDocument={setSelectedDocument}
          preparedDocuments={preparedDocuments}
        />
        {selectedDocument?.pendingSignaturePdfUrl && (
          <PDFContainer>
            <PDFObject url={selectedDocument.pendingSignaturePdfUrl} />
          </PDFContainer>
        )}
      </div>
    </Modal>
    <NoSignatureModal
      open={noSignatureModalOpen}
      onCancel={() => setNoSignatureModalOpen(false)}
    />
  </>
);