Problem while inserting a standalone game project (HTML/JS) inside a React component in production mode

Question

I want to render a standlone html js project (game project) inside a react component. In my local machine it works fine with this code:

import styled from "styled-components";
const GAME_URL = "/src/StandloneGames/Tetris/index.html"; 

const Tetris = () => {
  return (
    <TetrisWrapper>
      <div>
        <iframe src={GAME_URL} className="iframe"></iframe>
      </div>
    </TetrisWrapper>
  );
};

export default Tetris;

But when i have used Render for deployment i received 404 error !

Here are Render settings :

Render settings :

Answer 1

I have solved the problem by moving the StandloneGames directory and delete 'index.html' from the path !

const GAME_URL = "/StandloneGames/Tetris/";

    const Tetris = () => {
      return (
        <TetrisWrapper>
          <div>
            <iframe src={GAME_URL} className="iframe"></iframe>
          </div>
        </TetrisWrapper>
      );
    };