feat(query-params): add an option to use brackets convention with arrays

Author: qboot

README.md

@@ -71,6 +71,7 @@ Options:
   --clean-output                clean output folder before generate api. WARNING: May cause data loss (default: false)
   --api-class-name <string>     name of the api class
   --patch                       fix up small errors in the swagger source definition (default: false)
+  --query-params-with-brackets  use the `brackets` convention for array in query params: `?a[]=foo&a[]=bar` instead of `repeat` convention: `?a=foo&a=bar`
   -h, --help                    display help for command
 ```
 

index.d.ts

@@ -119,6 +119,12 @@ interface GenerateApiParamsBase {
    * fix up small errors in the swagger source definition
    */
   patch?: boolean;
+
+  /**
+   * use the brackets convention for array in query params: "?a[]=foo&a[]=bar" instead of repeat convention: "?a=foo&a=bar"
+   */
+  queryParamsWithBrackets?: boolean;
+
   /**
    *  authorization token
    */
@@ -350,6 +356,7 @@ export interface GenerateApiConfiguration {
     };
     routeNameDuplicatesMap: Map<string, string>;
     apiClassName: string;
+    queryParamsWithBrackets: boolean;
   };
   modelTypes: ModelType[];
   rawModelTypes: SchemaComponent[];

index.js

@@ -68,6 +68,10 @@ const options = program
   .option("--api-class-name <string>", "name of the api class")
   .option("--patch", "fix up small errors in the swagger source definition", false)
   .option("--debug", "additional information about processes inside this tool", false)
+  .option(
+    "--query-params-with-brackets",
+    'use the brackets convention for array in query params: "?a[]=foo&a[]=bar" instead of repeat convention: "?a=foo&a=bar"',
+  )
   .parse(process.argv)
   .opts();
 
@@ -105,6 +109,7 @@ generateApi({
   typePrefix: options.typePrefix,
   typeSuffix: options.typeSuffix,
   patch: !!options.patch,
+  queryParamsWithBrackets: !!options.queryParamsWithBrackets,
   apiClassName: options.apiClassName,
   debug: options.debug,
 }).catch((err) => {

package.json

@@ -46,7 +46,8 @@
     "test:--cli": "node index.js -p tests/spec/cli/schema.json -o tests/spec/cli -n schema.ts --extract-response-body --extract-response-error --type-prefix Prefix --api-class-name MySuperApi --no-client",
     "test:partialBaseTemplate": "node tests/spec/partialBaseTemplate/test.js",
     "test:partialDefaultTemplate": "node tests/spec/partialDefaultTemplate/test.js",
-    "test:--patch": "node tests/spec/patch/test.js"
+    "test:--patch": "node tests/spec/patch/test.js",
+    "test:--query-params-with-brackets": "node tests/spec/queryParamsWithBrackets/test.js"
   },
   "author": "acacode",
   "license": "MIT",

src/config.js

@@ -90,6 +90,7 @@ const config = {
   typePrefix: "",
   typeSuffix: "",
   patch: false,
+  queryParamsWithBrackets: false,
   componentTypeNameResolver: new NameResolver([]),
   /** name of the main exported class */
   apiClassName: "Api",

src/index.js

@@ -63,6 +63,7 @@ module.exports = {
     typePrefix = config.typePrefix,
     typeSuffix = config.typeSuffix,
     patch = config.patch,
+    queryParamsWithBrackets = config.queryParamsWithBrackets,
     authorizationToken,
     apiClassName = config.apiClassName,
     debug = config.debug,
@@ -101,6 +102,7 @@ module.exports = {
         typePrefix,
         typeSuffix,
         patch,
+        queryParamsWithBrackets,
         apiClassName,
         debug,
       });

templates/base/http-clients/fetch-http-client.ejs

@@ -69,9 +69,9 @@ export class HttpClient<SecurityDataType = unknown> {
         this.securityData = data;
     }
 
-    protected encodeQueryParam(key: string, value: any) {
+    protected encodeQueryParam(key: string, value: any, withBrackets: boolean = false) {
         const encodedKey = encodeURIComponent(key);
-        return `${encodedKey}=${encodeURIComponent(typeof value === "number" ? value : `${value}`)}`;
+        return `${encodedKey}${withBrackets ? '[]' : ''}=${encodeURIComponent(typeof value === "number" ? value : `${value}`)}`;
     }
 
     protected addQueryParam(query: QueryParamsType, key: string) {
@@ -80,7 +80,12 @@ export class HttpClient<SecurityDataType = unknown> {
 
     protected addArrayQueryParam(query: QueryParamsType, key: string) {
         const value = query[key];
+
+<% if (config.queryParamsWithBrackets) { %>
+        return value.map((v: any) => this.encodeQueryParam(key, v, true)).join("&");
+<% } else { %>
         return value.map((v: any) => this.encodeQueryParam(key, v)).join("&");
+<% } %>
     }
 
     protected toQueryString(rawQuery?: QueryParamsType): string {

tests/generated/v2.0/adafruit.ts

@@ -229,9 +229,11 @@ export class HttpClient<SecurityDataType = unknown> {
     this.securityData = data;
   };
 
-  protected encodeQueryParam(key: string, value: any) {
+  protected encodeQueryParam(key: string, value: any, withBrackets: boolean = false) {
     const encodedKey = encodeURIComponent(key);
-    return `${encodedKey}=${encodeURIComponent(typeof value === "number" ? value : `${value}`)}`;
+    return `${encodedKey}${withBrackets ? "[]" : ""}=${encodeURIComponent(
+      typeof value === "number" ? value : `${value}`,
+    )}`;
   }
 
   protected addQueryParam(query: QueryParamsType, key: string) {
@@ -240,6 +242,7 @@ export class HttpClient<SecurityDataType = unknown> {
 
   protected addArrayQueryParam(query: QueryParamsType, key: string) {
     const value = query[key];
+
     return value.map((v: any) => this.encodeQueryParam(key, v)).join("&");
   }
 

tests/generated/v2.0/another-example.ts

@@ -203,9 +203,11 @@ export class HttpClient<SecurityDataType = unknown> {
     this.securityData = data;
   };
 
-  protected encodeQueryParam(key: string, value: any) {
+  protected encodeQueryParam(key: string, value: any, withBrackets: boolean = false) {
     const encodedKey = encodeURIComponent(key);
-    return `${encodedKey}=${encodeURIComponent(typeof value === "number" ? value : `${value}`)}`;
+    return `${encodedKey}${withBrackets ? "[]" : ""}=${encodeURIComponent(
+      typeof value === "number" ? value : `${value}`,
+    )}`;
   }
 
   protected addQueryParam(query: QueryParamsType, key: string) {
@@ -214,6 +216,7 @@ export class HttpClient<SecurityDataType = unknown> {
 
   protected addArrayQueryParam(query: QueryParamsType, key: string) {
     const value = query[key];
+
     return value.map((v: any) => this.encodeQueryParam(key, v)).join("&");
   }
 

tests/generated/v2.0/another-schema.ts

@@ -96,9 +96,11 @@ export class HttpClient<SecurityDataType = unknown> {
     this.securityData = data;
   };
 
-  protected encodeQueryParam(key: string, value: any) {
+  protected encodeQueryParam(key: string, value: any, withBrackets: boolean = false) {
     const encodedKey = encodeURIComponent(key);
-    return `${encodedKey}=${encodeURIComponent(typeof value === "number" ? value : `${value}`)}`;
+    return `${encodedKey}${withBrackets ? "[]" : ""}=${encodeURIComponent(
+      typeof value === "number" ? value : `${value}`,
+    )}`;
   }
 
   protected addQueryParam(query: QueryParamsType, key: string) {
@@ -107,6 +109,7 @@ export class HttpClient<SecurityDataType = unknown> {
 
   protected addArrayQueryParam(query: QueryParamsType, key: string) {
     const value = query[key];
+
     return value.map((v: any) => this.encodeQueryParam(key, v)).join("&");
   }