From 49c6d7489e7fa566039af97777ecc8fe5f2fa289 Mon Sep 17 00:00:00 2001
From: chgibb <chris.gibb@outlook.com>
Date: Sat, 16 Nov 2019 15:17:24 -0500
Subject: [PATCH] copy and delete dialogs

---
 .../circularGenomeBuilderView.tsx             | 38 +++------------
 .../containers/copyFigureDialog.tsx           | 46 +++++++++++++++++++
 .../containers/deleteFigureDialog.tsx         | 46 +++++++++++++++++++
 .../containers/genomeBuilderAppBar.tsx        | 18 ++++++++
 4 files changed, 117 insertions(+), 31 deletions(-)
 create mode 100644 src/req/renderer/views/circularGenomeBuilderView/containers/copyFigureDialog.tsx
 create mode 100644 src/req/renderer/views/circularGenomeBuilderView/containers/deleteFigureDialog.tsx

diff --git a/src/req/renderer/views/circularGenomeBuilderView/circularGenomeBuilderView.tsx b/src/req/renderer/views/circularGenomeBuilderView/circularGenomeBuilderView.tsx
index 849e77f78..3b4e17856 100644
--- a/src/req/renderer/views/circularGenomeBuilderView/circularGenomeBuilderView.tsx
+++ b/src/req/renderer/views/circularGenomeBuilderView/circularGenomeBuilderView.tsx
@@ -32,6 +32,8 @@ import { DialogTitle } from '../../components/dialogTitle';
 import { DialogActions } from '../../components/dialogActions';
 import { Button } from '../../components/button';
 import { enQueueOperation } from '../../enQueueOperation';
+import { CopyFigureDialog } from './containers/copyFigureDialog';
+import { DeleteFigureDialog } from './containers/deleteFigureDialog';
 
 export interface CircularGenomeBuilderViewState {
     figureSelectOvelayOpen: boolean;
@@ -40,6 +42,7 @@ export interface CircularGenomeBuilderViewState {
     editBPTrackOptionsOverlayOpen : boolean;
     coverageTrackOverlayOpen : boolean;
     copyFigureDialogOpen : boolean;
+    deleteFigureDialogOpen : boolean;
     selectedFigure: string;
     figurePosition : {
         width : number,
@@ -77,6 +80,8 @@ export class CircularGenomeBuilderView extends React.Component<CircularGenomeBui
     protected toggleCoverageTrackLayerVisibility = toggleCoverageTrackLayerVisibility.bind(this);
     private GenomeBuilderAppBar = GenomeBuilderAppBar.bind(this);
     private GenomeBuilderOverlays = GenomeBuilderOverlays.bind(this);
+    private CopyFigureDialog = CopyFigureDialog.bind(this);
+    private DeleteFigureDialog = DeleteFigureDialog.bind(this);
     public constructor(props: CircularGenomeBuilderViewProps) 
     {
         super(props);
@@ -214,37 +219,8 @@ export class CircularGenomeBuilderView extends React.Component<CircularGenomeBui
                         />
                     ) : ""
                 }
-                <Dialog
-                    open={this.state.copyFigureDialogOpen}
-                    onClose={()=>{this.setState({copyFigureDialogOpen:false});}}
-                >
-                    <DialogTitle>{"Copy Figure?"}</DialogTitle>
-                    <DialogActions>
-                        <Button
-                            onClick={()=>{this.setState({copyFigureDialogOpen:false});}}
-                            type="retreat"
-                            label="Cancel"
-                        />
-
-                        <Button
-                            onClick={()=>{
-                                    this.setState({
-                                        copyFigureDialogOpen:false
-                                    });
-                                    
-                                    if(figure)
-                                    {
-                                        enQueueOperation({
-                                            opName: "copyCircularFigure",
-                                            data : figure
-                                        });
-                                    }
-                                }}
-                            type="advance"
-                            label="Copy"
-                        />
-                    </DialogActions>
-                </Dialog>
+                <this.CopyFigureDialog figure={figure} />
+                <this.DeleteFigureDialog figure={figure} />
             </React.Fragment>
         );
     }
diff --git a/src/req/renderer/views/circularGenomeBuilderView/containers/copyFigureDialog.tsx b/src/req/renderer/views/circularGenomeBuilderView/containers/copyFigureDialog.tsx
new file mode 100644
index 000000000..95165c7e9
--- /dev/null
+++ b/src/req/renderer/views/circularGenomeBuilderView/containers/copyFigureDialog.tsx
@@ -0,0 +1,46 @@
+import * as React from "react";
+
+import { CircularGenomeBuilderView } from '../circularGenomeBuilderView';
+import { Dialog } from '../../../components/dialog';
+import { DialogTitle } from '../../../components/dialogTitle';
+import { CircularFigure } from '../../../circularFigure/circularFigure';
+import { DialogActions } from '../../../components/dialogActions';
+import { Button } from '../../../components/button';
+import { enQueueOperation } from '../../../enQueueOperation';
+
+export function CopyFigureDialog(this : CircularGenomeBuilderView, props: { figure: CircularFigure | undefined }): JSX.Element 
+{
+    return (
+        <Dialog
+                    open={this.state.copyFigureDialogOpen}
+                    onClose={()=>{this.setState({copyFigureDialogOpen:false});}}
+                >
+                    <DialogTitle>{"Copy Figure?"}</DialogTitle>
+                    <DialogActions>
+                        <Button
+                            onClick={()=>{this.setState({copyFigureDialogOpen:false});}}
+                            type="retreat"
+                            label="Cancel"
+                        />
+
+                        <Button
+                            onClick={()=>{
+                                    this.setState({
+                                        copyFigureDialogOpen:false
+                                    });
+                                    
+                                    if(props.figure)
+                                    {
+                                        enQueueOperation({
+                                            opName: "copyCircularFigure",
+                                            data : props.figure
+                                        });
+                                    }
+                                }}
+                            type="advance"
+                            label="Copy"
+                        />
+                    </DialogActions>
+                </Dialog>
+    );
+}
\ No newline at end of file
diff --git a/src/req/renderer/views/circularGenomeBuilderView/containers/deleteFigureDialog.tsx b/src/req/renderer/views/circularGenomeBuilderView/containers/deleteFigureDialog.tsx
new file mode 100644
index 000000000..4a9c72874
--- /dev/null
+++ b/src/req/renderer/views/circularGenomeBuilderView/containers/deleteFigureDialog.tsx
@@ -0,0 +1,46 @@
+import * as React from "react";
+
+import { CircularGenomeBuilderView } from '../circularGenomeBuilderView';
+import { Dialog } from '../../../components/dialog';
+import { DialogTitle } from '../../../components/dialogTitle';
+import { CircularFigure } from '../../../circularFigure/circularFigure';
+import { DialogActions } from '../../../components/dialogActions';
+import { Button } from '../../../components/button';
+import { enQueueOperation } from '../../../enQueueOperation';
+
+export function DeleteFigureDialog(this : CircularGenomeBuilderView, props: { figure: CircularFigure | undefined }): JSX.Element 
+{
+    return (
+        <Dialog
+                    open={this.state.deleteFigureDialogOpen}
+                    onClose={()=>{this.setState({deleteFigureDialogOpen:false});}}
+                >
+                    <DialogTitle>{"Delete Figure?"}</DialogTitle>
+                    <DialogActions>
+                        <Button
+                            onClick={()=>{this.setState({deleteFigureDialogOpen:false});}}
+                            type="retreat"
+                            label="Cancel"
+                        />
+
+                        <Button
+                            onClick={()=>{
+                                    this.setState({
+                                        deleteFigureDialogOpen:false
+                                    });
+                                    
+                                    if(props.figure)
+                                    {
+                                        enQueueOperation({
+                                            opName: "deleteCircularFigure",
+                                            data : props.figure
+                                        });
+                                    }
+                                }}
+                            type="advance"
+                            label="Delete"
+                        />
+                    </DialogActions>
+                </Dialog>
+    );
+}
\ No newline at end of file
diff --git a/src/req/renderer/views/circularGenomeBuilderView/containers/genomeBuilderAppBar.tsx b/src/req/renderer/views/circularGenomeBuilderView/containers/genomeBuilderAppBar.tsx
index b9d16c4fd..63c5987bd 100644
--- a/src/req/renderer/views/circularGenomeBuilderView/containers/genomeBuilderAppBar.tsx
+++ b/src/req/renderer/views/circularGenomeBuilderView/containers/genomeBuilderAppBar.tsx
@@ -15,6 +15,7 @@ import {MenuRounded} from "../../../components/icons/menuRounded";
 
 import {appBar} from "./styles/appBar";
 import { FileCopyOutlined } from '../../../components/icons/fileCopyOutlined';
+import { DeleteForeverOutlined } from '../../../components/icons/deleteForeverOutlined';
 
 export function GenomeBuilderAppBar(this: CircularGenomeBuilderView, props: { figure: CircularFigure | undefined }): JSX.Element 
 {
@@ -91,6 +92,23 @@ export function GenomeBuilderAppBar(this: CircularGenomeBuilderView, props: { fi
                             <FileCopyOutlined />
                         </IconButton>
                     </Tooltip>
+                    <Tooltip title="Delete Figure">
+                        <IconButton
+                            edge="start"
+                            color="primary"
+                            classes={{colorPrimary: white}}
+                            onClick={()=>
+                            {
+                                if(figure){
+                                    this.setState({
+                                        deleteFigureDialogOpen : true
+                                    });
+                                }
+                            }}
+                        >
+                            <DeleteForeverOutlined />
+                        </IconButton>
+                    </Tooltip>
                     <Tooltip title="Customize Contigs">
                         <IconButton
                             edge="start"