From 3f1ffd2fc2f09bd6b5909ae69ef07006750f4436 Mon Sep 17 00:00:00 2001 From: Michael Foiani Date: Wed, 3 Aug 2022 13:41:52 -0400 Subject: add new icon and modal for reporting. --- src/client/util/ReportManager.tsx | 62 ++++++++++++++++++++++++++++++++++++++ src/client/views/MainView.tsx | 2 ++ src/client/views/topbar/TopBar.tsx | 6 ++++ 3 files changed, 70 insertions(+) create mode 100644 src/client/util/ReportManager.tsx (limited to 'src') diff --git a/src/client/util/ReportManager.tsx b/src/client/util/ReportManager.tsx new file mode 100644 index 000000000..49453ae67 --- /dev/null +++ b/src/client/util/ReportManager.tsx @@ -0,0 +1,62 @@ +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { action, computed, observable, runInAction } from 'mobx'; +import { observer } from 'mobx-react'; +import * as React from 'react'; +import { ColorState, SketchPicker } from 'react-color'; +import { Doc } from '../../fields/Doc'; +import { Id } from '../../fields/FieldSymbols'; +import { BoolCast, Cast, StrCast } from '../../fields/Types'; +import { addStyleSheet, addStyleSheetRule, Utils } from '../../Utils'; +import { GoogleAuthenticationManager } from '../apis/GoogleAuthenticationManager'; +import { DocServer } from '../DocServer'; +import { Networking } from '../Network'; +import { MainViewModal } from '../views/MainViewModal'; +import { FontIconBox } from '../views/nodes/button/FontIconBox'; +import { DragManager } from './DragManager'; +import { GroupManager } from './GroupManager'; +import './SettingsManager.scss'; +import { undoBatch } from './UndoManager'; +const higflyout = require('@hig/flyout'); +export const { anchorPoints } = higflyout; +export const Flyout = higflyout.default; + +@observer +export class ReportManager extends React.Component<{}> { + public static Instance: ReportManager; + @observable private isOpen = false; + + constructor(props: {}) { + super(props); + ReportManager.Instance = this; + } + + public close = action(() => (this.isOpen = false)); + public open = action(() => (this.isOpen = true)); + + private get reportInterface() { + + return ( +
+
+ +
+ +
+ content +
+
+ ); + } + + render() { + return ( + + ); + } +} diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index e96f65548..a8c8fedaa 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -20,6 +20,7 @@ import { DocumentManager } from '../util/DocumentManager'; import { GroupManager } from '../util/GroupManager'; import { HistoryUtil } from '../util/History'; import { Hypothesis } from '../util/HypothesisUtils'; +import { ReportManager } from '../util/ReportManager'; import { ScriptingGlobals } from '../util/ScriptingGlobals'; import { SelectionManager } from '../util/SelectionManager'; import { ColorScheme, SettingsManager } from '../util/SettingsManager'; @@ -974,6 +975,7 @@ export class MainView extends React.Component { + diff --git a/src/client/views/topbar/TopBar.tsx b/src/client/views/topbar/TopBar.tsx index 3fc0a237e..cbcfed06f 100644 --- a/src/client/views/topbar/TopBar.tsx +++ b/src/client/views/topbar/TopBar.tsx @@ -1,5 +1,6 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { Tooltip } from '@material-ui/core'; +import { MdBugReport } from 'react-icons/md'; import { action } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; @@ -18,6 +19,7 @@ import { DashboardView } from '../DashboardView'; import { Borders, Colors } from '../global/globalEnums'; import { MainView } from '../MainView'; import './TopBar.scss'; +import { ReportManager } from '../../util/ReportManager'; /** * ABOUT: This is the topbar in Dash, which included the current Dashboard as well as access to information on the user @@ -31,6 +33,7 @@ export class TopBar extends React.Component { DashboardView.closeActiveDashboard(); // bcz: if we do this, we need some other way to keep track, for user convenience, of the last dashboard in use }); }; + render() { const activeDashboard = Doc.ActiveDashboard; return ( @@ -92,6 +95,9 @@ export class TopBar extends React.Component { {GetEffectiveAcl(Doc.GetProto(Doc.ActiveDashboard)) === AclAdmin ? 'Share' : 'view original'} ) : null} +
ReportManager.Instance.open()}> + +
window.open('https://brown-dash.github.io/Dash-Documentation/', '_blank')}>
-- cgit v1.2.3-70-g09d2 From f4ad642399fd207909bb8733e431061b30e3cb7d Mon Sep 17 00:00:00 2001 From: Michael Foiani Date: Wed, 3 Aug 2022 13:59:21 -0400 Subject: basic interface for reporting bug --- src/client/util/ReportManager.tsx | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) (limited to 'src') diff --git a/src/client/util/ReportManager.tsx b/src/client/util/ReportManager.tsx index 49453ae67..b156d7981 100644 --- a/src/client/util/ReportManager.tsx +++ b/src/client/util/ReportManager.tsx @@ -33,6 +33,13 @@ export class ReportManager extends React.Component<{}> { public close = action(() => (this.isOpen = false)); public open = action(() => (this.isOpen = true)); + private bugTitle = ''; + private bugDescription = ''; + + public reportBug() { + console.log('Reporting bug', this.bugTitle, this.bugDescription); + } + private get reportInterface() { return ( @@ -42,7 +49,12 @@ export class ReportManager extends React.Component<{}> {
- content +

Report a Bug

+
+ this.bugTitle = e.target.value}/>
+ +