removing sessions and extra html pages

.github/workflows/build.yml

@@ -0,0 +1,26 @@
+name: Django CI
+
+on:
+  push:
+  pull_request:
+    branches: [ master ]
+
+jobs:
+  build:
+
+    runs-on: ubuntu-latest
+    strategy:
+      max-parallel: 4
+      matrix:
+        python-version: [3.7, 3.8, 3.9]
+
+    steps:
+    - uses: actions/checkout@v2
+    - name: Set up Python ${{ matrix.python-version }}
+      uses: actions/setup-python@v2
+      with:
+        python-version: ${{ matrix.python-version }}
+    - name: Install Dependencies
+      run: |
+        python -m pip install --upgrade pip
+        pip install -r requirements.txt

.github/workflows/e2e.yml

@@ -0,0 +1,9 @@
+name: E2E (Playwright)
+
+on:
+  workflow_dispatch:
+
+jobs:
+  DummyJob:
+    steps:
+      - name: DummyStep

.gitignore

@@ -0,0 +1,16 @@
+.idea
+.DS_Store
+
+config.ini
+
+venv/
+
+.git
+*.pyc
+__pycache__/
+*.egg-info
+dist
+build
+.vscode
+
+.env

app/app.py

@@ -3,7 +3,6 @@ import logging
 from Adyen.util import is_valid_hmac_notification
 from flask import Flask, render_template, send_from_directory, request, redirect, url_for, abort
 
-from main.sessions import adyen_sessions
 from main.paymentMethods import adyen_payment_methods
 from main.payments import adyen_payments
 from main.redirect import handle_shopper_redirect
@@ -23,17 +22,10 @@ def create_app():
 
     # Routes:
     @app.route('/')
-    def home():
-        return render_template('home.html')
-
-    @app.route('/cart/<integration>')
-    def cart(integration):
-        return render_template('cart.html', method=integration)
-
-    @app.route('/checkout')
     def checkout():
         return render_template('component.html', client_key=get_adyen_client_key())
 
+
     @app.route('/api/getPaymentMethods', methods=['GET', 'POST'])
     def get_payment_methods():
         request_data = request.get_json()
@@ -79,15 +71,6 @@ def create_app():
         else:
             return redirect(url_for('checkout_failure'))
 
-    @app.route('/api/sessions', methods=['POST'])
-    def sessions():
-        host_url = request.host_url 
-        request_data = request.get_json()
-        print (request_data)
-        locale_data = request_data
-
-        return adyen_sessions(host_url, locale_data)
-
 
     @app.route('/result/success', methods=['GET'])
     def checkout_success():

app/main/sessions.py

@@ -1,56 +0,0 @@
-import Adyen
-import json
-import uuid
-from main.config import get_adyen_api_key, get_adyen_merchant_account
-from flask import Flask, render_template, send_from_directory, request, redirect, url_for, abort
-
-'''
-Create Payment Session by calling /sessions endpoint
-
-Request must provide few mandatory attributes (amount, currency, returnUrl, transaction reference)
-
-Your backend should have a payment state where you can fetch information like amount and shopperReference
-
-Parameters
-    ----------
-    host_url : string
-        URL of the host (i.e. http://localhost:8080): required to define returnUrl parameter
-'''
-
-def adyen_sessions(host_url, locale_data):
-    
-    adyen = Adyen.Adyen()
-    adyen.payment.client.xapikey = get_adyen_api_key()
-    adyen.payment.client.platform = "test" # change to live for production
-    adyen.payment.client.merchant_account = get_adyen_merchant_account()
-
-
-
-    request = {}
-
-    request['amount'] = {"value": "4000", "currency": locale_data['currency']}
-    request['reference'] = f"Reference {uuid.uuid4()}"  # provide your unique payment reference
-    # set redirect URL required for some payment methods
-    request['returnUrl'] = f"{host_url}/redirect?shopperOrder=myRef"
-    request['countryCode'] = locale_data['countryCode']
-    # for Klarna
-    request['lineItems'] = [{"quantity": "1", "amountIncludingTax": "2000", "description": "Sunglasses", "id": "Item 1", "taxPercentage": "2100", "productUrl": "https://example.com/item1", "imageUrl": "https://example.com/item1pic"},
-    {"quantity": "1","amountIncludingTax": "2000","description": "Headphones","id": "Item 2","taxPercentage": "2100","productUrl": "https://example.com/item2","imageUrl": "https://example.com/item2pic"}]
-    request['shopperEmail'] = "customer@email.uk"
-    request['shopperReference'] = "UniqueReference"
-
-    # for clearPay
-    request['shopperName'] = {"firstName": "Test", "lastName": "Shopper"}
-    request['deliveryAddress'] = {"city": "London", "country": "GB", "houseNumberOrName": "56", "postalCode": "EC17 2IH", "street": "Mill Lane"}
-    request['billingAddress'] = {"city": "London", "country": "GB", "houseNumberOrName": "56", "postalCode": "EC17 2IH", "street": "Mill Lane"}
-
-
-  
-    result = adyen.checkout.sessions(request)
-    print("/sessions request:\n" + str(request))
-
-    formatted_response = json.dumps((json.loads(result.raw_response)))
-    print("/sessions response:\n" + formatted_response)
-
-    return formatted_response
-

app/static/js/sessionsCode.js

@@ -1,248 +0,0 @@
-const clientKey = JSON.parse(document.getElementById('client-key').innerHTML);
-const type = JSON.parse(document.getElementById('integration-type').innerHTML);
-const storedCountry = document.getElementById('country-code');
-let countrySettings;
-
-// Used to finalize a checkout call in case of redirect
-const urlParams = new URLSearchParams(window.location.search);
-const sessionId = urlParams.get('sessionId'); // Unique identifier for the payment session
-const redirectResult = urlParams.get('redirectResult');
-
-// Used to retrieve country value from url
-const urlCountryParams = new URLSearchParams(window.location.search);
-const countryURL = urlCountryParams.get('country');
-console.log(countryURL)
-
-const countryVariables = [
-    {
-        countryCode: "NL",
-        currency: "EUR",
-        locale: "en_NL"
-    },
-    {
-        countryCode: "GB",
-        currency: "GBP",
-        locale: "en_GB"
-    },
-    {
-        countryCode: "US",
-        currency: "USD",
-        locale: "en_US"
-    }
-]
-
-if (storedCountry) {
-    const selectedCountry = JSON.parse(storedCountry.innerHTML);
-    countrySettings = getCountryData(selectedCountry)
-}
-if (countryURL) {
-	const selectedCountry = countryURL
-	countrySettings = getCountryData(selectedCountry)
-}
-
-function getCountryData(countrySettings) {
-    return countryVariables.find((locality) => locality.countryCode === countrySettings)
-}
-
-
-// Start the Checkout workflow
-async function startCheckout() {
-	try {
-	    // Init Sessions
-		const checkoutSessionResponse = await callServer(
-            "/api/sessions?type=" + type,
-            countrySettings
-            );
-        console.log(countrySettings)
-
-        // Create AdyenCheckout using Sessions response
-		const checkout = await createAdyenCheckout(checkoutSessionResponse)
-
-		// Create an instance of Drop-in and mount it to the container you created.
-		const dropinComponent = checkout.create(type, {
-            showRemovePaymentMethodButton: true,
-            onDisableStoredPaymentMethod: (storedPaymentMethodId, resolve, reject) => {
-                callServer("/api/disable", {"storedPaymentMethodId":storedPaymentMethodId});
-                resolve()
-                reject()
-            },
-        }).mount("#component");  // pass DIV id where component must be rendered
-
-	} catch (error) {
-		console.error(error);
-		alert("Error occurred. Look at console for details");
-	}
-}
-
-// Some payment methods use redirects. This is where we finalize the operation
-async function finalizeCheckout() {
-    try {
-        // Create AdyenCheckout re-using existing Session
-        const checkout = await createAdyenCheckout({id: sessionId});
-
-        // Submit the extracted redirectResult (to trigger onPaymentCompleted(result, component) handler)
-        checkout.submitDetails({details: {redirectResult}});
-    } catch (error) {
-        console.error(error);
-        alert("Error occurred. Look at console for details");
-    }
-}
-
-async function createAdyenCheckout(session) {
-
-    const configuration = {
-        clientKey,
-        locale: countrySettings.locale || "en_GB",
-        countryCode: countrySettings.countryCode || "GB",
-        environment: "test",  // change to live for production
-        showPayButton: true,
-        session: session,
-        paymentMethodsConfiguration: {
-            ideal: {
-                showImage: true
-            },
-            card: {
-                hasHolderName: true,
-                holderNameRequired: true,
-                name: "Credit or debit card",
-                enableStoreDetails: true,
-                brands: ['mc','visa','amex', 'cup', 'cartebancaire', 'diners', 'discover', 'jcb'],
-                //billingAddressRequired: true,
-                //onSubmit: () => {},
-                amount: {
-                    value: 4000,
-                    currency: countrySettings.currency || "GBP"
-                }
-            },
-            threeDS2: { // Web Components 4.0.0 and above: sample configuration for the threeDS2 action type
-                challengeWindowSize: '02'
-                 // Set to any of the following:
-                 // '02': ['390px', '400px'] -  The default window size
-                 // '01': ['250px', '400px']
-                 // '03': ['500px', '600px']
-                 // '04': ['600px', '400px']
-                 // '05': ['100%', '100%']
-          },
-            paypal: {
-                amount: {
-                    currency: countrySettings.currency || "GBP",
-                    value: 4000
-                },
-                environment: "test",
-                commit: false,
-                returnUrl: "http://localhost:8080/checkout/success",
-                //countryCode: "GB",   // Only needed for test. This will be automatically retrieved when you are in production.
-                lineItems: [
-                    {"quantity": "1",
-                    "amountIncludingTax": "2000",
-                    "description": "Sunglasses",
-                    "id": "Item 1",
-                    "taxPercentage": "2100",
-                    "productUrl": "https://example.com/item1",
-                    "imageUrl": "https://example.com/item1pic"
-                    },
-                    {"quantity": "1",
-                    "amountIncludingTax": "2000",
-                    "description": "Headphones",
-                    "id": "Item 2",
-                    "taxPercentage": "2100",
-                    "productUrl": "https://example.com/item2",
-                    "imageUrl": "https://example.com/item2pic"
-                }
-                ]
-            },
-            //klarna: {
-            //    lineItems: [
-            //        {"quantity": "1",
-            //        "amountIncludingTax": "500",
-            //        "description": "Sunglasses",
-            //        "id": "Item 1",
-            //        "taxPercentage": "2100",
-            //        "productUrl": "https://example.com/item1",
-            //        "imageUrl": "https://example.com/item1pic"}
-            //    ]
-            //}frontend_request
-        },
-        /*onSubmit: (state, component) => {
-            // Your function calling your server to make the /payments request.
-            console.log(state);
-
-            if (state.isValid) {
-                handleSubmission(state, component, "/api/initiatePayment");
-            }
-        },
-        onAdditionalDetails: (state, component) => {
-            handleSubmission(state, component, "/api/submitAdditionalDetails");
-        },*/
-        onPaymentCompleted: (result, component) => {
-            console.info(result, component);
-            handleServerResponse(result, component);
-        },
-        onError: (error, component) => {
-            console.error(error.name, error.message, error.stack, component);
-        },
-        onDisableStoredPaymentMethod: (storedPaymentMethodId, resolve, reject) => {
-        }
-    };
-
-    return new AdyenCheckout(configuration);
-}
-
-/*
-// Event handlers called when the shopper selects the pay button,
-// or when additional information is required to complete the payment
-async function handleSubmission(state, dropin, url) {
-    try {
-        const res = await callServer(url, state.data, countrySettings);
-        handleServerResponse(res, dropin);
-    } catch (error) {
-        console.error(error);
-        alert("Error occurred. Look at console for details");
-    }
-}
-*/
-// Calls your server endpoints
-async function callServer(url, data) {
-	const res = await fetch(url, {
-		method: "POST",
-		body: data ? JSON.stringify(data) : "",
-		headers: {
-			"Content-Type": "application/json",
-            "Access-Control-Allow-Origin": "*"
-		}
-	});
-
-	return await res.json();
-}
-
-// Handles responses sent from your server to the client
-function handleServerResponse(res, component) {
-	if (res.action) {
-		component.handleAction(res.action);
-	} else {
-		switch (res.resultCode) {
-			case "Authorised":
-				window.location.href = "/result/success";
-				break;
-			case "Pending":
-			case "Received":
-				window.location.href = "/result/pending";
-				break;
-			case "Refused":
-				window.location.href = "/result/failed";
-				break;
-			default:
-				window.location.href = "/result/error";
-				break;
-		}
-	}
-}
-
-if (!sessionId) {
-    startCheckout();
-}
-else {
-    // existing session: complete Checkout
-    finalizeCheckout();
-}
-

app/templates/amazonRedirect.html

@@ -1,31 +0,0 @@
-{% extends "layout.html" %}
-{% block content %}
-
-	<meta charset="UTF-8">
-	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-	<meta http-equiv="X-UA-Compatible" content="ie=edge">
-
-	<!-- Adyen CSS from TEST environment (change to live for production)-->
-	<link rel="stylesheet"
-     	href="https://checkoutshopper-live.adyen.com/checkoutshopper/sdk/4.9.0/adyen.css"
-     	integrity="sha384-0IvbHDeulbhdg1tMDeFeGlmjiYoVT6YsbfAMKFU2lFd6YKUVk0Hgivcmva3j6mkK"
-    	 crossorigin="anonymous">
-
-	<div id="payment-page">
-		<div class="container">
-                <div id="amazonpay_payment-container"></div>
-		</div>
-    </div>
-
-
-	<!-- Adyen JS from TEST environment (change to live for production)-->
-	<script src="https://checkoutshopper-live.adyen.com/checkoutshopper/sdk/4.9.0/adyen.js"
-		integrity="sha384-aEL1fltFqDd33ItS8N+aAdd44ida67AQctv9h57pBGjNJ8E2xxbX/CVALJqO8/aM"
-		crossorigin="anonymous"></script>
-
-	<script id="client-key" type="application/json">{{ client_key|tojson }}</script>
-	<script id="integration-type" type="application/json">{{ method|tojson }}</script>
-	<script id="country-code" type="application/json">{{ countryCode|default("GB")|tojson }}</script>
-
-	<script src="{{ url_for('static', filename='js/amazonRedirect.js') }}"></script>
-{% endblock %}

app/templates/amazonpay.html

@@ -1,45 +0,0 @@
-{% extends "layout.html" %}
-{% block content %}
-
-	<meta charset="UTF-8">
-	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-	<meta http-equiv="X-UA-Compatible" content="ie=edge">
-
-	<!-- Adyen CSS from TEST environment (change to live for production)-->
-	<link rel="stylesheet"
-		href="https://checkoutshopper-live.adyen.com/checkoutshopper/sdk/4.9.0/adyen.css"
-		integrity="sha384-0IvbHDeulbhdg1tMDeFeGlmjiYoVT6YsbfAMKFU2lFd6YKUVk0Hgivcmva3j6mkK"
-		crossorigin="anonymous">
-
-	<div id="payment-page">
-		<div class="container">
-				<div id="dropin-container" class="payment">
-					<!-- Component will be rendered here -->
-				</div>
-                <div id="amazonpay_payment-container"></div>
-                <div id="amazonpay_button-container"></div>
-		</div>
-        <div class="info">
-            <p>
-                Check the Source Code to see the full implementation.
-            </p>
-            <p>
-                To make a payment, use our <a
-                    href="https://docs.adyen.com/developers/development-resources/test-cards/test-card-numbers"
-                    target="_blank">test card numbers</a>.
-            </p>
-        </div>
-    </div>
-
-
-	<!-- Adyen JS from TEST environment (change to live for production)-->
-	<script src="https://checkoutshopper-live.adyen.com/checkoutshopper/sdk/4.9.0/adyen.js"
-		integrity="sha384-aEL1fltFqDd33ItS8N+aAdd44ida67AQctv9h57pBGjNJ8E2xxbX/CVALJqO8/aM"
-		crossorigin="anonymous"></script>
-
-	<script id="client-key" type="application/json">{{ client_key|tojson }}</script>
-	<script id="integration-type" type="application/json">{{ method|tojson }}</script>
-	<script id="country-code" type="application/json">{{ countryCode|default("GB")|tojson }}</script>
-
-	<script src="{{ url_for('static', filename='js/amazonpay.js') }}"></script>
-{% endblock %}

app/templates/cart.html

@@ -1,97 +0,0 @@
-{% extends "layout.html" %}
-
-{% block content %}
-
-    <main>
-        <section class="cart">
-            <h2>Cart</h2>
-            <div>
-                <ul>
-                    <li class="order-summary-list-list-item first-item">
-                        <img src="{{ url_for('static', filename='img/sunglasses.png') }}"
-                             class="order-summary-list-list-item-image"/>
-                        <p class="order-summary-list-list-item-title">Sunglasses</p>
-                        <p id="item_1_cost" class="order-summary-list-list-item-price">€20.00</p>
-                    </li>
-                    <li class="order-summary-list-list-item">
-                        <img src="{{ url_for('static', filename='img/headphones.png') }}"
-                             class="order-summary-list-list-item-image"/>
-                        <p class="order-summary-list-list-item-title">Headphones</p>
-                        <p id="item_2_cost" class="order-summary-list-list-item-price">€20.00</p>
-                    </li>
-                </ul>
-            </div>
-            <div class="cart-footer"><span class="cart-footer-label">Total:</span><span id="total_cost" class="cart-footer-amount">€40.00</span>
-                <a id="checkout_button" href="{{ url_for('checkout', integration=method) }}">
-                    <p class="button">Continue to checkout</p>
-                </a>
-            </div>
-        </section>
-        <footer class="footer">
-            <div class="country-selector">
-                <div class="country-selector__flag" aria-hidden="true">
-                    <img id="flag_img" src="https://ca-test.adyen.com/ca/adl/img/flags/nl.svg" alt="Flag icon">
-                </div>
-                <select onchange="changeSelect(this)" id="country_select" class="country-selector__select" aria-label="country" autocomplete="off">
-                    <option value="NL">Netherlands</option>
-                    <option value="GB">United Kingdom</option>
-                    <option value="US">United States</option>
-                </select>
-                <div class="dropdown-icon" aria-hidden="true">
-                    <img src="{{ url_for('static', filename='img/dropdown.svg') }}" alt="Dropdown caret">
-                </div>
-            </div>
-        </footer>
-    </main>
-    <script>
-        const pay_button = document.getElementById('checkout_button');
-        const old_href = pay_button.href;
-        //const country = "NL";
-        //let new_href = `${old_href}?country=${country}`;
-        updateUrl()
-
-        
-        const flagUrlMap = {
-            "NL" : {
-                "src": "https://ca-test.adyen.com/ca/adl/img/flags/nl.svg",
-                "item1": "€20.00",
-                "item2": "€20.00",
-                "total": "€40.00",
-                "currency": "EUR",
-                "href": "{{ url_for('checkout', integration=method, country=NL) }}"
-            },
-            "GB" : {
-                "src": "https://ca-test.adyen.com/ca/adl/img/flags/gb.svg",
-                "item1": "£20.00",
-                "item2": "£20.00",
-                "total": "£40.00",
-                "currency": "GBP",
-                "href": "{{ url_for('checkout', integration=method, country=GB) }}"
-            },
-            "US" : {
-                "src": "https://ca-test.adyen.com/ca/adl/img/flags/us.svg",
-                "item1": "$20.00",
-                "item2": "$20.00",
-                "total": "$40.00",
-                "href": "{{ url_for('checkout', integration=method, country=US) }}"
-            }
-        };
-
-        pay_button.href = new_href;
-
-        function changeSelect(el) {
-            document.getElementById('flag_img').src = flagUrlMap[el.value].src;
-            document.getElementById("item_1_cost").innerHTML = flagUrlMap[el.value].item1;
-            document.getElementById("item_2_cost").innerHTML = flagUrlMap[el.value].item2;
-            document.getElementById("total_cost").innerHTML = flagUrlMap[el.value].total;
-            const country = el.value;
-            updateUrl(country)
-        }
-        function updateUrl(country = "NL") {
-            const new_href = `${old_href}?country=${country}`;
-            pay_button.href = new_href
-        }
-    </script>
-
-
-{% endblock %}

app/templates/component.html

@@ -1,9 +1,33 @@
-{% extends "layout.html" %}
-{% block content %}
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
 
-	<meta charset="UTF-8">
-	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-	<meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
+    integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
+    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/application.css') }}" />
+
+    <style>
+      @import url('https://fonts.googleapis.com/css2?family=Oleo+Script:wght@700&display=swap');
+    </style>
+
+    <title>Checkout Create</title>
+  </head>
+  <body>
+    <header id="header">
+      <div class="logo-box">
+      <a href="{{ url_for('checkout') }}">
+        <img
+          class="logo-image"
+          src="{{ url_for('static', filename='img/mystore-logo.svg') }}"
+          alt="BARB logo"
+        />
+      </a>
+      <!--<a class="logo-title">All Things Retro</a>-->
+    </div>
+    </header>
 
 	<!-- Adyen CSS from TEST environment (change to live for production)-->
 	<link rel="stylesheet"
@@ -39,17 +63,14 @@
 			</div>
         </div>
     </div>
-
-
-
 	<!-- Adyen JS from TEST environment (change to live for production)-->
 	<script src="https://checkoutshopper-live.adyen.com/checkoutshopper/sdk/5.15.0/adyen.js"
-     integrity="sha384-vMZOl6V83EY2UXaXsPUxH5Pt5VpyLeHpSFnANBVjcH5l7yZmJO0QBl3s6XbKwjiN"
-     crossorigin="anonymous"></script>
+	integrity="sha384-vMZOl6V83EY2UXaXsPUxH5Pt5VpyLeHpSFnANBVjcH5l7yZmJO0QBl3s6XbKwjiN"
+	crossorigin="anonymous"></script>
 
 	<!-- bootstrap-colorpicker JS -->
 	<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-colorpicker/3.4.0/js/bootstrap-colorpicker.min.js"
-    integrity="sha512-94dgCw8xWrVcgkmOc2fwKjO4dqy/X3q7IjFru6MHJKeaAzCvhkVtOS6S+co+RbcZvvPBngLzuVMApmxkuWZGwQ=="
+	integrity="sha512-94dgCw8xWrVcgkmOc2fwKjO4dqy/X3q7IjFru6MHJKeaAzCvhkVtOS6S+co+RbcZvvPBngLzuVMApmxkuWZGwQ=="
 	crossorigin="anonymous" referrerpolicy="no-referrer"></script> -->
 
 
@@ -59,6 +80,6 @@
 
 	<!-- local JS -->
 	<script src="{{ url_for('static', filename='js/adyen-implementation.js') }}"></script>
+  </body>
+</html>
 
-
-{% endblock %}

app/templates/home.html

@@ -1,137 +0,0 @@
-{% extends "layout.html" %}
-{% block content %}
-    <div class='main-container'>
-        <div class="info">
-            <h1>Ana's test demo</h1>
-        </div>
-        <div>
-            <h3 class="h3 title-container">Implementation via Sessions</h3>
-        </div>
-        <ul class="integration-list">
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="dropin") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">Drop-in</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="card") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">Card</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="ideal") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">iDEAL</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="klarna") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">Klarna</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="directEbanking") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">Sofort</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="alipay") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">Alipay</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="googlepay") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">GooglePay</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="sepadirectdebit") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">SEPA Direct Debit</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="clearpay") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">ClearPay</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="giropay") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">Giropay</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="ach") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">ACH</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="paypal") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">PayPal</p>
-                    </div>
-                </a>
-            </li>
-        </ul>
-        <div>
-            <h3 class="h3 title-container">Advanced Checkout - Non Sessions</h3>
-        </div>
-        <ul class="integration-list">
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="nonsessions") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">Drop-in</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="nonsessionCard") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">Card</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="nonsessionIdeal") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">iDEAL</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="paybylink") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">Pay By Link</p>
-                    </div>
-                </a>
-            </li>
-            <li class="integration-list-item">
-                <a class="integration-list-item-link" href="{{ url_for('cart', integration="amazonpay") }}">
-                    <div class="title-container">
-                        <p class="integration-list-item-title">Amazon Pay</p>
-                    </div>
-                </a>
-            </li>
-        </ul>
-    </div>
-{% endblock %}

app/templates/layout.html

@@ -1,36 +0,0 @@
-<!DOCTYPE html>
-<html lang="en" dir="ltr">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
-
-    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
-    integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
-    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/application.css') }}" />
-
-    <style>
-      @import url('https://fonts.googleapis.com/css2?family=Oleo+Script:wght@700&display=swap');
-    </style>
-
-    <title>Checkout Demo</title>
-  </head>
-  <body>
-    <header id="header">
-      <div class="logo-box">
-      <a href="{{ url_for('home') }}">
-        <img
-          class="logo-image"
-          src="{{ url_for('static', filename='img/mystore-logo.svg') }}"
-          alt="BARB logo"
-        />
-      </a>
-      <!--<a class="logo-title">All Things Retro</a>-->
-    </div>
-    </header>
-
-    <div class="container">
-      {% block content %} {% endblock %}
-    </div>
-  </body>
-</html>

app/templates/sessions-component.html

@@ -1,42 +0,0 @@
-{% extends "layout.html" %}
-{% block content %}
-
-	<meta charset="UTF-8">
-	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-	<meta http-equiv="X-UA-Compatible" content="ie=edge">
-
-	<!-- Adyen CSS from TEST environment (change to live for production)-->
-	<link rel="stylesheet" href="https://checkoutshopper-test.adyen.com/checkoutshopper/sdk/5.4.0/adyen.css"
-		  integrity="sha384-47lm6XSs4AdvQN9BdRTZykpp82IALHlxMtM5p378Nsg3O3nGoBB86N0d7GXgjrA3"
-		  crossorigin="anonymous" />
-
-	<div id="payment-page">
-		<div class="container">
-			<div class="checkout-component-container">
-
-				<div id="component" class="payment">
-					<!-- Component will be rendered here -->
-				</div>
-
-			</div>
-		</div>
-	</div>
-
-	<!-- Adyen JS from TEST environment (change to live for production)-->
-	<script src="https://checkoutshopper-test.adyen.com/checkoutshopper/sdk/5.4.0/adyen.js"
-			integrity="sha384-TrjObe7+xENaI4cONDkap2qTzoJIfTaC79+mJuANZ5Y1IxLMvqpPKcmgl3IrqCk3"
-			crossorigin="anonymous"></script>
-
-	<script id="client-key" type="application/json">{{ client_key|tojson }}</script>
-	<script id="integration-type" type="application/json">{{ method|tojson }}</script>
-	<!--script type="application/javascript">
-		const queryString = window.location.search;
-		console.log(queryString);
-		const urlCountry = new URLSearchParams(queryString);
-		const country = urlCountry.get('country')
-		console.log(country);
-	</script-->
-	<script id="country-code" type="application/json">{{ countryCode|default("GB")|tojson }}</script>
-
-	<script src="{{ url_for('static', filename='js/adyen-implementation.js') }}"></script>
-{% endblock %}