fix bug editor block

This commit is contained in:
2026-08-09 22:38:14 +03:00
parent 4ba9dd8012
commit b0ee07823e
9 changed files with 710 additions and 1114 deletions
+44 -38
View File
@@ -1,4 +1,5 @@
import React, { useState, useEffect, useRef, useCallback } from 'react';
import 'quill/dist/quill.snow.css';
import '../App.css';
import DOMPurify from 'dompurify';
@@ -14,7 +15,7 @@ function Editor() {
const [editContent, setEditContent] = useState('');
const [editPreviewContent, setEditPreviewContent] = useState('');
const [showConfirmModal, setShowConfirmModal] = useState(false);
const [csrfToken, setCsrfToken] = useState('');
//const [csrfToken, setCsrfToken] = useState('');
const [notify, setNotify] = useState({ message: '', type: '', show: false });
const editorRef = useRef(null);
@@ -30,14 +31,14 @@ function Editor() {
}, []);
// Fetch CSRF token
useEffect(() => {
fetch('/moders/csrf-token')
.then(res => res.json())
.then(data => {
setCsrfToken(data.csrfToken);
})
.catch(() => {});
}, []);
//useEffect(() => {
// fetch('/moders/csrf-token')
// .then(res => res.json())
// .then(data => {
// setCsrfToken(data.csrfToken);
//})
//.catch(() => {});
//}, []);
// Check session on mount
useEffect(() => {
@@ -53,13 +54,9 @@ function Editor() {
.catch(() => setIsLoggedIn(false));
}, []); // eslint-disable-line react-hooks/exhaustive-deps
const authenticatedFetch = useCallback((url, options = {}) => {
if (!options.headers) options.headers = {};
if (options.method && ['POST', 'PUT', 'DELETE'].includes(options.method.toUpperCase())) {
options.headers['x-csrf-token'] = csrfToken;
}
return fetch(url, options);
}, [csrfToken]);
const authenticatedFetch = useCallback((url, options = {}) => {
return fetch(url, options);
}, []);
const loadBlocks = useCallback(async (tab) => {
try {
@@ -140,32 +137,41 @@ function Editor() {
};
const handleSaveBlock = async (e) => {
e.preventDefault();
const content = DOMPurify.sanitize(editContent.trim());
if (!content || content === '<p><br></p>') return;
e.preventDefault();
const content = DOMPurify.sanitize(editContent.trim());
if (!content || content === '<p><br></p>') return;
try {
if (editingBlockId) {
await authenticatedFetch(`/moders/content/${activeTab}/${editingBlockId}`, {
method: 'PUT',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ type: 'text', content })
});
showNotify('Блок обновлён', 'success');
} else {
await authenticatedFetch(`/moders/content/${activeTab}`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ type: 'text', content })
});
showNotify('Блок добавлен', 'success');
}
const url = editingBlockId
? `/moders/content/${activeTab}/${editingBlockId}`
: `/moders/content/${activeTab}`;
const method = editingBlockId ? 'PUT' : 'POST';
console.log('➡️ Отправка:', method, url, { type: 'text', content });
try {
const response = await fetch(url, {
method,
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ type: 'text', content })
});
const data = await response.json();
console.log('⬅️ Ответ сервера:', response.status, data);
if (response.ok) {
showNotify(editingBlockId ? 'Блок обновлён' : 'Блок добавлен', 'success');
setShowEditModal(false);
loadBlocks(activeTab);
} catch (e) {
showNotify('Ошибка сохранения', 'error');
} else {
showNotify(`Ошибка: ${data.message || response.status}`, 'error');
}
};
} catch (e) {
console.error('❌ Ошибка при сохранении:', e);
showNotify('Ошибка сохранения', 'error');
}
};
const handleTryCloseEditModal = () => {
if (editContent !== originalContentRef.current) {