update cancel subscription page

Author: AxeemHaider

layouts/page/cancel-subscription.html

@@ -44,15 +44,27 @@ <h2 class="text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">
 
       function onFormSubmit() {
         if (cancel_subscription_form_submitted) {
-          window.location = "https://octabyte.io";
+          const message = document.getElementById("message");
+          const submitBtn = document.getElementById("submit-btn");
+
+          submitBtn.style.display = "none";
+          message.style.display = "block";
+
+          setTimeout(() => {
+            window.location = "https://octabyte.io";
+          }, 3000);
         }
       }
 
       function submitForm(e) {
         const errorMessage = document.getElementById("error-message");
         const serviceInput = document.getElementById("service-name");
 
-        if (serviceInput.value.trim() != serviceName) {
+        errorMessage.style.display = "none";
+
+        if (
+          serviceInput.value.trim().toLowerCase() != serviceName.toLowerCase()
+        ) {
           errorMessage.style.display = "block";
           e.preventDefault();
         }
@@ -99,7 +111,11 @@ <h2 class="text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">
 
       <div class="mt-10">
         <p id="error-message" class="mt-2 text-sm text-red-500 hidden">
-          Please enter a valid service name.
+          Please enter a same service name to confirm.
+        </p>
+        <p id="message" class="mt-2 text-sm text-green-700">
+          Your request to cancel the subscription has been successfully sent.
+          Redirecting to octabyte.io...
         </p>
         <button
           onclick="submitForm(event)"