Add "show company / people" view and "Notes" concept (#528)

* Begin adding show view and refactoring threads to become notes

* Progress on design

* Progress redesign timeline

* Dropdown button, design improvement

* Open comment thread edit mode in drawer

* Autosave local storage and commentThreadcount

* Improve display and fix missing key issue

* Remove some hardcoded CSS properties

* Create button

* Split company show into ui/business + fix eslint

* Fix font weight

* Begin auto-save on edit mode

* Save server-side query result to Apollo cache

* Fix save behavior

* Refetch timeline after creating note

* Rename createCommentThreadWithComment

* Improve styling

* Revert "Improve styling"

This reverts commit 9fbbf2db006e529330edc64f3eb8ff9ecdde6bb0.

* Improve CSS styling

* Bring back border radius inadvertently removed

* padding adjustment

* Improve blocknote design

* Improve edit mode display

* Remove Comments.tsx

* Remove irrelevant comment stories

* Removed un-necessary panel component

* stop using fragment, move trash icon

* Add a basic story for CompanyShow

* Add a basic People show view

* Fix storybook tests

* Add very basic Person story

* Refactor PR1

* Refactor part 2

* Refactor part 3

* Refactor part 4

* Fix tests

---------

Co-authored-by: Charles Bochet <charles@twenty.com>

server/src/database/migrations/20230706072223_add_body_title_author_fields_to_comment_threads/migration.sql

@@ -0,0 +1,15 @@
+-- AlterTable
+ALTER TABLE "comment_threads" ADD COLUMN     "body" TEXT,
+ADD COLUMN     "title" TEXT,
+ADD COLUMN     "authorId" TEXT;
+
+
+-- Update field with a random user if some rows already exist...
+UPDATE "comment_threads" 
+SET "authorId" = (SELECT id FROM users LIMIT 1);
+
+
+ALTER TABLE "comment_threads" 
+ALTER COLUMN "authorId" SET NOT NULL;
+
+ALTER TABLE "comment_threads" ADD CONSTRAINT "comment_threads_authorId_fkey" FOREIGN KEY ("authorId") REFERENCES "users"("id") ON DELETE RESTRICT ON UPDATE CASCADE;

server/src/database/schema.prisma

@@ -175,8 +175,9 @@ model User {
   /// @TypeGraphQL.omit(input: true, output: true)
   deletedAt DateTime?
 
-  createdAt DateTime @default(now())
-  updatedAt DateTime @updatedAt
+  createdAt     DateTime        @default(now())
+  updatedAt     DateTime        @updatedAt
+  CommentThread CommentThread[]
 
   @@map("users")
 }
@@ -332,6 +333,12 @@ model CommentThread {
   /// @TypeGraphQL.omit(input: true, output: true)
   workspaceId          String
 
+  authorId String
+  author   User   @relation(fields: [authorId], references: [id])
+
+  body  String?
+  title String?
+
   /// @TypeGraphQL.omit(input: true, output: true)
   deletedAt DateTime?
 

server/src/database/seeds/comments.ts

@@ -6,6 +6,9 @@ export const seedComments = async (prisma: PrismaClient) => {
     create: {
       id: 'twenty-fe256b39-3ec3-4fe3-8997-b76aa0bfb400',
       workspaceId: 'twenty-7ed9d212-1c25-4d02-bf25-6aeccf7ea419',
+      title: 'Performance update',
+      body: '[{"id":"555df0c3-ab88-4c62-abae-c9b557c37c5b","type":"paragraph","props":{"textColor":"default","backgroundColor":"default","textAlignment":"left"},"content":[{"type":"text","text":"In the North American region, we have observed a strong growth rate of 18% in sales. Europe followed suit with a significant 14% increase, while Asia-Pacific sustained its performance with a steady 10% rise. Special kudos to the North American team for the excellent work done in penetrating new markets and establishing stronger footholds in the existing ones.","styles":{}}],"children":[]},{"id":"13530934-b3ce-4332-9238-3760aa4acb3e","type":"paragraph","props":{"textColor":"default","backgroundColor":"default","textAlignment":"left"},"content":[],"children":[]}]',
+      authorId: 'twenty-ge256b39-3ec3-4fe3-8997-b76aa0bfa408',
     },
   });
 
@@ -50,6 +53,9 @@ export const seedComments = async (prisma: PrismaClient) => {
     create: {
       id: 'twenty-fe256b39-3ec3-4fe3-8997-b76aa0bfc408',
       workspaceId: 'twenty-7ed9d212-1c25-4d02-bf25-6aeccf7ea419',
+      title: 'Buyout Proposal',
+      body: '[{"id":"333df0c3-ab88-4c62-abae-c9b557c37c5b","type":"paragraph","props":{"textColor":"default","backgroundColor":"default","textAlignment":"left"},"content":[{"type":"text","text":"We are considering the potential acquisition of [Company], a leading company in [Industry/Specific Technology]. This company has demonstrated remarkable success and pioneering advancements in their field, paralleling our own commitment to progress. By integrating their expertise with our own, we believe that we can amplify our growth, broaden our offerings, and fortify our position at the forefront of technology. This prospective partnership could help to ensure our continued leadership in the industry and allow us to deliver even more innovative solutions for our customers.","styles":{}}],"children":[]},{"id":"13530934-b3ce-4332-9238-3760aa4acb3e","type":"paragraph","props":{"textColor":"default","backgroundColor":"default","textAlignment":"left"},"content":[],"children":[]}]',
+      authorId: 'twenty-ge256b39-3ec3-4fe3-8997-b76aa0bfa408',
     },
   });
 
@@ -82,6 +88,9 @@ export const seedComments = async (prisma: PrismaClient) => {
     create: {
       id: 'twenty-dev-fe256b39-3ec3-4fe3-8997-b76aaabfb408',
       workspaceId: 'twenty-dev-7ed9d212-1c25-4d02-bf25-6aeccf7ea420',
+      title: 'Call summary',
+      body: '[{"id":"555df0c3-ab88-4c62-abae-c9b557c37c5b","type":"paragraph","props":{"textColor":"default","backgroundColor":"default","textAlignment":"left"},"content":[{"type":"text","text":"Valuation & Due Diligence: The CFO highlighted the financial implications, pointing out that the acquisition will be accretive to earnings. The M&A team has been directed to commence due diligence and work closely with legal counsel to assess all aspects of the acquisition.","styles":{}}],"children":[]},{"id":"13530934-b3ce-4332-9238-3760aa4acb3e","type":"paragraph","props":{"textColor":"default","backgroundColor":"default","textAlignment":"left"},"content":[],"children":[]}]',
+      authorId: 'twenty-dev-gk256b39-3ec3-4fe3-8997-b76aa0boa408',
     },
   });