-
-
- {{ t('editor.blockPicker.noProps') }}
-
-
-
-
-
-
-
-
+
@@ -145,7 +110,9 @@ import { computed, onMounted, reactive } from 'vue'
import { useI18n } from 'vue-i18n'
import { notify } from '@/composables/notify'
-import { blockMarkdown } from '@/helpers/blocks'
+import { blockMarkdown, blockPropsFilled } from '@/helpers/blocks'
+
+import BlockPropsForm from '@/components/BlockPropsForm.vue'
import { useSiteStore } from '@/stores/site'
@@ -186,15 +153,10 @@ const blocks = computed(() => state.blocks.filter((block) => block.isEnabled))
const markdown = computed(() => (state.selected ? blockMarkdown(state.selected, state.values) : ''))
-const canInsert = computed(() => {
- if (!state.selected) {
- return false
- }
- // -> A required prop with nothing in it would insert a block that cannot draw anything
- return state.selected.props
- .filter((prop) => prop.required)
- .every((prop) => String(state.values[prop.name] ?? '').length > 0)
-})
+// -> A required prop with nothing in it would insert a block that cannot draw anything
+const canInsert = computed(
+ () => Boolean(state.selected) && blockPropsFilled(state.selected, state.values)
+)
// METHODS
diff --git a/frontend/src/components/BlockPropsForm.vue b/frontend/src/components/BlockPropsForm.vue
new file mode 100644
index 000000000..6d24e369a
--- /dev/null
+++ b/frontend/src/components/BlockPropsForm.vue
@@ -0,0 +1,75 @@
+
+
+ {{ t('editor.blockPicker.noProps') }}
+
+
+
+
+
+
+
+
+
+
+
diff --git a/frontend/src/components/EditorMarkdown.vue b/frontend/src/components/EditorMarkdown.vue
index 0aaee20b4..d7f2367be 100644
--- a/frontend/src/components/EditorMarkdown.vue
+++ b/frontend/src/components/EditorMarkdown.vue
@@ -309,6 +309,7 @@