diff options
author | André Oliveira <37463445+SpecialAro@users.noreply.github.com> | 2022-07-19 12:52:31 +0100 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-07-19 12:52:31 +0100 |
commit | 3bb1ca7825a0381ddd8dbe7f44f7dcf4a788b165 (patch) | |
tree | 6b414b9ef3be7656da1717b0d6def62e95d1fb90 /src/containers | |
parent | fix: remove autoHibernate (diff) | |
download | ferdium-app-3bb1ca7825a0381ddd8dbe7f44f7dcf4a788b165.tar.gz ferdium-app-3bb1ca7825a0381ddd8dbe7f44f7dcf4a788b165.tar.zst ferdium-app-3bb1ca7825a0381ddd8dbe7f44f7dcf4a788b165.zip |
Feature: Add Release Notes (#491)
Co-authored-by: Vijay A <vraravam@users.noreply.github.com>
Co-authored-by: Ricardo Cino <ricardo@cino.io>
Diffstat (limited to 'src/containers')
-rw-r--r-- | src/containers/auth/AuthLayoutContainer.tsx | 1 | ||||
-rw-r--r-- | src/containers/auth/AuthReleaseNotesScreen.tsx | 107 | ||||
-rw-r--r-- | src/containers/layout/AppLayoutContainer.tsx | 1 | ||||
-rw-r--r-- | src/containers/settings/EditSettingsScreen.tsx | 3 | ||||
-rw-r--r-- | src/containers/settings/ReleaseNotesScreen.tsx | 16 | ||||
-rw-r--r-- | src/containers/settings/ReleaseNotesWindow.tsx | 42 |
6 files changed, 169 insertions, 1 deletions
diff --git a/src/containers/auth/AuthLayoutContainer.tsx b/src/containers/auth/AuthLayoutContainer.tsx index 8d31cfb48..6fc6713f1 100644 --- a/src/containers/auth/AuthLayoutContainer.tsx +++ b/src/containers/auth/AuthLayoutContainer.tsx | |||
@@ -49,6 +49,7 @@ class AuthLayoutContainer extends Component<AuthLayoutContainerProps> { | |||
49 | appUpdateIsDownloaded={ | 49 | appUpdateIsDownloaded={ |
50 | app.updateStatus === app.updateStatusTypes.DOWNLOADED | 50 | app.updateStatus === app.updateStatusTypes.DOWNLOADED |
51 | } | 51 | } |
52 | updateVersion={app.updateVersion} | ||
52 | > | 53 | > |
53 | <Outlet /> | 54 | <Outlet /> |
54 | </AuthLayout> | 55 | </AuthLayout> |
diff --git a/src/containers/auth/AuthReleaseNotesScreen.tsx b/src/containers/auth/AuthReleaseNotesScreen.tsx new file mode 100644 index 000000000..c717529fa --- /dev/null +++ b/src/containers/auth/AuthReleaseNotesScreen.tsx | |||
@@ -0,0 +1,107 @@ | |||
1 | import { Component } from 'react'; | ||
2 | import { inject, observer } from 'mobx-react'; | ||
3 | |||
4 | import { defineMessages, injectIntl } from 'react-intl'; | ||
5 | import Markdown from 'markdown-to-jsx'; | ||
6 | import { mdiArrowLeftCircle } from '@mdi/js'; | ||
7 | import { openExternalUrl } from '../../helpers/url-helpers'; | ||
8 | import Icon from '../../components/ui/icon'; | ||
9 | import { ferdiumVersion } from '../../environment-remote'; | ||
10 | import { | ||
11 | getFerdiumVersion, | ||
12 | getUpdateInfoFromGH, | ||
13 | } from '../../helpers/update-helpers'; | ||
14 | |||
15 | const messages = defineMessages({ | ||
16 | headline: { | ||
17 | id: 'settings.releasenotes.headline', | ||
18 | defaultMessage: 'Release Notes', | ||
19 | }, | ||
20 | }); | ||
21 | |||
22 | interface IProps { | ||
23 | intl: any; | ||
24 | } | ||
25 | |||
26 | class AuthReleaseNotesScreen extends Component<IProps> { | ||
27 | state = { | ||
28 | data: '', | ||
29 | }; | ||
30 | |||
31 | constructor(props) { | ||
32 | super(props); | ||
33 | |||
34 | this.state = { data: '' }; | ||
35 | } | ||
36 | |||
37 | async componentDidMount() { | ||
38 | const { intl } = this.props; | ||
39 | |||
40 | const data = await getUpdateInfoFromGH( | ||
41 | window.location.href, | ||
42 | ferdiumVersion, | ||
43 | intl, | ||
44 | ); | ||
45 | |||
46 | this.setState({ | ||
47 | data, | ||
48 | }); | ||
49 | |||
50 | for (const link of document.querySelectorAll('.releasenotes__body a')) { | ||
51 | link.addEventListener('click', this.handleClick.bind(this), false); | ||
52 | } | ||
53 | } | ||
54 | |||
55 | handleClick(e) { | ||
56 | e.preventDefault(); | ||
57 | openExternalUrl(e.target.href); | ||
58 | } | ||
59 | |||
60 | componentWillUnmount() { | ||
61 | document.removeEventListener( | ||
62 | 'click', | ||
63 | // eslint-disable-next-line unicorn/no-invalid-remove-event-listener | ||
64 | this.handleClick.bind(this), | ||
65 | false, | ||
66 | ); | ||
67 | } | ||
68 | |||
69 | render() { | ||
70 | const { intl } = this.props; | ||
71 | |||
72 | const { data } = this.state; | ||
73 | return ( | ||
74 | <div className="auth__container auth__container--releasenotes"> | ||
75 | <div className="auth__main--releasenotes"> | ||
76 | <div className="auth__header"> | ||
77 | <span className="auth__header-item"> | ||
78 | Ferdium {getFerdiumVersion(window.location.href, ferdiumVersion)}{' '} | ||
79 | {' | '} | ||
80 | </span> | ||
81 | <span className="auth__header-item__secondary"> | ||
82 | {intl.formatMessage(messages.headline)} | ||
83 | </span> | ||
84 | </div> | ||
85 | <div className="auth__body releasenotes__body"> | ||
86 | <Markdown options={{ wrapper: 'article' }}>{data}</Markdown> | ||
87 | </div> | ||
88 | <div className="auth__help"> | ||
89 | <button | ||
90 | type="button" | ||
91 | onClick={() => { | ||
92 | // For some reason <Link> doesn't work here. So we hard code the path to take us to the Welcome Screen | ||
93 | window.location.href = '#/auth/welcome'; | ||
94 | }} | ||
95 | > | ||
96 | <Icon icon={mdiArrowLeftCircle} size={1.5} /> | ||
97 | </button> | ||
98 | </div> | ||
99 | </div> | ||
100 | </div> | ||
101 | ); | ||
102 | } | ||
103 | } | ||
104 | |||
105 | export default injectIntl<'intl', IProps>( | ||
106 | inject('stores', 'actions')(observer(AuthReleaseNotesScreen)), | ||
107 | ); | ||
diff --git a/src/containers/layout/AppLayoutContainer.tsx b/src/containers/layout/AppLayoutContainer.tsx index a4857a426..9c03b0ba4 100644 --- a/src/containers/layout/AppLayoutContainer.tsx +++ b/src/containers/layout/AppLayoutContainer.tsx | |||
@@ -157,6 +157,7 @@ class AppLayoutContainer extends Component<AppLayoutContainerProps> { | |||
157 | areRequiredRequestsSuccessful={requests.areRequiredRequestsSuccessful} | 157 | areRequiredRequestsSuccessful={requests.areRequiredRequestsSuccessful} |
158 | retryRequiredRequests={retryRequiredRequests} | 158 | retryRequiredRequests={retryRequiredRequests} |
159 | areRequiredRequestsLoading={requests.areRequiredRequestsLoading} | 159 | areRequiredRequestsLoading={requests.areRequiredRequestsLoading} |
160 | updateVersion={app.updateVersion} | ||
160 | > | 161 | > |
161 | <Outlet /> | 162 | <Outlet /> |
162 | </AppLayout> | 163 | </AppLayout> |
diff --git a/src/containers/settings/EditSettingsScreen.tsx b/src/containers/settings/EditSettingsScreen.tsx index a6c4561dd..fbbed629a 100644 --- a/src/containers/settings/EditSettingsScreen.tsx +++ b/src/containers/settings/EditSettingsScreen.tsx | |||
@@ -853,6 +853,7 @@ class EditSettingsScreen extends Component<EditSettingsScreenProps> { | |||
853 | const { app } = this.props.stores; | 853 | const { app } = this.props.stores; |
854 | const { | 854 | const { |
855 | updateStatus, | 855 | updateStatus, |
856 | updateVersion, | ||
856 | updateStatusTypes, | 857 | updateStatusTypes, |
857 | isClearingAllCache, | 858 | isClearingAllCache, |
858 | lockingFeatureEnabled, | 859 | lockingFeatureEnabled, |
@@ -860,13 +861,13 @@ class EditSettingsScreen extends Component<EditSettingsScreenProps> { | |||
860 | const { checkForUpdates, installUpdate, clearAllCache } = | 861 | const { checkForUpdates, installUpdate, clearAllCache } = |
861 | this.props.actions.app; | 862 | this.props.actions.app; |
862 | const form = this.prepareForm(); | 863 | const form = this.prepareForm(); |
863 | |||
864 | return ( | 864 | return ( |
865 | <ErrorBoundary> | 865 | <ErrorBoundary> |
866 | <EditSettingsForm | 866 | <EditSettingsForm |
867 | form={form} | 867 | form={form} |
868 | checkForUpdates={checkForUpdates} | 868 | checkForUpdates={checkForUpdates} |
869 | installUpdate={installUpdate} | 869 | installUpdate={installUpdate} |
870 | updateVersion={updateVersion} | ||
870 | isCheckingForUpdates={updateStatus === updateStatusTypes.CHECKING} | 871 | isCheckingForUpdates={updateStatus === updateStatusTypes.CHECKING} |
871 | isUpdateAvailable={updateStatus === updateStatusTypes.AVAILABLE} | 872 | isUpdateAvailable={updateStatus === updateStatusTypes.AVAILABLE} |
872 | noUpdateAvailable={updateStatus === updateStatusTypes.NOT_AVAILABLE} | 873 | noUpdateAvailable={updateStatus === updateStatusTypes.NOT_AVAILABLE} |
diff --git a/src/containers/settings/ReleaseNotesScreen.tsx b/src/containers/settings/ReleaseNotesScreen.tsx new file mode 100644 index 000000000..c3014d187 --- /dev/null +++ b/src/containers/settings/ReleaseNotesScreen.tsx | |||
@@ -0,0 +1,16 @@ | |||
1 | import { Component, ReactElement } from 'react'; | ||
2 | |||
3 | import ReleaseNotes from '../../components/settings/releaseNotes/ReleaseNotesDashboard'; | ||
4 | import ErrorBoundary from '../../components/util/ErrorBoundary'; | ||
5 | |||
6 | class ReleaseNotesScreen extends Component { | ||
7 | render(): ReactElement { | ||
8 | return ( | ||
9 | <ErrorBoundary> | ||
10 | <ReleaseNotes /> | ||
11 | </ErrorBoundary> | ||
12 | ); | ||
13 | } | ||
14 | } | ||
15 | |||
16 | export default ReleaseNotesScreen; | ||
diff --git a/src/containers/settings/ReleaseNotesWindow.tsx b/src/containers/settings/ReleaseNotesWindow.tsx new file mode 100644 index 000000000..3e43727d0 --- /dev/null +++ b/src/containers/settings/ReleaseNotesWindow.tsx | |||
@@ -0,0 +1,42 @@ | |||
1 | import { inject, observer } from 'mobx-react'; | ||
2 | import { Component, ReactPortal } from 'react'; | ||
3 | import ReactDOM from 'react-dom'; | ||
4 | import { Outlet } from 'react-router-dom'; | ||
5 | |||
6 | import { StoresProps } from '../../@types/ferdium-components.types'; | ||
7 | import Layout from '../../components/settings/releaseNotes/ReleaseNotesLayout'; | ||
8 | import ErrorBoundary from '../../components/util/ErrorBoundary'; | ||
9 | |||
10 | class SettingsContainer extends Component<StoresProps> { | ||
11 | portalRoot: any; | ||
12 | |||
13 | el: HTMLDivElement; | ||
14 | |||
15 | constructor(props: StoresProps) { | ||
16 | super(props); | ||
17 | |||
18 | this.portalRoot = document.querySelector('#portalContainer'); | ||
19 | this.el = document.createElement('div'); | ||
20 | } | ||
21 | |||
22 | componentDidMount(): void { | ||
23 | this.portalRoot.append(this.el); | ||
24 | } | ||
25 | |||
26 | componentWillUnmount(): void { | ||
27 | this.el.remove(); | ||
28 | } | ||
29 | |||
30 | render(): ReactPortal { | ||
31 | return ReactDOM.createPortal( | ||
32 | <ErrorBoundary> | ||
33 | <Layout {...this.props}> | ||
34 | <Outlet /> | ||
35 | </Layout> | ||
36 | </ErrorBoundary>, | ||
37 | this.el, | ||
38 | ); | ||
39 | } | ||
40 | } | ||
41 | |||
42 | export default inject('stores', 'actions')(observer(SettingsContainer)); | ||