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/containers/WithTopBarContainer.tsx

@@ -5,7 +5,7 @@ import { useRecoilState } from 'recoil';
 import { Panel } from '../Panel';
 import { RightDrawer } from '../right-drawer/components/RightDrawer';
 import { isRightDrawerOpenState } from '../right-drawer/states/isRightDrawerOpenState';
-import { TopBar } from '../top-bar/TopBar';
+import { TOP_BAR_MIN_HEIGHT, TopBar } from '../top-bar/TopBar';
 
 type OwnProps = {
   children: JSX.Element;
@@ -20,13 +20,14 @@ const StyledContainer = styled.div`
   width: 100%;
 `;
 
-const TOPBAR_HEIGHT = '48px';
-
 const MainContainer = styled.div`
   display: flex;
   flex-direction: row;
   width: calc(100% - ${(props) => props.theme.spacing(3)});
-  height: calc(100% - ${TOPBAR_HEIGHT} - ${(props) => props.theme.spacing(3)});
+  height: calc(
+    100% - ${TOP_BAR_MIN_HEIGHT} - ${(props) => props.theme.spacing(2)} -
+      ${(props) => props.theme.spacing(5)}
+  );
   background: ${(props) => props.theme.noisyBackground};
   padding-right: ${(props) => props.theme.spacing(3)};
   padding-bottom: ${(props) => props.theme.spacing(3)};