prevent bubble when all options are shown

front/src/components/structure/message/Composer.vue

@@ -95,6 +95,34 @@ function sendMessage() {
 <template>
     <div v-if="editor">
         <div id="options" v-if="showOptions">
+            <span class="category">
+                <SvgLoader
+                    svg="bold"
+                    @click="editor.chain().focus().toggleBold().run()"
+                    :class="[{ 'is-active': editor.isActive('bold') }, 'editorOption']"
+                />
+                <SvgLoader
+                    svg="italic"
+                    @click="editor.chain().focus().toggleItalic().run()"
+                    :class="[{ 'is-active': editor.isActive('italic') }, 'editorOption']"
+                    v-tooltip="'Italic'"
+                />
+                <SvgLoader
+                    svg="strikethrough"
+                    @click="editor.chain().focus().toggleStrike().run()"
+                    :class="[{ 'is-active': editor.isActive('strike') }, 'editorOption']"
+                />
+                <SvgLoader
+                    svg="underline"
+                    @click="editor.chain().focus().toggleUnderline().run()"
+                    :class="[{ 'is-active': editor.isActive('underline') }, 'editorOption']"
+                />
+                <SvgLoader
+                    svg="font-color"
+                    @click="editor.commands.toggleHighlight({ color: '#ffcc00' })"
+                    :class="[{ 'is-active': editor.isActive('highlight') }, 'editorOption']"
+                />
+            </span>
             <span class="category">
                 <SvgLoader
                     svg="h-2"
@@ -182,7 +210,7 @@ function sendMessage() {
                 :class="[{ 'is-active': editor.isActive('bold') }, 'editorOption']"
             /> -->
         </div>
-        <bubble-menu class="bubble-menu" :tippy-options="{ duration: 100 }" :editor="editor">
+        <bubble-menu v-if="!showOptions" class="bubble-menu" :tippy-options="{ duration: 100 }" :editor="editor">
             <SvgLoader
                 svg="bold"
                 @click="editor.chain().focus().toggleBold().run()"