climb-onyx-gui 0.16.3 → 0.16.4-dev
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +69 -1
- package/dist/climb-onyx-gui.js +9198 -9197
- package/dist/components/Graphs.d.ts +2 -2
- package/dist/interfaces.d.ts +4 -2
- package/dist/style.css +1 -5
- package/dist/utils/functions.d.ts +12 -10
- package/package.json +3 -2
package/README.md
CHANGED
|
@@ -1 +1,69 @@
|
|
|
1
|
-
|
|
1
|
+
|
|
2
|
+
|
|
3
|
+
# Onyx Graphical User Interface
|
|
4
|
+
|
|
5
|
+
## Overview
|
|
6
|
+
|
|
7
|
+
A Graphical user interface for [Onyx](https://github.com/CLIMB-TRE/onyx), with functionality for browsing and filtering records/analyses, viewing their details and change history, exporting data, and a customisable dashboard for generating graphs of aggregated fields.
|
|
8
|
+
|
|
9
|
+
The Onyx GUI is currently available as an [npm package](https://www.npmjs.com/package/climb-onyx-gui) under the name `climb-onyx-gui`, and is implemented within the Onyx [JupyterLab extension](https://github.com/CLIMB-TRE/onyx-extension), as part of the [CLIMB-TRE](https://climb-tre.github.io) project.
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
## Setup
|
|
16
|
+
|
|
17
|
+
### Install from [npm](https://www.npmjs.com/package/climb-onyx-gui)
|
|
18
|
+
|
|
19
|
+
```
|
|
20
|
+
$ npm install climb-onyx-gui
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
The Onyx GUI can then be imported as a React component:
|
|
24
|
+
|
|
25
|
+
```typescript
|
|
26
|
+
import React from "react";
|
|
27
|
+
import ReactDOM from "react-dom";
|
|
28
|
+
import Onyx from "climb-onyx-gui";
|
|
29
|
+
import "climb-onyx-gui/dist/style.css";
|
|
30
|
+
|
|
31
|
+
ReactDOM.render(
|
|
32
|
+
<React.StrictMode>
|
|
33
|
+
<Onyx
|
|
34
|
+
httpPathHandler={httpPathHandler}
|
|
35
|
+
s3PathHandler={s3PathHandler}
|
|
36
|
+
fileWriter={fileWriter}
|
|
37
|
+
extVersion={extVersion}
|
|
38
|
+
getItem={getItem}
|
|
39
|
+
setItem={setItem}
|
|
40
|
+
setTitle={setTitle}
|
|
41
|
+
/>
|
|
42
|
+
</React.StrictMode>,
|
|
43
|
+
document.getElementById("root")
|
|
44
|
+
);
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
See the [JupyterLab extension](https://github.com/CLIMB-TRE/onyx-extension/blob/main/src/onyxWidget.tsx) for an example implementation.
|
|
48
|
+
|
|
49
|
+
### Local development
|
|
50
|
+
|
|
51
|
+
Clone the repository:
|
|
52
|
+
|
|
53
|
+
```
|
|
54
|
+
$ git clone https://github.com/CLIMB-TRE/onyx-gui
|
|
55
|
+
$ cd onyx-gui/
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
Copy and edit `.env.local` with `VITE_ONYX_DOMAIN` and `VITE_ONYX_TOKEN` for your development instance of Onyx:
|
|
59
|
+
|
|
60
|
+
```
|
|
61
|
+
$ cp .env.local.example .env.local
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
Install dependencies and run the development server:
|
|
65
|
+
|
|
66
|
+
```
|
|
67
|
+
$ npm install
|
|
68
|
+
$ npm run dev
|
|
69
|
+
```
|