diff --git a/app/assets/javascripts/preferences/PreferencesView.tsx b/app/assets/javascripts/preferences/PreferencesView.tsx index fc5c328a272..d9059a44044 100644 --- a/app/assets/javascripts/preferences/PreferencesView.tsx +++ b/app/assets/javascripts/preferences/PreferencesView.tsx @@ -1,14 +1,14 @@ import { RoundIconButton } from '@/components/RoundIconButton'; import { TitleBar, Title } from '@/components/TitleBar'; import { FunctionComponent } from 'preact'; -import { AccountPreferences, HelpAndFeedback, Security } from './panes'; +import { AccountPreferences, General, HelpAndFeedback, Security } from './panes'; import { observer } from 'mobx-react-lite'; import { PreferencesMenu } from './PreferencesMenu'; import { PreferencesMenuView } from './PreferencesMenuView'; import { WebApplication } from '@/ui_models/application'; import { MfaProps } from './panes/two-factor-auth/MfaProps'; import { AppState } from '@/ui_models/app_state'; -import { useCallback, useEffect } from 'preact/hooks'; +import { useEffect } from 'preact/hooks'; interface PreferencesProps extends MfaProps { application: WebApplication; @@ -21,7 +21,7 @@ const PaneSelector: FunctionComponent< > = observer((props) => { switch (props.menu.selectedPaneId) { case 'general': - return null; + return case 'account': return ( = ({ }) => (index < length - 1 ? : null); export const PreferencesGroup: FunctionComponent = ({ children }) => ( -
+
{Array.isArray(children) ? children - .filter( - (child) => child != undefined && child !== '' && child !== false - ) - .map((child, i, arr) => ( - <> - {child} - - - )) + .filter( + (child) => child != undefined && child !== '' && child !== false + ) + .map((child, i, arr) => ( + <> + {child} + + + )) : children}
); diff --git a/app/assets/javascripts/preferences/components/PreferencesPane.tsx b/app/assets/javascripts/preferences/components/PreferencesPane.tsx index 257ce4f73b4..f1a13688414 100644 --- a/app/assets/javascripts/preferences/components/PreferencesPane.tsx +++ b/app/assets/javascripts/preferences/components/PreferencesPane.tsx @@ -7,12 +7,6 @@ export const PreferencesPane: FunctionComponent = ({ children }) => ( {children != undefined && Array.isArray(children) ? children .filter((child) => child != undefined) - .map((child) => ( - <> - {child} -
- - )) : children}
diff --git a/app/assets/javascripts/preferences/panes/General.tsx b/app/assets/javascripts/preferences/panes/General.tsx new file mode 100644 index 00000000000..2598b7a98ee --- /dev/null +++ b/app/assets/javascripts/preferences/panes/General.tsx @@ -0,0 +1,16 @@ +import { WebApplication } from '@/ui_models/application'; +import { AppState } from '@/ui_models/app_state'; +import { FunctionComponent } from 'preact'; +import { PreferencesPane } from '../components'; +import { ErrorReporting } from './general-segments'; + +interface GeneralProps { + appState: AppState; + application: WebApplication; +} + +export const General: FunctionComponent = (props) => ( + + + +); diff --git a/app/assets/javascripts/preferences/panes/general-segments/ErrorReporting.tsx b/app/assets/javascripts/preferences/panes/general-segments/ErrorReporting.tsx new file mode 100644 index 00000000000..5b4d7f04347 --- /dev/null +++ b/app/assets/javascripts/preferences/panes/general-segments/ErrorReporting.tsx @@ -0,0 +1,86 @@ +import { useState } from 'preact/hooks'; +import { storage, StorageKey } from '@Services/localStorage'; +import { disableErrorReporting, enableErrorReporting, errorReportingId } from '@Services/errorReporting'; +import { alertDialog } from '@Services/alertService'; +import { observer } from 'mobx-react-lite'; +import { AppState } from '@/ui_models/app_state'; +import { FunctionComponent } from 'preact'; +import { PreferencesGroup, PreferencesSegment, Title, Text } from '@/preferences/components'; +import { Switch } from '@/components/Switch'; + +type Props = { + appState: AppState; +} + +export const ErrorReporting: FunctionComponent = observer(({ appState }: Props) => { + const [isErrorReportingEnabled] = useState(() => storage.get(StorageKey.DisableErrorReporting) === false); + const [errorReportingIdValue] = useState(() => errorReportingId()); + + const toggleErrorReportingEnabled = () => { + if (isErrorReportingEnabled) { + disableErrorReporting(); + } else { + enableErrorReporting(); + } + if (!appState.sync.inProgress) { + window.location.reload(); + } + }; + + const openErrorReportingDialog = () => { + alertDialog({ + title: 'Data sent during automatic error reporting', + text: ` + We use Bugsnag + to automatically report errors that occur while the app is running. See + + this article, paragraph 'Browser' under 'Sending diagnostic data', + + to see what data is included in error reports. +

+ Error reports never include IP addresses and are fully + anonymized. We use error reports to be alerted when something in our + code is causing unexpected errors and crashes in your application + experience. + ` + }); + }; + + return ( + + + +
+
+ Error Reporting + + Help us improve Standard Notes by automatically submitting + anonymized error reports. + +
+
+ +
+
+
+ + {errorReportingIdValue && ( + <> + + Your random identifier is {errorReportingIdValue} + + + Disabling error reporting will remove that identifier from your + local storage, and a new identifier will be created should you + decide to enable error reporting again in the future. + + + )} + + + What data is being sent? + + + + ); +}); diff --git a/app/assets/javascripts/preferences/panes/general-segments/index.ts b/app/assets/javascripts/preferences/panes/general-segments/index.ts new file mode 100644 index 00000000000..619f11e36c5 --- /dev/null +++ b/app/assets/javascripts/preferences/panes/general-segments/index.ts @@ -0,0 +1 @@ +export * from './ErrorReporting'; diff --git a/app/assets/javascripts/preferences/panes/index.ts b/app/assets/javascripts/preferences/panes/index.ts index 741508ad065..da5721469b4 100644 --- a/app/assets/javascripts/preferences/panes/index.ts +++ b/app/assets/javascripts/preferences/panes/index.ts @@ -1,3 +1,4 @@ export * from './HelpFeedback'; export * from './Security'; export * from './AccountPreferences'; +export * from './General'; diff --git a/app/assets/javascripts/preferences/panes/security-segments/Protections.tsx b/app/assets/javascripts/preferences/panes/security-segments/Protections.tsx index ae1d3a9e56e..2cf2caabb1b 100644 --- a/app/assets/javascripts/preferences/panes/security-segments/Protections.tsx +++ b/app/assets/javascripts/preferences/panes/security-segments/Protections.tsx @@ -6,7 +6,6 @@ import { ApplicationEvent } from '@standardnotes/snjs'; import { isSameDay } from '@/utils'; import { PreferencesGroup, PreferencesSegment, Title, Text } from '@/preferences/components'; import { Button } from '@/components/Button'; -import { Switch } from '@/components/Switch'; type Props = { application: WebApplication;