import { ContextMenu, ContextMenuItem, ContextMenuTrigger } from 'rctx-contextmenu';
import React from 'react';
import RenderCompleted from '../../resources/ui/ServerSideRenderingCompleted';

function App() {

    const isMounted = RenderCompleted();

    return (
        <div className="app">
            { isMounted ? <><ContextMenuTrigger
                id="my-context-menu-1"
            >
                <div className="box">
                    Right Click On Me
            </div>
            </ContextMenuTrigger>

                <ContextMenu id="my-context-menu-1">
                    <ContextMenuItem>Menu Item 1</ContextMenuItem>
                    <ContextMenuItem>Menu Item 2</ContextMenuItem>
                    <ContextMenuItem>Menu Item 3</ContextMenuItem>
                    <ContextMenuItem>Menu Item 4</ContextMenuItem>
                </ContextMenu></> : 'loading'}
        </div>
    );
}

export default App;