Lazy load tooltip

web/components/UserPopover.tsx

@@ -1,11 +1,12 @@
 // This displays a clickable user name (or whatever children element you provide), and displays a simple tooltip of created time. OnClick a modal with more information about the user is displayed.
 
 import { useState, ReactNode, FC } from 'react';
-import { Divider, Modal, Tooltip, Typography, Row, Col, Space } from 'antd';
+import { Divider, Modal, Typography, Row, Col, Space } from 'antd';
 import formatDistanceToNow from 'date-fns/formatDistanceToNow';
 import format from 'date-fns/format';
 import { uniq } from 'lodash';
 
+import dynamic from 'next/dynamic';
 import { BanUserButton } from './BanUserButton';
 import { ModeratorUserButton } from './ModeratorUserButton';
 
@@ -13,6 +14,10 @@ import { User, UserConnectionInfo } from '../types/chat';
 import { formatDisplayDate } from './UserTable';
 import { formatUAstring } from '../utils/format';
 
+// Lazy loaded components
+
+const Tooltip = dynamic(() => import('antd').then(mod => mod.Tooltip));
+
 export type UserPopoverProps = {
   user: User;
   connectionInfo?: UserConnectionInfo | null;