From 1404582b18b965bb58aa53258a942979211a667a Mon Sep 17 00:00:00 2001 From: Alexander Vogt Date: Fri, 24 May 2024 12:05:01 +0200 Subject: [PATCH 1/3] move version into reference at bottom --- report-viewer/src/components/VersionInfoComponent.vue | 4 ++-- ...oryReference.vue => VersionRepositoryReference.vue} | 10 ++++++++++ report-viewer/src/viewWrapper/ClusterViewWrapper.vue | 4 ++-- .../src/viewWrapper/ComparisonViewWrapper.vue | 4 ++-- .../src/viewWrapper/InformationViewWrapper.vue | 4 ++-- report-viewer/src/viewWrapper/OverviewViewWrapper.vue | 4 ++-- 6 files changed, 20 insertions(+), 10 deletions(-) rename report-viewer/src/components/{RepositoryReference.vue => VersionRepositoryReference.vue} (68%) diff --git a/report-viewer/src/components/VersionInfoComponent.vue b/report-viewer/src/components/VersionInfoComponent.vue index 7f3d1feec1..656bd1ceba 100644 --- a/report-viewer/src/components/VersionInfoComponent.vue +++ b/report-viewer/src/components/VersionInfoComponent.vue @@ -32,7 +32,7 @@
Demo of JPlag v{{ reportViewerVersion.toString() }}
Displays the result of JPlag on the Progpedia dataset.
- + @@ -40,7 +40,7 @@ import { Version } from '@/model/Version' import { ref } from 'vue' import { minimalReportVersion, reportViewerVersion } from '@/model/Version' -import RepositoryReference from './RepositoryReference.vue' +import VersionRepositoryReference from './VersionRepositoryReference.vue' const newestVersion = ref(new Version(-1, -1, -1)) const isDemo = import.meta.env.MODE == 'demo' diff --git a/report-viewer/src/components/RepositoryReference.vue b/report-viewer/src/components/VersionRepositoryReference.vue similarity index 68% rename from report-viewer/src/components/RepositoryReference.vue rename to report-viewer/src/components/VersionRepositoryReference.vue index c05d85bd21..19c2ffa789 100644 --- a/report-viewer/src/components/RepositoryReference.vue +++ b/report-viewer/src/components/VersionRepositoryReference.vue @@ -4,6 +4,10 @@ 'absolute bottom-1 left-5 text-xs text-black dark:text-white print:hidden': overrideStyle }" > + JPlag v{{ reportViewerVersion.toString() }} JPlag is open source. Bug reports and feature requests can be submitted on GitHub import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome' import { faGithub } from '@fortawesome/free-brands-svg-icons' +import { reportViewerVersion } from '@/model/Version' defineProps({ overrideStyle: { type: Boolean, required: false, default: true + }, + showVersion: { + type: Boolean, + required: false, + default: true } }) diff --git a/report-viewer/src/viewWrapper/ClusterViewWrapper.vue b/report-viewer/src/viewWrapper/ClusterViewWrapper.vue index 234569c676..51876a6f08 100644 --- a/report-viewer/src/viewWrapper/ClusterViewWrapper.vue +++ b/report-viewer/src/viewWrapper/ClusterViewWrapper.vue @@ -8,7 +8,7 @@ - + @@ -19,7 +19,7 @@ import ClusterView from '@/views/ClusterView.vue' import LoadingCircle from '@/components/LoadingCircle.vue' import type { Overview } from '@/model/Overview' import { redirectOnError } from '@/router' -import RepositoryReference from '@/components/RepositoryReference.vue' +import VersionRepositoryReference from '@/components/VersionRepositoryReference.vue' const props = defineProps({ clusterIndex: { diff --git a/report-viewer/src/viewWrapper/ComparisonViewWrapper.vue b/report-viewer/src/viewWrapper/ComparisonViewWrapper.vue index fd2907da97..bebdb458b3 100644 --- a/report-viewer/src/viewWrapper/ComparisonViewWrapper.vue +++ b/report-viewer/src/viewWrapper/ComparisonViewWrapper.vue @@ -8,7 +8,7 @@ - + @@ -21,7 +21,7 @@ import { ComparisonFactory } from '@/model/factories/ComparisonFactory' import LoadingCircle from '@/components/LoadingCircle.vue' import { redirectOnError } from '@/router' import type { Language } from '@/model/Language' -import RepositoryReference from '@/components/RepositoryReference.vue' +import VersionRepositoryReference from '@/components/VersionRepositoryReference.vue' const props = defineProps({ comparisonFileName: { diff --git a/report-viewer/src/viewWrapper/InformationViewWrapper.vue b/report-viewer/src/viewWrapper/InformationViewWrapper.vue index f384d036ee..ce586a12f8 100644 --- a/report-viewer/src/viewWrapper/InformationViewWrapper.vue +++ b/report-viewer/src/viewWrapper/InformationViewWrapper.vue @@ -8,7 +8,7 @@ - + @@ -21,7 +21,7 @@ import LoadingCircle from '@/components/LoadingCircle.vue' import { redirectOnError } from '@/router' import { OptionsFactory } from '@/model/factories/OptionsFactory' import type { CliOptions } from '@/model/CliOptions' -import RepositoryReference from '@/components/RepositoryReference.vue' +import VersionRepositoryReference from '@/components/VersionRepositoryReference.vue' const overview: Ref = ref(null) const cliOptions: Ref = ref(undefined) diff --git a/report-viewer/src/viewWrapper/OverviewViewWrapper.vue b/report-viewer/src/viewWrapper/OverviewViewWrapper.vue index 13c0008439..e73d074db5 100644 --- a/report-viewer/src/viewWrapper/OverviewViewWrapper.vue +++ b/report-viewer/src/viewWrapper/OverviewViewWrapper.vue @@ -8,7 +8,7 @@ - + @@ -19,7 +19,7 @@ import OverviewView from '@/views/OverviewView.vue' import type { Overview } from '@/model/Overview' import LoadingCircle from '@/components/LoadingCircle.vue' import { redirectOnError } from '@/router' -import RepositoryReference from '@/components/RepositoryReference.vue' +import VersionRepositoryReference from '@/components/VersionRepositoryReference.vue' const overview: Ref = ref(null) From 36aa34998860c773c5fa8e7f4b110ed660204b4f Mon Sep 17 00:00:00 2001 From: Alex | Kronox Date: Sat, 27 Jul 2024 17:49:17 +0200 Subject: [PATCH 2/3] add toast to page --- report-viewer/src/App.vue | 39 ++++++++++++++++ .../src/components/ToastComponent.vue | 45 +++++++++++++++++++ .../src/components/VersionInfoComponent.vue | 32 +------------ .../components/VersionRepositoryReference.vue | 15 ++++--- report-viewer/src/version.json | 2 +- .../components/VersionInfoComponent.test.ts | 14 ------ 6 files changed, 97 insertions(+), 50 deletions(-) create mode 100644 report-viewer/src/components/ToastComponent.vue diff --git a/report-viewer/src/App.vue b/report-viewer/src/App.vue index a76889ad25..42ab7aa37a 100644 --- a/report-viewer/src/App.vue +++ b/report-viewer/src/App.vue @@ -14,6 +14,23 @@ :icon="store().uiState.useDarkMode ? ['fas', 'sun'] : ['fas', 'moon']" /> + + You are using an outdated version of the JPlag Report Viewer ({{ + reportViewerVersion.toString() + }}).
+ Version {{ newestVersion.toString() }} is available on + GitHub. + @@ -25,7 +42,29 @@ import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome' import { library } from '@fortawesome/fontawesome-svg-core' import { faMoon, faSun } from '@fortawesome/free-solid-svg-icons' import { store } from './stores/store' +import ToastComponent from './components/ToastComponent.vue' +import { Version, reportViewerVersion } from './model/Version' +import { ref } from 'vue' library.add(faMoon) library.add(faSun) + +const newestVersion = ref(new Version(-1, -1, -1)) +const isDemo = import.meta.env.MODE == 'demo' + +fetch('https://api.github.com/repos/jplag/JPlag/releases/latest') + .then((response) => response.json()) + .then((data) => { + const versionString = data.tag_name + // remove the 'v' from the version string and split it into an array + const versionArray = versionString.substring(1).split('.') + newestVersion.value = new Version( + parseInt(versionArray[0]), + parseInt(versionArray[1]), + parseInt(versionArray[2]) + ) + }) + .catch(() => { + newestVersion.value = new Version(-1, -1, -1) + }) diff --git a/report-viewer/src/components/ToastComponent.vue b/report-viewer/src/components/ToastComponent.vue new file mode 100644 index 0000000000..d2ff857801 --- /dev/null +++ b/report-viewer/src/components/ToastComponent.vue @@ -0,0 +1,45 @@ + + + diff --git a/report-viewer/src/components/VersionInfoComponent.vue b/report-viewer/src/components/VersionInfoComponent.vue index a3c3f4e30f..bc6d6b9e0a 100644 --- a/report-viewer/src/components/VersionInfoComponent.vue +++ b/report-viewer/src/components/VersionInfoComponent.vue @@ -7,17 +7,7 @@
-
- You are using an outdated version of the JPlag Report Viewer ({{ - reportViewerVersion.toString() - }}).
- Version {{ newestVersion.toString() }} is available on - GitHub. -
- -
JPlag v{{ reportViewerVersion.toString() }}
+ JPlag v{{ reportViewerVersion.toString() }}
The minimal version of JPlag that is supported by the viewer is v{{ @@ -37,26 +27,8 @@ diff --git a/report-viewer/src/components/VersionRepositoryReference.vue b/report-viewer/src/components/VersionRepositoryReference.vue index 19c2ffa789..11f504c072 100644 --- a/report-viewer/src/components/VersionRepositoryReference.vue +++ b/report-viewer/src/components/VersionRepositoryReference.vue @@ -1,17 +1,22 @@ diff --git a/report-viewer/src/version.json b/report-viewer/src/version.json index 9134088500..d03da50710 100644 --- a/report-viewer/src/version.json +++ b/report-viewer/src/version.json @@ -1,6 +1,6 @@ { "report_viewer_version": { - "major": 0, + "major": 5, "minor": 0, "patch": 0 }, diff --git a/report-viewer/tests/unit/components/VersionInfoComponent.test.ts b/report-viewer/tests/unit/components/VersionInfoComponent.test.ts index 6cbb9966bc..a706ffafe0 100644 --- a/report-viewer/tests/unit/components/VersionInfoComponent.test.ts +++ b/report-viewer/tests/unit/components/VersionInfoComponent.test.ts @@ -19,20 +19,6 @@ describe('VersionInfoComponent', () => { ) }) - it('Render outdated version', async () => { - vi.spyOn(versionTsFile, 'reportViewerVersion', 'get').mockReturnValue(mockVersionJSON(4, 3, 0)) - vi.spyOn(versionTsFile, 'minimalReportVersion', 'get').mockReturnValue(mockVersionJSON(4, 0, 0)) - global.fetch = vi.fn().mockResolvedValueOnce(mockVersionResponse('v4.4.0')) - - const wrapper = mount(VersionInfoComponent) - await flushPromises() - - expect(wrapper.text()).toContain('outdated version') - expect(wrapper.text()).toContain( - 'The minimal version of JPlag that is supported by the viewer is v4.0.0.' - ) - }) - it('Render latest version', async () => { vi.spyOn(versionTsFile, 'reportViewerVersion', 'get').mockReturnValue(mockVersionJSON(4, 3, 0)) vi.spyOn(versionTsFile, 'minimalReportVersion', 'get').mockReturnValue(mockVersionJSON(4, 0, 0)) From 15f04ccb901ca2782fb52e766f77dfe1f7d5f825 Mon Sep 17 00:00:00 2001 From: Alex | Kronox Date: Sat, 27 Jul 2024 17:51:51 +0200 Subject: [PATCH 3/3] save shown state in session storage --- report-viewer/src/App.vue | 30 ++++++++++++++++++++---------- 1 file changed, 20 insertions(+), 10 deletions(-) diff --git a/report-viewer/src/App.vue b/report-viewer/src/App.vue index 42ab7aa37a..58b62b9de5 100644 --- a/report-viewer/src/App.vue +++ b/report-viewer/src/App.vue @@ -14,15 +14,7 @@ :icon="store().uiState.useDarkMode ? ['fas', 'sun'] : ['fas', 'moon']" /> - + You are using an outdated version of the JPlag Report Viewer ({{ reportViewerVersion.toString() }}).
@@ -44,13 +36,31 @@ import { faMoon, faSun } from '@fortawesome/free-solid-svg-icons' import { store } from './stores/store' import ToastComponent from './components/ToastComponent.vue' import { Version, reportViewerVersion } from './model/Version' -import { ref } from 'vue' +import { computed, ref } from 'vue' library.add(faMoon) library.add(faSun) const newestVersion = ref(new Version(-1, -1, -1)) const isDemo = import.meta.env.MODE == 'demo' +const hasShownToast = ref(sessionStorage.getItem('hasShownToast') == 'true') + +const showToast = computed(() => { + const value = + !isDemo && + !newestVersion.value.isInvalid() && + !reportViewerVersion.isDevVersion() && + newestVersion.value.compareTo(reportViewerVersion) > 0 && + !hasShownToast.value + + if (value) { + sessionStorage.setItem('hasShownToast', 'true') + } else { + sessionStorage.removeItem('hasShownToast') + } + + return value +}) fetch('https://api.github.com/repos/jplag/JPlag/releases/latest') .then((response) => response.json())