How to Import a container component from a .js file in react js.to use in other .js file as a popup modals

I created a class component(given below) in my local project. AppOne.js

import React from 'react';
import { Container, Col, Row, Form } from "react-bootstrap";
import './AppOne.scss';

class AppOne extends React.Component {
    constructor(props) {
        super(props);
    }
    render() {
        return (
            <div>
              <Form>
                 .................
              </Form>
              <Container>
                 <Row>
                    <Col>
                       .......................
                    </Col>
                 </Row>
               </Container>
            </div >
        )
    }
}
export default AppOne;

And below is my other .js file inside this file I want to import Container Component as a popup model from AppOne.js file

AppTwo.js

import React from 'react';
import { Container, Col, Row, Form } from "react-bootstrap";
import AppOne from "./AppOne.Container"

class AppTwo extends React.Component {
    constructor(props) {
        super(props);
    }
    render() {
        return (
            <div>
              <h1></h1>
               <AppOne/>
            </div>
        )
    }
}
export default AppTwo;

I tried to get the solution by using above method. I know this is silly question. So, What is the best way to solve this?