Merge pull request #21082 from nextcloud/enh/noid/apps-settings

Show changelog in apps management
This commit is contained in:
Roeland Jago Douma 2020-09-03 22:13:27 +02:00 committed by GitHub
commit c205faca80
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
20 changed files with 264 additions and 89 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -250,6 +250,7 @@ class AppSettingsController extends Controller {
$appstoreData = $appData['appstoreData'];
$appData['screenshot'] = isset($appstoreData['screenshots'][0]['url']) ? 'https://usercontent.apps.nextcloud.com/' . base64_encode($appstoreData['screenshots'][0]['url']) : '';
$appData['category'] = $appstoreData['categories'];
$appData['releases'] = $appstoreData['releases'];
}
$newVersion = $this->installer->isUpdateAvailable($appData['id']);

View File

@ -139,24 +139,23 @@
target="_blank"
rel="noreferrer noopener">{{ t('settings', 'Developer documentation') }} </a>
</p>
<div class="app-details__description" v-html="renderMarkdown" />
<Markdown class="app-details__description" :text="app.description" />
</div>
</template>
<script>
import { Multiselect } from '@nextcloud/vue'
import marked from 'marked'
import dompurify from 'dompurify'
import AppManagement from '../mixins/AppManagement'
import PrefixMixin from './PrefixMixin'
import Markdown from './Markdown'
export default {
name: 'AppDetails',
components: {
Multiselect,
Markdown,
},
mixins: [AppManagement, PrefixMixin],
@ -204,66 +203,6 @@ export default {
.filter(group => group.id !== 'disabled')
.sort((a, b) => a.name.localeCompare(b.name))
},
renderMarkdown() {
const renderer = new marked.Renderer()
renderer.link = function(href, title, text) {
let prot
try {
prot = decodeURIComponent(unescape(href))
.replace(/[^\w:]/g, '')
.toLowerCase()
} catch (e) {
return ''
}
if (prot.indexOf('http:') !== 0 && prot.indexOf('https:') !== 0) {
return ''
}
let out = '<a href="' + href + '" rel="noreferrer noopener"'
if (title) {
out += ' title="' + title + '"'
}
out += '>' + text + '</a>'
return out
}
renderer.image = function(href, title, text) {
if (text) {
return text
}
return title
}
renderer.blockquote = function(quote) {
return quote
}
return dompurify.sanitize(
marked(this.app.description.trim(), {
renderer,
gfm: false,
highlight: false,
tables: false,
breaks: false,
pedantic: false,
sanitize: true,
smartLists: true,
smartypants: false,
}),
{
SAFE_FOR_JQUERY: true,
ALLOWED_TAGS: [
'strong',
'p',
'a',
'ul',
'ol',
'li',
'em',
'del',
'blockquote',
],
}
)
},
},
mounted() {
if (this.app.groups.length > 0) {

View File

@ -0,0 +1,197 @@
<!--
- @copyright Copyright (c) 2020 Julius Härtl <jus@bitgrid.net>
-
- @author Julius Härtl <jus@bitgrid.net>
-
- @license GNU AGPL version 3 or any later version
-
- This program is free software: you can redistribute it and/or modify
- it under the terms of the GNU Affero General Public License as
- published by the Free Software Foundation, either version 3 of the
- License, or (at your option) any later version.
-
- This program is distributed in the hope that it will be useful,
- but WITHOUT ANY WARRANTY; without even the implied warranty of
- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- GNU Affero General Public License for more details.
-
- You should have received a copy of the GNU Affero General Public License
- along with this program. If not, see <http://www.gnu.org/licenses/>.
-
-->
<template>
<div class="settings-markdown" v-html="renderMarkdown" />
</template>
<script>
import marked from 'marked'
import dompurify from 'dompurify'
export default {
name: 'Markdown',
props: {
text: {
type: String,
default: '',
},
},
computed: {
renderMarkdown() {
const renderer = new marked.Renderer()
renderer.link = function(href, title, text) {
let prot
try {
prot = decodeURIComponent(unescape(href))
.replace(/[^\w:]/g, '')
.toLowerCase()
} catch (e) {
return ''
}
if (prot.indexOf('http:') !== 0 && prot.indexOf('https:') !== 0) {
return ''
}
let out = '<a href="' + href + '" rel="noreferrer noopener"'
if (title) {
out += ' title="' + title + '"'
}
out += '>' + text + '</a>'
return out
}
renderer.image = function(href, title, text) {
if (text) {
return text
}
return title
}
renderer.blockquote = function(quote) {
return quote
}
return dompurify.sanitize(
marked(this.text.trim(), {
renderer,
gfm: false,
highlight: false,
tables: false,
breaks: false,
pedantic: false,
sanitize: true,
smartLists: true,
smartypants: false,
}),
{
SAFE_FOR_JQUERY: true,
ALLOWED_TAGS: [
'h1',
'h2',
'h3',
'h4',
'h5',
'h6',
'strong',
'p',
'a',
'ul',
'ol',
'li',
'em',
'del',
'blockquote',
],
}
)
},
},
}
</script>
<style scoped lang="scss">
.settings-markdown::v-deep {
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: 600;
line-height: 120%;
margin-top: 24px;
margin-bottom: 12px;
color: var(--color-main-text);
}
h1 {
font-size: 36px;
margin-top: 48px;
}
h2 {
font-size: 28px;
margin-top: 48px;
}
h3 {
font-size: 24px;
}
h4 {
font-size: 21px;
}
h5 {
font-size: 17px;
}
h6 {
font-size: 14px;
}
pre {
white-space: pre;
overflow-x: auto;
background-color: var(--color-background-dark);
border-radius: var(--border-radius);
padding: 1em 1.3em;
margin-bottom: 1em;
}
p code {
background-color: var(--color-background-dark);
border-radius: var(--border-radius);
padding: .1em .3em;
}
li {
position: relative;
}
ul, ol {
padding-left: 10px;
margin-left: 10px;
}
ul li {
list-style-type: disc;
}
ul > li > ul > li {
list-style-type: circle;
}
ul > li > ul > li ul li {
list-style-type: square;
}
blockquote {
padding-left: 1em;
border-left: 4px solid var(--color-primary-element);
color: var(--color-text-maxcontrast);
margin-left: 0;
margin-right: 0;
}
}
</style>

View File

@ -119,7 +119,23 @@
</template>
<!-- Tab content -->
<AppDetails :app="app" />
<AppSidebarTab id="desc"
icon="icon-category-office"
:name="t('settings', 'Details')"
:order="0">
<AppDetails :app="app" />
</AppSidebarTab>
<AppSidebarTab v-if="app.appstoreData && app.releases[0].translations.en.changelog"
id="desca"
icon="icon-category-organization"
:name="t('settings', 'Changelog')"
:order="1">
<div v-for="release in app.releases" :key="release.version" class="app-sidebar-tabs__release">
<h2>{{ release.version }}</h2>
<Markdown v-if="changelog(release)" :text="changelog(release)" />
</div>
</AppSidebarTab>
</AppSidebar>
</Content>
</template>
@ -131,6 +147,7 @@ import AppNavigationCounter from '@nextcloud/vue/dist/Components/AppNavigationCo
import AppNavigationItem from '@nextcloud/vue/dist/Components/AppNavigationItem'
import AppNavigationSpacer from '@nextcloud/vue/dist/Components/AppNavigationSpacer'
import AppSidebar from '@nextcloud/vue/dist/Components/AppSidebar'
import AppSidebarTab from '@nextcloud/vue/dist/Components/AppSidebarTab'
import Content from '@nextcloud/vue/dist/Components/Content'
import Vue from 'vue'
import VueLocalStorage from 'vue-localstorage'
@ -139,6 +156,7 @@ import AppList from '../components/AppList'
import AppDetails from '../components/AppDetails'
import AppManagement from '../mixins/AppManagement'
import AppScore from '../components/AppList/AppScore'
import Markdown from '../components/Markdown'
Vue.use(VueLocalStorage)
@ -155,7 +173,9 @@ export default {
AppNavigationSpacer,
AppScore,
AppSidebar,
AppSidebarTab,
Content,
Markdown,
},
mixins: [AppManagement],
@ -228,6 +248,9 @@ export default {
}
},
changelog() {
return (release) => release.translations.en.changelog
},
},
watch: {
@ -326,4 +349,19 @@ export default {
}
}
.app-sidebar-tabs__release {
h2 {
border-bottom: 1px solid var(--color-border);
}
// Overwrite changelog heading styles
::v-deep {
h3 {
font-size: 20px;
}
h4 {
font-size: 17px;
}
}
}
</style>