diff --git a/Gemfile b/Gemfile
index abbd3332f..4b9d978d4 100644
--- a/Gemfile
+++ b/Gemfile
@@ -207,7 +207,7 @@ group :production do
 end
 
 group :development do
-  gem 'annotate'
+  gem 'annotaterb'
   gem 'bullet'
   gem 'letter_opener'
   gem 'scss_lint', require: false
diff --git a/Gemfile.lock b/Gemfile.lock
index 99e75b33c..fa3a5e788 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -128,9 +128,9 @@ GEM
       selectize-rails (~> 0.6)
     ai-agents (0.4.3)
       ruby_llm (~> 1.3)
-    annotate (3.2.0)
-      activerecord (>= 3.2, < 8.0)
-      rake (>= 10.4, < 14.0)
+    annotaterb (4.20.0)
+      activerecord (>= 6.0.0)
+      activesupport (>= 6.0.0)
     ast (2.4.3)
     attr_extras (7.1.0)
     audited (5.4.1)
@@ -992,7 +992,7 @@ DEPENDENCIES
   administrate-field-active_storage (>= 1.0.3)
   administrate-field-belongs_to_search (>= 0.9.0)
   ai-agents (>= 0.4.3)
-  annotate
+  annotaterb
   attr_extras
   audited (~> 5.4, >= 5.4.1)
   aws-sdk-s3
diff --git a/app/javascript/dashboard/components/ui/Dropdown/DropdownButton.vue b/app/javascript/dashboard/components/ui/Dropdown/DropdownButton.vue
index 7289267c1..5ca8bde2b 100644
--- a/app/javascript/dashboard/components/ui/Dropdown/DropdownButton.vue
+++ b/app/javascript/dashboard/components/ui/Dropdown/DropdownButton.vue
@@ -23,6 +23,7 @@ defineProps({
     slate
     sm
     class="relative"
+    no-animation
     :icon="icon"
     :trailing-icon="trailingIcon"
   >
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/FinishSetup.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/FinishSetup.vue
index b19416137..46a189b39 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/FinishSetup.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/FinishSetup.vue
@@ -197,7 +197,7 @@ onMounted(() => {
           v-if="shouldShowWhatsAppWebhookDetails"
           class="w-[50%] max-w-[50%] ml-[25%]"
         >
-          <p class="mt-8 font-medium text-slate-700 dark:text-slate-200">
+          <p class="mt-8 font-medium text-n-slate-11">
             {{ $t('INBOX_MGMT.ADD.WHATSAPP.API_CALLBACK.WEBHOOK_URL') }}
           </p>
           <woot-code lang="html" :script="currentInbox.callback_webhook_url" />
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Whatsapp.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Whatsapp.vue
index c6c021a45..b8b8126c7 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Whatsapp.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Whatsapp.vue
@@ -73,10 +73,10 @@ const handleManualLinkClick = () => {
   <div class="overflow-auto col-span-6 p-6 w-full h-full">
     <div v-if="showProviderSelection">
       <div class="mb-10 text-left">
-        <h1 class="mb-2 text-lg font-medium text-slate-12">
+        <h1 class="mb-2 text-lg font-medium text-n-slate-12">
           {{ $t('INBOX_MGMT.ADD.WHATSAPP.SELECT_PROVIDER.TITLE') }}
         </h1>
-        <p class="text-sm leading-relaxed text-slate-11">
+        <p class="text-sm leading-relaxed text-n-slate-11">
           {{ $t('INBOX_MGMT.ADD.WHATSAPP.SELECT_PROVIDER.DESCRIPTION') }}
         </p>
       </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/settingsPage/ConfigurationPage.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/settingsPage/ConfigurationPage.vue
index 186fcc48e..578a788cd 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/settingsPage/ConfigurationPage.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/settingsPage/ConfigurationPage.vue
@@ -322,7 +322,7 @@ export default {
           "
         >
           <div class="flex gap-4 items-center">
-            <p class="text-sm text-slate-600">
+            <p class="text-sm text-n-slate-11">
               {{
                 $t(
                   'INBOX_MGMT.SETTINGS_POPUP.WHATSAPP_EMBEDDED_SIGNUP_DESCRIPTION'
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/NewHook.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/NewHook.vue
index 5fe350215..1a4d36fee 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/NewHook.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/NewHook.vue
@@ -4,6 +4,7 @@ import { mapGetters } from 'vuex';
 import { useAlert } from 'dashboard/composables';
 import { useIntegrationHook } from 'dashboard/composables/useIntegrationHook';
 import { FormKit } from '@formkit/vue';
+import { useBranding } from 'shared/composables/useBranding';
 
 import NextButton from 'dashboard/components-next/button/Button.vue';
 
@@ -23,8 +24,9 @@ export default {
     const { integration, isHookTypeInbox } = useIntegrationHook(
       props.integrationId
     );
+    const { replaceInstallationName } = useBranding();
 
-    return { integration, isHookTypeInbox };
+    return { integration, isHookTypeInbox, replaceInstallationName };
   },
   data() {
     return {
@@ -117,7 +119,7 @@ export default {
   <div class="flex flex-col h-auto overflow-auto integration-hooks">
     <woot-modal-header
       :header-title="integration.name"
-      :header-content="integration.short_description"
+      :header-content="replaceInstallationName(integration.short_description)"
     />
     <FormKit
       v-model="values"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/SingleIntegrationHooks.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/SingleIntegrationHooks.vue
index a1bd609cd..f32926d79 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/SingleIntegrationHooks.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/SingleIntegrationHooks.vue
@@ -1,6 +1,7 @@
 <script setup>
 import { defineProps, defineEmits } from 'vue';
 import { useIntegrationHook } from 'dashboard/composables/useIntegrationHook';
+import { useBranding } from 'shared/composables/useBranding';
 import Button from 'dashboard/components-next/button/Button.vue';
 
 const props = defineProps({
@@ -15,6 +16,8 @@ defineEmits(['add', 'delete']);
 const { integration, hasConnectedHooks } = useIntegrationHook(
   props.integrationId
 );
+
+const { replaceInstallationName } = useBranding();
 </script>
 
 <template>
@@ -37,7 +40,7 @@ const { integration, hasConnectedHooks } = useIntegrationHook(
           {{ integration.name }}
         </h3>
         <p class="text-n-slate-11 text-sm leading-6">
-          {{ integration.description }}
+          {{ replaceInstallationName(integration.description) }}
         </p>
       </div>
       <div class="flex justify-center items-center mb-0 w-[15%]">
diff --git a/lib/tasks/auto_annotate_models.rake b/lib/tasks/auto_annotate_models.rake
index 8a89739b6..9dcd13126 100644
--- a/lib/tasks/auto_annotate_models.rake
+++ b/lib/tasks/auto_annotate_models.rake
@@ -2,11 +2,14 @@
 # NOTE: are sensitive to local FS writes, and besides -- it's just not proper
 # NOTE: to have a dev-mode tool do its thing in production.
 if Rails.env.development?
-  require 'annotate'
+  require 'annotate_rb'
+
+  AnnotateRb::Core.load_rake_tasks
+
   task :set_annotation_options do
     # You can override any of these by setting an environment variable of the
     # same name.
-    Annotate.set_defaults(
+    AnnotateRb::Options.set_defaults(
       'additional_file_patterns' => [],
       'routes' => 'false',
       'models' => 'true',
@@ -55,6 +58,4 @@ if Rails.env.development?
       'with_comment' => 'true'
     )
   end
-
-  Annotate.load_tasks
 end