lint

src/components/Editor/Editor.tsx

@@ -303,7 +303,6 @@ export const EditorComponent = (props: EditorComponentProps) => {
             user: { name: profile.name, color: uniqolor(profile.slug).color }
           })
         )
-
       } catch (error) {
         console.error('Error initializing collaboration:', error)
         showSnackbar({ body: t('Failed to initialize collaboration') })
@@ -334,13 +333,7 @@ export const EditorComponent = (props: EditorComponentProps) => {
   })
 
   // collab mode on/off
-  createEffect(
+  createEffect(on(isCollabMode, (x) => !x && initializeCollaboration(), { defer: true }))
-    on(
-      isCollabMode,
-      (x) => !x && initializeCollaboration(),
-      { defer: true }
-    )
-  )
 
   onCleanup(() => {
     editorElRef()?.removeEventListener('focus', handleFocus)

src/components/Editor/Toolbar/FullBubbleMenu.tsx

@@ -9,8 +9,8 @@ import { MicroBubbleMenu } from './MicroBubbleMenu'
 import { ToolbarControl } from './ToolbarControl'
 
 import { Popover } from '~/components/_shared/Popover/Popover'
-import styles from './FullBubbleMenu.module.scss'
 import { useEditorContext } from '~/context/editor'
+import styles from './FullBubbleMenu.module.scss'
 
 type FullBubbleMenuProps = {
   editor: () => Editor | undefined
@@ -265,8 +265,11 @@ export const FullBubbleMenu = (props: FullBubbleMenuProps) => {
         <div class={styles.dropDownHolder}>
           <Popover content={t('Collaborative mode')}>
             {(triggerRef: (el: HTMLButtonElement) => void) => (
-              <button ref={triggerRef} type="button" class={styles.actionButton}
+              <button
-                onClick={() => setIsCollabMode(x => !x)}
+                ref={triggerRef}
+                type="button"
+                class={styles.actionButton}
+                onClick={() => setIsCollabMode((x) => !x)}
               >
                 <Icon name={`comment${isCollabMode() ? '-hover' : ''}`} />
               </button>