Dev

.env

@@ -11,3 +11,11 @@ USE_HTTPS = false
 VSAC_API_KEY = changeMe
 WHITELIST = http://localhost, http://localhost:3005
 SERVER_NAME = CodeX REMS Administrator Prototype
+FULL_RESOURCE_IN_APP_CONTEXT = false
+
+#Frontend Vars
+FRONTEND_PORT=9090
+VITE_REALM = ClientFhirServer
+VITE_AUTH = http://localhost:8180
+VITE_CLIENT = app-login
+VITE_SCOPE_ID = rems-admin

Dockerfile

@@ -4,10 +4,21 @@ WORKDIR /rems-admin
 ARG PORT=8090
 ENV PORT=${PORT}
 
+ARG FRONTEND_PORT=9090
+ENV FRONTEND_PORT=${FRONTEND_PORT}
+
 COPY --chown=node:node . .
 RUN npm install
-EXPOSE 8090
 
-HEALTHCHECK --interval=30s --start-period=15s --timeout=10m --retries=10 CMD wget --no-verbose --tries=1 --spider http://localhost:${PORT} || exit 1
+WORKDIR /rems-admin/frontend
+RUN npm install
+
+WORKDIR /rems-admin
+
+EXPOSE 8090
 EXPOSE 8095
-CMD npm run start
+EXPOSE 9090
+EXPOSE 9095
+
+HEALTHCHECK --interval=45s --start-period=60s --timeout=10m --retries=10 CMD (wget --no-verbose --tries=1 --spider http://localhost:${PORT} && wget --no-verbose --tries=1 --spider http://localhost:${FRONTEND_PORT}) || exit 1
+CMD ./dockerRunnerProd.sh

Dockerfile.dev

@@ -4,13 +4,31 @@ WORKDIR /rems-admin
 ARG PORT=8090
 ENV PORT=${PORT}
 
+ARG FRONTEND_PORT=9090
+ENV FRONTEND_PORT=${FRONTEND_PORT}
+
 COPY --chown=node:node . .
 RUN npm install
+
+WORKDIR /rems-admin/frontend
+RUN npm install
+
+WORKDIR /rems-admin
+
+
 EXPOSE 8090
 EXPOSE 8091
 
-HEALTHCHECK --interval=30s --start-period=15s --timeout=10m --retries=10 CMD wget --no-verbose --tries=1 --spider http://localhost:${PORT} || exit 1
-
 EXPOSE 8095
 EXPOSE 8096
+
+EXPOSE 9090
+EXPOSE 9091
+
+EXPOSE 9095
+EXPOSE 9096
+
+HEALTHCHECK --interval=45s --start-period=60s --timeout=10m --retries=10 CMD (wget --no-verbose --tries=1 --spider http://localhost:${PORT} && wget --no-verbose --tries=1 --spider http://localhost:${FRONTEND_PORT}) || exit 1
+
+
 CMD ./dockerRunnerDev.sh

README.md

@@ -44,7 +44,7 @@ Next, start the frontend with the following:
 
 ### `npm start`
 
-Go to the UI running on http://localhost:5173/ (or whichever port it was run on)
+Go to the UI running on http://localhost:9090/ (or whichever port it was run on)
 
 Still need to update docker to start the UI automatically. 
 
@@ -117,3 +117,5 @@ Following are a list of modifiable paths:
 | VSAC_API_KEY    | `changeMe`                                 | Replace with VSAC API key for pulling down ValueSets. Request an API Key from the [VSAC website](https://vsac.nlm.nih.gov/) |
 | WHITELIST       | `http://localhost, http://localhost:3005`  | List of valid URLs for CORS. Should include any URLs the server accesses for resources.                                     |
 | SERVER_NAME     | `CodeX REMS Administrator Prototype`       | Name of the server that is returned in the card source.                                                                     |
+| FULL_RESOURCE_IN_APP_CONTEXT     | 'false'       | If true, the entire order resource will be included in the appContext, otherwise only a reference will be.                                                                     |
+| FRONTEND_PORT            | `9080`                                             | Port that the frontend  server should run on, change if there are conflicts with port usage.                   |

dockerRunnerDev.sh

@@ -1,44 +1,71 @@
 #!/bin/sh
 
 # Handle closing application on signal interrupt (ctrl + c)
-trap 'kill $CONTINUOUS_INSTALL_PID $SERVER_PID; gradle --stop; exit' INT
+trap 'kill $CONTINUOUS_INSTALL_PID $SERVER_PID $BACKEND_SERVER_PID; exit' INT
 
 mkdir logs 
+touch ./logs/frontend_installer.log
+touch ./logs/frontend_runner.log
+touch ./logs/backend_installer.log
+touch ./logs/backend_runner.log
+
 # Reset log file content for new application boot
-echo "*** Logs for continuous installer ***" > ./logs/installer.log
-echo "*** Logs for 'npm run start' ***" > ./logs/runner.log
+echo "*** Logs for continuous frontend installer ***" > ./logs/frontend_installer.log
+echo "*** Logs for frontend 'npm run start' ***" > ./logs/frontend_runner.log
+
+echo "*** Logs for continuous backend installer ***" > ./logs/backend_installer.log
+echo "*** Logs for backend 'npm run start' ***" > ./logs/backend_runner.log
 
 # Print that the application is starting in watch mode
 echo "starting application in watch mode..."
 
 # Start the continious build listener process
-echo "starting continuous installer..."
-npm install
+echo "starting continuous installers..."
+
+cd frontend
+npm install | tee ./logs/frontend_installer.log
+cd ..
+npm install | tee ./logs/backend_installer.log
 
-( package_modify_time=$(stat -c %Y package.json)
-package_lock_modify_time=$(stat -c %Y package-lock.json)
+( package_modify_time=$(stat -c %Y frontend/package.json)
+package_lock_modify_time=$(stat -c %Y frontend/package-lock.json)
+backend_modify_time=$(stat -c %Y package.json)
+backend_lock_modify_time=$(stat -c %Y package-lock.json)
 while sleep 1
 do
-    new_package_modify_time=$(stat -c %Y package.json)
-    new_package_lock_modify_time=$(stat -c %Y package-lock.json)    
+    new_package_modify_time=$(stat -c %Y frontend/package.json)
+    new_package_lock_modify_time=$(stat -c %Y frontend/package-lock.json)
+    new_backend_modify_time=$(stat -c %Y package.json)
+    new_backend_lock_modify_time=$(stat -c %Y package-lock.json)
 
-    if [[ "$package_modify_time" != "$new_package_modify_time" ]] || [[ "$package_lock_modify_time" != "$new_package_lock_modify_time" ]]
+    if [[ "$package_modify_time" != "$new_package_modify_time" ]] || [[ "$package_lock_modify_time" != "$new_package_lock_modify_time" ]] || [[ "$backend_lock_modify_time" != "$new_backend_lock_modify_time" ]]|| [[ "$backend_modify_time" != "$new_backend_modify_time" ]]
     then
-        echo "running npm install..."
-        npm install | tee ./logs/installer.log
+        echo "running frontent npm install..."
+        cd frontend
+        npm install | tee ./logs/frontend_installer.log
+        cd ..
+    elif [[ "$backend_lock_modify_time" != "$new_backend_lock_modify_time" ]]|| [[ "$backend_modify_time" != "$new_backend_modify_time" ]]
+    then
+        echo "running backend npm install..."
+        npm install | tee ./logs/backend_installer.log
     fi
 
     package_modify_time=$new_package_modify_time
     package_lock_modify_time=$new_package_lock_modify_time
+    backend_modify_time=$new_backend_modify_time
+    backend_lock_modify_time=$new_backend_lock_modify_time
 
 done )  & CONTINUOUS_INSTALL_PID=$!
 
 # Start server process once initial build finishes  
-( npm run start | tee ./logs/runner.log ) & SERVER_PID=$!
+cd frontend
+( npm run start | tee ./logs/frontend_runner.log ) & SERVER_PID=$!
+
+cd ..
+( npm run start | tee ./logs/backend_runner.log ) & BACKEND_SERVER_PID=$!
 
 # Handle application background process exiting
-wait $CONTINUOUS_INSTALL_PID $SERVER_PID
+wait $CONTINUOUS_INSTALL_PID $SERVER_PID $BACKEND_SERVER_PID
 EXIT_CODE=$?
 echo "application exited with exit code $EXIT_CODE..."
 
-

dockerRunnerProd.sh

@@ -0,0 +1,12 @@
+#!/bin/sh
+
+cd frontend
+( npm run start ) & SERVER_PID=$!
+
+cd ..
+( npm run start ) & BACKEND_SERVER_PID=$!
+
+# Handle application background process exiting
+wait $SERVER_PID $BACKEND_SERVER_PID
+EXIT_CODE=$?
+echo "application exited with exit code $EXIT_CODE..."

frontend/package.json

@@ -15,6 +15,7 @@
     "@mui/icons-material": "^6.1.0",
     "@mui/material": "^6.1.0",
     "axios": "^1.7.7",
+    "dotenv": "^16.4.5",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-router-dom": "^6.26.2"

frontend/src/App.tsx

@@ -29,7 +29,7 @@ function App() {
   const resetDB = async () => {
     setOpen(false);
     await axios
-      .post('http://localhost:8090/etasu/reset')
+      .post(process.env.RESOURCE_SERVER + '/etasu/reset')
       .then(function (response: any) {
         console.log(response);
         setForceRefresh(true);

frontend/src/views/DataViews/CaseCollection.tsx

@@ -56,7 +56,7 @@ const CaseCollection = (props: { refresh: boolean }) => {
   }, []);
 
   const getAllRemsCase = async () => {
-    const url = 'http://localhost:8090/api/all/remscase';
+    const url = process.env.RESOURCE_SERVER + '/api/all/remscase';
     await axios
       .get(url)
       .then(function (response: { data: SetStateAction<RemsCase[]> }) {
@@ -70,7 +70,7 @@ const CaseCollection = (props: { refresh: boolean }) => {
   };
 
   const deleteSingleRow = async (event: any, row: RemsCase) => {
-    const url = 'http://localhost:8090/api/remsCase/deleteOne';
+    const url = process.env.RESOURCE_SERVER + '/api/remsCase/deleteOne';
     await axios
       .post(url, { data: { params: row } })
       .then(function (response: { data: any; status: number }) {

frontend/src/views/DataViews/Medications.tsx

@@ -46,7 +46,7 @@ const Medications = (props: { refresh: boolean }) => {
   }, []);
 
   const getAllMedications = async () => {
-    const url = 'http://localhost:8090/api/all/medications';
+    const url = process.env.RESOURCE_SERVER + '/api/all/medications';
     await axios
       .get(url)
       .then(function (response: { data: SetStateAction<Medication[]> }) {

frontend/src/views/DataViews/MetRequirements.tsx

@@ -44,7 +44,7 @@ const MetRequirements = (props: { refresh: boolean }) => {
   }, []);
 
   const getAllMetReqs = async () => {
-    const url = 'http://localhost:8090/api/all/metreqs';
+    const url = process.env.RESOURCE_SERVER + '/api/all/metreqs';
     await axios
       .get(url)
       .then(function (response: { data: any }) {
@@ -58,7 +58,7 @@ const MetRequirements = (props: { refresh: boolean }) => {
   };
 
   const deleteSingleRow = async (event: any, row: MetRequirements) => {
-    const url = 'http://localhost:8090/api/metreqs/deleteOne';
+    const url = process.env.RESOURCE_SERVER + '/api/metreqs/deleteOne';
     await axios
       .post(url, { data: { params: row } })
       .then(function (response: { data: any; status: number }) {
@@ -73,7 +73,7 @@ const MetRequirements = (props: { refresh: boolean }) => {
   };
 
   const formattedQuestionnaire = (row: MetRequirements) => {
-    return row?.completedQuestionnaire?.questionnaire.split('http://localhost:8090/4_0_0/')[1];
+    return row?.completedQuestionnaire?.questionnaire.split(process.env.RESOURCE_SERVER + '/4_0_0/')[1];
   };
   const formattedCompleted = (row: MetRequirements) => {
     return row?.completed === true ? 'Yes' : 'No';

frontend/src/views/Login.tsx

@@ -2,7 +2,6 @@ import { SetStateAction, useState } from 'react';
 import axios from 'axios';
 import { Avatar, Box, Button, Container, CssBaseline, TextField, Typography } from '@mui/material';
 import LockOutlinedIcon from '@mui/icons-material/LockOutlined';
-import config from '../../config.json';
 
 const Login = props => {
   const [showMessage, setShowMessage] = useState(false);
@@ -20,9 +19,9 @@ const Login = props => {
       params.append('username', user);
       params.append('password', pass);
       params.append('grant_type', 'password');
-      params.append('client_id', config.client);
+      params.append('client_id', process.env.VITE_CLIENT!);
       axios
-        .post(`${config.auth}/realms/${config.realm}/protocol/openid-connect/token`, params, {
+        .post(`${process.env.VITE_AUTH}/realms/${process.env.VITE_REALM}/protocol/openid-connect/token`, params, {
           withCredentials: true
         })
         .then(

frontend/vite.config.ts

@@ -1,7 +1,19 @@
 import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
 
-// https://vitejs.dev/config/
+import dotenv from 'dotenv';
+
+dotenv.config({ path: '../.env' }); // load env vars from .env
 export default defineConfig({
-  plugins: [react()]
+  // depending on your application, base can also be "/"
+  base: '',
+  plugins: [react()],
+  define: {
+    'process.env': process.env
+  },
+  server: {
+    port: parseInt(process.env.FRONTEND_PORT!),
+    open: false,
+    host: true
+  }
 });

src/config.ts

@@ -23,7 +23,8 @@ export default {
   },
   general: {
     resourcePath: 'src/cds-library/CRD-DTR',
-    VsacApiKey: env.get('VSAC_API_KEY').required().asString()
+    VsacApiKey: env.get('VSAC_API_KEY').required().asString(),
+    fullResourceInAppContext: env.get('FULL_RESOURCE_IN_APP_CONTEXT').required().asBool()
   },
   database: {
     selected: 'mongo',
@@ -40,7 +41,7 @@ export default {
   fhirServerConfig: {
     auth: {
       // This server's URI
-      resourceServer: env.get('RESOURCE_SERVER').required().asUrlString()
+      resourceServer: env.get('RESOURCE_SERVER').required().asUrlString() + '/'
       //
       // if you use this strategy, you need to add the corresponding env vars to docker-compose
       //