Replace mock data with live data

This change allows to configure the Axios client to use a different base
URL and set the authentication header.

NODE_ENV=development
VITE_TEST_SERVER_URL=https://develop.opencast.org
VITE_TEST_SERVER_AUTH="admin:opencast"

Author: geichelberger

.github/workflows/deploy-main.yml

@@ -26,6 +26,10 @@ jobs:
         run: npm ci
 
       - name: build project
+        env:
+          NODE_ENV: development
+          VITE_TEST_SERVER_URL: "https://develop.opencast.org"
+          VITE_TEST_SERVER_AUTH: "admin:opencast"
         run: npm run build
 
       - name: create pages directory
@@ -34,10 +38,6 @@ jobs:
       - name: include admin interface
         run: mv build gh-pages/admin-ui
 
-      - name: include mock data
-        working-directory: ./gh-pages
-        run: cp -rv ../test/GET/* .
-
       - name: include landing page
         run: cp .github/demo-page.html gh-pages/index.html
 

.github/workflows/deploy-test.yml

@@ -35,6 +35,9 @@ jobs:
       - name: build app
         env:
           PUBLIC_URL: /${{ steps.build-path.outputs.build }}
+          NODE_ENV: development
+          VITE_TEST_SERVER_URL: "https://develop.opencast.org"
+          VITE_TEST_SERVER_AUTH: "admin:opencast"
         run: npm run build
 
       - name: prepare git
@@ -67,10 +70,6 @@ jobs:
         run: |
           git checkout gh-pages
 
-      - name: include mock data
-        working-directory: admin-interface-test
-        run: cp -rv ../test/GET/* .
-
       - name: store build
         working-directory: admin-interface-test
         env:

README.md

@@ -50,6 +50,11 @@ PROXY_TARGET=http://localhost:8080 PROXY_AUTH=jdoe:aligator3 npm start
 Similarly, if you want to change the port the development server itself runs at,
 you can specify an alternative port in the `PORT` environment variable.
 
+If you aim to test against a remote server without using a proxy, you have the option to configure the target server with the `VITE_TEST_SERVER_URL`, and the `VITE_TEST_SERVER_AUTH` environment variables while using the node development mode:
+
+```sh
+NODE_ENV=development VITE_TEST_SERVER_URL="https://develop.opencast.org" VITE_TEST_SERVER_AUTH="admin:opencast" npm start
+```
 
 How to cut a release for Opencast
 ---------------------------------

src/index.tsx

@@ -2,6 +2,7 @@ import React from "react";
 import ReactDOMClient from "react-dom/client";
 import "./index.css";
 import App from "./App";
+import axios from "axios";
 
 // redux imports
 import { persistStore } from "redux-persist";
@@ -31,6 +32,11 @@ const theme = createTheme({
 	}
 })
 
+if (import.meta.env.DEV && import.meta.env.VITE_TEST_SERVER_URL) {
+  axios.defaults.baseURL = import.meta.env.VITE_TEST_SERVER_URL || ""
+  axios.defaults.headers.common['Authorization'] = import.meta.env.VITE_TEST_SERVER_AUTH && ("Basic " + window.btoa(import.meta.env.VITE_TEST_SERVER_AUTH));
+}
+
 const container = document.getElementById("root");
 if (!container) {
 	throw new Error("Failed to find the root element");