Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update README #1303

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
131 changes: 39 additions & 92 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,113 +1,60 @@
# Assemblyline UI Frontend

This repo is dedicated for the new version off Assemblyline 4 UI. It uses React as the framework and Material UI for the visual components.

## Install dev environment pre-requisites

### Install NodeJS (Ubuntu)

Follow these simple command to get NodeJS installed

curl -sL https://deb.nodesource.com/setup_18.x | sudo -E bash -
sudo apt-get install gcc g++ make
sudo apt-get install -y nodejs

### Install Yarn (NPM modules manager)

curl -sL https://dl.yarnpkg.com/debian/pubkey.gpg | gpg --dearmor | sudo tee /usr/share/keyrings/yarnkey.gpg >/dev/null
echo "deb [signed-by=/usr/share/keyrings/yarnkey.gpg] https://dl.yarnpkg.com/debian stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
sudo apt-get update && sudo apt-get install yarn

### Install NPM dependencies

Go to your `assemblyline-ui-frontend` directory and type:

yarn install

### Install docker (Ubuntu)

Follow these simple commands to get Docker running on your machine:

# Add Docker repository
sudo apt-get update
sudo apt-get install -y apt-transport-https ca-certificates curl gnupg-agent software-properties-common
curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo apt-key add -
sudo apt-key fingerprint 0EBFCD88
sudo add-apt-repository "deb [arch=amd64] https://download.docker.com/linux/ubuntu $(lsb_release -cs) stable"
[![Discord](https://img.shields.io/badge/chat-on%20discord-7289da.svg?sanitize=true)](https://discord.gg/GUAy9wErNu)
[![](https://img.shields.io/discord/908084610158714900)](https://discord.gg/GUAy9wErNu)
[![Static Badge](https://img.shields.io/badge/github-assemblyline-blue?logo=github)](https://github.com/CybercentreCanada/assemblyline)
[![Static Badge](https://img.shields.io/badge/github-assemblyline--ui--frontend-blue?logo=github)](https://github.com/CybercentreCanada/assemblyline-ui-frontend)
[![GitHub Issues or Pull Requests by label](https://img.shields.io/github/issues/CybercentreCanada/assemblyline/ui-frontend)](https://github.com/CybercentreCanada/assemblyline/issues?q=is:issue+is:open+label:ui-frontend)
[![License](https://img.shields.io/github/license/CybercentreCanada/assemblyline-ui-frontend)](./LICENSE.md)

# Install Docker
sudo apt-get install -y docker-ce docker-ce-cli containerd.io

# Test Docker installation
sudo docker run hello-world

### Install docker-compose

Installing docker-compose is done the same way on all Linux distros. Follow these simple instructions:

# Install docker-compose
sudo curl -L "https://github.com/docker/compose/releases/download/1.28.5/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose
sudo chmod +x /usr/local/bin/docker-compose

# Test docker-compose installation
docker-compose --version

For reference, here are the instructions on Docker’s website: <https://docs.docker.com/compose/install/>

## Configure the dev environment

### Setup Webpack for debugging behing a proxy

Create a file named `.env.local` at the root of the assemblyline-ui-frontend directory with the following content:

HOST=0.0.0.0
WDS_SOCKET_PORT=443
HTTPS=true
BROWSER=none

### Setup docker compose environment

#### Setup IP routing

Create a file in the `docker` directory named `.env`.
# Assemblyline UI Frontend

This file should only contain the following where `<YOUR_IP>` is replaced by your dev computer IP.
This repo is dedicated for the new version of Assemblyline 4 UI. It uses the React library and Material UI for the visual components.

EXTERNAL_IP=<YOUR_IP>
## Image variants and tags

#### Setup Assemblyline config file
| **Tag Type** | **Description** | **Example Tag** |
| :----------: | :----------------------------------------------------------------------------------------------- | :------------------------: |
| latest | The most recent build (can be unstable). | `latest` |
| build_type | The type of build used. `dev` is the latest unstable build. `stable` is the latest stable build. | `stable` or `dev` |
| series | Complete build details, including version and build type: `version.buildType`. | `4.5.stable`, `4.5.1.dev3` |

From the `docker` directory, copy the file `config.yml.template` to `config.yml` in the same directory.
#### Running this component

Change the `<YOUR_IP>` in the newly created `config.yml`file to the IP of your dev machine.
```bash
docker run --name frontend cccs/assemblyline-ui-frontend
```

#### Setup Assemblyline classification engine file
## Development

From the `docker` directory, copy the file `classification.yml.template` to `classification.yml` in the same directory.
For information on frontend development, follow this [guide](https://cybercentrecanada.github.io/assemblyline4_docs/developer_manual/frontend/frontend/).

Change the `enforce` value to `true` in the `classification.yml` file to turn on the classification engine.
## Documentation

## Launch the dev environment
For more information about this Assemblyline component, follow this [overview](https://cybercentrecanada.github.io/assemblyline4_docs/overview/architecture/) of the system's architecture.

### Dependencies
---

Go to the `docker` directory and run the following command to launch the Assemblyline DB and UI.
# Front-end de l'interface utilisateur d'Assemblyline

docker-compose up
Ce repo est dédié à la nouvelle version d'Assemblyline 4 UI. Elle utilise la bibliothèque React et Material UI pour les composants visuels.

### Frontend
## Variantes et étiquettes d'image

Simply use the `npm start script` to launch the frontend.
| **Type d'étiquette** | **Description** | **Exemple d'étiquette** |
| :------------------: | :--------------------------------------------------------------------------------------------------------------- | :------------------------: |
| dernière | La version la plus récente (peut être instable). | `latest` |
| build_type | Le type de compilation utilisé. `dev` est la dernière version instable. `stable` est la dernière version stable. | `stable` ou `dev` |

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

build_type --> type de déploiement

| séries | Le détail de compilation utilisé, incluant la version et le type de compilation : `version.buildType`. | `4.5.stable`, `4.5.1.dev3` |

### Once dependencies and frontend started
#### Exécuter ce composant

Access the dev frontend at the following link: `https://<YOUR_IP>.nip.io`
```bash
docker run --name frontend cccs/assemblyline-ui-frontend
```

## Testing
## Développement

Testing is done through the `jest` framework.
Pour des informations sur le développement du frontend, suivez ce [guide](https://cybercentrecanada.github.io/assemblyline4_docs/developer_manual/frontend/frontend/).

To run the tests, simply use the `npm test` command. (Development dependencies should already have been installed
previously via the `yarn install` command).
## Documentation

NOTE: the test command will only run tests related to changed files based on git.
Pour plus d'informations sur ce composant Assemblyline, suivez ce [overview](https://cybercentrecanada.github.io/assemblyline4_docs/overview/architecture/) de l'architecture du système.