Conditionally use error logging

Totally not needed on local dev at all. Disable for prod for now

.env.production

@@ -0,0 +1 @@
+VITE_APP_ENV=production

index.html

@@ -6,7 +6,7 @@
       name="viewport"
       content="width=device-width, initial-scale=1, viewport-fit=cover"
     />
-    <title>Phanpy</title>
+    <title><{ VITE_CLIENT_NAME }></title>
     <meta
       name="description"
       content="Minimalistic opinionated Mastodon web client"
@@ -14,10 +14,10 @@
     <meta name="color-scheme" content="dark light" />
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
-    <meta name="apple-mobile-web-app-title" content="Phanpy" />
+    <meta name="apple-mobile-web-app-title" content="<{ VITE_CLIENT_NAME }>" />
     <meta name="apple-mobile-web-app-capable" content="yes" />
     <meta name="mobile-web-app-capable" content="yes" />
-    <link rel="canonical" href="https://phanpy.social" />
+    <link rel="canonical" href="<{ VITE_WEBSITE }>" />
     <meta
       name="theme-color"
       content="#fff"
@@ -28,13 +28,16 @@
       content="#242526"
       media="(prefers-color-scheme: dark)"
     />
-    <script>
+    <script vite-if="import.meta.env.VITE_APP_ENV === production">
+      var isDev = /dev\./.test(window.location.hostname);
       var _rollbarConfig = {
         accessToken: 'ec3e07829d324a29abf6c83472a9740d',
         captureUncaught: true,
         captureUnhandledRejections: true,
+        enabled: isDev,
+        hostSafeList: ['dev.phanpy.social', 'phanpy.social'],
         payload: {
-          environment: 'production',
+          environment: isDev ? 'development' : 'production',
         },
       };
       // Rollbar Snippet

package-lock.json

@@ -32,6 +32,7 @@
         "postcss-dark-theme-class": "~0.7.3",
         "twitter-text": "~3.1.0",
         "vite": "~4.0.3",
+        "vite-plugin-html-env": "~1.2.7",
         "vite-plugin-pwa": "~0.14.0",
         "workbox-cacheable-response": "~6.5.4",
         "workbox-expiration": "~6.5.4",
@@ -5406,6 +5407,18 @@
         }
       }
     },
+    "node_modules/vite-plugin-html-env": {
+      "version": "1.2.7",
+      "resolved": "https://registry.npmjs.org/vite-plugin-html-env/-/vite-plugin-html-env-1.2.7.tgz",
+      "integrity": "sha512-vdTnKtuBeB8Zp93DCbN0Qjf4odW2msVRq45r7lGKA6nwQGJFj6YemU54u3xPPkvDeZhG8DEEU64xbLwzVEBilQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "peerDependencies": {
+        "vite": "*"
+      }
+    },
     "node_modules/vite-plugin-pwa": {
       "version": "0.14.0",
       "resolved": "https://registry.npmjs.org/vite-plugin-pwa/-/vite-plugin-pwa-0.14.0.tgz",
@@ -9597,6 +9610,13 @@
         "rollup": "^3.7.0"
       }
     },
+    "vite-plugin-html-env": {
+      "version": "1.2.7",
+      "resolved": "https://registry.npmjs.org/vite-plugin-html-env/-/vite-plugin-html-env-1.2.7.tgz",
+      "integrity": "sha512-vdTnKtuBeB8Zp93DCbN0Qjf4odW2msVRq45r7lGKA6nwQGJFj6YemU54u3xPPkvDeZhG8DEEU64xbLwzVEBilQ==",
+      "dev": true,
+      "requires": {}
+    },
     "vite-plugin-pwa": {
       "version": "0.14.0",
       "resolved": "https://registry.npmjs.org/vite-plugin-pwa/-/vite-plugin-pwa-0.14.0.tgz",

package.json

@@ -34,6 +34,7 @@
     "postcss-dark-theme-class": "~0.7.3",
     "twitter-text": "~3.1.0",
     "vite": "~4.0.3",
+    "vite-plugin-html-env": "~1.2.7",
     "vite-plugin-pwa": "~0.14.0",
     "workbox-cacheable-response": "~6.5.4",
     "workbox-expiration": "~6.5.4",

vite.config.js

@@ -2,6 +2,7 @@ import preact from '@preact/preset-vite';
 import { execSync } from 'child_process';
 import { resolve } from 'path';
 import { defineConfig, loadEnv, splitVendorChunkPlugin } from 'vite';
+import VitePluginHtmlEnv from 'vite-plugin-html-env';
 import { VitePWA } from 'vite-plugin-pwa';
 
 const { VITE_CLIENT_NAME: CLIENT_NAME, NODE_ENV } = loadEnv(
@@ -21,6 +22,7 @@ export default defineConfig({
   plugins: [
     preact(),
     splitVendorChunkPlugin(),
+    VitePluginHtmlEnv(),
     VitePWA({
       manifest: {
         name: CLIENT_NAME,