Load sentry from havascript bundle

README.md

@@ -163,10 +163,5 @@ nabu_run bundle update
 # node modules
 nabu_run yarn upgrade-interactive
 
-# Sentry
-# https://docs.sentry.io/platforms/javascript/install/cdn/
-vi app/views/layouts/application.html.haml
-
 # New rails version
 rails new nabu --database=mysql --javascript=esbuild --css=sass --skip-action-cable
-```

app/javascript/application.js

@@ -1,3 +1,6 @@
+// NOTE: Add sentry as early as possible
+import './custom/sentry'; // Add jQuery to the window
+
 // Entry point for the build script in your package.json
 import '@hotwired/turbo-rails';
 import './controllers';
@@ -6,11 +9,9 @@ import './controllers';
 // Our Stuff
 ///////////////////
 
-// NOTE: This must only contain imports, any code added here runs after all the imports happen
-
 // Vendor Stuff
+// NOTE: This must only contain imports, any code added here runs after all the imports happen
 import './custom/add_jquery'; // Add jQuery to the window
-
 import 'jquery-ui';
 import 'jquery-ui/ui/widgets/datepicker';
 import 'jquery-query-object';

app/javascript/custom/sentry.js

@@ -0,0 +1,16 @@
+import * as Sentry from '@sentry/browser';
+
+const isProd = document.querySelector('body').dataset.railsEnv === 'production';
+if (isProd) {
+  Sentry.init({
+    dsn: 'https://511d833c4a954b6b9f54992abe16607c@o4504801902985216.ingest.sentry.io/4504802133213184',
+
+    integrations: [Sentry.browserTracingIntegration(), Sentry.replayIntegration()],
+
+    tracesSampleRate: 1.0,
+    tracePropagationTargets: ['localhost', /^https:\/\/.*paradisec.org.au\.io\//],
+
+    replaysSessionSampleRate: 0.1,
+    replaysOnErrorSampleRate: 1.0,
+  });
+}

app/views/layouts/application.html.haml

@@ -32,20 +32,6 @@
     = javascript_include_tag "application", "data-turbo-track": "reload", type: "module", defer: true
     = stylesheet_link_tag "application", "data-turbo-track": "reload"
 
-    %script{ src: 'https://browser.sentry-cdn.com/7.55.2/bundle.tracing.min.js', integrity: 'sha384-u0VnF/CCtmgYR2cShUDrGNHOlH3jdsqBHK+yrIo7uqFygjVXak8CMh+/81vtqNBF', crossorigin: 'anonymous' }
-
-    -if Rails.env.production?
-      :javascript
-        Sentry.init({
-          dsn: "https://511d833c4a954b6b9f54992abe16607c@o4504801902985216.ingest.sentry.io/4504802133213184",
-          integrations: [new Sentry.Integrations.BrowserTracing()],
-          tracesSampleRate: 1.0,
-          ignoreErrors: [
-            /Module specifier, .application. does not start with/,
-            /Error resolving module specifier .application./,
-          ],
-        });
-
     = yield :page_scripts
 
   %body.bp{ "data-rails-env": Rails.env, "google-map-api-key": ENV['GOOGLE_MAPS_API_KEY'] || 'AIzaSyAtxUAk_CHTIHR_to5xDCA2kG5YzkVcl4E' }

package.json

@@ -8,6 +8,7 @@
     "@googlemaps/markerclusterer": "^2.5.3",
     "@hotwired/stimulus": "^3.2.2",
     "@hotwired/turbo-rails": "^8.0.12",
+    "@sentry/browser": "^8.39.0",
     "jquery": "^3.7.1",
     "jquery-query-object": "^2.2.3",
     "jquery-ui": "^1.14.1",

yarn.lock

@@ -419,6 +419,93 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@sentry-internal/browser-utils@npm:8.39.0":
+  version: 8.39.0
+  resolution: "@sentry-internal/browser-utils@npm:8.39.0"
+  dependencies:
+    "@sentry/core": "npm:8.39.0"
+    "@sentry/types": "npm:8.39.0"
+    "@sentry/utils": "npm:8.39.0"
+  checksum: 10c0/74b5c57549f71bd69c57f44312090655cd8db9db4f84adfdc74a3581b6d371b97654bb4e1f44861c2f02e88bf00f192f1c2e99ec2efa461d95322105d1ee4e25
+  languageName: node
+  linkType: hard
+
+"@sentry-internal/feedback@npm:8.39.0":
+  version: 8.39.0
+  resolution: "@sentry-internal/feedback@npm:8.39.0"
+  dependencies:
+    "@sentry/core": "npm:8.39.0"
+    "@sentry/types": "npm:8.39.0"
+    "@sentry/utils": "npm:8.39.0"
+  checksum: 10c0/4e7b9747d8f558c97253aa28796ac67fdef8f2e00f77183d2df9b2fde947860b0b4d0c8c4d125b316ee0a051f3f927f2420bae6d0777ac5c02d9bfb5c661e8e4
+  languageName: node
+  linkType: hard
+
+"@sentry-internal/replay-canvas@npm:8.39.0":
+  version: 8.39.0
+  resolution: "@sentry-internal/replay-canvas@npm:8.39.0"
+  dependencies:
+    "@sentry-internal/replay": "npm:8.39.0"
+    "@sentry/core": "npm:8.39.0"
+    "@sentry/types": "npm:8.39.0"
+    "@sentry/utils": "npm:8.39.0"
+  checksum: 10c0/eef8b4cbecaeb048bd43f68f9d906e51aeb99263464bc29f3f7d39e1626c1a4b1fd6c1a954a615aa17d829b0181a5616cd34e1b3eec27cc6b3fa1dfcb2f4c479
+  languageName: node
+  linkType: hard
+
+"@sentry-internal/replay@npm:8.39.0":
+  version: 8.39.0
+  resolution: "@sentry-internal/replay@npm:8.39.0"
+  dependencies:
+    "@sentry-internal/browser-utils": "npm:8.39.0"
+    "@sentry/core": "npm:8.39.0"
+    "@sentry/types": "npm:8.39.0"
+    "@sentry/utils": "npm:8.39.0"
+  checksum: 10c0/ae4b7821b19ddc5e0256b0dd4aa44ffe77392e41481299378d13299737fef268e06c539e2681c78f517df9acfca17b3bfae6bc8ac94467288ea9bd5993e68c93
+  languageName: node
+  linkType: hard
+
+"@sentry/browser@npm:^8.39.0":
+  version: 8.39.0
+  resolution: "@sentry/browser@npm:8.39.0"
+  dependencies:
+    "@sentry-internal/browser-utils": "npm:8.39.0"
+    "@sentry-internal/feedback": "npm:8.39.0"
+    "@sentry-internal/replay": "npm:8.39.0"
+    "@sentry-internal/replay-canvas": "npm:8.39.0"
+    "@sentry/core": "npm:8.39.0"
+    "@sentry/types": "npm:8.39.0"
+    "@sentry/utils": "npm:8.39.0"
+  checksum: 10c0/593d8f39c01667704f27902f4262f32ce184c313039db9d771d8c73a065b8ca745a8bf93337fe8ec1d629a7fa6468b60eff3b0ee4b77b0f8fb82a548c1af571f
+  languageName: node
+  linkType: hard
+
+"@sentry/core@npm:8.39.0":
+  version: 8.39.0
+  resolution: "@sentry/core@npm:8.39.0"
+  dependencies:
+    "@sentry/types": "npm:8.39.0"
+    "@sentry/utils": "npm:8.39.0"
+  checksum: 10c0/2d1a9d9c208d54bf701c4b9c0ff41a814b8fe1a9e919910886c66d95f4ffdfccd51bb1c6d5fd73ebe1464a3e175df827e8e493a9442d783573d40ca6225379ed
+  languageName: node
+  linkType: hard
+
+"@sentry/types@npm:8.39.0":
+  version: 8.39.0
+  resolution: "@sentry/types@npm:8.39.0"
+  checksum: 10c0/4c7947adf312da5b353c50b7404520129e208f7033ecaed08961cd8e8a2b4d9d0e7ed8797e024086b8329809d476b012005f9bd432cfe84008437e4388fe98a7
+  languageName: node
+  linkType: hard
+
+"@sentry/utils@npm:8.39.0":
+  version: 8.39.0
+  resolution: "@sentry/utils@npm:8.39.0"
+  dependencies:
+    "@sentry/types": "npm:8.39.0"
+  checksum: 10c0/fe1f6cb60afcf423f01c3984c93bdb07b01ba052a71f0485129378b3075bcdd9f7aabfe2c75f0234eb93f8aa3e842d16b8ebc3c81f90431abee60d36ef183583
+  languageName: node
+  linkType: hard
+
 "abbrev@npm:^2.0.0":
   version: 2.0.0
   resolution: "abbrev@npm:2.0.0"
@@ -1126,6 +1213,7 @@ __metadata:
     "@googlemaps/markerclusterer": "npm:^2.5.3"
     "@hotwired/stimulus": "npm:^3.2.2"
     "@hotwired/turbo-rails": "npm:^8.0.12"
+    "@sentry/browser": "npm:^8.39.0"
     esbuild: "npm:^0.24.0"
     jquery: "npm:^3.7.1"
     jquery-query-object: "npm:^2.2.3"