From 52e5839aab957e4c404f53b874876164c575642f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Daniel=20G=C3=B6bel?= <dgoebel@techfak.uni-bielefeld.de>
Date: Wed, 23 Nov 2022 18:34:08 +0100
Subject: [PATCH] Add content to README & DEVELOPING and fix typescript version
#25
---
CHANGELOG.md | 0
DEVELOPING.md | 36 +++++++++++++++++++++++++++++
README.md | 51 +++++++++++------------------------------
package-lock.json | 14 +++++------
package.json | 2 +-
src/views/LoginView.vue | 2 +-
6 files changed, 58 insertions(+), 47 deletions(-)
create mode 100644 CHANGELOG.md
create mode 100644 DEVELOPING.md
diff --git a/CHANGELOG.md b/CHANGELOG.md
new file mode 100644
index 0000000..e69de29
diff --git a/DEVELOPING.md b/DEVELOPING.md
new file mode 100644
index 0000000..7cb00f0
--- /dev/null
+++ b/DEVELOPING.md
@@ -0,0 +1,36 @@
+# Development Setup
+
+## Install Dependencies
+Install dependencies with `npm`.
+```shell
+npm install
+```
+
+## Environment Setup
+Create the file `.env` with the following (or similar) content. See the [README](README.md) for details on these
+environment variables.
+```
+VITE_API_BASE_URL=http://localhost:9999/api
+VITE_S3_URL=http://localhost:9998
+```
+## Backend Setup
+Clone the [repository](https://gitlab.ub.uni-bielefeld.de/denbi/object-storage-access) for the backend and set up the
+service for developing.
+
+## Run linter and type check
+```shell
+npm run lint
+npm run type-check
+```
+
+## Run Dev Server
+Start the dev service with `npm`
+```shell
+npm run dev
+```
+
+## Create axios client
+To create the axios client from the OpenAPI definition of the backend, start the backend and execute the following command
+```shell
+npm run generate-client
+```
diff --git a/README.md b/README.md
index cf331e8..c563b1b 100644
--- a/README.md
+++ b/README.md
@@ -1,46 +1,21 @@
# ProxyAPI-UI
-This template should help get you started developing with Vue 3 in Vite.
+## Description
-## Recommended IDE Setup
+This is the Frontend to manage your S3 Buckets and start Workflows. For further information visit the repository for the
+backend https://gitlab.ub.uni-bielefeld.de/denbi/object-storage-access
-[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
+## Environment Variables
-## Type Support for `.vue` Imports in TS
+These needs to be present when bundling the JavaScript files.
+This needs to be considered when building docker images.
-TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
+| Variable | Default | Value | Description |
+|---------------------|---------------------------|-----------|----------------------------------------|
+| `VITE_API_BASE_URL` | http://localhost:9999/api | HTTP URL | Base URL for the API as backend |
+| `VITE_S3_URL` | unset | HTTP URL | URL of the S3 storage to interact with |
-If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
+## Getting started
-1. Disable the built-in TypeScript Extension
- 1) Run `Extensions: Show Built-in Extensions` from VSCode's command palette
- 2) Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
-2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.
-
-## Customize configuration
-
-See [Vite Configuration Reference](https://vitejs.dev/config/).
-
-## Project Setup
-
-```sh
-npm install
-```
-
-### Compile and Hot-Reload for Development
-
-```sh
-npm run dev
-```
-
-### Type-Check, Compile and Minify for Production
-
-```sh
-npm run build
-```
-
-### Lint with [ESLint](https://eslint.org/)
-
-```sh
-npm run lint
-```
+This service depends on multiple other services. See [DEVELOPING.md](DEVELOPING.md) how to set these up for developing
+on your local machine.
diff --git a/package-lock.json b/package-lock.json
index 099abb1..0bd1e52 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -39,7 +39,7 @@
"prettier": "^2.8.0",
"rollup-plugin-node-polyfills": "^0.2.1",
"sass": "^1.56.1",
- "typescript": "~4.9.3",
+ "typescript": "~4.7.4",
"vite": "^3.2.4",
"vue-tsc": "^1.0.9"
}
@@ -5719,9 +5719,9 @@
}
},
"node_modules/typescript": {
- "version": "4.9.3",
- "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.3.tgz",
- "integrity": "sha512-CIfGzTelbKNEnLpLdGFgdyKhG23CKdKgQPOBc+OUNrkJ2vr+KSzsSV5kq5iWhEQbok+quxgGzrAtGWCyU7tHnA==",
+ "version": "4.7.4",
+ "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz",
+ "integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==",
"devOptional": true,
"bin": {
"tsc": "bin/tsc",
@@ -10421,9 +10421,9 @@
"dev": true
},
"typescript": {
- "version": "4.9.3",
- "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.3.tgz",
- "integrity": "sha512-CIfGzTelbKNEnLpLdGFgdyKhG23CKdKgQPOBc+OUNrkJ2vr+KSzsSV5kq5iWhEQbok+quxgGzrAtGWCyU7tHnA==",
+ "version": "4.7.4",
+ "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz",
+ "integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==",
"devOptional": true
},
"uglify-js": {
diff --git a/package.json b/package.json
index 432c5c4..d5ef606 100644
--- a/package.json
+++ b/package.json
@@ -42,7 +42,7 @@
"prettier": "^2.8.0",
"rollup-plugin-node-polyfills": "^0.2.1",
"sass": "^1.56.1",
- "typescript": "~4.9.3",
+ "typescript": "~4.7.4",
"vite": "^3.2.4",
"vue-tsc": "^1.0.9"
}
diff --git a/src/views/LoginView.vue b/src/views/LoginView.vue
index 28cfbab..6d36bf3 100644
--- a/src/views/LoginView.vue
+++ b/src/views/LoginView.vue
@@ -36,7 +36,7 @@ onMounted(() => {
aria-atomic="true"
class="toast text-bg-danger align-items-center border-0"
style="--bs-bg-opacity: 0.7"
- data-bs-config='{"delay":8000}'
+ data-bs-config="{'delay': 8000}"
data-bs-autohide="true"
id="loginErrorToast"
>
--
GitLab