From d2da067b7f825e013a042fdb5ec114dc68bf96e0 Mon Sep 17 00:00:00 2001
From: AndiMajore <andi.majore@googlemail.com>
Date: Wed, 5 Apr 2023 16:13:29 +0200
Subject: [PATCH] added burg report panel

---
 src/app/app.module.ts                         |  2 +
 .../analysis-panel.component.html             |  5 ++
 .../analysis-panel.component.ts               |  4 ++
 .../bug-report/bug-report.component.html      | 49 +++++++++++++++++++
 .../bug-report/bug-report.component.scss      |  7 +++
 .../bug-report/bug-report.component.spec.ts   | 25 ++++++++++
 .../bug-report/bug-report.component.ts        | 34 +++++++++++++
 .../license-agreement.component.html          |  2 +-
 .../components/network/network.component.html |  5 ++
 .../components/network/network.component.ts   |  4 ++
 .../explorer-page.component.html              |  1 +
 .../drugstone-config.service.ts               |  1 +
 .../netex-controller.service.ts               |  8 +++
 13 files changed, 146 insertions(+), 1 deletion(-)
 create mode 100644 src/app/components/bug-report/bug-report.component.html
 create mode 100644 src/app/components/bug-report/bug-report.component.scss
 create mode 100644 src/app/components/bug-report/bug-report.component.spec.ts
 create mode 100644 src/app/components/bug-report/bug-report.component.ts

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 29c00da0..4715e5a0 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -53,6 +53,7 @@ import { SummaryNodeComponent } from './pages/explorer-page/summary-node/summary
 import { NetworkOverviewComponent } from './pages/explorer-page/network-overview/network-overview/network-overview.component';
 import { InfoTileEdgeComponent } from './components/info-tile-edge/info-tile-edge/info-tile-edge.component';
 import { NetworkEmptyWarningComponent } from './components/network-empty-warning/network-empty-warning.component';
+import { BugReportComponent } from './components/bug-report/bug-report.component';
 
 
 @NgModule({
@@ -95,6 +96,7 @@ import { NetworkEmptyWarningComponent } from './components/network-empty-warning
     NetworkOverviewComponent,
     InfoTileEdgeComponent,
     NetworkEmptyWarningComponent,
+    BugReportComponent,
   ],
   imports: [
     BrowserModule,
diff --git a/src/app/components/analysis-panel/analysis-panel.component.html b/src/app/components/analysis-panel/analysis-panel.component.html
index ca9f8736..35cff928 100644
--- a/src/app/components/analysis-panel/analysis-panel.component.html
+++ b/src/app/components/analysis-panel/analysis-panel.component.html
@@ -70,6 +70,11 @@
                        [ngClass]="{ 'text-small': drugstoneConfig.smallStyle }"
                        [tooltipStyleClass]="'drgstn drgstn-tooltip drgstn-tooltip-left'"
                        (click)="showEULA()">Show EULA</a>
+                  <a class="dropdown-item" pTooltip="Open window to submit a bug report"
+                     tooltipPosition="left"
+                     [ngClass]="{ 'text-small': drugstoneConfig.smallStyle }"
+                     [tooltipStyleClass]="'drgstn drgstn-tooltip drgstn-tooltip-left'"
+                     (click)="openBugreport()">Report bug</a>
                     <a class="dropdown-item" pTooltip="Opens Drugst.One website"
                        [ngClass]="{ 'text-small': drugstoneConfig.smallStyle }" tooltipPosition="left"
                        [tooltipStyleClass]="'drgstn drgstn-tooltip drgstn-tooltip-left'" target="_blank"
diff --git a/src/app/components/analysis-panel/analysis-panel.component.ts b/src/app/components/analysis-panel/analysis-panel.component.ts
index 5c261c65..b9b152d6 100644
--- a/src/app/components/analysis-panel/analysis-panel.component.ts
+++ b/src/app/components/analysis-panel/analysis-panel.component.ts
@@ -583,4 +583,8 @@ export class AnalysisPanelComponent implements OnInit, OnChanges, AfterViewInit
     this.drugstoneConfig.showLicense = true;
   }
 
+  public openBugreport() {
+    this.drugstoneConfig.showBugreport = true;
+  }
+
 }
diff --git a/src/app/components/bug-report/bug-report.component.html b/src/app/components/bug-report/bug-report.component.html
new file mode 100644
index 00000000..1605c042
--- /dev/null
+++ b/src/app/components/bug-report/bug-report.component.html
@@ -0,0 +1,49 @@
+<div
+  class="modal absolute"
+  [class.is-active]="drugstoneConfig.showBugreport"
+>
+  <div class="modal-background"></div>
+  <div class="modal-card">
+    <header class="modal-card-head">
+      <p class="modal-card-title">
+        <app-fa-solid-icon icon="bug"></app-fa-solid-icon>
+        Submit Bug report
+      </p>
+    </header>
+    <section class="modal-card-body">
+      <div class="is-text-align-justify" style="margin-bottom: 16px">
+        <i
+        >If you experienced some unexpected behaviour and error or another clear sign for a bug we are happy to receive
+          your report to improve the Drugst.One application:</i
+        >
+      </div>
+      <div class="bugreport-input">
+        <input #title class="input" type="text" placeholder="Title">
+        <textarea #body class="textarea" placeholder="Report details about the bug" rows="10"></textarea>
+        <input #email class="input" type="text" placeholder="Optional: Email">
+      </div>
+    </section>
+    <footer class="modal-card-foot">
+      <button
+        (click)="send(title.value, body.value, email.value)"
+        class="button is-rounded has-tooltip is-success"
+        pTooltip="Send bug report to contact@drugst.one"
+        [tooltipStyleClass]="'drgstn drgstn-tooltip drgstn-tooltip-top'"
+        tooltipPosition="top"
+      >
+        <app-fa-solid-icon icon="bug"></app-fa-solid-icon>
+        Send
+      </button>
+      <button
+        (click)="close()"
+        class="button is-rounded has-tooltip is-danger"
+        pTooltip="Close without sending bug report"
+        [tooltipStyleClass]="'drgstn drgstn-tooltip drgstn-tooltip-top'"
+        tooltipPosition="top"
+      >
+        <app-fa-solid-icon icon="times"></app-fa-solid-icon>
+        Close
+      </button>
+    </footer>
+  </div>
+</div>
diff --git a/src/app/components/bug-report/bug-report.component.scss b/src/app/components/bug-report/bug-report.component.scss
new file mode 100644
index 00000000..4f996bad
--- /dev/null
+++ b/src/app/components/bug-report/bug-report.component.scss
@@ -0,0 +1,7 @@
+.bugreport-input{
+  width: 95%
+}
+
+.textarea{
+  margin-top:8px !important;
+}
diff --git a/src/app/components/bug-report/bug-report.component.spec.ts b/src/app/components/bug-report/bug-report.component.spec.ts
new file mode 100644
index 00000000..fc8c3b52
--- /dev/null
+++ b/src/app/components/bug-report/bug-report.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BugReportComponent } from './bug-report.component';
+
+describe('BugReportComponent', () => {
+  let component: BugReportComponent;
+  let fixture: ComponentFixture<BugReportComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ BugReportComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(BugReportComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/components/bug-report/bug-report.component.ts b/src/app/components/bug-report/bug-report.component.ts
new file mode 100644
index 00000000..8e39e258
--- /dev/null
+++ b/src/app/components/bug-report/bug-report.component.ts
@@ -0,0 +1,34 @@
+import {Component, OnInit} from '@angular/core';
+import {DrugstoneConfigService} from '../../services/drugstone-config/drugstone-config.service';
+import {NetexControllerService} from '../../services/netex-controller/netex-controller.service';
+
+@Component({
+  selector: 'app-bug-report',
+  templateUrl: './bug-report.component.html',
+  styleUrls: ['./bug-report.component.scss']
+})
+export class BugReportComponent implements OnInit {
+
+  constructor(public drugstoneConfig: DrugstoneConfigService, public http: NetexControllerService) {
+  }
+
+  public close() {
+    this.drugstoneConfig.showBugreport = false;
+  }
+
+  public send(title, body, email) {
+    this.http.sendBugreport({title, body, email}).then(response => {
+      if (response.status === 200) {
+        this.close();
+      } else {
+        console.log('Error sending bugreport');
+      }
+    }).finally(() => {
+      this.close();
+    }).catch(console.error);
+  }
+
+  ngOnInit(): void {
+  }
+
+}
diff --git a/src/app/components/license-agreement/license-agreement.component.html b/src/app/components/license-agreement/license-agreement.component.html
index b8629865..da930ddb 100644
--- a/src/app/components/license-agreement/license-agreement.component.html
+++ b/src/app/components/license-agreement/license-agreement.component.html
@@ -13,7 +13,7 @@
     <section class="modal-card-body">
       <div class="is-text-align-justify" style="margin-bottom: 16px">
         <i
-          >For the use of licenced data of sources like DrugBank and OMIM,
+          >For the use of licensed data of sources like DrugBank and OMIM,
           partially provided by the NeDRex database, the terms of use for data
           of the NeDRex platform have to be accepted:</i
         >
diff --git a/src/app/components/network/network.component.html b/src/app/components/network/network.component.html
index 247e8450..e198d47e 100644
--- a/src/app/components/network/network.component.html
+++ b/src/app/components/network/network.component.html
@@ -48,6 +48,11 @@
                        [ngClass]="{ 'text-small': drugstoneConfig.smallStyle }"
                        [tooltipStyleClass]="'drgstn drgstn-tooltip drgstn-tooltip-left'"
                        (click)="showEULA()">Show EULA</a>
+                  <a class="dropdown-item" pTooltip="Open window to submit a bug report"
+                       tooltipPosition="left"
+                       [ngClass]="{ 'text-small': drugstoneConfig.smallStyle }"
+                       [tooltipStyleClass]="'drgstn drgstn-tooltip drgstn-tooltip-left'"
+                       (click)="openBugreport()">Report bug</a>
                     <a class="dropdown-item" pTooltip="Opens Drugst.One website" [ngClass]="{ 'text-small': drugstoneConfig.smallStyle }" tooltipPosition="left"
                        [tooltipStyleClass]="'drgstn drgstn-tooltip drgstn-tooltip-left'" target="_blank"
                        href="https://drugst.one/home">About Drugst.One</a>
diff --git a/src/app/components/network/network.component.ts b/src/app/components/network/network.component.ts
index 4c962835..9bfaccb7 100644
--- a/src/app/components/network/network.component.ts
+++ b/src/app/components/network/network.component.ts
@@ -671,4 +671,8 @@ export class NetworkComponent implements OnInit {
   public showEULA() {
     this.drugstoneConfig.showLicense = true;
   }
+
+  public openBugreport() {
+    this.drugstoneConfig.showBugreport = true;
+  }
 }
diff --git a/src/app/pages/explorer-page/explorer-page.component.html b/src/app/pages/explorer-page/explorer-page.component.html
index 6b2d7ded..1adab2e1 100644
--- a/src/app/pages/explorer-page/explorer-page.component.html
+++ b/src/app/pages/explorer-page/explorer-page.component.html
@@ -9,6 +9,7 @@
     <app-parser-warning></app-parser-warning>
     <app-privacy-banner></app-privacy-banner>
     <app-license-agreement></app-license-agreement>
+    <app-bug-report></app-bug-report>
 
     <app-launch-analysis
       [(show)]="showAnalysisDialog"
diff --git a/src/app/services/drugstone-config/drugstone-config.service.ts b/src/app/services/drugstone-config/drugstone-config.service.ts
index c83d3f68..6da65352 100644
--- a/src/app/services/drugstone-config/drugstone-config.service.ts
+++ b/src/app/services/drugstone-config/drugstone-config.service.ts
@@ -18,6 +18,7 @@ export class DrugstoneConfigService {
   public smallStyle = false;
 
   public showLicense = false;
+  public showBugreport = false;
 
   constructor() {
   }
diff --git a/src/app/services/netex-controller/netex-controller.service.ts b/src/app/services/netex-controller/netex-controller.service.ts
index 230f850c..f87da76a 100644
--- a/src/app/services/netex-controller/netex-controller.service.ts
+++ b/src/app/services/netex-controller/netex-controller.service.ts
@@ -100,6 +100,7 @@ export class NetexControllerService {
     return this.http.post<any>(`${this.getBackend()}adjacent_drugs/`, params).toPromise();
   }
 
+
   public graphExport(graph_data: { edges: EdgeType[], nodes: Node[] }) {
     /**
      * Sends complete graph data to backend where it is written to graphml or json File.
@@ -117,6 +118,13 @@ export class NetexControllerService {
     return this.http.post(`${this.getBackend()}fetch_edges/`, payload).toPromise();
   }
 
+  public sendBugreport(payload): Promise<any> {
+    /**
+     * Sends a bugreport to the backend
+     */
+    return this.http.post(`${this.getBackend()}send_bugreport/`, payload).toPromise();
+  }
+
 
   public async getLicense(): Promise<any> {
     /**
-- 
GitLab