Skip to content

Commit c8dbf51

Browse files
dimitrov-adriandimitrov-adrian
committed
Disable image, attaches and personality if no files access
1 parent f08f99b commit c8dbf51

File tree

3 files changed

+136
-58
lines changed

3 files changed

+136
-58
lines changed

‎src/editorjs-uploader.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,9 @@ export default class Uploader {
2626
files: [file],
2727
},
2828
});
29-
} catch (error) {}
29+
} catch (error) {
30+
window.console.log('editorjs-interface: Cannot get browsing component', error.toString());
31+
}
3032
}, 500);
3133
}
3234

‎src/index.js‎

Lines changed: 98 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
1-
import { defineInterface } from '@directus/shared/utils';
21
import InterfaceComponent from './interface.vue';
3-
4-
export default defineInterface({
2+
export default {
53
id: 'extension-editorjs',
64
name: 'Editor.js',
75
description: 'Block-styled editor for rich media stories, outputs clean data in JSON using Editor.js',
@@ -29,9 +27,18 @@ export default defineInterface({
2927
interface: 'select-dropdown',
3028
options: {
3129
choices: [
32-
{ text: '$t:sans_serif', value: 'sans-serif' },
33-
{ text: '$t:monospace', value: 'monospace' },
34-
{ text: '$t:serif', value: 'serif' },
30+
{
31+
text: '$t:sans_serif',
32+
value: 'sans-serif',
33+
},
34+
{
35+
text: '$t:monospace',
36+
value: 'monospace',
37+
},
38+
{
39+
text: '$t:serif',
40+
value: 'serif',
41+
},
3542
],
3643
},
3744
},
@@ -51,27 +58,90 @@ export default defineInterface({
5158
interface: 'select-multiple-dropdown',
5259
options: {
5360
choices: [
54-
{ value: 'header', text: 'Header' },
55-
{ value: 'list', text: 'List' },
56-
{ value: 'embed', text: 'Embed' },
57-
{ value: 'paragraph', text: 'Paragraph' },
58-
{ value: 'code', text: 'Code' },
59-
{ value: 'image', text: 'Image' },
60-
{ value: 'warning', text: 'Warning' },
61-
{ value: 'attaches', text: 'Attaches' },
62-
{ value: 'table', text: 'Table' },
63-
{ value: 'quote', text: 'Quote' },
64-
{ value: 'marker', text: 'Marker' },
65-
{ value: 'simpleimage', text: 'Simple Image' },
66-
{ value: 'underline', text: 'Underline' },
67-
{ value: 'inlinecode', text: 'Inline Code' },
68-
{ value: 'textalign', text: 'Align' },
69-
{ value: 'alert', text: 'Alert' },
70-
{ value: 'strikethrough', text: 'Strikethrough' },
71-
{ value: 'delimiter', text: 'Delimiter' },
72-
{ value: 'checklist', text: 'Checklist' },
73-
{ value: 'personality', text: 'Personality' },
74-
{ value: 'raw', text: 'Raw HTML' },
61+
{
62+
value: 'header',
63+
text: 'Header',
64+
},
65+
{
66+
value: 'list',
67+
text: 'List',
68+
},
69+
{
70+
value: 'embed',
71+
text: 'Embed',
72+
},
73+
{
74+
value: 'paragraph',
75+
text: 'Paragraph',
76+
},
77+
{
78+
value: 'code',
79+
text: 'Code',
80+
},
81+
{
82+
value: 'image',
83+
text: 'Image',
84+
},
85+
{
86+
value: 'warning',
87+
text: 'Warning',
88+
},
89+
{
90+
value: 'attaches',
91+
text: 'Attaches',
92+
},
93+
{
94+
value: 'table',
95+
text: 'Table',
96+
},
97+
{
98+
value: 'quote',
99+
text: 'Quote',
100+
},
101+
{
102+
value: 'marker',
103+
text: 'Marker',
104+
},
105+
{
106+
value: 'simpleimage',
107+
text: 'Simple Image',
108+
},
109+
{
110+
value: 'underline',
111+
text: 'Underline',
112+
},
113+
{
114+
value: 'inlinecode',
115+
text: 'Inline Code',
116+
},
117+
{
118+
value: 'textalign',
119+
text: 'Align',
120+
},
121+
{
122+
value: 'alert',
123+
text: 'Alert',
124+
},
125+
{
126+
value: 'strikethrough',
127+
text: 'Strikethrough',
128+
},
129+
{
130+
value: 'delimiter',
131+
text: 'Delimiter',
132+
},
133+
{
134+
value: 'checklist',
135+
text: 'Checklist',
136+
},
137+
{
138+
value: 'personality',
139+
text: 'Personality',
140+
},
141+
{
142+
value: 'raw',
143+
text: 'Raw HTML',
144+
},
75145
],
76146
},
77147
},
@@ -105,4 +175,4 @@ export default defineInterface({
105175
},
106176
},
107177
],
108-
});
178+
};

‎src/interface.vue‎

Lines changed: 35 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
11
<template>
2-
<v-dialog :model-value="fileHandler !== null" @update:model-value="unsetFileHandler" @esc="unsetFileHandler">
2+
<v-dialog v-if="haveFilesAccess" :model-value="fileHandler !== null" @update:model-value="unsetFileHandler" @esc="unsetFileHandler">
33
<v-card>
44
<v-card-title>
55
<i18n-t keypath="upload_from_device" />
66
</v-card-title>
77
<v-card-text>
88
<v-upload
99
:ref="uploaderComponentElement"
10-
@input="handleFile"
1110
:multiple="false"
1211
:folder="folder"
1312
from-library
1413
from-url
14+
@input="handleFile"
1515
/>
1616
</v-card-text>
1717
<v-card-actions>
@@ -21,10 +21,10 @@
2121
</v-card-actions>
2222
</v-card>
2323
</v-dialog>
24-
<div :class="className" ref="editorElement"></div>
24+
<div ref="editorElement" :class="className"></div>
2525
</template>
2626

27-
<script>
27+
<script language="js">
2828
import { defineComponent, ref, onMounted, onUnmounted, watch, inject } from 'vue';
2929
import debounce from 'debounce';
3030
import EditorJS from '@editorjs/editorjs';
@@ -53,7 +53,6 @@ import AttachesTool from './custom-plugins/plugin-attaches-patch';
5353
import PersonalityTool from './custom-plugins/plugin-personality-patch';
5454
5555
export default defineComponent({
56-
emits: ['input', 'error'],
5756
props: {
5857
value: {
5958
type: Object,
@@ -84,36 +83,19 @@ export default defineComponent({
8483
default: undefined,
8584
},
8685
},
87-
86+
emits: ['input', 'error'],
8887
setup(props, { emit, attrs }) {
8988
const api = inject('api');
90-
91-
function addQueryToPath(path, query) {
92-
const queryParams = [];
93-
94-
for (const [key, value] of Object.entries(query)) {
95-
queryParams.push(`${key}=${value}`);
96-
}
97-
98-
return path.includes('?') ? `${path}&${queryParams.join('&')}` : `${path}?${queryParams.join('&')}`;
99-
}
100-
101-
function getToken() {
102-
return api.defaults.headers?.['Authorization']?.split(' ')[1] || null;
103-
}
104-
105-
function addTokenToURL(url, token) {
106-
const accessToken = token || getToken();
107-
if (!accessToken) return url;
108-
return addQueryToPath(url, { access_token: accessToken });
109-
}
89+
const { useCollectionsStore } = inject('stores');
90+
const collectionStore = useCollectionsStore();
11091
11192
const editorjsInstance = ref(null);
11293
const uploaderComponentElement = ref(null);
11394
const editorElement = ref(null);
11495
const fileHandler = ref(null);
96+
const haveFilesAccess = Boolean(collectionStore.getCollection('directus_files'));
11597
116-
const editorValueEmitter = debounce(function saver(context) {
98+
const editorValueEmitter = debounce((context) => {
11799
if (props.disabled || !context) return;
118100
119101
context.saver
@@ -186,6 +168,7 @@ export default defineComponent({
186168
[props.font]: true,
187169
bordered: props.bordered,
188170
},
171+
haveFilesAccess,
189172
190173
// Methods
191174
editorValueEmitter,
@@ -336,16 +319,39 @@ export default defineComponent({
336319
337320
// Build current tools config.
338321
const tools = {};
339-
322+
const fileRequiresTools = ['attaches', 'personality', 'image'];
340323
for (const toolName of props.tools) {
324+
if (!haveFilesAccess && fileRequiresTools.includes(toolName)) continue;
341325
// @ts-ignore
342-
if (defaults.hasOwnProperty(toolName)) {
326+
if (toolName in defaults) {
343327
tools[toolName.toString()] = defaults[toolName];
344328
}
345329
}
346330
347331
return tools;
348332
}
333+
334+
function addQueryToPath(path, query) {
335+
const queryParams = [];
336+
337+
for (const [key, value] of Object.entries(query)) {
338+
queryParams.push(`${key}=${value}`);
339+
}
340+
341+
return path.includes('?') ? `${path}&${queryParams.join('&')}` : `${path}?${queryParams.join('&')}`;
342+
}
343+
344+
function getToken() {
345+
return api.defaults.headers?.['Authorization']?.split(' ')[1] || null;
346+
}
347+
348+
function addTokenToURL(url, token) {
349+
const accessToken = token || getToken();
350+
if (!accessToken) return url;
351+
return addQueryToPath(url, {
352+
access_token: accessToken,
353+
});
354+
}
349355
},
350356
});
351357
</script>

0 commit comments

Comments
 (0)