chore: add custom name option

app/javascript/dashboard/components-next/whatsapp/WhatsAppTemplateParser.vue

@@ -117,6 +117,11 @@ const updateMediaUrl = value => {
   processedParams.value.header.media_url = value;
 };
 
+const updateMediaName = value => {
+  processedParams.value.header ??= {};
+  processedParams.value.header.media_name = value;
+};
+
 const sendMessage = () => {
   v$.value.$touch();
   if (v$.value.$invalid) return;
@@ -163,6 +168,7 @@ defineExpose({
   renderedTemplate,
   v$,
   updateMediaUrl,
+  updateMediaName,
   sendMessage,
   resetTemplate,
   goBack,
@@ -216,6 +222,21 @@ defineExpose({
             @update:model-value="updateMediaUrl"
           />
         </div>
+        <div
+          v-if="headerComponent?.format === 'DOCUMENT'"
+          class="flex items-center mb-2.5"
+        >
+          <Input
+            :model-value="processedParams.header?.media_name || ''"
+            type="text"
+            class="flex-1"
+            :placeholder="
+              t('WHATSAPP_TEMPLATES.PARSER.MEDIA_NAME_PLACEHOLDER') ||
+              'Enter custom filename (optional)'
+            "
+            @update:model-value="updateMediaName"
+          />
+        </div>
       </div>
 
       <!-- Body Variables Section -->

app/javascript/dashboard/helper/templateHelper.js

@@ -51,6 +51,9 @@ export const buildTemplateParameters = (template, hasMediaHeaderValue) => {
     if (!allVariables.header) allVariables.header = {};
     allVariables.header.media_url = '';
     allVariables.header.media_type = headerComponent.format.toLowerCase();
+    if (headerComponent.format === 'DOCUMENT') {
+      allVariables.header.media_name = '';
+    }
   }
 
   // Process button variables

app/javascript/dashboard/i18n/locale/en/whatsappTemplates.json

@@ -40,6 +40,7 @@
       "BUTTON_LABEL": "Button {index}",
       "COUPON_CODE": "Enter coupon code (max 15 chars)",
       "MEDIA_URL_LABEL": "Enter {type} URL",
+      "MEDIA_NAME_PLACEHOLDER": "Enter custom filename (optional)",
       "BUTTON_PARAMETER": "Enter button parameter"
     }
   }

app/services/whatsapp/populate_template_parameters_service.rb

@@ -30,12 +30,12 @@ class Whatsapp::PopulateTemplateParametersService
     end
   end
 
-  def build_media_parameter(url, media_type)
+  def build_media_parameter(url, media_type, media_name = nil)
     return nil if url.blank?
 
     sanitized_url = sanitize_parameter(url)
     validate_url(sanitized_url)
-    build_media_type_parameter(sanitized_url, media_type.downcase)
+    build_media_type_parameter(sanitized_url, media_type.downcase, media_name)
   end
 
   def build_named_parameter(parameter_name, value)
@@ -89,14 +89,14 @@ class Whatsapp::PopulateTemplateParametersService
     }
   end
 
-  def build_media_type_parameter(sanitized_url, media_type)
+  def build_media_type_parameter(sanitized_url, media_type, media_name = nil)
     case media_type
     when 'image'
       build_image_parameter(sanitized_url)
     when 'video'
       build_video_parameter(sanitized_url)
     when 'document'
-      filename = extract_filename_from_url(sanitized_url)
+      filename = (media_name.presence || extract_filename_from_url(sanitized_url))
       build_document_parameter(sanitized_url, filename)
     else
       raise ArgumentError, "Unsupported media type: #{media_type}"

app/services/whatsapp/template_processor_service.rb

@@ -60,9 +60,9 @@ class Whatsapp::TemplateProcessorService
       next if value.blank?
 
       if media_url_with_type?(key, header_data)
-        media_param = parameter_builder.build_media_parameter(value, header_data['media_type'])
+        media_param = parameter_builder.build_media_parameter(value, header_data['media_type'], header_data['media_name'])
         header_params << media_param if media_param
-      elsif key != 'media_type'
+      elsif key != 'media_type' && key != 'media_name'
         header_params << parameter_builder.build_parameter(value)
       end
     end

spec/services/whatsapp/send_on_whatsapp_service_spec.rb

@@ -201,6 +201,31 @@ describe Whatsapp::SendOnWhatsappService do
         expect(message.reload.source_id).to eq('123456789')
       end
 
+      it 'handles template with document header parameters and custom media_name' do
+        processed_params = {
+          'body' => { '1' => 'Order456' },
+          'header' => {
+            'media_url' => 'https://baserow.example.com/media/user_files/lBWKm8sZ24l7JLkz5V253Yt0RWG4ypfu_e5a8419c8e6f9a3e58d868bd065f4a4d7cea6a30b4716c380a9b0e1628596d9f.pdf',
+            'media_type' => 'document',
+            'media_name' => 'customer_charge.pdf'
+          }
+        }
+        custom_name_template_params = build_sample_template_params(processed_params)
+        message = create_message_with_template('', custom_name_template_params)
+
+        components = [
+          { type: 'header',
+            parameters: [{ type: 'document',
+                           document: { link: 'https://baserow.example.com/media/user_files/lBWKm8sZ24l7JLkz5V253Yt0RWG4ypfu_e5a8419c8e6f9a3e58d868bd065f4a4d7cea6a30b4716c380a9b0e1628596d9f.pdf',
+                                       filename: 'customer_charge.pdf' } }] },
+          { type: 'body', parameters: [{ type: 'text', text: 'Order456' }] }
+        ]
+        stub_sample_template_request(components)
+
+        described_class.new(message: message).perform
+        expect(message.reload.source_id).to eq('123456789')
+      end
+
       it 'handles empty processed_params gracefully' do
         empty_template_params = {
           name: 'sample_shipping_confirmation',