Split company show into ui/business + fix eslint

front/src/modules/comments/components/CommentThreadCreateMode.tsx

@@ -1,5 +1,5 @@
 import { BlockNoteEditor } from '@blocknote/core';
-import { BlockNoteView, useBlockNote } from '@blocknote/react';
+import { BlockNoteView } from '@blocknote/react';
 import styled from '@emotion/styled';
 
 import { PropertyBox } from '@/ui/components/property-box/PropertyBox';
@@ -54,7 +54,7 @@ const StyledEditableTitleInput = styled.input`
   font-weight: ${({ theme }) => theme.font.weight.semiBold};
   justify-content: center;
 
-  line-height: 120%;
+  line-height: ${({ theme }) => theme.text.lineHeight.md};
   outline: none;
   width: 318px;
 

front/src/modules/comments/components/CommentThreadEditMode.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import { BlockNoteEditor, PartialBlock } from '@blocknote/core';
+import { BlockNoteEditor } from '@blocknote/core';
 import { BlockNoteView, useBlockNote } from '@blocknote/react';
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
@@ -9,9 +9,6 @@ import { PropertyBoxItem } from '@/ui/components/property-box/PropertyBoxItem';
 import { IconArrowUpRight } from '@/ui/icons/index';
 import { useGetCommentThreadQuery } from '~/generated/graphql';
 
-import { CommentableEntity } from '../types/CommentableEntity';
-import { CommentThreadForDrawer } from '../types/CommentThreadForDrawer';
-
 import { Comments } from './Comments';
 import { CommentThreadRelationPicker } from './CommentThreadRelationPicker';
 import { CommentThreadTypeDropdown } from './CommentThreadTypeDropdown';
@@ -59,7 +56,7 @@ const StyledEditableTitleInput = styled.input`
   font-weight: ${({ theme }) => theme.font.weight.semiBold};
   justify-content: center;
 
-  line-height: 120%;
+  line-height: ${({ theme }) => theme.text.lineHeight.md};
   outline: none;
   width: 318px;
 

front/src/modules/comments/components/CommentThreadItem.tsx

@@ -22,7 +22,7 @@ const StyledCommentBody = styled.div`
   color: ${({ theme }) => theme.font.color.secondary};
   font-size: ${({ theme }) => theme.font.size.md};
 
-  line-height: ${({ theme }) => theme.text.lineHeight};
+  line-height: ${({ theme }) => theme.text.lineHeight.md};
   overflow-wrap: anywhere;
 
   padding-left: 24px;

front/src/modules/comments/components/CommentThreadRelationPicker.tsx

@@ -1,5 +1,4 @@
 import { useState } from 'react';
-import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
 import {
   autoUpdate,
@@ -9,7 +8,6 @@ import {
   useFloating,
 } from '@floating-ui/react';
 
-import { CommentThreadForDrawer } from '@/comments/types/CommentThreadForDrawer';
 import CompanyChip from '@/companies/components/CompanyChip';
 import { useHotkeysScopeOnBooleanState } from '@/hotkeys/hooks/useHotkeysScopeOnBooleanState';
 import { useScopedHotkeys } from '@/hotkeys/hooks/useScopedHotkeys';
@@ -47,25 +45,6 @@ const StyledContainer = styled.div`
   width: 100%;
 `;
 
-const StyledLabelContainer = styled.div`
-  align-items: center;
-  display: flex;
-  flex-direction: row;
-
-  gap: ${({ theme }) => theme.spacing(2)};
-
-  padding-bottom: ${({ theme }) => theme.spacing(2)};
-  padding-top: ${({ theme }) => theme.spacing(2)};
-`;
-
-const StyledRelationLabel = styled.div`
-  color: ${({ theme }) => theme.font.color.secondary};
-  display: flex;
-  flex-direction: row;
-
-  user-select: none;
-`;
-
 const StyledRelationContainer = styled.div`
   --horizontal-padding: ${({ theme }) => theme.spacing(1)};
   --vertical-padding: ${({ theme }) => theme.spacing(1.5)};
@@ -108,8 +87,6 @@ export function CommentThreadRelationPicker({
     isMenuOpen,
   );
 
-  const theme = useTheme();
-
   const peopleIds =
     commentThread?.commentThreadTargets
       ?.filter((relation) => relation.commentableType === 'Person')
@@ -134,6 +111,7 @@ export function CommentThreadRelationPicker({
     ) {
       companyIds.push(commentable.id);
     }
+    return null;
   });
 
   const personsForMultiSelect = useFilteredSearchEntityQuery({

front/src/modules/comments/components/CommentThreadTypeDropdown.tsx

@@ -2,7 +2,7 @@ import {
   DropdownButton,
   DropdownOptionType,
 } from '@/ui/components/buttons/DropdownButton';
-import { IconNotes, IconPhone } from '@/ui/icons/index';
+import { IconNotes } from '@/ui/icons/index';
 
 export function CommentThreadTypeDropdown() {
   const options: DropdownOptionType[] = [

front/src/modules/comments/components/Comments.tsx

@@ -4,13 +4,9 @@ import { useRecoilValue } from 'recoil';
 import { v4 } from 'uuid';
 
 import { currentUserState } from '@/auth/states/currentUserState';
-import { CommentThreadForDrawer } from '@/comments/types/CommentThreadForDrawer';
 import { GET_COMPANIES } from '@/companies/services';
 import { GET_PEOPLE } from '@/people/services';
 import { AutosizeTextInput } from '@/ui/components/inputs/AutosizeTextInput';
-import { PropertyBox } from '@/ui/components/property-box/PropertyBox';
-import { PropertyBoxItem } from '@/ui/components/property-box/PropertyBoxItem';
-import { IconArrowUpRight } from '@/ui/icons/index';
 import { logError } from '@/utils/logs/logError';
 import { isDefined } from '@/utils/type-guards/isDefined';
 import { isNonEmptyString } from '@/utils/type-guards/isNonEmptyString';
@@ -23,7 +19,6 @@ import { GET_COMMENT_THREADS_BY_TARGETS } from '../services';
 
 import { CommentThreadActionBar } from './CommentThreadActionBar';
 import { CommentThreadItem } from './CommentThreadItem';
-import { CommentThreadRelationPicker } from './CommentThreadRelationPicker';
 
 type OwnProps = {
   commentThread: GetCommentThreadQuery['findManyCommentThreads'][0];

front/src/modules/comments/components/RightDrawerEditCommentThread.tsx

@@ -3,7 +3,6 @@ import { useRecoilValue } from 'recoil';
 import { RightDrawerBody } from '@/ui/layout/right-drawer/components/RightDrawerBody';
 import { RightDrawerPage } from '@/ui/layout/right-drawer/components/RightDrawerPage';
 import { RightDrawerTopBar } from '@/ui/layout/right-drawer/components/RightDrawerTopBar';
-import { CommentableType } from '~/generated/graphql';
 
 import { viewableCommentThreadIdState } from '../states/viewableCommentThreadIdState';
 

front/src/modules/comments/components/Timeline.tsx

@@ -4,7 +4,6 @@ import styled from '@emotion/styled';
 
 import { TableActionBarButtonToggleComments } from '@/ui/components/table/action-bar/TableActionBarButtonOpenComments';
 import { IconNotes, IconPlus } from '@/ui/icons/index';
-import { useOpenRightDrawer } from '@/ui/layout/right-drawer/hooks/useOpenRightDrawer';
 import {
   beautifyExactDate,
   beautifyPastDateRelativeToNow,
@@ -13,7 +12,6 @@ import {
   SortOrder,
   useGetCommentThreadsByTargetsQuery,
 } from '~/generated/graphql';
-import { TableActionBarButtonCreateCommentThreadCompany } from '~/pages/companies/table/TableActionBarButtonCreateCommentThreadCompany';
 
 import { useOpenCommentThreadRightDrawer } from '../hooks/useOpenCommentThreadRightDrawer';
 import { useOpenCreateCommentThreadDrawer } from '../hooks/useOpenCreateCommentThreadDrawer';
@@ -47,14 +45,14 @@ const StyledEmptyTimelineTitle = styled.div`
   color: ${({ theme }) => theme.font.color.secondary};
   font-size: ${({ theme }) => theme.font.size.xxl};
   font-weight: ${({ theme }) => theme.font.weight.semiBold};
-  line-height: 120%;
+  line-height: ${({ theme }) => theme.text.lineHeight.md};
 `;
 
 const StyledEmptyTimelineSubTitle = styled.div`
   color: ${({ theme }) => theme.font.color.extraLight};
   font-size: ${({ theme }) => theme.font.size.xxl};
   font-weight: ${({ theme }) => theme.font.weight.semiBold};
-  line-height: 120%;
+  line-height: ${({ theme }) => theme.text.lineHeight.md};
 `;
 
 const StyledTimelineItemContainer = styled.div`
@@ -135,7 +133,7 @@ const StyledCard = styled.div`
 const StyledCardTitle = styled.div`
   color: ${({ theme }) => theme.font.color.primary};
   font-weight: ${({ theme }) => theme.font.weight.medium};
-  line-height: 150%;
+  line-height: ${({ theme }) => theme.text.lineHeight.lg};
 `;
 
 const StyledCardContent = styled.div`