Skip to content
Permalink

Comparing changes

This is a direct comparison between two commits made in this repository or its related repositories. View the default comparison for this range or learn more about diff comparisons.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also . Learn more about diff comparisons here.
base repository: liqd/a4-meinberlin
Failed to load repositories. Confirm that selected base ref is valid, then try again.
Loading
base: 240dd21bec8cb075c1537b8af9c20555d8813a7a
Choose a base ref
..
head repository: liqd/a4-meinberlin
Failed to load repositories. Confirm that selected head ref is valid, then try again.
Loading
compare: 22e04d23e5ada9462a134ee98398b2aa58e10eb7
Choose a head ref
Showing with 57 additions and 72 deletions.
  1. +9 −0 changelog/8231.md
  2. +44 −69 meinberlin/apps/documents/assets/ParagraphForm.jsx
  3. +2 −1 meinberlin/config/settings/base.py
  4. +1 −1 package.json
  5. +1 −1 requirements/base.txt
9 changes: 9 additions & 0 deletions changelog/8231.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
### Added

- add max resolution (650, 650) to organisation logo
- add settings to restrict upload file size for django-ckeditor-5

### Changed

- update django-ckeditor-5 to v0.2.13-liqd
- refactor ParagraphForm.jsx to work with the changed api in django-ckeditor-5
113 changes: 44 additions & 69 deletions meinberlin/apps/documents/assets/ParagraphForm.jsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, { useRef, useEffect } from 'react'
import React, { useEffect } from 'react'
import django from 'django'
import FormFieldError from 'adhocracy4/adhocracy4/static/FormFieldError'

@@ -18,61 +18,26 @@ const translations = {
}

const ParagraphForm = (props) => {
const editor = useRef(null)
const index = useRef(props.index)
const id = 'id_paragraphs-' + props.id + '-text'
const id = 'id_paragraphs-' + props.id
const ckeditorId = id + '-text'

useEffect(() => {
// destroy if component renders multiple times to prevent
// multiple CKEditors
let destroy = false
const createEditor = async () => {
const config = props.config
window.ckeditorSetSpecialConfigValues(
config,
props.csrfCookieName,
props.uploadUrl,
props.uploadFileTypes
)
const ckeditor = await window.ClassicEditor.create(
document.querySelector('#' + id),
config
)
if (destroy) {
ckeditor.destroy()
} else {
editor.current = ckeditor
editor.current.model.document.on('change:data', (e) => {
const text = editor.current.getData()
props.onTextChange(text)
})
editor.current.setData(props.paragraph.text)
}
window.ckeditorRegisterCallback(ckeditorId, setDataHandler)
const editor = window.editors[ckeditorId]
if (editor) {
setDataHandler(editor)
}
if (editor.current) {
if (index.current !== props.index) {
// recreate if index changed
destroyEditor()
}
return () => {
window.ckeditorUnregisterCallback(ckeditorId)
}
index.current = props.index
if (!editor.current) {
createEditor()
return () => {
// destroy if still in process of creating
destroy = true
// destroy if already created
destroyEditor()
}
}
}, [props.index])
}, [props.id, props.onTextChange, props.index])

const destroyEditor = () => {
if (editor.current) {
editor.current.destroy()
editor.current = null
}
const setDataHandler = (editor) => {
editor.model.document.on('change:data', () => {
props.onTextChange(editor.getData())
})
}

const handleNameChange = (e) => {
const name = e.target.value
props.onNameChange(name)
@@ -113,26 +78,36 @@ const ParagraphForm = (props) => {
>
{translations.helpText}
</div>
<div
className="django-ckeditor-widget"
data-field-id={'id_paragraphs-' + props.id + '-text'}
style={{ display: 'inline-block' }}
>
<textarea
id={'id_paragraphs-' + props.id + '-text'}
aria-invalid={props.errors ? 'true' : 'false'}
aria-describedby={
(props.errors ? 'id_paragraph-help-text-' : 'id_error-') +
props.id
}
/>
</div>
<FormFieldError
id={'id_error-' + props.id}
error={props.errors}
field="text"
/>
</label>
<div className="ck-editor-container">
<textarea
id={ckeditorId}
className="django_ckeditor_5"
defaultValue={props.paragraph.text}
/>
<div />
<span
className="word-count"
id={ckeditorId + '_script-word-count'}
/>
<input
type="hidden"
id={ckeditorId + '_script-ck-editor-5-upload-url'}
data-upload-url={props.uploadUrl}
data-upload-file-types={JSON.stringify(props.uploadFileTypes)}
data-csrf_cookie_name={props.csrfCookieName}
/>
<span id={ckeditorId + '_script-span'}>
<script id={ckeditorId + '_script'} type="application/json">
{JSON.stringify(props.config)}
</script>
</span>
</div>
<FormFieldError
id={'id_error-' + props.id}
error={props.errors}
field="text"
/>
</div>
</div>
</div>
3 changes: 2 additions & 1 deletion meinberlin/config/settings/base.py
Original file line number Diff line number Diff line change
@@ -219,7 +219,7 @@
},
"heroimage": {"min_resolution": (1500, 500)},
"tileimage": {"min_resolution": (500, 300)},
"logo": {"min_resolution": (200, 50)},
"logo": {"min_resolution": (200, 50), "max_resolution": (650, 650)},
"avatar": {"min_resolution": (200, 200)},
"idea_image": {"min_resolution": (600, 400)},
"plan_image": {"min_resolution": (600, 400)},
@@ -534,6 +534,7 @@
CKEDITOR_5_UNRESTRICTED_UPLOADS = True
CKEDITOR_5_ALLOW_ALL_FILE_TYPES = True
CKEDITOR_5_UPLOAD_FILE_TYPES = ["jpg", "jpeg", "png", "gif", "pdf", "doc", "docx"]
CKEDITOR_5_MAX_FILE_SIZE = 5 # restrict to 5 MB
CKEDITOR_5_CONFIGS = {
"default": {
"language": "de",
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -67,7 +67,7 @@
"@babel/preset-react": "7.24.7",
"@testing-library/react": "14.3.1",
"babel-loader": "9.1.3",
"eslint": "9.7.0",
"eslint": "9.8.0",
"eslint-config-standard": "17.1.0",
"eslint-config-standard-jsx": "11.0.0",
"eslint-plugin-import": "2.29.1",
2 changes: 1 addition & 1 deletion requirements/base.txt
Original file line number Diff line number Diff line change
@@ -20,7 +20,7 @@ celery==5.3.6
django-allauth==0.61.1
django-autoslug==1.9.9
django-ckeditor==6.7.1
https://github.com/liqd/django-ckeditor-5/releases/download/v0.2.11-liqd/django_ckeditor_5-0.2.11-py3-none-any.whl
https://github.com/liqd/django-ckeditor-5/releases/download/v0.2.13-liqd/django_ckeditor_5-0.2.13-py3-none-any.whl
django-filter==23.5
django-widget-tweaks==1.5.0
Django==4.2.11