Don't show embed in dropdown if, closes code16/sharp-dev#404

Author: aguingand

resources/js/form/components/fields/editor/Editor.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
     import { __ } from "@/utils/i18n";
     import { FormEditorFieldData } from "@/types";
-    import { provide, ref, watch } from "vue";
+    import { computed, provide, ref, watch } from "vue";
     import { Editor, BubbleMenu, isActive } from "@tiptap/vue-3";
     import debounce from 'lodash/debounce';
     import { EditorContent } from '@tiptap/vue-3';
@@ -150,6 +150,11 @@
             return editor;
         }
     );
+
+    const dropdownEmbeds = computed(() =>
+        Object.values(props.field.embeds ?? {})
+            .filter(embed => !props.field.toolbar?.includes(`embed:${embed.key}`))
+    );
 </script>
 
 <template>
@@ -198,15 +203,15 @@
                                 </Toggle>
                             </template>
                         </template>
-                        <template v-if="Object.values(props.field.embeds ?? {}).length > 0">
+                        <template v-if="dropdownEmbeds.length > 0">
                             <DropdownMenu :modal="false">
                                 <DropdownMenuTrigger as-child>
                                     <Button class="px-3" variant="ghost" size="sm" :disabled="props.field.readOnly">
                                         {{ __('sharp::form.editor.dropdown.embeds') }}
                                     </Button>
                                 </DropdownMenuTrigger>
                                 <DropdownMenuContent>
-                                    <template v-for="embed in props.field.embeds">
+                                    <template v-for="embed in dropdownEmbeds">
                                         <DropdownMenuItem @click="embedModal.open({ embed })">
                                             {{ embed.label }}
                                         </DropdownMenuItem>

resources/js/types/generated.d.ts

@@ -368,7 +368,7 @@ export type FormEditorFieldData = {
   showCharacterCount: boolean;
   uploads: FormEditorFieldUploadData | null;
   embeds: { [embedKey: string]: EmbedData };
-  toolbar: Array<FormEditorToolbarButton>;
+  toolbar: Array<FormEditorToolbarButton | `embed:${string}`>;
   maxHeight: number | null;
   maxLength: number | null;
   placeholder: string | null;

src/Data/Form/Fields/FormEditorFieldData.php

@@ -35,7 +35,7 @@ public function __construct(
         public ?array $uploads = null,
         #[LiteralTypeScriptType('{ [embedKey:string]:EmbedData }')]
         public ?array $embeds = null,
-        #[LiteralTypeScriptType('Array<FormEditorToolbarButton>')]
+        #[LiteralTypeScriptType('Array<FormEditorToolbarButton | `embed:${string}`>')]
         public ?array $toolbar = null,
         public ?int $maxHeight = null,
         public ?int $maxLength = null,