FROM node:latest

# Default working dir
WORKDIR /opt/node_app


# Get apt up and running
RUN apt update 
#RUN apt install git yarn -y
#RUN npm install --global yarn


#RUN npm install react react-dom @excalidraw/excalidraw vscode-languageclient -g

# Create a React 
#RUN npx create-react-app my-excalidraw-app
RUN git clone https://github.com/excalidraw/excalidraw

# Change to the newly created directory
#WORKDIR /opt/node_app/my-excalidraw-app
WORKDIR /opt/node_app/excalidraw

# Set ENV on dev / prod
RUN echo -e "\n\nBROWSER=NONE" >> .env.development
RUN echo -e "\n\nBROWSER=NONE" >> .env.development



# Setup npm / yarn / deps
RUN npm install react react-dom
RUN npm install workbox-build workbox-window eslint

# Run yarn to install deps
RUN yarn



# Replace the content of src/App.js
#RUN echo "import React from 'react';" > src/App.js \
#&& echo "import Excalidraw from '@excalidraw/excalidraw';" >> src/App.js \
#&& echo "import './App.css';" >> src/App.js \
#&& echo "function App() {" >> src/App.js \
#&& echo "  return (" >> src/App.js \
#&& echo "    <div className='App'>" >> src/App.js \
#&& echo "      <Excalidraw />" >> src/App.js \
#&& echo "    </div>" >> src/App.js \
#&& echo "  );" >> src/App.js \
#&& echo "}" >> src/App.js \
#&& echo "export default App;" >> src/App.js

# Make port 3000 available outside the container
EXPOSE 3000

# Start the development server
CMD ["yarn", "start"]