25.2

.env

@@ -2,3 +2,4 @@ VITE_VERSION=$npm_package_version
 VITE_NAME=$npm_package_name
 FAST_REFRESH=false
 VITE_VIDISPINE_URL=$VIDISPINE_URL
+BASE_URL='/admin-tool'

.github/workflows/build-with-public-url.yml

@@ -23,9 +23,10 @@ jobs:
       - name: Install dependencies
         run: npm ci
       - name: Build site
-        run: PUBLIC_URL=${PUBLIC_URL} GENERATE_SOURCEMAP=false npm run build
+        run: VITE_GIT_COMMIT=${VITE_GIT_COMMIT} BASE_URL=${BASE_URL} npm run build
         env:
-          PUBLIC_URL: ${{ github.event.inputs.public_url }}
+          BASE_URL: ${{ github.event.inputs.public_url }}
+          VITE_GIT_COMMIT: ${{ steps.artifact-vars.outputs.sha_short }}
       - name: Upload artifact
         uses: actions/upload-artifact@v4
         with:

.github/workflows/docker-image.yml

@@ -25,6 +25,5 @@ jobs:
         run: npm ci
         shell: bash
       - name: Build the Docker image
-        run: PUBLIC_URL=/admin-tool npm run docker:buildx:push
+        run: VITE_GIT_COMMIT=$(git rev-parse --short HEAD) BASE_URL=/admin-tool npm run docker:buildx:push
         shell: bash
-

.github/workflows/gh-pages.yml

@@ -19,7 +19,7 @@ jobs:
       - name: Publish to GitHub Pages
         run: |
           git remote set-url origin https://git:${GITHUB_TOKEN}@github.com/${GITHUB_REPOSITORY}.git
-          PUBLIC_URL="https://${GITHUB_REPOSITORY%/*}.github.io/${GITHUB_REPOSITORY#*/}" GENERATE_SOURCEMAP=false npm run build
+          VITE_GIT_COMMIT=$(git rev-parse --short HEAD) BASE_URL="https://${GITHUB_REPOSITORY%/*}.github.io/${GITHUB_REPOSITORY#*/}" npm run build
           npm run gh-pages -- -d build -u "github-actions-bot <[email protected]>"
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.gitignore

@@ -24,3 +24,4 @@ npm-error.log*
 yarn-debug.log*
 yarn-error.log*
 *.tar.gz
+.eslintcache

.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["dbaeumer.vscode-eslint", "esbenp.prettier-vscode"]
+}

.vscode/launch.json

@@ -3,20 +3,34 @@
     {
       "name": "start",
       "request": "launch",
-      "runtimeArgs": ["start"],
+      "runtimeArgs": [
+        "start"
+      ],
       "runtimeExecutable": "npm",
-      "skipFiles": ["<node_internals>/**"],
+      "skipFiles": [
+        "<node_internals>/**"
+      ],
       "type": "node",
-      "env": { "VITE_VIDISPINE_URL": "${input:vidicoreUrl}"},
-      "stopOnEntry": true
+      "env": {
+        "VITE_VIDISPINE_URL": "${input:vidicoreUrl}"
+      },
+      "stopOnEntry": true,
+      "sourceMaps": true,
+      "serverReadyAction": {
+        "action": "debugWithChrome",
+        "killOnServerStop": true,
+        "pattern": ".*Local:.+(https?://.+)",
+        "uriFormat": "%s",
+        "webRoot": "${workspaceFolder}"
+      }
     }
   ],
-    "inputs": [
+  "inputs": [
     {
       "id": "vidicoreUrl",
       "type": "promptString",
       "description": "VidiCore URL",
       "default": "http://localhost:8080"
     }
   ]
-}
+}

.vscode/settings.json

@@ -1,5 +1,9 @@
 {
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "editor.formatOnSave": true,
+  "editor.formatOnPaste": true,
+  "editor.rulers": [100],
   "editor.codeActionsOnSave": {
     "source.fixAll.eslint": "explicit"
   }
-}
+}

.vscode/tasks.json

@@ -0,0 +1,27 @@
+{
+  "version": "2.0.0",
+  "tasks": [
+    {
+      "type": "npm",
+      "label": "prettier:check",
+      "script": "prettier:check"
+    },
+    {
+      "type": "npm",
+      "label": "prettier:write",
+      "script": "prettier:write"
+    },
+    {
+      "type": "npm",
+      "label": "lint:check",
+      "script": "lint:check",
+      "problemMatcher": []
+    },
+    {
+      "type": "npm",
+      "label": "lint:fix",
+      "script": "lint:fix",
+      "problemMatcher": []
+    }
+  ]
+}

Dockerfile

@@ -1,6 +1,6 @@
 FROM nginx
-ARG PUBLIC_URL
-COPY build /usr/share/nginx/html${PUBLIC_URL}
+ARG BASE_URL
+COPY build /usr/share/nginx/html${BASE_URL}
 COPY build/index.html /usr/share/nginx/html/
 COPY proxy.template /etc/nginx/conf.d/proxy.template
 ENV VIDISPINE_URL=http://localhost:8080

README.md

@@ -2,76 +2,84 @@
 
 See [Knowledge Base](https://support.vidispine.com/space/CKB/2249949244/VidiCore+Admin+Tool) for more information on the initial setup.
 
-The VidiCore Admin Tool showcases Vidispine API features within a simple user interface.  The application runs in a web browser and communicates directly with the API without the need for any middleware.  It works out of the box with any VidiCore API server without the need for any configuration except CORS if you run the application remotely.
+The VidiCore Admin Tool showcases Vidispine API features within a simple user interface. The application runs in a web browser and communicates directly with the API without the need for any middleware. It works out of the box with any VidiCore API server without the need for any configuration except CORS if you run the application remotely.
 
-The application runs in a single webpage which means that a bundle of static files need to be downloaded once, then the browser will dynamically rendered pages based on the JSON data returned from the Vidispine API.  The bundle can be hosted by any webserver, including an S3 bucket.  This means updates to the application can be simply rolled out by updating the bundle and reloading the browser.
+The application runs in a single webpage which means that a bundle of static files need to be downloaded once, then the browser will dynamically rendered pages based on the JSON data returned from the Vidispine API. The bundle can be hosted by any webserver, including an S3 bucket. This means updates to the application can be simply rolled out by updating the bundle and reloading the browser.
 
 The intention of the application is to demonstrate all API endpoints with a consistent user experience. This includes viewing lists or entities, forms that allow entry of any possible value within the schema, and actions to create/update/remove entities.
 
-An icon in the toolbar displays the data returned from the VidiCore API which has been used to render the UI.  For further detail, the API requests can be monitored via the browser's inspector tools.  This demonstrates to developers the correct syntax to use when integrating VidiCore API into their own products.
-
+An icon in the toolbar displays the data returned from the VidiCore API which has been used to render the UI. For further detail, the API requests can be monitored via the browser's inspector tools. This demonstrates to developers the correct syntax to use when integrating VidiCore API into their own products.
 
 # Get Started
 
 ## Source
 
-* Install `nodejs`.
+- Install `nodejs`.
+
+- Clone this project and change into the project folder.
 
-* Clone this project and change into the project folder.
+- Install dependencies.
 
-* Install dependencies.
 ```
 npm install
 ```
 
-* Start the [vite dev server](https://vitejs.dev/guide/cli.html#dev-server)
+- Start the [vite dev server](https://vitejs.dev/guide/cli.html#dev-server)
+
 ```
 npm run start
 ```
 
-* (Optionally) Set the `VITE_VIDISPINE_URL` to configure the [proxy](https://vitejs.dev/config/server-options.html#server-proxy) to avoid configuring CORS.
+- (Optionally) Set the `VITE_VIDISPINE_URL` to configure the [proxy](https://vitejs.dev/config/server-options.html#server-proxy) to avoid configuring CORS.
 
 _MacOS, Linux_
+
 ```bash
 VITE_VIDISPINE_URL='https://example.myvidispine.com' npm run start
 ```
 
 _Windows_
+
 ```cmd
 set VITE_VIDISPINE_URL='https://example.myvidispine.com'& npm run start
 ```
 
-* Open http://localhost:3000/ in a browser.
+- Open http://localhost:3000/ in a browser.
 
 ### VSCode
 
-* Use the _Run and Debug_ console to launch the dev server and set the VidiCore URL. See [launch.json](.vscode/launch.json).
+- Use the _Run and Debug_ console to launch the dev server and set the VidiCore URL. See [launch.json](.vscode/launch.json).
 
 ### Build
 
-* Compile the application locally.
+- Compile the application locally.
+
 ```
 npm run build
 ```
 
-* Build the docker image with the `latest` tag.
-Note that only files/folders specified with `!` prefix in the docker compose run -e DEBUG=1 web python console.py will be included.
+- Build the docker image with the `latest` tag.
+  Note that only files/folders specified with `!` prefix in the docker compose run -e DEBUG=1 web python console.py will be included.
+
 ```
 npm run docker:build
 ```
+
 ## Docker
 
 Docker Containers can be downloaded from Dockerhub https://hub.docker.com/r/vidispine/admin-tool/tags
 
 ### Run
 
-* Pull the latest image
+- Pull the latest image
+
 ```
 docker image pull vidispine/admin-tool:latest
 ```
 
-* Start the container with the latest image.
-  - Try changing the port from `-p 80:80` to `-p 8088:80` if running on Windows. 
+- Start the container with the latest image.
+  - Try changing the port from `-p 80:80` to `-p 8088:80` if running on Windows.
+
 ```
 docker run \
   --name vidispine-admin-tool \
@@ -82,9 +90,10 @@ docker run \
   -e VIDISPINE_URL='http://my-vidispine-server:8080' \
   -p 80:80 \
   'vidispine/admin-tool:latest'
-``` 
+```
+
+- Alternatively, start the container without specifying a VidiCore server.
 
-* Alternatively, start the container without specifying a VidiCore server.
 ```
 docker run \
   --name vidispine-admin-tool \
@@ -95,9 +104,10 @@ docker run \
   -e CONTAINER_PROXY='true' \
   -p 80:80 \
   'vidispine/admin-tool:latest'
-``` 
+```
+
+- Alternatively, use `docker compose` with the linked [`docker-compose.yaml`](./docker-compose.yaml).
 
-* Alternatively, use `docker compose` with the linked [`docker-compose.yaml`](./docker-compose.yaml).
 ```
 docker compose up -d \
   --detach \
@@ -108,15 +118,15 @@ docker compose up -d \
 
 #### Run Environment Variables
 
-* **VIDISPINE_URL**: The URL (including http/s and port) to access the Vidispine API.
+- **VIDISPINE_URL**: The URL (including http/s and port) to access the Vidispine API.
   - Do not include a trailing `/` on the URL as it will break the Nginx proxy.
   - If running in Compose/Kubernetes, this should be the service name.
   - If running on localhost either use `host.docker.internal`, the IP address of the host on the docker network, or use `--net=host`.
-* **NGINX_RESOLVER**: Nginx will proxy requests to an upstream VidiCore server, this will require a DNS address for the [resolver](https://nginx.org/en/docs/http/ngx_http_core_module.html#resolver) if using a hostname.
+- **NGINX_RESOLVER**: Nginx will proxy requests to an upstream VidiCore server, this will require a DNS address for the [resolver](https://nginx.org/en/docs/http/ngx_http_core_module.html#resolver) if using a hostname.
   - Set this to `127.0.0.11` if using within Docker Compose.
   - Set this to `169.254.169.253` if using in AWS ECS (or your [Route 53 Resolver](https://docs.aws.amazon.com/vpc/latest/userguide/AmazonDNS-concepts.html#AmazonDNS)).
-* **CONTAINER_PROXY**: Sets the `X-Proxy-URL` header on frontend requests and proxy via Nginx.
+- **CONTAINER_PROXY**: Sets the `X-Proxy-URL` header on frontend requests and proxy via Nginx.
 
 #### Ports
 
-* **80**: Web service
+- **80**: Web service

TODO.md

@@ -1,5 +1,4 @@
-TO-DO
-===
+# TO-DO
 
 1. ~~Placeholder notifications not associated with entities~~
 2. Notifications on specific entities.
@@ -48,33 +47,33 @@ TO-DO
 45. Reindex libraries
 46. Auto-projection rules
 47. Bulky metadata editing
-49. Global metadata
-50. Search document metadata
-51. Document metadata changesets
-52. Modify entity metadata changesets
-53. Entity Metadata Graph
-54. Metadata locks
-55. Metadata field enumaration values
-56. Terse schema
-57. Metadata field ACLs
-58. Metadata migrations
-59. Metadata schema
-60. Item export subtitles
-61. Specify timezone on requests
-62. Projects
-63. Search by metadata group
-64. Secrets
-65. Test shape-tag script
-66. Auto-import rules per storage
-67. Upload file to storage
-68. Import file from path
-69. Reindex single file
-70. Import/export storage definition
-71. Shape filename rules
-72. Shape storage rules
-73. Shape-tag storage rules
-74. Transfer logs
-75. Vidinet cost estimate
-76. Extract logs
-77. Resource tags
-78. Export templates
+48. Global metadata
+49. Search document metadata
+50. Document metadata changesets
+51. Modify entity metadata changesets
+52. Entity Metadata Graph
+53. Metadata locks
+54. Metadata field enumaration values
+55. Terse schema
+56. Metadata field ACLs
+57. Metadata migrations
+58. Metadata schema
+59. Item export subtitles
+60. Specify timezone on requests
+61. Projects
+62. Search by metadata group
+63. Secrets
+64. Test shape-tag script
+65. Auto-import rules per storage
+66. Upload file to storage
+67. Import file from path
+68. Reindex single file
+69. Import/export storage definition
+70. Shape filename rules
+71. Shape storage rules
+72. Shape-tag storage rules
+73. Transfer logs
+74. Vidinet cost estimate
+75. Extract logs
+76. Resource tags
+77. Export templates

docker-compose.yaml

@@ -6,4 +6,4 @@ services:
       NGINX_RESOLVER: 127.0.0.11
       CONTAINER_PROXY: true
     ports:
-      - ${ADMINTOOL_PORT:-80}:80
+      - ${ADMINTOOL_PORT:-80}:80