server-side item sanitization

This commit is contained in:
Nazar Kanaev
2021-03-29 21:58:02 +01:00
parent 493a4262b1
commit 3ae17171e2
6 changed files with 77 additions and 43 deletions

View File

@@ -117,7 +117,7 @@
<label class="selectgroup mt-1"
:class="{'d-none': filterSelected
&& !filteredFolderStats[folder.id]
&& (!itemSelected || feedsById[itemSelectedDetails.feed_id].folder_id != folder.id)}">
&& (!itemSelectedDetails || feedsById[itemSelectedDetails.feed_id].folder_id != folder.id)}">
<input type="radio" name="feed" :value="'folder:'+folder.id" v-model="feedSelected">
<div class="selectgroup-label d-flex align-items-center w-100" v-if="folder.id">
<span class="icon mr-2"
@@ -133,7 +133,7 @@
<label class="selectgroup"
:class="{'d-none': filterSelected
&& !filteredFeedStats[feed.id]
&& (!itemSelected || itemSelectedDetails.feed_id != feed.id)}"
&& (!itemSelectedDetails || itemSelectedDetails.feed_id != feed.id)}"
v-for="feed in folder.feeds">
<input type="radio" name="feed" :value="'feed:'+feed.id" v-model="feedSelected">
<div class="selectgroup-label d-flex align-items-center w-100">
@@ -195,7 +195,7 @@
</div>
<!-- item show -->
<div id="col-item" class="vh-100 d-flex flex-column w-100" style="min-width: 0;">
<div class="toolbar px-2 d-flex align-items-center" v-if="itemSelected">
<div class="toolbar px-2 d-flex align-items-center" v-if="itemSelectedDetails">
<button class="toolbar-item"
@click="toggleItemStarred(itemSelectedDetails)"
title="Mark Starred">
@@ -245,7 +245,7 @@
<span class="icon">{% inline "x.svg" %}</span>
</button>
</div>
<div v-if="itemSelected"
<div v-if="itemSelectedDetails"
ref="content"
class="content px-4 pt-3 pb-5 border-top overflow-auto"
:style="{'font-family': theme.font, 'font-size': theme.size + 'rem'}">

View File

@@ -71,6 +71,9 @@
}
},
items: {
get: function(id) {
return api('get', './api/items/' + id).then(json)
},
list: function(query) {
return api('get', './api/items' + param(query)).then(json)
},

View File

@@ -233,7 +233,7 @@ var vm = new Vue({
'num': 1,
},
'itemSelected': null,
'itemSelectedDetails': {},
'itemSelectedDetails': null,
'itemSelectedReadability': '',
'itemSearch': '',
'itemSortNewestFirst': undefined,
@@ -281,9 +281,6 @@ var vm = new Vue({
feedsById: function() {
return this.feeds.reduce(function(acc, feed) { acc[feed.id] = feed; return acc }, {})
},
itemsById: function() {
return this.items.reduce(function(acc, item) { acc[item.id] = item; return acc }, {})
},
itemSelectedContent: function() {
if (!this.itemSelected) return ''
@@ -296,7 +293,7 @@ var vm = new Vue({
else if (this.itemSelectedDetails.description)
content = this.itemSelectedDetails.description
return sanitize(content, this.itemSelectedDetails.link)
return content
},
},
watch: {
@@ -345,12 +342,14 @@ var vm = new Vue({
}
if (this.$refs.content) this.$refs.content.scrollTop = 0
this.itemSelectedDetails = this.itemsById[newVal]
if (this.itemSelectedDetails.status == 'unread') {
this.itemSelectedDetails.status = 'read'
this.feedStats[this.itemSelectedDetails.feed_id].unread -= 1
api.items.update(this.itemSelectedDetails.id, {status: this.itemSelectedDetails.status})
}
api.items.get(newVal).then(function(item) {
this.itemSelectedDetails = item
if (this.itemSelectedDetails.status == 'unread') {
this.itemSelectedDetails.status = 'read'
this.feedStats[this.itemSelectedDetails.feed_id].unread -= 1
api.items.update(this.itemSelectedDetails.id, {status: this.itemSelectedDetails.status})
}
}.bind(this))
},
'itemSearch': debounce(function(newVal) {
this.refreshItems()