GH-2829 Add Sentry on frontend (#3111)

* GH-2829 pass sentry dsn key from backend in ClientConfig

* GH-2829 add Sentry library on frontend

* GH-2829 fetch dsnKey in GQL and add a state

* GH-2829 initialize Sentry on frontend

* GH-2829 fix linting issues

* Update yarn.lock

* GH-2829 update graphql schema for clientConfig

* GH-2829 remove Sentry comments

* GH-2829 rename sentry state

* GH-2829 rename dsnKey to dsn

* GH-2829 refactor to use componentEffect for sentry initialization

* GH-2829 fix linting issues

* GH-2829 update Graphql types

---------

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

packages/twenty-server/src/core/client-config/client-config.entity.ts

@@ -39,6 +39,12 @@ class Support {
   supportFrontChatId: string | undefined;
 }
 
+@ObjectType()
+class Sentry {
+  @Field(() => String)
+  dsn: string | undefined;
+}
+
 @ObjectType()
 export class ClientConfig {
   @Field(() => AuthProviders, { nullable: false })
@@ -58,4 +64,7 @@ export class ClientConfig {
 
   @Field(() => Support)
   support: Support;
+
+  @Field(() => Sentry)
+  sentry: Sentry;
 }

packages/twenty-server/src/core/client-config/client-config.resolver.ts

@@ -31,6 +31,9 @@ export class ClientConfigResolver {
         supportDriver: this.environmentService.getSupportDriver(),
         supportFrontChatId: this.environmentService.getSupportFrontChatId(),
       },
+      sentry: {
+        dsn: this.environmentService.getSentryDSN(),
+      },
     };
 
     return Promise.resolve(clientConfig);