From ffd54e4065e7ee1537903916fadfc4f32be5d682 Mon Sep 17 00:00:00 2001
From: Josh Pigford <josh@joshpigford.com>
Date: Tue, 8 Oct 2024 10:50:49 -0500
Subject: [PATCH] Intercom integration (#1267)

* Intercom integration

Includes if/else statements for various ways to reach out. Also, github/discord icons updated to SVG.

* Update app/views/layouts/_sidebar.html.erb

Co-authored-by: Zach Gollwitzer <zach@maybe.co>
Signed-off-by: Josh Pigford <josh@joshpigford.com>

* Update app/views/pages/feedback.html.erb

Co-authored-by: Zach Gollwitzer <zach@maybe.co>
Signed-off-by: Josh Pigford <josh@joshpigford.com>

* Family = Company in Intercom

---------

Signed-off-by: Josh Pigford <josh@joshpigford.com>
Co-authored-by: Zach Gollwitzer <zach@maybe.co>
---
 Gemfile                             |   1 +
 Gemfile.lock                        |   3 +
 app/assets/images/discord-icon.png  | Bin 932 -> 0 bytes
 app/assets/images/discord-icon.svg  |   1 +
 app/assets/images/github-icon.png   | Bin 548 -> 0 bytes
 app/assets/images/github-icon.svg   |   1 +
 app/views/layouts/_sidebar.html.erb |  15 +++-
 app/views/pages/feedback.html.erb   |  18 +++--
 config/initializers/intercom.rb     | 118 ++++++++++++++++++++++++++++
 9 files changed, 147 insertions(+), 10 deletions(-)
 delete mode 100644 app/assets/images/discord-icon.png
 create mode 100644 app/assets/images/discord-icon.svg
 delete mode 100644 app/assets/images/github-icon.png
 create mode 100644 app/assets/images/github-icon.svg
 create mode 100644 config/initializers/intercom.rb

diff --git a/Gemfile b/Gemfile
index 7875b635..c794bf70 100644
--- a/Gemfile
+++ b/Gemfile
@@ -45,6 +45,7 @@ gem "rails-settings-cached"
 gem "tzinfo-data", platforms: %i[windows jruby]
 gem "csv"
 gem "redcarpet"
+gem "intercom-rails"
 
 group :development, :test do
   gem "debug", platforms: %i[mri windows]
diff --git a/Gemfile.lock b/Gemfile.lock
index d64b0537..c7f8e025 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -207,6 +207,8 @@ GEM
     inline_svg (1.10.0)
       activesupport (>= 3.0)
       nokogiri (>= 1.6)
+    intercom-rails (1.0.1)
+      activesupport (> 4.0)
     io-console (0.7.2)
     irb (1.14.1)
       rdoc (>= 4.0.0)
@@ -484,6 +486,7 @@ DEPENDENCIES
   image_processing (>= 1.2)
   importmap-rails
   inline_svg
+  intercom-rails
   letter_opener
   lucide-rails!
   mocha
diff --git a/app/assets/images/discord-icon.png b/app/assets/images/discord-icon.png
deleted file mode 100644
index a6c6277e10145a7168b47b1d218e1f72836c546a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 932
zcmV;V16%xwP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH135`VK~#7F#aBN}
z6Hyrd-fIijYYZj82H{*JxKI)n7z%{N7)hF70xre{0uG8{GjT8`#)SwDhR8x(fJ9@X
zgOdqyaS%gUFtAv}4a5d)E0nv>_dNuA?Yo0Q+WwMD?%w<EegA&nd+%eAgUBcbwd8ID
z8EfHy1|o(IXP5y60pkdeV89Y$tr$aG29IxHZpt6emSQ%=so!^*g`>zI2t@*8Y-0As
zg?o7h^bhVXF*x$JxIn<zUdHN<&QvEj4cr*oeOfBz1d*1IR>4Q*`@nG805kIqN(>SD
zL^@+$<U)BDlmUXELCxoh@KT08-v|tG1l9s&f=Gkm6@&;P1;hmbok6(W3zwV3bIAka
z&(pB7X4+)J9X`0;TLJ4E7JQB!z!&i(Q+SdIEo@+LhX`mmiS+eW!qpxh==yQRLP{*0
z{jD0K?^o~k;r)kwa6z2ADX**H(yLr$x!<ZW`lf&DY8kk|;BK>hVuAC3jOe>o=_=!B
z0D0dj@_Js-8UdXZZoqlH&&HJ=U*QH2+jBw0T3I_#%F|r@hpC)%i=<aI*x0}YdF-}r
z{<PrHcnUVRP^Ra}1O1qIZgT`0BQnx_F1Xr&eD4=UT^}t#3bXeCs{QOa+6VI1tj}N5
z(Ey{twKybn7h<VMS69PMZ-DO47w&BLL0jlBW3=mKbA-mj|MJ`{#*gG|2GpvZQgT3P
zl<;cow%>7n<d!BM$N&8WM4%W*rPb$xG6L%xL@;~lEG`KWZd=gY<N?EhP*kE{S4~N{
zwpRPnE34`fbv%ry6vsyVw%pMoRBlAF#(FN(LhteKCTwk^JpG<M4%q(@M!lThla-=C
z+>rzH!=3v{xru~3=ot3G$4?nKmy{cl+9NvsZuV<Z@$0wyj&jm_zy#|b+IhneB5(r8
z)05Blf@K#tM_fOR<Y|=`A}cOJ%XB4+L75<KV==B}%qU%vp&am-3w%a&C!+tGgc3u9
ze{ycBT3*ROJFq4MBTJSFWEh*Du9BURG=QQoJ6+W(8q=aig31mMAMWW^_y4gR3=IDg
zt(vEcng&MKX22kIF=uJdr2^5KTcXm4aDM`3G&)gj<J(`jR7!ofde?RU0000<MNUMn
GLSTZ5@2NHb

diff --git a/app/assets/images/discord-icon.svg b/app/assets/images/discord-icon.svg
new file mode 100644
index 00000000..4cadbc7f
--- /dev/null
+++ b/app/assets/images/discord-icon.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 127.14 96.36"><path fill="#5865f2" d="M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a68.68,68.68,0,0,1-10.87,5.19,77,77,0,0,0,6.89,11.1A105.25,105.25,0,0,0,126.6,80.22h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.25,60,73.25,53s5-12.74,11.44-12.74S96.23,46,96.12,53,91.08,65.69,84.69,65.69Z"/></svg>
\ No newline at end of file
diff --git a/app/assets/images/github-icon.png b/app/assets/images/github-icon.png
deleted file mode 100644
index 35add0f4d9adb72e7201260d1d72ce0f4dfac7d5..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 548
zcmV+<0^9wGP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH0l7&;K~#7FwO5OA
zgD?zz%>*7nBd|d;0vnVK+6~eT!Ukl6bOWvvq@4gZpc_ytXJ3Ix#u)eAy*pyddh$n>
z^MrU9%hK}MvalrA#`v-9Ex#;3Ek9ga7LeuHa<CjXuyJFPVVv-|lP4sAEV~Tio*g!<
z24xoC6vTgtM+dPKzgb=rgW^Nm2xIxTk;G4elXB8uO`HwxyLG(bFG~hz>qSbz?|CUs
z$}9@Oj-aE!<LpTBJ@eDV7$t%f-?cX|(D$*#ew5J9$bGdc>`0pk80d$%VuL2snF*Dm
z!P@szEOq7tuYy!dID7Pt%#gNWI6%G>vX#;adZEo66k|eukk+Bqd4s$VQ;}DoR|XWw
zhojQoa{%8;=Lz}nqO|i9PR-FVFmMZA1O6*E&~nuC4e1Dp&uYzO()f;f>Gjt#x5b<b
zazVE%;>~nWu@LiRRk}Q`0rBgKs5pC%8uLm;E|BH+90LIyBgJcJ@N&l9h}<_X+1hz9
z5#k*JcMM_vv?6RrNIc4Cfyeiq|0}jSctt$=awF)Eh?D?2B&;Uy(*^qjsIjxI&?1o7
m09u4ICMl4ZJ(Qm2Dt-ZITZzzS2DOU-0000<MNUMnLSTa0gYPK-

diff --git a/app/assets/images/github-icon.svg b/app/assets/images/github-icon.svg
new file mode 100644
index 00000000..37fa923d
--- /dev/null
+++ b/app/assets/images/github-icon.svg
@@ -0,0 +1 @@
+<svg width="98" height="96" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z" fill="#24292f"/></svg>
\ No newline at end of file
diff --git a/app/views/layouts/_sidebar.html.erb b/app/views/layouts/_sidebar.html.erb
index 7cb00841..e62a104a 100644
--- a/app/views/layouts/_sidebar.html.erb
+++ b/app/views/layouts/_sidebar.html.erb
@@ -13,7 +13,7 @@
         <div class="text-white w-9 h-9 bg-gray-400 rounded-full flex items-center justify-center text-lg uppercase"><%= Current.user.initial %></div>
       <% end %>
     </button>
-    <div data-menu-target="content" class="hidden absolute w-[240px] z-10 top-10 left-[255px] top-[72px] bg-white rounded-sm shadow-xs border border-alpha-black-25">
+    <div data-menu-target="content" class="hidden absolute w-[240px] z-10 left-[255px] top-[72px] bg-white rounded-sm shadow-xs border border-alpha-black-25">
       <div class="p-3 flex items-center gap-3">
         <% if profile_image_attached %>
           <div class="text-white shrink-0 w-9 h-9">
@@ -57,9 +57,16 @@
           <%= lucide_icon("megaphone", class: "w-5 h-5 text-gray-500 shrink-0") %>
           <span class="text-gray-900 text-sm">Feedback</span>
         <% end %>
-        <%= link_to "https://link.maybe.co/discord", class: "flex gap-2 items-center hover:bg-gray-50 rounded-lg px-3 py-2" do %>
-          <%= lucide_icon("message-square-more", class: "w-5 h-5 text-gray-500 shrink-0") %>
-          <span class="text-gray-900 text-sm">Contact</span>
+        <% if self_hosted? %>
+          <%= link_to "https://link.maybe.co/discord", class: "flex gap-2 items-center hover:bg-gray-50 rounded-lg px-3 py-2" do %>
+            <%= lucide_icon("message-square-more", class: "w-5 h-5 text-gray-500 shrink-0") %>
+            <span class="text-gray-900 text-sm">Contact</span>
+          <% end %>
+        <% else %>
+          <%= link_to "mailto:hello@maybe.co", class: "flex gap-2 items-center hover:bg-gray-50 rounded-lg px-3 py-2", onclick: "Intercom('showNewMessage'); return false;" do %>
+            <%= lucide_icon("message-square-more", class: "w-5 h-5 text-gray-500 shrink-0") %>
+            <span class="text-gray-900 text-sm">Contact</span>
+          <% end %>
         <% end %>
       </div>
       <div class="p-1">
diff --git a/app/views/pages/feedback.html.erb b/app/views/pages/feedback.html.erb
index 9d0339bb..fdc5c4ad 100644
--- a/app/views/pages/feedback.html.erb
+++ b/app/views/pages/feedback.html.erb
@@ -9,17 +9,23 @@
     <p class="text-sm text-gray-500 mb-4">Let us know if you have any specific feedback. Feel free to include links to videos or screenshots.</p>
     <div class="flex gap-2">
       <%= link_to "https://github.com/maybe-finance/maybe/discussions/categories/feature-requests", target: "_blank", rel: "noopener noreferrer", class: "w-1/3 flex flex-col items-center p-4 border border-alpha-black-25 rounded-xl hover:bg-gray-50" do %>
-        <%= image_tag "github-icon.png", class: "w-8 h-8 mb-2" %>
+        <%= image_tag "github-icon.svg", class: "w-8 h-8 mb-2" %>
         <span class="text-sm font-medium text-gray-900">Write a feature request</span>
       <% end %>
-
-      <%= link_to "https://github.com/maybe-finance/maybe/issues/new?assignees=&labels=bug&template=bug_report.md&title=", target: "_blank", rel: "noopener noreferrer", class: "w-1/3 flex flex-col items-center p-4 border border-alpha-black-25 rounded-xl hover:bg-gray-50" do %>
-        <%= image_tag "github-icon.png", class: "w-8 h-8 mb-2" %>
-        <span class="text-sm font-medium text-gray-900">File a bug report</span>
+      <% if self_hosted? %>
+        <%= link_to "https://github.com/maybe-finance/maybe/issues/new?assignees=&labels=bug&template=bug_report.md&title=", target: "_blank", rel: "noopener noreferrer", class: "w-1/3 flex flex-col items-center p-4 border border-alpha-black-25 rounded-xl hover:bg-gray-50" do %>
+          <%= image_tag "github-icon.svg", class: "w-8 h-8 mb-2" %>
+          <span class="text-sm font-medium text-gray-900">File a bug report</span>
+        <% end %>
+      <% else %>
+        <%= link_to "mailto:hello@maybe.co", class: "w-1/3 flex flex-col items-center p-4 border border-alpha-black-25 rounded-xl hover:bg-gray-50", onclick: "Intercom('showNewMessage'); return false;" do %>
+          <%= lucide_icon "bug", class: "w-8 h-8 mb-2" %>
+          <span class="text-sm font-medium text-gray-900">File a bug report</span>
+        <% end %>
       <% end %>
 
       <%= link_to "https://link.maybe.co/discord", target: "_blank", rel: "noopener noreferrer", class: "w-1/3 flex flex-col items-center p-4 border border-alpha-black-25 rounded-xl hover:bg-gray-50" do %>
-        <%= image_tag "discord-icon.png", class: "w-8 h-8 mb-2" %>
+        <%= image_tag "discord-icon.svg", class: "w-8 h-8 mb-2" %>
         <span class="text-sm font-medium text-gray-900">Discuss Maybe with others</span>
       <% end %>
     </div>
diff --git a/config/initializers/intercom.rb b/config/initializers/intercom.rb
new file mode 100644
index 00000000..4f1f0f8f
--- /dev/null
+++ b/config/initializers/intercom.rb
@@ -0,0 +1,118 @@
+if ENV["INTERCOM_APP_ID"].present? && ENV["INTERCOM_IDENTITY_VERIFICATION_KEY"].present?
+  IntercomRails.config do |config|
+    # == Intercom app_id
+    #
+    config.app_id = ENV["INTERCOM_APP_ID"]
+
+    # == Intercom session_duration
+    #
+    # config.session_duration = 300000
+    # == Intercom secret key
+    # This is required to enable Identity Verification, you can find it on your Setup
+    # guide in the "Identity Verification" step.
+    #
+    config.api_secret = ENV["INTERCOM_IDENTITY_VERIFICATION_KEY"]
+
+    # == Enabled Environments
+    # Which environments is auto inclusion of the Javascript enabled for
+    #
+    config.enabled_environments = [ "development", "production" ]
+
+    # == Current user method/variable
+    # The method/variable that contains the logged in user in your controllers.
+    # If it is `current_user` or `@user`, then you can ignore this
+    #
+    config.user.current = Proc.new { Current.user }
+
+    # == Include for logged out Users
+    # If set to true, include the Intercom messenger on all pages, regardless of whether
+    # The user model class (set below) is present.
+    config.include_for_logged_out_users = true
+
+    # == User model class
+    # The class which defines your user model
+    #
+    # config.user.model = Proc.new { User }
+
+    # == Lead/custom attributes for non-signed up users
+    # Pass additional attributes to for potential leads or
+    # non-signed up users as an an array.
+    # Any attribute contained in config.user.lead_attributes can be used
+    # as custom attribute in the application.
+    # config.user.lead_attributes = %w(ref_data utm_source)
+
+    # == Exclude users
+    # A Proc that given a user returns true if the user should be excluded
+    # from imports and Javascript inclusion, false otherwise.
+    #
+    # config.user.exclude_if = Proc.new { |user| user.deleted? }
+
+    # == User Custom Data
+    # A hash of additional data you wish to send about your users.
+    # You can provide either a method name which will be sent to the current
+    # user object, or a Proc which will be passed the current user.
+    #
+    config.user.custom_data = {
+      family_id: Proc.new { |current_user| current_user.family.id }
+    }
+
+    # == Current company method/variable
+    # The method/variable that contains the current company for the current user,
+    # in your controllers. 'Companies' are generic groupings of users, so this
+    # could be a company, app or group.
+    #
+    config.company.current = Proc.new { Current.family }
+    #
+    # Or if you are using devise you can just use the following config
+    #
+    # config.company.current = Proc.new { current_user.company }
+
+    # == Exclude company
+    # A Proc that given a company returns true if the company should be excluded
+    # from imports and Javascript inclusion, false otherwise.
+    #
+    # config.company.exclude_if = Proc.new { |app| app.subdomain == 'demo' }
+
+    # == Company Custom Data
+    # A hash of additional data you wish to send about a company.
+    # This works the same as User custom data above.
+    #
+    # config.company.custom_data = {
+    #   :number_of_messages => Proc.new { |app| app.messages.count },
+    #   :is_interesting => :is_interesting?
+    # }
+
+    # == Company Plan name
+    # This is the name of the plan a company is currently paying (or not paying) for.
+    # e.g. Messaging, Free, Pro, etc.
+    #
+    # config.company.plan = Proc.new { |current_company| current_company.plan.name }
+
+    # == Company Monthly Spend
+    # This is the amount the company spends each month on your app. If your company
+    # has a plan, it will set the 'total value' of that plan appropriately.
+    #
+    # config.company.monthly_spend = Proc.new { |current_company| current_company.plan.price }
+    # config.company.monthly_spend = Proc.new { |current_company| (current_company.plan.price - current_company.subscription.discount) }
+
+    # == Custom Style
+    # By default, Intercom will add a button that opens the messenger to
+    # the page. If you'd like to use your own link to open the messenger,
+    # uncomment this line and clicks on any element with id 'Intercom' will
+    # open the messenger.
+    #
+    # config.inbox.style = :custom
+    #
+    # If you'd like to use your own link activator CSS selector
+    # uncomment this line and clicks on any element that matches the query will
+    # open the messenger
+    # config.inbox.custom_activator = '.intercom'
+    #
+    # If you'd like to hide default launcher button uncomment this line
+    # config.hide_default_launcher = true
+    #
+    # If you need to route your Messenger requests through a different endpoint than the default, uncomment the below line. Generally speaking, this is not needed.
+    # config.api_base = "https://api-iam.intercom.io"
+    #
+  end
+end