Infra-Mirrors/BookStack
1
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2024-09-20 00:06:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Comments: Added back-end HTML support, fixed editor focus

Browse Source 
Also fixed handling of editors when moved in DOM, to properly remove
then re-init before & after move to avoid issues.
This commit is contained in:
Dan Brown 2024-01-30 15:16:58 +00:00
parent 5c92b72fdd
commit adf0baebb9
No known key found for this signature in database
GPG Key ID: 46D9F943C24A2EF9
6 changed files with 34 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
app/Activity/CommentRepo.php
View File

@ -5,7 +5,7 @@ namespace BookStack\Activity;
use BookStack\Activity\Models\Comment;
use BookStack\Entities\Models\Entity;
use BookStack\Facades\Activity as ActivityService;
use League\CommonMark\CommonMarkConverter;
use BookStack\Util\HtmlDescriptionFilter;
class CommentRepo
{
@ -20,13 +20,12 @@ class CommentRepo
/**
* Create a new comment on an entity.
*/
public function create(Entity $entity, string $text, ?int $parent_id): Comment
public function create(Entity $entity, string $html, ?int $parent_id): Comment
{
$userId = user()->id;
$comment = new Comment();
$comment->text = $text;
$comment->html = $this->commentToHtml($text);
$comment->html = HtmlDescriptionFilter::filterFromString($html);
$comment->created_by = $userId;
$comment->updated_by = $userId;
$comment->local_id = $this->getNextLocalId($entity);
@ -42,11 +41,10 @@ class CommentRepo
/**
* Update an existing comment.
*/
public function update(Comment $comment, string $text): Comment
public function update(Comment $comment, string $html): Comment
{
$comment->updated_by = user()->id;
$comment->text = $text;
$comment->html = $this->commentToHtml($text);
$comment->html = HtmlDescriptionFilter::filterFromString($html);
$comment->save();
ActivityService::add(ActivityType::COMMENT_UPDATE, $comment);
@ -64,20 +62,6 @@ class CommentRepo
ActivityService::add(ActivityType::COMMENT_DELETE, $comment);
}
/**
* Convert the given comment Markdown to HTML.
*/
public function commentToHtml(string $commentText): string
{
$converter = new CommonMarkConverter([
'html_input' => 'strip',
'max_nesting_level' => 10,
'allow_unsafe_links' => false,
]);
return $converter->convert($commentText);
}
/**
* Get the next local ID relative to the linked entity.
*/

17
app/Activity/Controllers/CommentController.php
View File

@ -22,8 +22,8 @@ class CommentController extends Controller
*/
public function savePageComment(Request $request, int $pageId)
{
$this->validate($request, [
'text' => ['required', 'string'],
$input = $this->validate($request, [
'html' => ['required', 'string'],
'parent_id' => ['nullable', 'integer'],
]);
@ -39,7 +39,7 @@ class CommentController extends Controller
// Create a new comment.
$this->checkPermission('comment-create-all');
$comment = $this->commentRepo->create($page, $request->get('text'), $request->get('parent_id'));
$comment = $this->commentRepo->create($page, $input['html'], $input['parent_id'] ?? null);
return view('comments.comment-branch', [
'readOnly' => false,
@ -57,17 +57,20 @@ class CommentController extends Controller
*/
public function update(Request $request, int $commentId)
{
$this->validate($request, [
'text' => ['required', 'string'],
$input = $this->validate($request, [
'html' => ['required', 'string'],
]);
$comment = $this->commentRepo->getById($commentId);
$this->checkOwnablePermission('page-view', $comment->entity);
$this->checkOwnablePermission('comment-update', $comment);
$comment = $this->commentRepo->update($comment, $request->get('text'));
$comment = $this->commentRepo->update($comment, $input['html']);
return view('comments.comment', ['comment' => $comment, 'readOnly' => false]);
return view('comments.comment', [
'comment' => $comment,
'readOnly' => false,
]);
}
/**

6
resources/js/components/page-comment.js
View File

@ -1,6 +1,6 @@
import {Component} from './component';
import {getLoading, htmlToDom} from '../services/dom';
import {buildForInput} from "../wysiwyg/config";
import {buildForInput} from '../wysiwyg/config';
export class PageComment extends Component {
@ -58,6 +58,7 @@ export class PageComment extends Component {
this.toggleEditMode(true);
if (this.wysiwygEditor) {
this.wysiwygEditor.focus();
return;
}
@ -72,6 +73,7 @@ export class PageComment extends Component {
window.tinymce.init(config).then(editors => {
this.wysiwygEditor = editors[0];
setTimeout(() => this.wysiwygEditor.focus(), 50);
});
}
@ -81,7 +83,7 @@ export class PageComment extends Component {
this.form.toggleAttribute('hidden', true);
const reqData = {
text: this.input.value,
html: this.wysiwygEditor.getContent(),
parent_id: this.parentId || null,
};

17
resources/js/components/page-comments.js
View File

@ -1,6 +1,6 @@
import {Component} from './component';
import {getLoading, htmlToDom} from '../services/dom';
import {buildForInput} from "../wysiwyg/config";
import {buildForInput} from '../wysiwyg/config';
export class PageComments extends Component {
@ -65,9 +65,8 @@ export class PageComments extends Component {
this.form.after(loading);
this.form.toggleAttribute('hidden', true);
const text = this.formInput.value;
const reqData = {
text,
html: this.wysiwygEditor.getContent(),
parent_id: this.parentId || null,
};
@ -92,6 +91,7 @@ export class PageComments extends Component {
}
resetForm() {
this.removeEditor();
this.formInput.value = '';
this.parentId = null;
this.replyToRow.toggleAttribute('hidden', true);
@ -99,6 +99,7 @@ export class PageComments extends Component {
}
showForm() {
this.removeEditor();
this.formContainer.toggleAttribute('hidden', false);
this.addButtonContainer.toggleAttribute('hidden', true);
this.formContainer.scrollIntoView({behavior: 'smooth', block: 'nearest'});
@ -118,6 +119,7 @@ export class PageComments extends Component {
loadEditor() {
if (this.wysiwygEditor) {
this.wysiwygEditor.focus();
return;
}
@ -132,10 +134,17 @@ export class PageComments extends Component {
window.tinymce.init(config).then(editors => {
this.wysiwygEditor = editors[0];
this.wysiwygEditor.focus();
setTimeout(() => this.wysiwygEditor.focus(), 50);
});
}
removeEditor() {
if (this.wysiwygEditor) {
this.wysiwygEditor.remove();
this.wysiwygEditor = null;
}
}
getCommentCount() {
return this.container.querySelectorAll('[component="page-comment"]').length;
}

2
resources/views/comments/comment.blade.php
View File

@ -77,7 +77,7 @@
@if(!$readOnly && userCan('comment-update', $comment))
<form novalidate refs="page-comment@form" hidden class="content pt-s px-s block">
<div class="form-group description-input">
<textarea refs="page-comment@input" name="markdown" rows="3" placeholder="{{ trans('entities.comment_placeholder') }}">{{ $comment->text }}</textarea>
<textarea refs="page-comment@input" name="html" rows="3" placeholder="{{ trans('entities.comment_placeholder') }}">{{ $comment->html }}</textarea>
</div>
<div class="form-group text-right">
<button type="button" class="button outline" refs="page-comment@form-cancel">{{ trans('common.cancel') }}</button>

2
resources/views/comments/create.blade.php
View File

@ -16,7 +16,7 @@
<div class="content px-s pt-s">
<form refs="page-comments@form" novalidate>
<div class="form-group description-input">
<textarea refs="page-comments@form-input" name="markdown"
<textarea refs="page-comments@form-input" name="html"
rows="3"
placeholder="{{ trans('entities.comment_placeholder') }}"></textarea>
</div>