Merge pull request #345 from rakutentech/feature/curl-fix

(ui) curl command should have backslash

Author: kevincobain2000

ui/src/components/elements/ApiActionInfo.tsx

@@ -28,7 +28,7 @@ export default function ApiActionInfo(props: Props) {
                 <table className="table table-fixed table-compact">
                     <tbody>
                         <tr>
-                            <th>Method</th>
+                            <th className='w-2/6'>Method</th>
                             <td>
                                 <span className={`method-${lrdDocsItem.http_method} uppercase`}>
                                     {lrdDocsItem.http_method}
@@ -37,19 +37,19 @@ export default function ApiActionInfo(props: Props) {
                         </tr>
                         {lrdDocsItem.controller && (
                             <tr>
-                                <th>Controller</th>
+                                <th className='w-2/6'>Controller</th>
                                 <td>{lrdDocsItem.controller}</td>
                             </tr>
                         )}
                         {lrdDocsItem.method && (
                             <tr>
-                                <th>Function</th>
+                                <th className='w-2/6'>Function</th>
                                 <td>{lrdDocsItem.method}</td>
                             </tr>
                         )}
                         {lrdDocsItem.middlewares.length != 0 && (
                             <tr>
-                                <th>Middlewares</th>
+                                <th className='w-2/6'>Middlewares</th>
                                 <td className='no-scrollbar'>
                                     {lrdDocsItem.middlewares.map((middleware) => (
                                         <div key={shortid.generate()}>
@@ -61,7 +61,7 @@ export default function ApiActionInfo(props: Props) {
                             </tr>
                         )}
                         <tr>
-                            <th>
+                            <th className='w-2/6'>
                                 Status Codes
                             </th>
                             <td>
@@ -84,7 +84,7 @@ export default function ApiActionInfo(props: Props) {
                             </td>
                         </tr>
                         <tr>
-                            <th>
+                            <th className='w-2/6'>
                                 <CodeBracketIcon className='inline-block w-4 h-4 mr-1' />
                                 Curl
                             </th>

ui/src/global.css

@@ -121,7 +121,7 @@ h2[id] {
     @apply bg-success;
 }
 
-.badge-422,.badge-429, {
+.badge-422,.badge-429 {
     @apply bg-warning;
 }
 .badge-400,.badge-401,.badge-402,.badge-403,.badge-404,.badge-405 {

ui/src/libs/strings.tsx

@@ -8,33 +8,39 @@ export const explode = (str: string, maxLength: number, by: string) => {
     return buff;
 }
 
-export const makeCurlCommand = (host:string, url: string, method: string, queries: string, headers: any): string => {
+export const makeCurlCommand = (host: string, url: string, method: string, queries: string, headers: any): string => {
 
-    let curl = `curl`
-    curl += `\n -X ${method}`
+    let curl = `curl \\`
+    curl += `\n -X ${method} \\`
     try {
         const jsonRequestHeaders = JSON.parse(headers)
         for (const [key, value] of Object.entries(jsonRequestHeaders)) {
-            curl += `\n -H "${key}: ${value}"`
+            curl += `\n -H "${key}: ${value}" \\`
         }
     } catch (error: any) {
-        curl += `\n -H "Content-Type: application/json"`
+        curl += `\n -H "Content-Type: application/json" \\`
     }
     const get = (queries: string) => {
-        curl += `\n ${host}/${url}`
-        curl += `\n${queries}`
+        curl += `\n ${host}/${url} \\`
+        curl += `\n${queries} \\`
         return curl
     }
     const post = (jsonBody: string) => {
-        curl += `\n ${host}/${url}`
-        curl += `\n -d '${jsonBody}'`
+        curl += `\n ${host}/${url} \\`
+        curl += `\n -d '${jsonBody}' \\`
         return curl
     }
     if (method === "GET" || method === "DELETE" || method === "HEAD") {
-        return get(queries)
+        return removeLast(get(queries), "\\")
     }
     if (method === "POST" || method === "PUT" || method === "PATCH") {
-        return post(queries)
+        return removeLast(post(queries), "\\")
     }
     return ""
 }
+
+
+export const removeLast = (s: string, r: string) => {
+    const ss = s.split(r)
+    return ss.slice(0,-1).join(r) + ss.pop()
+}