Lucas/t 365 on comment drawer i see a add comment section with severa (#256)

* Added comments and authors on drawer with proper resolving

* Fixed generated front graphql from rebase

* Fixed comment chip

* wip

* wip 2

* - Added string typing for DateTime scalar
- Refactored user in a recoil state and workspace using it
- Added comment creation

* Put theme and user state in generic providers

* Fix from rebase

* Fixed app theme provider removed from storybook

* Wip

* Fix graphql front

* Fixed backend bug

* - Added comment fetching in creation mode
- Fixed drawer overflows and heights

* - Fixed autosize validation button CSS bug

* Fixed CSS bug with drawer changing height if overflow

* Fixed text input too many event catched and useless error message

* Removed console.log

* Fixed comment cell chip

* Create comment thread on each comment action bar click

* Fixed lint

* Fixed TopBar height

front/src/modules/ui/layout/right-drawer/components/RightDrawerBody.tsx

@@ -3,4 +3,5 @@ import styled from '@emotion/styled';
 export const RightDrawerBody = styled.div`
   display: flex;
   flex-direction: column;
+  overflow: auto;
 `;

front/src/modules/ui/layout/right-drawer/components/RightDrawerRouter.tsx

@@ -1,6 +1,7 @@
 import { useRecoilState } from 'recoil';
 
 import { RightDrawerComments } from '@/comments/components/comments/RightDrawerComments';
+import { RightDrawerCreateCommentThread } from '@/comments/components/comments/RightDrawerCreateCommentThread';
 import { isDefined } from '@/utils/type-guards/isDefined';
 
 import { rightDrawerPageState } from '../states/rightDrawerPageState';
@@ -12,5 +13,11 @@ export function RightDrawerRouter() {
     return <></>;
   }
 
-  return rightDrawerPage === 'comments' ? <RightDrawerComments /> : <></>;
+  return rightDrawerPage === 'comments' ? (
+    <RightDrawerComments />
+  ) : rightDrawerPage === 'create-comment-thread' ? (
+    <RightDrawerCreateCommentThread />
+  ) : (
+    <></>
+  );
 }

front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBar.tsx

@@ -5,7 +5,7 @@ import { RightDrawerTopBarCloseButton } from './RightDrawerTopBarCloseButton';
 const StyledRightDrawerTopBar = styled.div`
   display: flex;
   flex-direction: row;
-  height: 40px;
+  min-height: 40px;
   align-items: center;
   justify-content: space-between;
   padding-left: 8px;

front/src/modules/ui/layout/right-drawer/states/rightDrawerPageState.ts

@@ -4,5 +4,5 @@ import { RightDrawerPage } from '../types/RightDrawerPage';
 
 export const rightDrawerPageState = atom<RightDrawerPage | null>({
   key: 'ui/layout/right-drawer-page',
-  default: 'comments',
+  default: null,
 });

front/src/modules/ui/layout/right-drawer/types/RightDrawerPage.ts

@@ -1 +1 @@
-export type RightDrawerPage = 'comments';
+export type RightDrawerPage = 'comments' | 'create-comment-thread';