fix(payment_link): Payment link render issue when transaction_details not passed

[Sakilmostak]

Type of Change

• Bugfix
• New feature
• Enhancement
• Refactoring
• Dependency updates
• Documentation
• CI/CD

Description

If transaction detail field is not passed in payment link config, the payment link render fails. This adds a check before rendering the dynamic merchant transaction details.

Additional Changes

• This PR modifies the API contract
• This PR modifies the database schema
• This PR modifies application configuration/environment variables

Motivation and Context

How did you test it?

Tested through Postman:

Case 1

• Create a Payment link (without passing the transaction details in payment link config):

{
    "amount": 1100,
    "currency": "USD",
    "confirm": false,
    "payment_link": true,
    "payment_link_config": {
        "logo": "https://hyperswitch.io/logos/hyperswitch.svg",
        "display_sdk_only": false
    },
    "capture_method": "manual",
    "capture_on": "2022-09-10T10:11:12Z",
    "customer_id": "StripeCustomer",
    "email": "[email protected]",
    "name": "John Doe",
    "phone": "999999999",
    "phone_country_code": "+65",
    "description": "Its my first payment request",
    "authentication_type": "no_three_ds",
    "return_url": "https://google.com",
    "setup_future_usage": "on_session",
    "browser_info": {
        "user_agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.110 Safari/537.36",
        "accept_header": "text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8",
        "language": "nl-NL",
        "color_depth": 24,
        "screen_height": 723,
        "screen_width": 1536,
        "time_zone": 0,
        "java_enabled": true,
        "java_script_enabled": true,
        "ip_address": "127.0.0.1"
    },
    "shipping": {
        "address": {
            "line1": "1467",
            "line2": "Harrison Street",
            "line3": "Harrison Street",
            "city": "San Fransico",
            "state": "California",
            "zip": "94122",
            "country": "US",
            "first_name": "John",
            "last_name": "Doe"
        }
    },
    "statement_descriptor_name": "joseph",
    "statement_descriptor_suffix": "JS",
    "metadata": {
        "udf1": "value1",
        "new_customer": "true",
        "login_date": "2019-09-10T10:11:12Z"
    },
    "payment_method": "card",
    "payment_method_type": "credit",
    "payment_method_data": {
        "card": {
            "card_number": "4005550000000001",
            "card_exp_month": "02",
            "card_exp_year": "26",
            "card_holder_name": "Joseph Doe",
            "card_cvc": "999"
        }
    },
    "billing": {
        "address": {
            "line1": "8th block",
            "line2": "8th block",
            "line3": "8th block",
            "city": "Bengaluru",
            "state": "Karnataka",
            "zip": "560095",
            "country": "IN",
            "first_name": "Sakil",
            "last_name": "Mostak"
        }
    }
}

• Redirect to the Payment link, it should look like following:

Case 2

• Create a Payment link (with passing the transaction details in payment link config but no field is passed inside):

{
    "amount": 1100,
    "currency": "USD",
    "confirm": false,
    "payment_link": true,
    "payment_link_config": {
        "logo": "https://hyperswitch.io/logos/hyperswitch.svg",
        "display_sdk_only": false,
        "transaction_details": []
    },
    "capture_method": "manual",
    "capture_on": "2022-09-10T10:11:12Z",
    "customer_id": "StripeCustomer",
    "email": "[email protected]",
    "name": "John Doe",
    "phone": "999999999",
    "phone_country_code": "+65",
    "description": "Its my first payment request",
    "authentication_type": "no_three_ds",
    "return_url": "https://google.com",
    "setup_future_usage": "on_session",
    "browser_info": {
        "user_agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.110 Safari/537.36",
        "accept_header": "text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8",
        "language": "nl-NL",
        "color_depth": 24,
        "screen_height": 723,
        "screen_width": 1536,
        "time_zone": 0,
        "java_enabled": true,
        "java_script_enabled": true,
        "ip_address": "127.0.0.1"
    },
    "shipping": {
        "address": {
            "line1": "1467",
            "line2": "Harrison Street",
            "line3": "Harrison Street",
            "city": "San Fransico",
            "state": "California",
            "zip": "94122",
            "country": "US",
            "first_name": "John",
            "last_name": "Doe"
        }
    },
    "statement_descriptor_name": "joseph",
    "statement_descriptor_suffix": "JS",
    "metadata": {
        "udf1": "value1",
        "new_customer": "true",
        "login_date": "2019-09-10T10:11:12Z"
    },
    "payment_method": "card",
    "payment_method_type": "credit",
    "payment_method_data": {
        "card": {
            "card_number": "4005550000000001",
            "card_exp_month": "02",
            "card_exp_year": "26",
            "card_holder_name": "Joseph Doe",
            "card_cvc": "999"
        }
    },
    "billing": {
        "address": {
            "line1": "8th block",
            "line2": "8th block",
            "line3": "8th block",
            "city": "Bengaluru",
            "state": "Karnataka",
            "zip": "560095",
            "country": "IN",
            "first_name": "Sakil",
            "last_name": "Mostak"
        }
    }
}

• Redirect to the Payment link, it should look like following:

Case 3

• Create a Payment link (with passing the transaction details in payment link config):

{
    "amount": 1100,
    "currency": "USD",
    "confirm": false,
    "payment_link": true,
    "payment_link_config": {
        "logo": "https://hyperswitch.io/logos/hyperswitch.svg",
        "display_sdk_only": false,
        "transaction_details": [
            {
                "key": "sakil",
                "value": "mostak",
                "ui_configuration": {
                    "is_key_bold": true,
                    "is_value_bold": true,
                    "position": 3
                }
            },
            {
                "key": "Value to be filled",
                "value": "Dummy value is filled",
                "ui_configuration": {
                    "is_key_bold": false,
                    "is_value_bold": true
                }
            },
            {
                "key": "লোডটেস্ট কাজ করছে",
                "value": "বিভিন্ন ভাষায় লোডটেস্ট",
                "ui_configuration": {
                    "is_key_bold": true,
                    "is_value_bold": false,
                    "position": 4
                }
            },
            {
                "key": "Business Country",
                "value": "Germany"
            },
            {
                "key": "Policy Number",
                "value": "938478327648",
                "ui_configuration": {
                    "is_key_bold": false,
                    "is_value_bold": false,
                    "position": 2
                }
            }
        ]
    },
    "capture_method": "manual",
    "capture_on": "2022-09-10T10:11:12Z",
    "customer_id": "StripeCustomer",
    "email": "[email protected]",
    "name": "John Doe",
    "phone": "999999999",
    "phone_country_code": "+65",
    "description": "Its my first payment request",
    "authentication_type": "no_three_ds",
    "return_url": "https://google.com",
    "setup_future_usage": "on_session",
    "browser_info": {
        "user_agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.110 Safari/537.36",
        "accept_header": "text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8",
        "language": "nl-NL",
        "color_depth": 24,
        "screen_height": 723,
        "screen_width": 1536,
        "time_zone": 0,
        "java_enabled": true,
        "java_script_enabled": true,
        "ip_address": "127.0.0.1"
    },
    "shipping": {
        "address": {
            "line1": "1467",
            "line2": "Harrison Street",
            "line3": "Harrison Street",
            "city": "San Fransico",
            "state": "California",
            "zip": "94122",
            "country": "US",
            "first_name": "John",
            "last_name": "Doe"
        }
    },
    "statement_descriptor_name": "joseph",
    "statement_descriptor_suffix": "JS",
    "metadata": {
        "udf1": "value1",
        "new_customer": "true",
        "login_date": "2019-09-10T10:11:12Z"
    },
    "payment_method": "card",
    "payment_method_type": "credit",
    "payment_method_data": {
        "card": {
            "card_number": "4005550000000001",
            "card_exp_month": "02",
            "card_exp_year": "26",
            "card_holder_name": "Joseph Doe",
            "card_cvc": "999"
        }
    },
    "billing": {
        "address": {
            "line1": "8th block",
            "line2": "8th block",
            "line3": "8th block",
            "city": "Bengaluru",
            "state": "Karnataka",
            "zip": "560095",
            "country": "IN",
            "first_name": "Sakil",
            "last_name": "Mostak"
        }
    }
}

• Redirect to the Payment link, it should look like following:

Checklist

• I formatted the code cargo +nightly fmt --all
• I addressed lints thrown by cargo clippy
• I reviewed the submitted code
• I added unit tests for my changes where possible

[semanticdiff-com]

Review changes with SemanticDiff.

Analyzed 2 of 3 files.

Overall, the semantic diff is 1% smaller than the GitHub diff.

	Filename	Status
❔	crates/router/src/core/payment_link/payment_link_initiate/payment_link.css	Unsupported file format
✔️	crates/router/src/core/payment_link/payment_link_initiate/payment_link.html	6.67% smaller
✔️	crates/router/src/core/payment_link/payment_link_initiate/payment_link.js	0.66% smaller

[kashif-m]

Can you re-check both the cases

1. when transaction_details is empty
2. when transaction_details is present