refactor(web): move contact modal to component (#1718)

apps/web/src/components/pure/help-island/index.tsx

@@ -1,10 +1,9 @@
-import { Tooltip } from '@affine/component';
-import { MuiFade } from '@affine/component';
+import { MuiFade, Tooltip } from '@affine/component';
 import { useTranslation } from '@affine/i18n';
 import { CloseIcon } from '@blocksuite/icons';
+import dynamic from 'next/dynamic';
 import { useState } from 'react';
 
-import ContactModal from '../contact-modal';
 import { ShortcutsModal } from '../shortcuts-modal';
 import { ContactIcon, HelpIcon, KeyboardIcon } from './Icons';
 import {
@@ -13,6 +12,17 @@ import {
   StyledIsland,
   StyledTriggerWrapper,
 } from './style';
+
+const ContactModal = dynamic(
+  () =>
+    import('@affine/component/contact-modal').then(({ ContactModal }) => ({
+      default: ContactModal,
+    })),
+  {
+    ssr: true,
+  }
+);
+
 export type IslandItemNames = 'contact' | 'shortcuts';
 export const HelpIsland = ({
   showList = ['contact', 'shortcuts'],
@@ -93,7 +103,11 @@ export const HelpIsland = ({
           </StyledTriggerWrapper>
         </MuiFade>
       </StyledIsland>
-      <ContactModal open={open} onClose={() => setOpen(false)} />
+      <ContactModal
+        open={open}
+        onClose={() => setOpen(false)}
+        logoSrc="/imgs/affine-text-logo.png"
+      />
       <ShortcutsModal
         open={openShortCut}
         onClose={() => setOpenShortCut(false)}