Add attachment support for nextcloud-text#107
Conversation
|
Please confirm this is manually written code, not AI generated. |
|
Hey @davidjgraph, yes, this is indeed manually written code and may need some refinement 😄 |
@davidjgraph just for the context: we worked on the attachment editing feature for NextCloud (see nextcloud/text#6676). The PR here basically makes the draw.io plugin behave the same way as the NextCloud whiteboard app. Which is very neat for creating rich documents with diagrams; and the diagrams are integrated into the document as attachments. The basic functionality is laid out in my comment here: nextcloud/collectives#615 (comment). With draw.io installed it simply shows "Create new draw.io diagram" and launches draw.io to edit the attachment. |
|
Here is how it works with draw.io The main point is to have the diagram as attachment to the markdown doc, not as separate file, to not clutter the surrounding folder with the diagram files. |
There was a problem hiding this comment.
Pull Request Overview
This PR adds attachment support for draw.io files within the Nextcloud Text editor by integrating with Nextcloud's new attachment feature. It enables users to insert and preview draw.io diagrams directly in text documents.
Key changes:
- Implemented a preview component for rendering draw.io file thumbnails in the Text editor
- Added template file creator registration to make draw.io mimetypes available to other Nextcloud apps
- Enhanced editor navigation to support files stored in Text attachment directories
Reviewed Changes
Copilot reviewed 6 out of 11 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| src/viewer.js | New preview component for displaying draw.io file thumbnails with click-to-edit functionality |
| src/main.js | Registered the preview component with OCA.Viewer and refactored initialization to remove new file menu registration |
| src/editor.js | Added logic to detect and handle files in Text attachment directories for proper navigation |
| package.json | Added @nextcloud/browserslist-config dependency |
| lib/Listeners/RegisterTemplateCreatorListener.php | New event listener for registering draw.io file templates with Nextcloud's template manager |
| lib/AppInfo/Application.php | Registered the template creator listener and added APP_ID constant |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
|
||
| this.$nextTick(() => { | ||
| const el = document.getElementById( | ||
| `drawoi-${rnd}`, |
There was a problem hiding this comment.
Corrected spelling of 'drawoi' to 'drawio'.
| const img = new Image(); | ||
| img.onload = function() { | ||
| const el = document.getElementById( | ||
| `drawoi-${rnd}`, |
There was a problem hiding this comment.
Corrected spelling of 'drawoi' to 'drawio'.
| return createElement( | ||
| 'div', | ||
| { | ||
| attrs: { id: `drawoi-${rnd}` }, |
There was a problem hiding this comment.
Corrected spelling of 'drawoi' to 'drawio'.
| img.style.height = `${this.height}px`; | ||
| img.style.width = `100%`; | ||
| img.style.background = `url(${imgUrl}) no-repeat center/contain`; | ||
| img.style.cursor = 'pointer', |
There was a problem hiding this comment.
Syntax error: using comma instead of semicolon. This line should end with a semicolon to be consistent with other property assignments and to avoid potential issues.
| img.style.cursor = 'pointer', | |
| img.style.cursor = 'pointer'; |
| computed: { | ||
| isWB() { | ||
| var extension = this.filename.substr(this.filename.lastIndexOf('.') + 1).toLowerCase(); | ||
| return String(extension == 'dwb'); |
There was a problem hiding this comment.
Using loose equality (==) and unnecessary String() conversion. The comparison should use strict equality (===) and String() wrapper is redundant since the result will already be a boolean.
| return String(extension == 'dwb'); | |
| return extension === 'dwb'; |
This PR integrates the new attachment support from nextcloud/text into nextcloud-drawio.
Changes