Refused to frame 'https://github.com/' because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'none'"

Question

import React from 'react';
import Iframe from 'react-iframe';

const CodePanel = () => {
  return (
    <div className='codePanel'>
      <Iframe
        url="https://github.dev/Mrpolat/JavaScript"
        width="100%"
        height="500px"
        id=""
        className=""
        display="block"
        position="relative"
      />
    </div>
  );
}

export default CodePanel;

Due to security policies. I cannot display the github.dev ide on my website with iframe. What is the alternative way to do this? Do I need to use something like restApi?

using iframe I tried a structure like below but it was only for gist. and it worked

<iframe frameborder="0" scrolling="no" seamless="seamless" srcdoc='<script src="https://gist.github.com/sundbry/55bb902b66a39c0ff83629d9a8015ca4.js"></script>'></ iframe>

But I want to display the github.dev IDE on my website and manage it along with its folders and contents through my website.