From 3d9a39ac3bbad64e65066367f98b2088b8aac540 Mon Sep 17 00:00:00 2001
From: Hoan Luu Huu <110280845+xquanluu@users.noreply.github.com>
Date: Thu, 11 May 2023 03:05:57 +0700
Subject: [PATCH] fix: add/edit lcr should have secondary text to explain the
 purpose of lcr (#247)

---
 src/containers/internal/views/least-cost-routing/add.tsx  | 8 +++++++-
 src/containers/internal/views/least-cost-routing/edit.tsx | 8 +++++++-
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/containers/internal/views/least-cost-routing/add.tsx b/src/containers/internal/views/least-cost-routing/add.tsx
index 6e45494..37f36fb 100644
--- a/src/containers/internal/views/least-cost-routing/add.tsx
+++ b/src/containers/internal/views/least-cost-routing/add.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import { H1 } from "@jambonz/ui-kit";
+import { H1, M } from "@jambonz/ui-kit";
 
 import { LcrForm } from "./form";
 
@@ -7,6 +7,12 @@ export const AddLcr = () => {
   return (
     <>
       <H1 className="h2">Add outbound call routes</H1>
+      <section>
+        <M>
+          Outbound call routing is used to select a carrier when there are
+          multiple carriers available.
+        </M>
+      </section>
       <LcrForm />
     </>
   );
diff --git a/src/containers/internal/views/least-cost-routing/edit.tsx b/src/containers/internal/views/least-cost-routing/edit.tsx
index 1e29f12..bc2547c 100644
--- a/src/containers/internal/views/least-cost-routing/edit.tsx
+++ b/src/containers/internal/views/least-cost-routing/edit.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import { H1 } from "@jambonz/ui-kit";
+import { H1, M } from "@jambonz/ui-kit";
 import LcrForm from "./form";
 import { useApiData } from "src/api";
 import { Lcr, LcrRoute } from "src/api/types";
@@ -15,6 +15,12 @@ export const EditLcr = () => {
   return (
     <>
       <H1 className="h2">Edit outbound call routes</H1>
+      <section>
+        <M>
+          Outbound call routing is used to select a carrier when there are
+          multiple carriers available.
+        </M>
+      </section>
       <LcrForm
         lcrDataMap={{ data: lcrData, refetch: lcrRefect, error: lcrError }}
         lcrRouteDataMap={{