Synced dashboard features, refactors

Author: lukekoch

flask-backend/src/modules/analyses.py

@@ -159,17 +159,18 @@ def __generate_analyses_name(assembly_name, analyses_type):
     try:
         connection, cursor, error = connect()
         cursor.execute(
-            f"SELECT AUTO_INCREMENT FROM information_schema.TABLES WHERE TABLE_SCHEMA='{DB_NAME}' AND TABLE_NAME='analyses'"
+            "SELECT MAX(id) FROM analyses"
         )
         auto_increment_counter = cursor.fetchone()[0]
+        print(auto_increment_counter)
 
         if not auto_increment_counter:
             next_id = 1
         else:
-            next_id = auto_increment_counter
+            next_id = auto_increment_counter + 1
 
-        cursor.execute("ALTER TABLE analyses AUTO_INCREMENT = %s", (next_id + 1,))
-        connection.commit()
+        # cursor.execute("ALTER TABLE analyses AUTO_INCREMENT = %s", (next_id + 1,))
+        # connection.commit()
     except Exception as err:
         return 0, 0, createNotification(message=str(err))
 

mysql/create_gnom_db.sql

@@ -506,6 +506,48 @@ CREATE TABLE IF NOT EXISTS `gnom_db`.`tags` (
 ENGINE = InnoDB;
 
 
+-- -----------------------------------------------------
+-- Table `gnom_db`.`taxaminerDiamond`
+-- -----------------------------------------------------
+CREATE TABLE `taxaminerDiamond` (
+	`qseqid` VARCHAR(100) NULL DEFAULT NULL COLLATE 'utf8mb4_0900_ai_ci',
+	`sseqid` VARCHAR(50) NULL DEFAULT NULL COLLATE 'utf8mb4_0900_ai_ci',
+	`pident` FLOAT NULL DEFAULT NULL,
+	`length` INT(10) NULL DEFAULT NULL,
+	`mismatch` INT(10) NULL DEFAULT NULL,
+	`gapopen` INT(10) NULL DEFAULT NULL,
+	`qstart` INT(10) NULL DEFAULT NULL,
+	`qend` INT(10) NULL DEFAULT NULL,
+	`sstart` INT(10) NULL DEFAULT NULL,
+	`send` INT(10) NULL DEFAULT NULL,
+	`evalue` FLOAT NULL DEFAULT NULL,
+	`bitscore` FLOAT NULL DEFAULT NULL,
+	`taxids` VARCHAR(1000) NULL DEFAULT NULL COLLATE 'utf8mb4_0900_ai_ci',
+	`taxname` VARCHAR(200) NULL DEFAULT NULL COLLATE 'utf8mb4_0900_ai_ci',
+	`analysisID` INT(10) NULL DEFAULT NULL,
+	`assemblyID` INT(10) NULL DEFAULT NULL,
+	INDEX `Index 1` (`qseqid`, `analysisID`, `assemblyID`) USING BTREE
+)
+COLLATE='utf8mb4_0900_ai_ci'
+ENGINE=InnoDB
+;
+
+
+-- -----------------------------------------------------
+-- Table `gnom_db`.`taxaminerDiamond`
+-- -----------------------------------------------------
+CREATE TABLE `settingsTaxaminer` (
+	`analysisID` INT(10) NOT NULL DEFAULT '0',
+	`userID` INT(10) NOT NULL DEFAULT '0',
+	`custom_fields` JSON NULL DEFAULT NULL,
+	PRIMARY KEY (`analysisID`, `userID`) USING BTREE
+)
+COLLATE='utf8mb4_0900_ai_ci'
+ENGINE=InnoDB
+;
+
+
+
 -- -----------------------------------------------------
 -- Table `gnom_db`.`runningTasks`
 -- -----------------------------------------------------

react-frontend/package.json

@@ -9,6 +9,7 @@
     "@types/react-select": "^5.0.1",
     "bcryptjs": "2.4.3",
     "bootstrap": "^5.2.1",
+    "bootstrap-icons": "^1.10.3",
     "classnames": "2.3.1",
     "grommet-icons": "4.7.0",
     "node-polyfill-webpack-plugin": "1.1.4",
@@ -49,7 +50,8 @@
     "rules": {
       "@typescript-eslint/explicit-module-boundary-types": "off",
       "@typescript-eslint/no-unused-vars": "off",
-      "no-use-before-define": "off"
+      "no-use-before-define": "off",
+      "@typescript-eslint/ban-types": "off"
     },
     "overrides": [
       {
@@ -100,6 +102,9 @@
     "@types/node": "16.11.17",
     "@types/plotly.js": "^1.54.18",
     "@types/react": "17.0.38",
+    "@types/react-bootstrap-table-next": "^4.0.18",
+    "@types/react-bootstrap-table2-filter": "^1.3.4",
+    "@types/react-bootstrap-table2-paginator": "^2.1.2",
     "@types/react-dom": "17.0.11",
     "@types/react-plotly.js": "^2.5.1",
     "@types/uuid": "^8.3.3",

react-frontend/src/api/index.ts

@@ -4,7 +4,6 @@ import { AssemblyInterface, AssemblyTagInterface } from "../tsInterfaces/tsInter
 import { Observable, of } from "rxjs";
 import { fromFetch } from "rxjs/fetch";
 import { catchError, switchMap } from "rxjs/operators";
-import { request } from "http";
 
 // =============================== users =============================== //
 // USER AUTHENTIFCATION
@@ -1759,7 +1758,7 @@ export function fetchTaxaminerMain (
   })
 }
 
-// ==== Taxaminer Metadate ==== //
+// ==== Taxaminer Metadata ==== //
 export function fetchTaxaminerMetadata (
   assembly_id: number, 
   taxaminer_id: number,
@@ -1769,7 +1768,7 @@ export function fetchTaxaminerMetadata (
   return fetch(
     `${process.env.REACT_APP_API_ADRESS}/taxaminer/summary?assemblyID=${assembly_id}&analysisID=${taxaminer_id}&userID=${userID}&token=${token}`
   )
-  .then(response => response.text())
+  .then(response => response.json())
   .then((data: any) => data.payload)
   .catch((error) => {
     console.error(error);

react-frontend/src/screens/MainRouter/components/AssemblyInformation/components/TaxonomicAssignmentDashboard/dashboard.tsx

@@ -2,21 +2,21 @@ import React from 'react';
 import Row from 'react-bootstrap/Row';
 import Col from 'react-bootstrap/Col'
 import Container from 'react-bootstrap/esm/Container';
-import { Tabs, Tab } from "react-bootstrap";
+import { Tabs, Tab, Card } from "react-bootstrap";
 import { DataSetSelector } from './sidebar/DataSet/dataset_selector';
 import SelectionView from './sidebar/selection/selection';
 import { DataSetMeta } from './sidebar/DataSet/dataset_metadata';
 import Scatter3D from './scatterplot3d/scatter3d';
 import PCAPlot from './sidebar/PCAPlot/PCAPlot';
 import { FilterUI } from './sidebar/Filters/filterui';
 import Table from './sidebar/DiamondTable/diamondtable';
-import { TableView } from './tableview/TableView';
 import ScatterMatrix from './sidebar/ScatterMatrix/ScatterMatrix';
 
 // Stylesheet
 import 'bootstrap/dist/css/bootstrap.min.css';
 import 'bootstrap-icons/font/bootstrap-icons.css';
-import { fetchTaxaminerMain, fetchTaxaminerScatterplot, fetchTaxaminerSeq } from '../../../../../../api';
+import { fetchTaxaminerScatterplot, fetchTaxaminerSeq } from '../../../../../../api';
+import { TableView } from './tableview';
 
 
 interface State {
@@ -36,6 +36,7 @@ interface State {
     token: string
     fields: string[]
     g_options: { label: string; value: string; }[]
+    customFields: any[]
     scatter_points: any
     is_loading: boolean
 }
@@ -71,6 +72,7 @@ class TaxaminerDashboard extends React.Component<Props, State> {
             token: token,
             fields: [],
             g_options: [],
+            customFields: [],
             scatter_points: [],
             is_loading: false
         }
@@ -88,22 +90,20 @@ class TaxaminerDashboard extends React.Component<Props, State> {
         this.setState({is_loading: true})
         this.setState({dataset_id: id}, () => {
             fetchTaxaminerScatterplot(this.props.assembly_id, id, this.state.userID, this.state.token)
-		    .then(data => {
+            .then(data => {
                 const main_data = {}
-			    this.setState( {scatter_points: data}, () => {
-                    for (const chunk of this.state.scatter_points) {
+                this.setState( {scatter_points: data}, () => {
+                    for (const chunk of data as unknown as any[]) {
                         for (const row of chunk) {
                             const key = row.g_name as string
-                            // @ts-ignore
-                            main_data[key] = row
+                            (main_data as any)[key] = row
                         }
                     }
                     this.setState({data: main_data})
 
                     // Infer fields from first row
                     if (main_data) {
-                        // @ts-ignore
-                        const proto_row = main_data[Object.keys(main_data)[0]]
+                        const proto_row = (main_data as any)[Object.keys(main_data)[0]]
                         this.setState( { fields: Object.keys(proto_row) })
                     }
 
@@ -113,7 +113,7 @@ class TaxaminerDashboard extends React.Component<Props, State> {
                     ))
                     this.setState({g_options: gene_options})
                 });
-		    })
+            })
             .finally(() => {
                 console.log("Finished loading")
                 this.setState({is_loading: false})
@@ -183,6 +183,16 @@ class TaxaminerDashboard extends React.Component<Props, State> {
         this.setState({filters: values})
     }
 
+     /**
+     * Store custom fields of selection view globally
+     * @param values 
+     */
+     setCustomFields = (values: any) => {
+        console.log(values)
+        values = Array.from(values)
+        this.setState({customFields: values})
+    }
+
     /**
      * Uses the scatter data from the main plot to slave the scatter matrix
      * @param values 
@@ -212,16 +222,29 @@ class TaxaminerDashboard extends React.Component<Props, State> {
                 <Col>
                      <Tabs>
                         <Tab eventKey="Overview" title="Overview">
-                            <DataSetSelector
-                            dataset_changed={this.setDataset}
-                            analyses={this.props.analyses}
-                            />
-                            <DataSetMeta
-                            assemblyID={this.props.assembly_id}
-                            dataset_id={this.state.dataset_id}
-                            userID={this.state.userID}
-                            token={this.state.token}
-                            metadata={this.state.analysis}/>
+                            <Card className='m-2'>
+                                <Card.Body>
+                                    <Card.Title>Dataset</Card.Title>
+                                    <Tabs>
+                                        <Tab title="Load Dataset" eventKey="dataset-loader">
+                                            <DataSetSelector
+                                                dataset_changed={this.setDataset}
+                                                analyses={this.props.analyses}
+                                            />
+                                        </Tab>
+                                        <Tab title="Metadata" eventKey="dataset-meta">
+                                            <DataSetMeta
+                                                assemblyID={this.props.assembly_id}
+                                                dataset_id={this.state.dataset_id}
+                                                userID={this.state.userID}
+                                                token={this.state.token}
+                                                metadata={this.state.analysis}/>
+                                        </Tab>
+                                    </Tabs>
+                                </Card.Body>
+                            </Card>
+                            
+                            
                             <SelectionView
                             is_loading={this.state.is_loading}
                             row={this.state.selected_row}
@@ -230,7 +253,8 @@ class TaxaminerDashboard extends React.Component<Props, State> {
                             assemblyID={this.props.assembly_id}
                             analysisID={this.state.dataset_id}
                             userID={this.state.userID}
-                            token={this.state.token}/>
+                            token={this.state.token}
+                            passCustomFields={this.setCustomFields}/>
                         </Tab>
                         <Tab eventKey="Filter" title="Filters">
                             <FilterUI
@@ -288,6 +312,7 @@ class TaxaminerDashboard extends React.Component<Props, State> {
                 token={this.state.token}
                 assemblyID={this.props.assembly_id}
                 row={this.state.selected_row}
+                customFields={this.state.customFields}
                 />
         <br/>
         <br/>