feat: add pagination configuration to runtime settings and update config builder service

Author: danOIntellitect

src/app/models/index.ts

@@ -165,6 +165,15 @@ export interface IHostConfig {
   mode?: HostMode;
 }
 
+/**
+ * Pagination configuration
+ */
+export interface IPaginationConfig {
+  'max-page-size'?: number | null;
+  'default-page-size'?: number | null;
+  'next-link-relative'?: boolean;
+}
+
 /**
  * Telemetry configuration
  */
@@ -183,6 +192,7 @@ export interface IRuntimeConfig {
   graphql?: IGraphQLConfig;
   mcp?: IMcpConfig;
   host?: IHostConfig;
+  pagination?: IPaginationConfig;
   telemetry?: ITelemetryConfig;
 }
 

src/app/pages/config-wizard/tabs/runtime-tab/runtime-tab.component.ts

@@ -251,6 +251,90 @@ import { ConfigBuilderService } from '../../../../services/config-builder.servic
           </div>
         </div>
 
+        <!-- Pagination Configuration -->
+        <div class="col-12 mb-4">
+          <div class="card">
+            <div class="card-header d-flex justify-content-between align-items-center">
+              <h5 class="mb-0">
+                <i class="bi bi-layers me-2"></i>
+                Pagination
+              </h5>
+              <a
+                href="https://learn.microsoft.com/en-us/azure/data-api-builder/configuration/runtime#pagination-runtime"
+                target="_blank"
+                rel="noopener noreferrer"
+                class="btn btn-sm btn-outline-primary"
+              >
+                <i class="bi bi-book me-1"></i>
+                Documentation
+              </a>
+            </div>
+            <div class="card-body">
+              <div class="row">
+                <div class="col-md-4 mb-3">
+                  <label for="maxPageSize" class="form-label">Max Page Size</label>
+                  <input
+                    type="number"
+                    id="maxPageSize"
+                    class="form-control"
+                    [ngModel]="configBuilder.paginationConfig()['max-page-size']"
+                    (ngModelChange)="configBuilder.setPaginationConfig({ 'max-page-size': $event })"
+                    placeholder="100000 (default)"
+                    min="1"
+                  />
+                  <small class="form-text text-muted">
+                    Maximum number of records per page (default: 100,000)
+                  </small>
+                </div>
+                <div class="col-md-4 mb-3">
+                  <label for="defaultPageSize" class="form-label">Default Page Size</label>
+                  <input
+                    type="number"
+                    id="defaultPageSize"
+                    class="form-control"
+                    [ngModel]="configBuilder.paginationConfig()['default-page-size']"
+                    (ngModelChange)="
+                      configBuilder.setPaginationConfig({ 'default-page-size': $event })
+                    "
+                    placeholder="100 (default)"
+                    min="1"
+                  />
+                  <small class="form-text text-muted">
+                    Default number of records returned (default: 100)
+                  </small>
+                </div>
+                <div class="col-md-4 mb-3">
+                  <label class="form-label d-block">Next Link Options</label>
+                  <div class="form-check mt-2">
+                    <input
+                      type="checkbox"
+                      id="nextLinkRelative"
+                      class="form-check-input"
+                      [ngModel]="configBuilder.paginationConfig()['next-link-relative']"
+                      (ngModelChange)="
+                        configBuilder.setPaginationConfig({ 'next-link-relative': $event })
+                      "
+                    />
+                    <label for="nextLinkRelative" class="form-check-label">
+                      Use Relative URLs
+                    </label>
+                  </div>
+                  <small class="form-text text-muted d-block mt-1">
+                    Use relative URLs for pagination links
+                  </small>
+                </div>
+              </div>
+              <div class="alert alert-info mb-0 mt-2">
+                <small>
+                  <strong>Pagination Settings:</strong> Configure default pagination behavior for
+                  REST and GraphQL endpoints. Leave values empty to use defaults (max: 100,000,
+                  default: 100).
+                </small>
+              </div>
+            </div>
+          </div>
+        </div>
+
         <!-- Authentication Configuration -->
         <div class="col-12 mb-4">
           <div class="card">

src/app/services/config-builder.service.ts

@@ -8,6 +8,7 @@ import {
   IGraphQLConfig,
   IHostConfig,
   IMcpConfig,
+  IPaginationConfig,
   IRestConfig,
   IRuntimeConfig,
 } from '../models';
@@ -57,6 +58,12 @@ export class ConfigBuilderService {
     mode: 'development',
   });
 
+  readonly paginationConfig = signal<IPaginationConfig>({
+    'max-page-size': null,
+    'default-page-size': null,
+    'next-link-relative': false,
+  });
+
   // Entities state
   readonly entities = signal<IGeneratedEntity[]>([]);
 
@@ -156,6 +163,13 @@ export class ConfigBuilderService {
     this.hostConfig.update((current) => ({ ...current, ...config }));
   }
 
+  /**
+   * Update Pagination configuration
+   */
+  setPaginationConfig(config: Partial<IPaginationConfig>): void {
+    this.paginationConfig.update((current) => ({ ...current, ...config }));
+  }
+
   /**
    * Toggle preview panel
    */
@@ -186,13 +200,25 @@ export class ConfigBuilderService {
       cleanedHostConfig.authentication = hostConfig.authentication;
     }
 
+    // Build pagination config, only include if values are set
+    const paginationConfig = this.paginationConfig();
+    const hasPaginationConfig =
+      paginationConfig['max-page-size'] !== null ||
+      paginationConfig['default-page-size'] !== null ||
+      paginationConfig['next-link-relative'] === true;
+
     const runtime: IRuntimeConfig = {
       rest: this.restConfig(),
       graphql: this.graphqlConfig(),
       mcp: this.mcpConfig(),
       host: cleanedHostConfig,
     };
 
+    // Only include pagination if configured
+    if (hasPaginationConfig) {
+      runtime.pagination = paginationConfig;
+    }
+
     return {
       $schema:
         'https://github.com/Azure/data-api-builder/releases/latest/download/dab.draft.schema.json',
@@ -327,5 +353,10 @@ export class ConfigBuilderService {
       },
       mode: 'development',
     });
+    this.paginationConfig.set({
+      'max-page-size': null,
+      'default-page-size': null,
+      'next-link-relative': false,
+    });
   }
 }