feat: ui update

fix: make ui good
chore: self review change
2026-06-16 13:30:36 +01:00 · 2026-06-16 13:36:43 +05:30 · 2026-06-16 12:20:24 +05:30 · 2026-06-16 11:43:41 +05:30 · 2026-06-16 11:37:01 +05:30 · 2026-06-16 10:55:42 +05:30
176 changed files with 17308 additions and 26413 deletions
--- a/docs/api/openapi.yml
+++ b/docs/api/openapi.yml
@@ -1364,14 +1364,6 @@ components:
      - appservice
      - containerapp
      - aks
-      - sqldatabase
-      - sqldatabasemi
-      - mysqlflexibleserver
-      - postgresqlflexibleserver
-      - mongodb
-      - cosmosdb
-      - cassandradb
-      - redis
      type: string
    CloudintegrationtypesServiceMetadata:
      properties:
@@ -2504,10 +2496,17 @@ components:
          $ref: '#/components/schemas/DashboardtypesTimePreference'
      type: object
    DashboardtypesBuilderQuerySpec:
+      discriminator:
+        mapping:
+          logs: '#/components/schemas/Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5LogAggregation'
+          metrics: '#/components/schemas/Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5MetricAggregation'
+          traces: '#/components/schemas/Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5TraceAggregation'
+        propertyName: signal
      oneOf:
      - $ref: '#/components/schemas/Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5LogAggregation'
      - $ref: '#/components/schemas/Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5MetricAggregation'
      - $ref: '#/components/schemas/Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5TraceAggregation'
+      type: object
    DashboardtypesComparisonOperator:
      enum:
      - above
@@ -2596,8 +2595,13 @@ components:
          type: array
      type: object
    DashboardtypesDatasourcePlugin:
+      discriminator:
+        mapping:
+          signoz/Datasource: '#/components/schemas/DashboardtypesDatasourcePluginVariantStruct'
+        propertyName: kind
      oneOf:
      - $ref: '#/components/schemas/DashboardtypesDatasourcePluginVariantStruct'
+      type: object
    DashboardtypesDatasourcePluginKind:
      enum:
      - signoz/Datasource
@@ -2664,7 +2668,7 @@ components:
          $ref: '#/components/schemas/DashboardtypesDashboardSpec'
        tags:
          items:
-            $ref: '#/components/schemas/TagtypesPostableTag'
+            $ref: '#/components/schemas/TagtypesGettableTag'
          nullable: true
          type: array
        updatedAt:
@@ -2741,8 +2745,13 @@ components:
      - path
      type: object
    DashboardtypesLayout:
+      discriminator:
+        mapping:
+          Grid: '#/components/schemas/DashboardtypesLayoutEnvelopeGithubComPersesSpecGoDashboardGridLayoutSpec'
+        propertyName: kind
      oneOf:
      - $ref: '#/components/schemas/DashboardtypesLayoutEnvelopeGithubComPersesSpecGoDashboardGridLayoutSpec'
+      type: object
    DashboardtypesLayoutEnvelopeGithubComPersesSpecGoDashboardGridLayoutSpec:
      properties:
        kind:
@@ -2782,6 +2791,11 @@ components:
      - solid
      - dashed
      type: string
+    DashboardtypesListOrder:
+      enum:
+      - asc
+      - desc
+      type: string
    DashboardtypesListPanelSpec:
      properties:
        selectFields:
@@ -2789,6 +2803,12 @@ components:
            $ref: '#/components/schemas/TelemetrytypesTelemetryFieldKey'
          type: array
      type: object
+    DashboardtypesListSort:
+      enum:
+      - updated_at
+      - created_at
+      - name
+      type: string
    DashboardtypesListVariableSpec:
      properties:
        allowAllValue:
@@ -2811,6 +2831,134 @@ components:
          nullable: true
          type: string
      type: object
+    DashboardtypesListableDashboardForUserV2:
+      properties:
+        dashboards:
+          items:
+            $ref: '#/components/schemas/DashboardtypesListedDashboardForUserV2'
+          type: array
+        tags:
+          items:
+            $ref: '#/components/schemas/TagtypesGettableTag'
+          type: array
+        total:
+          format: int64
+          type: integer
+      required:
+      - dashboards
+      - total
+      - tags
+      type: object
+    DashboardtypesListableDashboardV2:
+      properties:
+        dashboards:
+          items:
+            $ref: '#/components/schemas/DashboardtypesListedDashboardV2'
+          type: array
+        tags:
+          items:
+            $ref: '#/components/schemas/TagtypesGettableTag'
+          type: array
+        total:
+          format: int64
+          type: integer
+      required:
+      - dashboards
+      - total
+      - tags
+      type: object
+    DashboardtypesListedDashboardForUserV2:
+      properties:
+        createdAt:
+          format: date-time
+          type: string
+        createdBy:
+          type: string
+        id:
+          type: string
+        image:
+          type: string
+        locked:
+          type: boolean
+        name:
+          type: string
+        orgId:
+          type: string
+        pinned:
+          type: boolean
+        schemaVersion:
+          type: string
+        source:
+          $ref: '#/components/schemas/DashboardtypesSource'
+        spec:
+          $ref: '#/components/schemas/DashboardtypesListedDashboardV2Spec'
+        tags:
+          items:
+            $ref: '#/components/schemas/TagtypesGettableTag'
+          type: array
+        updatedAt:
+          format: date-time
+          type: string
+        updatedBy:
+          type: string
+      required:
+      - id
+      - orgId
+      - locked
+      - source
+      - schemaVersion
+      - name
+      - tags
+      - spec
+      - pinned
+      type: object
+    DashboardtypesListedDashboardV2:
+      properties:
+        createdAt:
+          format: date-time
+          type: string
+        createdBy:
+          type: string
+        id:
+          type: string
+        image:
+          type: string
+        locked:
+          type: boolean
+        name:
+          type: string
+        orgId:
+          type: string
+        schemaVersion:
+          type: string
+        source:
+          $ref: '#/components/schemas/DashboardtypesSource'
+        spec:
+          $ref: '#/components/schemas/DashboardtypesListedDashboardV2Spec'
+        tags:
+          items:
+            $ref: '#/components/schemas/TagtypesGettableTag'
+          type: array
+        updatedAt:
+          format: date-time
+          type: string
+        updatedBy:
+          type: string
+      required:
+      - id
+      - orgId
+      - locked
+      - source
+      - schemaVersion
+      - name
+      - tags
+      - spec
+      type: object
+    DashboardtypesListedDashboardV2Spec:
+      properties:
+        display:
+          $ref: '#/components/schemas/CommonDisplay'
+      type: object
    DashboardtypesNumberPanelSpec:
      properties:
        formatting:
@@ -2842,6 +2990,16 @@ components:
      - Panel
      type: string
    DashboardtypesPanelPlugin:
+      discriminator:
+        mapping:
+          signoz/BarChartPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesBarChartPanelSpec'
+          signoz/HistogramPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHistogramPanelSpec'
+          signoz/ListPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesListPanelSpec'
+          signoz/NumberPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesNumberPanelSpec'
+          signoz/PieChartPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesPieChartPanelSpec'
+          signoz/TablePanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTablePanelSpec'
+          signoz/TimeSeriesPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTimeSeriesPanelSpec'
+        propertyName: kind
      oneOf:
      - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTimeSeriesPanelSpec'
      - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesBarChartPanelSpec'
@@ -2850,6 +3008,7 @@ components:
      - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTablePanelSpec'
      - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHistogramPanelSpec'
      - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesListPanelSpec'
+      type: object
    DashboardtypesPanelPluginKind:
      enum:
      - signoz/TimeSeriesPanel
@@ -3028,6 +3187,15 @@ components:
          $ref: '#/components/schemas/DashboardtypesQuerySpec'
      type: object
    DashboardtypesQueryPlugin:
+      discriminator:
+        mapping:
+          signoz/BuilderQuery: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesBuilderQuerySpec'
+          signoz/ClickHouseSQL: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5ClickHouseQuery'
+          signoz/CompositeQuery: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5CompositeQuery'
+          signoz/Formula: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5QueryBuilderFormula'
+          signoz/PromQLQuery: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5PromQuery'
+          signoz/TraceOperator: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5QueryBuilderTraceOperator'
+        propertyName: kind
      oneOf:
      - $ref: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesBuilderQuerySpec'
      - $ref: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5CompositeQuery'
@@ -3035,6 +3203,7 @@ components:
      - $ref: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5PromQuery'
      - $ref: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5ClickHouseQuery'
      - $ref: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5QueryBuilderTraceOperator'
+      type: object
    DashboardtypesQueryPluginKind:
      enum:
      - signoz/BuilderQuery
@@ -3289,9 +3458,15 @@ components:
          type: boolean
      type: object
    DashboardtypesVariable:
+      discriminator:
+        mapping:
+          ListVariable: '#/components/schemas/DashboardtypesVariableEnvelopeGithubComSigNozSignozPkgTypesDashboardtypesListVariableSpec'
+          TextVariable: '#/components/schemas/DashboardtypesVariableEnvelopeGithubComPersesSpecGoDashboardTextVariableSpec'
+        propertyName: kind
      oneOf:
      - $ref: '#/components/schemas/DashboardtypesVariableEnvelopeGithubComSigNozSignozPkgTypesDashboardtypesListVariableSpec'
      - $ref: '#/components/schemas/DashboardtypesVariableEnvelopeGithubComPersesSpecGoDashboardTextVariableSpec'
+      type: object
    DashboardtypesVariableEnvelopeGithubComPersesSpecGoDashboardTextVariableSpec:
      properties:
        kind:
@@ -3317,10 +3492,17 @@ components:
      - spec
      type: object
    DashboardtypesVariablePlugin:
+      discriminator:
+        mapping:
+          signoz/CustomVariable: '#/components/schemas/DashboardtypesVariablePluginVariantGithubComSigNozSignozPkgTypesDashboardtypesCustomVariableSpec'
+          signoz/DynamicVariable: '#/components/schemas/DashboardtypesVariablePluginVariantGithubComSigNozSignozPkgTypesDashboardtypesDynamicVariableSpec'
+          signoz/QueryVariable: '#/components/schemas/DashboardtypesVariablePluginVariantGithubComSigNozSignozPkgTypesDashboardtypesQueryVariableSpec'
+        propertyName: kind
      oneOf:
      - $ref: '#/components/schemas/DashboardtypesVariablePluginVariantGithubComSigNozSignozPkgTypesDashboardtypesDynamicVariableSpec'
      - $ref: '#/components/schemas/DashboardtypesVariablePluginVariantGithubComSigNozSignozPkgTypesDashboardtypesQueryVariableSpec'
      - $ref: '#/components/schemas/DashboardtypesVariablePluginVariantGithubComSigNozSignozPkgTypesDashboardtypesCustomVariableSpec'
+      type: object
    DashboardtypesVariablePluginKind:
      enum:
      - signoz/DynamicVariable
@@ -5523,11 +5705,15 @@ components:
            $ref: '#/components/schemas/TelemetrytypesTelemetryFieldKey'
          type: array
        signal:
-          $ref: '#/components/schemas/TelemetrytypesSignal'
+          enum:
+          - logs
+          type: string
        source:
          $ref: '#/components/schemas/TelemetrytypesSource'
        stepInterval:
          $ref: '#/components/schemas/Querybuildertypesv5Step'
+      required:
+      - signal
      type: object
    Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5MetricAggregation:
      properties:
@@ -5574,11 +5760,15 @@ components:
            $ref: '#/components/schemas/TelemetrytypesTelemetryFieldKey'
          type: array
        signal:
-          $ref: '#/components/schemas/TelemetrytypesSignal'
+          enum:
+          - metrics
+          type: string
        source:
          $ref: '#/components/schemas/TelemetrytypesSource'
        stepInterval:
          $ref: '#/components/schemas/Querybuildertypesv5Step'
+      required:
+      - signal
      type: object
    Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5TraceAggregation:
      properties:
@@ -5625,11 +5815,15 @@ components:
            $ref: '#/components/schemas/TelemetrytypesTelemetryFieldKey'
          type: array
        signal:
-          $ref: '#/components/schemas/TelemetrytypesSignal'
+          enum:
+          - traces
+          type: string
        source:
          $ref: '#/components/schemas/TelemetrytypesSource'
        stepInterval:
          $ref: '#/components/schemas/Querybuildertypesv5Step'
+      required:
+      - signal
      type: object
    Querybuildertypesv5QueryBuilderTraceOperator:
      properties:
@@ -7070,6 +7264,16 @@ components:
      required:
      - references
      type: object
+    TagtypesGettableTag:
+      properties:
+        key:
+          type: string
+        value:
+          type: string
+      required:
+      - key
+      - value
+      type: object
    TagtypesPostableTag:
      properties:
        key:
@@ -13105,6 +13309,82 @@ paths:
      tags:
      - preferences
  /api/v2/dashboards:
+    get:
+      deprecated: false
+      description: Returns a page of v2-shape dashboards for the org. This is the
+        pure, user-independent list — it carries no pin state. Use ListDashboardsForUserV2
+        for the personalized, pin-aware list. Supports a filter DSL (`query`), sort
+        (`updated_at`/`created_at`/`name`), order (`asc`/`desc`), and offset-based
+        pagination (`limit`/`offset`).
+      operationId: ListDashboardsV2
+      parameters:
+      - in: query
+        name: query
+        schema:
+          type: string
+      - in: query
+        name: sort
+        schema:
+          $ref: '#/components/schemas/DashboardtypesListSort'
+      - in: query
+        name: order
+        schema:
+          $ref: '#/components/schemas/DashboardtypesListOrder'
+      - in: query
+        name: limit
+        schema:
+          type: integer
+      - in: query
+        name: offset
+        schema:
+          type: integer
+      responses:
+        "200":
+          content:
+            application/json:
+              schema:
+                properties:
+                  data:
+                    $ref: '#/components/schemas/DashboardtypesListableDashboardV2'
+                  status:
+                    type: string
+                required:
+                - status
+                - data
+                type: object
+          description: OK
+        "400":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Bad Request
+        "401":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Unauthorized
+        "403":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Forbidden
+        "500":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Internal Server Error
+      security:
+      - api_key:
+        - VIEWER
+      - tokenizer:
+        - VIEWER
+      summary: List dashboards (v2)
+      tags:
+      - dashboard
    post:
      deprecated: false
      description: This endpoint creates a dashboard in the v2 format that follows
@@ -13163,6 +13443,62 @@ paths:
      tags:
      - dashboard
  /api/v2/dashboards/{id}:
+    delete:
+      deprecated: false
+      description: This endpoint deletes a v2-shape dashboard along with its tag relations.
+        Locked dashboards are rejected.
+      operationId: DeleteDashboardV2
+      parameters:
+      - in: path
+        name: id
+        required: true
+        schema:
+          type: string
+      responses:
+        "204":
+          content:
+            application/json:
+              schema:
+                type: string
+          description: No Content
+        "400":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Bad Request
+        "401":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Unauthorized
+        "403":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Forbidden
+        "404":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Not Found
+        "500":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Internal Server Error
+      security:
+      - api_key:
+        - EDITOR
+      - tokenizer:
+        - EDITOR
+      summary: Delete dashboard (v2)
+      tags:
+      - dashboard
    get:
      deprecated: false
      description: This endpoint returns a v2-shape dashboard.
@@ -20385,6 +20721,196 @@ paths:
      summary: Update my user v2
      tags:
      - users
+  /api/v2/users/me/dashboards:
+    get:
+      deprecated: false
+      description: 'Same as ListDashboardsV2 but personalized for the calling user:
+        each dashboard carries the caller''s `pinned` state, and pinned dashboards
+        float to the top of the requested ordering. Supports the same filter DSL,
+        sort, order, and pagination.'
+      operationId: ListDashboardsForUserV2
+      parameters:
+      - in: query
+        name: query
+        schema:
+          type: string
+      - in: query
+        name: sort
+        schema:
+          $ref: '#/components/schemas/DashboardtypesListSort'
+      - in: query
+        name: order
+        schema:
+          $ref: '#/components/schemas/DashboardtypesListOrder'
+      - in: query
+        name: limit
+        schema:
+          type: integer
+      - in: query
+        name: offset
+        schema:
+          type: integer
+      responses:
+        "200":
+          content:
+            application/json:
+              schema:
+                properties:
+                  data:
+                    $ref: '#/components/schemas/DashboardtypesListableDashboardForUserV2'
+                  status:
+                    type: string
+                required:
+                - status
+                - data
+                type: object
+          description: OK
+        "400":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Bad Request
+        "401":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Unauthorized
+        "403":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Forbidden
+        "500":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Internal Server Error
+      security:
+      - api_key:
+        - VIEWER
+      - tokenizer:
+        - VIEWER
+      summary: List dashboards for the current user (v2)
+      tags:
+      - dashboard
+  /api/v2/users/me/dashboards/{id}/pins:
+    delete:
+      deprecated: false
+      description: Removes the pin for the calling user. Idempotent — unpinning a
+        dashboard that wasn't pinned still returns 204.
+      operationId: UnpinDashboardV2
+      parameters:
+      - in: path
+        name: id
+        required: true
+        schema:
+          type: string
+      responses:
+        "204":
+          content:
+            application/json:
+              schema:
+                type: string
+          description: No Content
+        "400":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Bad Request
+        "401":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Unauthorized
+        "403":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Forbidden
+        "500":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Internal Server Error
+      security:
+      - api_key:
+        - VIEWER
+      - tokenizer:
+        - VIEWER
+      summary: Unpin a dashboard for the current user (v2)
+      tags:
+      - dashboard
+    put:
+      deprecated: false
+      description: Pins the dashboard for the calling user. A user can pin at most
+        10 dashboards; pinning when at the limit returns 409. Re-pinning an already-pinned
+        dashboard is a no-op success.
+      operationId: PinDashboardV2
+      parameters:
+      - in: path
+        name: id
+        required: true
+        schema:
+          type: string
+      responses:
+        "204":
+          content:
+            application/json:
+              schema:
+                type: string
+          description: No Content
+        "400":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Bad Request
+        "401":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Unauthorized
+        "403":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Forbidden
+        "404":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Not Found
+        "409":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Conflict
+        "500":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Internal Server Error
+      security:
+      - api_key:
+        - VIEWER
+      - tokenizer:
+        - VIEWER
+      summary: Pin a dashboard for the current user (v2)
+      tags:
+      - dashboard
  /api/v2/users/me/factor_password:
    put:
      deprecated: false
--- a/docs/contributing/go/handler.md
+++ b/docs/contributing/go/handler.md
@@ -333,6 +333,50 @@ func (Step) JSONSchema() (jsonschema.Schema, error) {
 }
 ```

+### `oneOf` with a discriminator
+
+For a sum type whose variants are keyed by a property (e.g. `kind`), expose the variants via `JSONSchemaOneOf()` and add a discriminator. Without it, code generators intersect the variants (`A & B & C`) instead of producing a clean discriminated union (`A | B | C`).
+
+The parent keeps its `JSONSchemaOneOf()` (the `oneOf` itself) and *additionally* tags it via `PrepareJSONSchema` with the `x-signoz-discriminator` extension; `signoz.attachDiscriminators` then promotes that marker to a real OpenAPI 3 `discriminator` (and strips the duplicate parent properties) after reflection.
+
+```go
+// On the parent: expose the oneOf variants...
+func (Plugin) JSONSchemaOneOf() []any {
+    return []any{FooVariant{}}
+}
+
+// ...and tag that same oneOf with the discriminator marker.
+func (Plugin) PrepareJSONSchema(s *jsonschema.Schema) error {
+    if s.ExtraProperties == nil {
+        s.ExtraProperties = map[string]any{}
+    }
+    s.ExtraProperties["x-signoz-discriminator"] = map[string]any{
+        "propertyName": "kind",
+        "mapping": map[string]string{
+            "signoz/Foo": "#/components/schemas/FooVariant",
+        },
+    }
+    return nil
+}
+```
+
+Each variant must declare the discriminator property (`kind`) and mark it `required`. 
+
+This produces the following in the generated OpenAPI spec:
+
+```yaml
+Plugin:
+  discriminator:
+    propertyName: kind
+    mapping:
+      signoz/Foo: '#/components/schemas/FooVariant'
+  oneOf:
+  - $ref: '#/components/schemas/FooVariant'
+  type: object
+```
+
+Note the discriminator property lives in the variants, not on the parent — the parent is only the union.
+

 ## What should I remember?

--- a/ee/modules/dashboard/impldashboard/module.go
+++ b/ee/modules/dashboard/impldashboard/module.go
@@ -229,10 +229,39 @@ func (module *module) PatchV2(ctx context.Context, orgID valuer.UUID, id valuer.
 	return module.pkgDashboardModule.PatchV2(ctx, orgID, id, updatedBy, patch)
 }

+func (module *module) DeleteV2(ctx context.Context, orgID valuer.UUID, id valuer.UUID) error {
+	return module.store.RunInTx(ctx, func(ctx context.Context) error {
+		if err := module.store.DeletePublic(ctx, id.String()); err != nil && !errors.Ast(err, errors.TypeNotFound) {
+			return err
+		}
+		return module.pkgDashboardModule.DeleteV2(ctx, orgID, id)
+	})
+}
+
 func (module *module) LockUnlockV2(ctx context.Context, orgID valuer.UUID, id valuer.UUID, updatedBy string, isAdmin bool, lock bool) error {
 	return module.pkgDashboardModule.LockUnlockV2(ctx, orgID, id, updatedBy, isAdmin, lock)
 }

+func (module *module) ListV2(ctx context.Context, orgID valuer.UUID, params *dashboardtypes.ListDashboardsV2Params) (*dashboardtypes.ListableDashboardV2, error) {
+	return module.pkgDashboardModule.ListV2(ctx, orgID, params)
+}
+
+func (module *module) ListForUserV2(ctx context.Context, orgID valuer.UUID, userID valuer.UUID, params *dashboardtypes.ListDashboardsV2Params) (*dashboardtypes.ListableDashboardForUserV2, error) {
+	return module.pkgDashboardModule.ListForUserV2(ctx, orgID, userID, params)
+}
+
+func (module *module) PinV2(ctx context.Context, orgID valuer.UUID, userID valuer.UUID, id valuer.UUID) error {
+	return module.pkgDashboardModule.PinV2(ctx, orgID, userID, id)
+}
+
+func (module *module) UnpinV2(ctx context.Context, userID valuer.UUID, id valuer.UUID) error {
+	return module.pkgDashboardModule.UnpinV2(ctx, userID, id)
+}
+
+func (module *module) DeletePreferencesForUser(ctx context.Context, userID valuer.UUID) error {
+	return module.pkgDashboardModule.DeletePreferencesForUser(ctx, userID)
+}
+
 func (module *module) Get(ctx context.Context, orgID valuer.UUID, id valuer.UUID) (*dashboardtypes.Dashboard, error) {
 	return module.pkgDashboardModule.Get(ctx, orgID, id)
 }
--- a/ee/sqlstore/postgressqlstore/formatter.go
+++ b/ee/sqlstore/postgressqlstore/formatter.go
@@ -16,10 +16,11 @@ func newFormatter(dialect schema.Dialect) sqlstore.SQLFormatter {
 }

 func (f *formatter) JSONExtractString(column, path string) []byte {
-	var sql []byte
-	sql = f.bunf.AppendIdent(sql, column)
-	sql = append(sql, f.convertJSONPathToPostgres(path)...)
-	return sql
+	ops := f.convertJSONPathToPostgres(path)
+	if len(ops) == 0 {
+		return f.bunf.AppendIdent(nil, column)
+	}
+	return append(f.TextToJsonColumn(column), ops...)
 }

 func (f *formatter) JSONType(column, path string) []byte {
--- a/ee/sqlstore/postgressqlstore/formatter_test.go
+++ b/ee/sqlstore/postgressqlstore/formatter_test.go
@@ -18,19 +18,19 @@ func TestJSONExtractString(t *testing.T) {
 			name:     "simple path",
 			column:   "data",
 			path:     "$.field",
-			expected: `"data"->>'field'`,
+			expected: `"data"::jsonb->>'field'`,
 		},
 		{
 			name:     "nested path",
 			column:   "metadata",
 			path:     "$.user.name",
-			expected: `"metadata"->'user'->>'name'`,
+			expected: `"metadata"::jsonb->'user'->>'name'`,
 		},
 		{
 			name:     "deeply nested path",
 			column:   "json_col",
 			path:     "$.level1.level2.level3",
-			expected: `"json_col"->'level1'->'level2'->>'level3'`,
+			expected: `"json_col"::jsonb->'level1'->'level2'->>'level3'`,
 		},
 		{
 			name:     "root path",
--- a/frontend/src/AppRoutes/pageComponents.ts
+++ b/frontend/src/AppRoutes/pageComponents.ts
@@ -323,3 +323,17 @@ export const AIAssistantPage = Loadable(
 			/* webpackChunkName: "AI Assistant Page" */ 'pages/AIAssistantPage/AIAssistantPage'
 		),
 );
+
+export const LLMObservabilityModelPricingPage = Loadable(
+	() =>
+		import(
+			/* webpackChunkName: "LLM Observability Model Pricing Page" */ 'pages/LLMObservabilityModelPricing'
+		),
+);
+
+export const LLMObservabilityAttributeMappingPage = Loadable(
+	() =>
+		import(
+			/* webpackChunkName: "LLM Observability Attribute Mapping Page" */ 'pages/LLMObservabilityAttributeMapping'
+		),
+);
--- a/frontend/src/AppRoutes/routes.ts
+++ b/frontend/src/AppRoutes/routes.ts
@@ -22,6 +22,8 @@ import {
 	IntegrationsDetailsPage,
 	LicensePage,
 	ListAllALertsPage,
+	LLMObservabilityAttributeMappingPage,
+	LLMObservabilityModelPricingPage,
 	LiveLogs,
 	Login,
 	Logs,
@@ -507,6 +509,20 @@ const routes: AppRoutes[] = [
 		key: 'AI_ASSISTANT',
 		isPrivate: true,
 	},
+	{
+		path: ROUTES.LLM_OBSERVABILITY_MODEL_PRICING,
+		exact: true,
+		component: LLMObservabilityModelPricingPage,
+		key: 'LLM_OBSERVABILITY_MODEL_PRICING',
+		isPrivate: true,
+	},
+	{
+		path: ROUTES.LLM_OBSERVABILITY_ATTRIBUTE_MAPPING,
+		exact: true,
+		component: LLMObservabilityAttributeMappingPage,
+		key: 'LLM_OBSERVABILITY_ATTRIBUTE_MAPPING',
+		isPrivate: true,
+	},
 ];

 export const SUPPORT_ROUTE: AppRoutes = {
--- a/frontend/src/api/generated/services/dashboard/index.ts
+++ b/frontend/src/api/generated/services/dashboard/index.ts
@@ -26,6 +26,7 @@ import type {
 	DashboardtypesPostablePublicDashboardDTO,
 	DashboardtypesUpdatableDashboardV2DTO,
 	DashboardtypesUpdatablePublicDashboardDTO,
+	DeleteDashboardV2PathParameters,
 	DeletePublicDashboardPathParameters,
 	GetDashboardV2200,
 	GetDashboardV2PathParameters,
@@ -35,11 +36,17 @@ import type {
 	GetPublicDashboardPathParameters,
 	GetPublicDashboardWidgetQueryRange200,
 	GetPublicDashboardWidgetQueryRangePathParameters,
+	ListDashboardsForUserV2200,
+	ListDashboardsForUserV2Params,
+	ListDashboardsV2200,
+	ListDashboardsV2Params,
 	LockDashboardV2PathParameters,
 	PatchDashboardV2200,
 	PatchDashboardV2PathParameters,
+	PinDashboardV2PathParameters,
 	RenderErrorResponseDTO,
 	UnlockDashboardV2PathParameters,
+	UnpinDashboardV2PathParameters,
 	UpdateDashboardV2200,
 	UpdateDashboardV2PathParameters,
 	UpdatePublicDashboardPathParameters,
@@ -641,6 +648,103 @@ export const invalidateGetPublicDashboardWidgetQueryRange = async (
 	return queryClient;
 };

+/**
+ * Returns a page of v2-shape dashboards for the org. This is the pure, user-independent list — it carries no pin state. Use ListDashboardsForUserV2 for the personalized, pin-aware list. Supports a filter DSL (`query`), sort (`updated_at`/`created_at`/`name`), order (`asc`/`desc`), and offset-based pagination (`limit`/`offset`).
+ * @summary List dashboards (v2)
+ */
+export const listDashboardsV2 = (
+	params?: ListDashboardsV2Params,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<ListDashboardsV2200>({
+		url: `/api/v2/dashboards`,
+		method: 'GET',
+		params,
+		signal,
+	});
+};
+
+export const getListDashboardsV2QueryKey = (
+	params?: ListDashboardsV2Params,
+) => {
+	return [`/api/v2/dashboards`, ...(params ? [params] : [])] as const;
+};
+
+export const getListDashboardsV2QueryOptions = <
+	TData = Awaited<ReturnType<typeof listDashboardsV2>>,
+	TError = ErrorType<RenderErrorResponseDTO>,
+>(
+	params?: ListDashboardsV2Params,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof listDashboardsV2>>,
+			TError,
+			TData
+		>;
+	},
+) => {
+	const { query: queryOptions } = options ?? {};
+
+	const queryKey = queryOptions?.queryKey ?? getListDashboardsV2QueryKey(params);
+
+	const queryFn: QueryFunction<Awaited<ReturnType<typeof listDashboardsV2>>> = ({
+		signal,
+	}) => listDashboardsV2(params, signal);
+
+	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
+		Awaited<ReturnType<typeof listDashboardsV2>>,
+		TError,
+		TData
+	> & { queryKey: QueryKey };
+};
+
+export type ListDashboardsV2QueryResult = NonNullable<
+	Awaited<ReturnType<typeof listDashboardsV2>>
+>;
+export type ListDashboardsV2QueryError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary List dashboards (v2)
+ */
+
+export function useListDashboardsV2<
+	TData = Awaited<ReturnType<typeof listDashboardsV2>>,
+	TError = ErrorType<RenderErrorResponseDTO>,
+>(
+	params?: ListDashboardsV2Params,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof listDashboardsV2>>,
+			TError,
+			TData
+		>;
+	},
+): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
+	const queryOptions = getListDashboardsV2QueryOptions(params, options);
+
+	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
+		queryKey: QueryKey;
+	};
+
+	return { ...query, queryKey: queryOptions.queryKey };
+}
+
+/**
+ * @summary List dashboards (v2)
+ */
+export const invalidateListDashboardsV2 = async (
+	queryClient: QueryClient,
+	params?: ListDashboardsV2Params,
+	options?: InvalidateOptions,
+): Promise<QueryClient> => {
+	await queryClient.invalidateQueries(
+		{ queryKey: getListDashboardsV2QueryKey(params) },
+		options,
+	);
+
+	return queryClient;
+};
+
 /**
 * This endpoint creates a dashboard in the v2 format that follows Perses spec.
 * @summary Create dashboard (v2)
@@ -724,6 +828,85 @@ export const useCreateDashboardV2 = <
 > => {
 	return useMutation(getCreateDashboardV2MutationOptions(options));
 };
+/**
+ * This endpoint deletes a v2-shape dashboard along with its tag relations. Locked dashboards are rejected.
+ * @summary Delete dashboard (v2)
+ */
+export const deleteDashboardV2 = (
+	{ id }: DeleteDashboardV2PathParameters,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<string>({
+		url: `/api/v2/dashboards/${id}`,
+		method: 'DELETE',
+		signal,
+	});
+};
+
+export const getDeleteDashboardV2MutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof deleteDashboardV2>>,
+		TError,
+		{ pathParams: DeleteDashboardV2PathParameters },
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof deleteDashboardV2>>,
+	TError,
+	{ pathParams: DeleteDashboardV2PathParameters },
+	TContext
+> => {
+	const mutationKey = ['deleteDashboardV2'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+			'mutationKey' in options.mutation &&
+			options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof deleteDashboardV2>>,
+		{ pathParams: DeleteDashboardV2PathParameters }
+	> = (props) => {
+		const { pathParams } = props ?? {};
+
+		return deleteDashboardV2(pathParams);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type DeleteDashboardV2MutationResult = NonNullable<
+	Awaited<ReturnType<typeof deleteDashboardV2>>
+>;
+
+export type DeleteDashboardV2MutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Delete dashboard (v2)
+ */
+export const useDeleteDashboardV2 = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof deleteDashboardV2>>,
+		TError,
+		{ pathParams: DeleteDashboardV2PathParameters },
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof deleteDashboardV2>>,
+	TError,
+	{ pathParams: DeleteDashboardV2PathParameters },
+	TContext
+> => {
+	return useMutation(getDeleteDashboardV2MutationOptions(options));
+};
 /**
 * This endpoint returns a v2-shape dashboard.
 * @summary Get dashboard (v2)
@@ -1181,3 +1364,260 @@ export const useLockDashboardV2 = <
 > => {
 	return useMutation(getLockDashboardV2MutationOptions(options));
 };
+/**
+ * Same as ListDashboardsV2 but personalized for the calling user: each dashboard carries the caller's `pinned` state, and pinned dashboards float to the top of the requested ordering. Supports the same filter DSL, sort, order, and pagination.
+ * @summary List dashboards for the current user (v2)
+ */
+export const listDashboardsForUserV2 = (
+	params?: ListDashboardsForUserV2Params,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<ListDashboardsForUserV2200>({
+		url: `/api/v2/users/me/dashboards`,
+		method: 'GET',
+		params,
+		signal,
+	});
+};
+
+export const getListDashboardsForUserV2QueryKey = (
+	params?: ListDashboardsForUserV2Params,
+) => {
+	return [`/api/v2/users/me/dashboards`, ...(params ? [params] : [])] as const;
+};
+
+export const getListDashboardsForUserV2QueryOptions = <
+	TData = Awaited<ReturnType<typeof listDashboardsForUserV2>>,
+	TError = ErrorType<RenderErrorResponseDTO>,
+>(
+	params?: ListDashboardsForUserV2Params,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof listDashboardsForUserV2>>,
+			TError,
+			TData
+		>;
+	},
+) => {
+	const { query: queryOptions } = options ?? {};
+
+	const queryKey =
+		queryOptions?.queryKey ?? getListDashboardsForUserV2QueryKey(params);
+
+	const queryFn: QueryFunction<
+		Awaited<ReturnType<typeof listDashboardsForUserV2>>
+	> = ({ signal }) => listDashboardsForUserV2(params, signal);
+
+	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
+		Awaited<ReturnType<typeof listDashboardsForUserV2>>,
+		TError,
+		TData
+	> & { queryKey: QueryKey };
+};
+
+export type ListDashboardsForUserV2QueryResult = NonNullable<
+	Awaited<ReturnType<typeof listDashboardsForUserV2>>
+>;
+export type ListDashboardsForUserV2QueryError =
+	ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary List dashboards for the current user (v2)
+ */
+
+export function useListDashboardsForUserV2<
+	TData = Awaited<ReturnType<typeof listDashboardsForUserV2>>,
+	TError = ErrorType<RenderErrorResponseDTO>,
+>(
+	params?: ListDashboardsForUserV2Params,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof listDashboardsForUserV2>>,
+			TError,
+			TData
+		>;
+	},
+): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
+	const queryOptions = getListDashboardsForUserV2QueryOptions(params, options);
+
+	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
+		queryKey: QueryKey;
+	};
+
+	return { ...query, queryKey: queryOptions.queryKey };
+}
+
+/**
+ * @summary List dashboards for the current user (v2)
+ */
+export const invalidateListDashboardsForUserV2 = async (
+	queryClient: QueryClient,
+	params?: ListDashboardsForUserV2Params,
+	options?: InvalidateOptions,
+): Promise<QueryClient> => {
+	await queryClient.invalidateQueries(
+		{ queryKey: getListDashboardsForUserV2QueryKey(params) },
+		options,
+	);
+
+	return queryClient;
+};
+
+/**
+ * Removes the pin for the calling user. Idempotent — unpinning a dashboard that wasn't pinned still returns 204.
+ * @summary Unpin a dashboard for the current user (v2)
+ */
+export const unpinDashboardV2 = (
+	{ id }: UnpinDashboardV2PathParameters,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<string>({
+		url: `/api/v2/users/me/dashboards/${id}/pins`,
+		method: 'DELETE',
+		signal,
+	});
+};
+
+export const getUnpinDashboardV2MutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof unpinDashboardV2>>,
+		TError,
+		{ pathParams: UnpinDashboardV2PathParameters },
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof unpinDashboardV2>>,
+	TError,
+	{ pathParams: UnpinDashboardV2PathParameters },
+	TContext
+> => {
+	const mutationKey = ['unpinDashboardV2'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+			'mutationKey' in options.mutation &&
+			options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof unpinDashboardV2>>,
+		{ pathParams: UnpinDashboardV2PathParameters }
+	> = (props) => {
+		const { pathParams } = props ?? {};
+
+		return unpinDashboardV2(pathParams);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type UnpinDashboardV2MutationResult = NonNullable<
+	Awaited<ReturnType<typeof unpinDashboardV2>>
+>;
+
+export type UnpinDashboardV2MutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Unpin a dashboard for the current user (v2)
+ */
+export const useUnpinDashboardV2 = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof unpinDashboardV2>>,
+		TError,
+		{ pathParams: UnpinDashboardV2PathParameters },
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof unpinDashboardV2>>,
+	TError,
+	{ pathParams: UnpinDashboardV2PathParameters },
+	TContext
+> => {
+	return useMutation(getUnpinDashboardV2MutationOptions(options));
+};
+/**
+ * Pins the dashboard for the calling user. A user can pin at most 10 dashboards; pinning when at the limit returns 409. Re-pinning an already-pinned dashboard is a no-op success.
+ * @summary Pin a dashboard for the current user (v2)
+ */
+export const pinDashboardV2 = (
+	{ id }: PinDashboardV2PathParameters,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<string>({
+		url: `/api/v2/users/me/dashboards/${id}/pins`,
+		method: 'PUT',
+		signal,
+	});
+};
+
+export const getPinDashboardV2MutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof pinDashboardV2>>,
+		TError,
+		{ pathParams: PinDashboardV2PathParameters },
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof pinDashboardV2>>,
+	TError,
+	{ pathParams: PinDashboardV2PathParameters },
+	TContext
+> => {
+	const mutationKey = ['pinDashboardV2'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+			'mutationKey' in options.mutation &&
+			options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof pinDashboardV2>>,
+		{ pathParams: PinDashboardV2PathParameters }
+	> = (props) => {
+		const { pathParams } = props ?? {};
+
+		return pinDashboardV2(pathParams);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type PinDashboardV2MutationResult = NonNullable<
+	Awaited<ReturnType<typeof pinDashboardV2>>
+>;
+
+export type PinDashboardV2MutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Pin a dashboard for the current user (v2)
+ */
+export const usePinDashboardV2 = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof pinDashboardV2>>,
+		TError,
+		{ pathParams: PinDashboardV2PathParameters },
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof pinDashboardV2>>,
+	TError,
+	{ pathParams: PinDashboardV2PathParameters },
+	TContext
+> => {
+	return useMutation(getPinDashboardV2MutationOptions(options));
+};
--- a/frontend/src/api/generated/services/sigNoz.schemas.ts
+++ b/frontend/src/api/generated/services/sigNoz.schemas.ts
@@ -2655,14 +2655,6 @@ export enum CloudintegrationtypesServiceIDDTO {
 	appservice = 'appservice',
 	containerapp = 'containerapp',
 	aks = 'aks',
-	sqldatabase = 'sqldatabase',
-	sqldatabasemi = 'sqldatabasemi',
-	mysqlflexibleserver = 'mysqlflexibleserver',
-	postgresqlflexibleserver = 'postgresqlflexibleserver',
-	mongodb = 'mongodb',
-	cosmosdb = 'cosmosdb',
-	cassandradb = 'cassandradb',
-	redis = 'redis',
 }
 export type CloudintegrationtypesCloudIntegrationServiceDTOAnyOf = {
 	/**
@@ -3503,6 +3495,9 @@ export interface TelemetrytypesTelemetryFieldKeyDTO {
 	unit?: string;
 }

+export enum Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5LogAggregationDTOSignal {
+	logs = 'logs',
+}
 export enum TelemetrytypesSourceDTO {
 	meter = 'meter',
 }
@@ -3558,7 +3553,11 @@ export interface Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTyp
 	 * @type array
 	 */
 	selectFields?: TelemetrytypesTelemetryFieldKeyDTO[];
-	signal?: TelemetrytypesSignalDTO;
+	/**
+	 * @enum logs
+	 * @type string
+	 */
+	signal: Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5LogAggregationDTOSignal;
 	source?: TelemetrytypesSourceDTO;
 	stepInterval?: Querybuildertypesv5StepDTO;
 }
@@ -3624,6 +3623,9 @@ export interface Querybuildertypesv5MetricAggregationDTO {
 	timeAggregation?: MetrictypesTimeAggregationDTO;
 }

+export enum Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5MetricAggregationDTOSignal {
+	metrics = 'metrics',
+}
 export interface Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5MetricAggregationDTO {
 	/**
 	 * @type array
@@ -3676,7 +3678,11 @@ export interface Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTyp
 	 * @type array
 	 */
 	selectFields?: TelemetrytypesTelemetryFieldKeyDTO[];
-	signal?: TelemetrytypesSignalDTO;
+	/**
+	 * @enum metrics
+	 * @type string
+	 */
+	signal: Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5MetricAggregationDTOSignal;
 	source?: TelemetrytypesSourceDTO;
 	stepInterval?: Querybuildertypesv5StepDTO;
 }
@@ -3692,6 +3698,9 @@ export interface Querybuildertypesv5TraceAggregationDTO {
 	expression?: string;
 }

+export enum Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5TraceAggregationDTOSignal {
+	traces = 'traces',
+}
 export interface Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5TraceAggregationDTO {
 	/**
 	 * @type array
@@ -3744,7 +3753,11 @@ export interface Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTyp
 	 * @type array
 	 */
 	selectFields?: TelemetrytypesTelemetryFieldKeyDTO[];
-	signal?: TelemetrytypesSignalDTO;
+	/**
+	 * @enum traces
+	 * @type string
+	 */
+	signal: Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5TraceAggregationDTOSignal;
 	source?: TelemetrytypesSourceDTO;
 	stepInterval?: Querybuildertypesv5StepDTO;
 }
@@ -4631,7 +4644,7 @@ export interface DashboardtypesDashboardSpecDTO {
 export enum DashboardtypesDatasourcePluginKindDTO {
 	'signoz/Datasource' = 'signoz/Datasource',
 }
-export interface TagtypesPostableTagDTO {
+export interface TagtypesGettableTagDTO {
 	/**
 	 * @type string
 	 */
@@ -4681,7 +4694,7 @@ export interface DashboardtypesGettableDashboardV2DTO {
 	/**
 	 * @type array,null
 	 */
-	tags: TagtypesPostableTagDTO[] | null;
+	tags: TagtypesGettableTagDTO[] | null;
 	/**
 	 * @type string
 	 * @format date-time
@@ -4739,6 +4752,157 @@ export interface DashboardtypesJSONPatchOperationDTO {
 	value?: unknown;
 }

+export enum DashboardtypesListOrderDTO {
+	asc = 'asc',
+	desc = 'desc',
+}
+export enum DashboardtypesListSortDTO {
+	updated_at = 'updated_at',
+	created_at = 'created_at',
+	name = 'name',
+}
+export interface DashboardtypesListedDashboardV2SpecDTO {
+	display?: CommonDisplayDTO;
+}
+
+export interface DashboardtypesListedDashboardForUserV2DTO {
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	createdAt?: string;
+	/**
+	 * @type string
+	 */
+	createdBy?: string;
+	/**
+	 * @type string
+	 */
+	id: string;
+	/**
+	 * @type string
+	 */
+	image?: string;
+	/**
+	 * @type boolean
+	 */
+	locked: boolean;
+	/**
+	 * @type string
+	 */
+	name: string;
+	/**
+	 * @type string
+	 */
+	orgId: string;
+	/**
+	 * @type boolean
+	 */
+	pinned: boolean;
+	/**
+	 * @type string
+	 */
+	schemaVersion: string;
+	source: DashboardtypesSourceDTO;
+	spec: DashboardtypesListedDashboardV2SpecDTO;
+	/**
+	 * @type array
+	 */
+	tags: TagtypesGettableTagDTO[];
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	updatedAt?: string;
+	/**
+	 * @type string
+	 */
+	updatedBy?: string;
+}
+
+export interface DashboardtypesListableDashboardForUserV2DTO {
+	/**
+	 * @type array
+	 */
+	dashboards: DashboardtypesListedDashboardForUserV2DTO[];
+	/**
+	 * @type array
+	 */
+	tags: TagtypesGettableTagDTO[];
+	/**
+	 * @type integer
+	 * @format int64
+	 */
+	total: number;
+}
+
+export interface DashboardtypesListedDashboardV2DTO {
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	createdAt?: string;
+	/**
+	 * @type string
+	 */
+	createdBy?: string;
+	/**
+	 * @type string
+	 */
+	id: string;
+	/**
+	 * @type string
+	 */
+	image?: string;
+	/**
+	 * @type boolean
+	 */
+	locked: boolean;
+	/**
+	 * @type string
+	 */
+	name: string;
+	/**
+	 * @type string
+	 */
+	orgId: string;
+	/**
+	 * @type string
+	 */
+	schemaVersion: string;
+	source: DashboardtypesSourceDTO;
+	spec: DashboardtypesListedDashboardV2SpecDTO;
+	/**
+	 * @type array
+	 */
+	tags: TagtypesGettableTagDTO[];
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	updatedAt?: string;
+	/**
+	 * @type string
+	 */
+	updatedBy?: string;
+}
+
+export interface DashboardtypesListableDashboardV2DTO {
+	/**
+	 * @type array
+	 */
+	dashboards: DashboardtypesListedDashboardV2DTO[];
+	/**
+	 * @type array
+	 */
+	tags: TagtypesGettableTagDTO[];
+	/**
+	 * @type integer
+	 * @format int64
+	 */
+	total: number;
+}
+
 export enum DashboardtypesPanelPluginKindDTO {
 	'signoz/TimeSeriesPanel' = 'signoz/TimeSeriesPanel',
 	'signoz/BarChartPanel' = 'signoz/BarChartPanel',
@@ -4755,6 +4919,17 @@ export type DashboardtypesPatchableDashboardV2DTO =
 	| DashboardtypesJSONPatchOperationDTO[]
 	| null;

+export interface TagtypesPostableTagDTO {
+	/**
+	 * @type string
+	 */
+	key: string;
+	/**
+	 * @type string
+	 */
+	value: string;
+}
+
 export interface DashboardtypesPostableDashboardV2DTO {
 	/**
 	 * @type boolean
@@ -9657,6 +9832,40 @@ export type GetUserPreference200 = {
 export type UpdateUserPreferencePathParameters = {
 	name: string;
 };
+export type ListDashboardsV2Params = {
+	/**
+	 * @type string
+	 * @description undefined
+	 */
+	query?: string;
+	/**
+	 * @description undefined
+	 */
+	sort?: DashboardtypesListSortDTO;
+	/**
+	 * @description undefined
+	 */
+	order?: DashboardtypesListOrderDTO;
+	/**
+	 * @type integer
+	 * @description undefined
+	 */
+	limit?: number;
+	/**
+	 * @type integer
+	 * @description undefined
+	 */
+	offset?: number;
+};
+
+export type ListDashboardsV2200 = {
+	data: DashboardtypesListableDashboardV2DTO;
+	/**
+	 * @type string
+	 */
+	status: string;
+};
+
 export type CreateDashboardV2201 = {
 	data: DashboardtypesGettableDashboardV2DTO;
 	/**
@@ -9665,6 +9874,9 @@ export type CreateDashboardV2201 = {
 	status: string;
 };

+export type DeleteDashboardV2PathParameters = {
+	id: string;
+};
 export type GetDashboardV2PathParameters = {
 	id: string;
 };
@@ -10497,6 +10709,46 @@ export type GetMyUser200 = {
 	status: string;
 };

+export type ListDashboardsForUserV2Params = {
+	/**
+	 * @type string
+	 * @description undefined
+	 */
+	query?: string;
+	/**
+	 * @description undefined
+	 */
+	sort?: DashboardtypesListSortDTO;
+	/**
+	 * @description undefined
+	 */
+	order?: DashboardtypesListOrderDTO;
+	/**
+	 * @type integer
+	 * @description undefined
+	 */
+	limit?: number;
+	/**
+	 * @type integer
+	 * @description undefined
+	 */
+	offset?: number;
+};
+
+export type ListDashboardsForUserV2200 = {
+	data: DashboardtypesListableDashboardForUserV2DTO;
+	/**
+	 * @type string
+	 */
+	status: string;
+};
+
+export type UnpinDashboardV2PathParameters = {
+	id: string;
+};
+export type PinDashboardV2PathParameters = {
+	id: string;
+};
 export type GetHosts200 = {
 	data: ZeustypesGettableHostDTO;
 	/**
--- a/frontend/src/components/QueryBuilderV2/QueryV2/QuerySearch/QuerySearch.styles.scss
+++ b/frontend/src/components/QueryBuilderV2/QueryV2/QuerySearch/QuerySearch.styles.scss
@@ -1,5 +1,11 @@
 // TODO: Improve the styling of the query aggregation container and its components. - @YounixM , @H4ad

+$dropdown-base-height: 250px;
+$recents-header-height: 30px;
+$recent-row-height: 36px;
+// how many recents are rendered, this caps how tall the dropdown can grow to fit them.
+$max-recents-shown: 5;
+
 .code-mirror-where-clause {
 	width: 100%;
 	display: flex;
@@ -117,7 +123,23 @@
 				width: 100% !important;
 				max-width: 100% !important;
 				font-family: 'Space Mono', monospace !important;
-				min-height: 200px !important;
+				max-height: $dropdown-base-height !important;
+				overflow-y: auto !important;
+
+				// Recents render at the top of the dropdown ahead of regular suggestions.
+				// At the base max-height, having recents in view would crowd out the
+				// suggestion list below. This loop grows the dropdown by one row's worth
+				// of height for every recent present (up to $max-recents-shown), plus the
+				// section header. `:has(> li:nth-of-type(N) .cm-completionIcon-recent)`
+				// matches when the Nth child of <ul> is a recent — i.e. there are at
+				// least N recents visible.
+				@for $i from 1 through $max-recents-shown {
+					&:has(> li:nth-of-type(#{$i}) .cm-completionIcon-recent) {
+						max-height: $dropdown-base-height +
+							$recents-header-height +
+							($i * $recent-row-height) !important;
+					}
+				}

 				&::-webkit-scrollbar {
 					width: 0.3rem;
@@ -133,6 +155,19 @@
 					background: transparent;
 				}

+				completion-section {
+					display: block;
+					padding: 10px 12px 6px;
+					font-size: 10px !important;
+					font-weight: 700;
+					letter-spacing: 0.08em;
+					text-transform: uppercase;
+					color: var(--l3-foreground, var(--l2-foreground));
+					opacity: 0.7;
+					border-bottom: 0;
+					background-color: transparent;
+				}
+
 				li {
 					width: 100% !important;
 					max-width: 100% !important;
@@ -159,11 +194,78 @@
 						display: none !important;
 					}

+					.cm-completionDetail {
+						margin-left: auto;
+						font-style: normal;
+						font-size: var(--periscope-font-size-small, 11px);
+						font-weight: 600;
+						letter-spacing: 0.06em;
+						text-transform: uppercase;
+						opacity: 0.55;
+					}
+
 					&[aria-selected='true'] {
 						background: var(--l3-background) !important;
 						font-weight: 600 !important;
 					}
 				}
+
+				li:has(.cm-completionIcon-recent) {
+					&:hover .cm-recent-delete,
+					&[aria-selected='true'] .cm-recent-delete {
+						opacity: 1;
+					}
+				}
+
+				li .cm-completionLabel {
+					flex: 1;
+					min-width: 0;
+					white-space: nowrap;
+					overflow: hidden;
+					text-overflow: ellipsis;
+				}
+
+				.cm-recent-delete {
+					margin-left: 8px;
+					display: inline-flex;
+					align-items: center;
+					justify-content: center;
+					width: 20px;
+					height: 20px;
+					padding: 0;
+					border: 0;
+					border-radius: 4px;
+					background: transparent;
+					color: var(--l2-foreground);
+					font-size: 18px;
+					line-height: 1;
+					cursor: pointer;
+					opacity: 0.5;
+					transition:
+						opacity 0.12s ease,
+						background-color 0.12s ease;
+
+					&:hover {
+						opacity: 1;
+						background: color-mix(in srgb, var(--l2-foreground) 18%, transparent);
+					}
+				}
+			}
+
+			&::after {
+				content: '↓↑ to navigate · ↵ to apply · esc to dismiss';
+				display: block;
+				padding: 8px 12px;
+				border-top: 1px solid var(--l1-border);
+				font-family: 'Space Mono', monospace;
+				font-size: 11px;
+				font-weight: 500;
+				letter-spacing: 0.02em;
+				color: var(--l2-foreground);
+				opacity: 0.6;
+				background: color-mix(in srgb, var(--l1-background) 50%, transparent);
+				border-bottom-left-radius: 4px;
+				border-bottom-right-radius: 4px;
 			}
 		}

--- a/frontend/src/components/QueryBuilderV2/QueryV2/QuerySearch/QuerySearch.tsx
+++ b/frontend/src/components/QueryBuilderV2/QueryV2/QuerySearch/QuerySearch.tsx
@@ -46,8 +46,15 @@ import {
 import { validateQuery } from 'utils/queryValidationUtils';
 import { unquote } from 'utils/stringUtils';

-import { queryExamples } from './constants';
-import { combineInitialAndUserExpression } from './utils';
+import { getRecentQueries } from 'lib/recentQueries/getRecentQueries';
+import type { SignalType } from 'types/api/v5/queryRange';
+
+import { queryExamples, SUGGESTIONS_SECTION } from './constants';
+import {
+	combineInitialAndUserExpression,
+	getRecentOptions,
+	renderRecentDeleteButton,
+} from './utils';

 import './QuerySearch.styles.scss';

@@ -1250,6 +1257,41 @@ function QuerySearch({
 		};
 	}

+	const signal = dataSource as SignalType;
+
+	function combinedSuggestions(
+		context: CompletionContext,
+	): CompletionResult | null {
+		const fullDoc = context.state.doc.toString();
+		const recentOptions = getRecentOptions(
+			getRecentQueries(signal, signalSource ?? ''),
+			fullDoc,
+		);
+		const result = autoSuggestions(context);
+
+		const suggestionOptions = (result?.options || []).map((opt) => ({
+			...opt,
+			section: SUGGESTIONS_SECTION,
+		}));
+
+		if (recentOptions.length === 0 && suggestionOptions.length === 0) {
+			return result;
+		}
+
+		if (!result) {
+			return {
+				from: 0,
+				to: fullDoc.length,
+				options: recentOptions,
+			};
+		}
+
+		return {
+			...result,
+			options: [...recentOptions, ...suggestionOptions],
+		};
+	}
+
 	// Effect to handle focus state and trigger suggestions
 	useEffect(() => {
 		const clearTimeout = toggleSuggestions(10);
@@ -1398,11 +1440,12 @@ function QuerySearch({
 					})}
 					extensions={[
 						autocompletion({
-							override: [autoSuggestions],
+							override: [combinedSuggestions],
 							defaultKeymap: true,
 							closeOnBlur: true,
 							activateOnTyping: true,
 							maxRenderedOptions: 50,
+							addToOptions: [{ render: renderRecentDeleteButton, position: 100 }],
 						}),
 						javascript({ jsx: false, typescript: false }),
 						EditorView.lineWrapping,
--- a/frontend/src/components/QueryBuilderV2/QueryV2/QuerySearch/constants.ts
+++ b/frontend/src/components/QueryBuilderV2/QueryV2/QuerySearch/constants.ts
@@ -1,3 +1,14 @@
+export const RECENTS_SECTION = { name: 'Recent searches', rank: 1 } as const;
+export const SUGGESTIONS_SECTION = { name: 'Suggestions', rank: 2 } as const;
+
+// Custom CodeMirror Completion.type for recent-query entries. Used to discriminate
+// recents from regular autocomplete completions in renderers and event handlers.
+export const RECENT_COMPLETION_TYPE = 'recent';
+
+// Max number of recents rendered in the autocomplete dropdown.
+//  Do change $max-recents-shown: in QuerySearch.styles.scss if you change this.
+export const RECENTS_DISPLAY_CAP = 5;
+
 export const queryExamples = [
 	{
 		label: 'Basic Query',
--- a/frontend/src/components/QueryBuilderV2/QueryV2/QuerySearch/utils.ts
+++ b/frontend/src/components/QueryBuilderV2/QueryV2/QuerySearch/utils.ts
@@ -1,3 +1,19 @@
+import { closeCompletion, startCompletion } from '@codemirror/autocomplete';
+import type { Completion } from '@codemirror/autocomplete';
+import type { EditorView } from '@uiw/react-codemirror';
+import dayjs from 'dayjs';
+import { normalizeFilterExpression } from 'lib/recentQueries/normalize';
+import * as recentQueriesStore from 'lib/recentQueries/recentQueriesStore';
+import type { RecentQueryEntry } from 'lib/recentQueries/types';
+import type { SignalType } from 'types/api/v5/queryRange';
+import 'utils/timeUtils';
+
+import {
+	RECENT_COMPLETION_TYPE,
+	RECENTS_DISPLAY_CAP,
+	RECENTS_SECTION,
+} from './constants';
+
 export function combineInitialAndUserExpression(
 	initial: string,
 	user: string,
@@ -38,3 +54,106 @@ export function getUserExpressionFromCombined(
 	}
 	return c;
 }
+
+// Filters and projects a list of recent-query entries into CodeMirror completions.
+// Entries are supplied by the caller (typically via the useRecents hook) so this
+// function stays pure and React doesn't have to re-subscribe inside CodeMirror's
+// autocomplete callback.
+export function getRecentOptions(
+	entries: RecentQueryEntry[],
+	fullDoc: string,
+): Completion[] {
+	const normalizedDoc = normalizeFilterExpression(fullDoc);
+
+	const matches = entries
+		.filter((e) => {
+			const normalizedRecent = normalizeFilterExpression(e.filter.expression);
+			if (normalizedRecent === normalizedDoc) {
+				return false;
+			}
+			if (normalizedDoc === '') {
+				return true;
+			}
+			return normalizedRecent.includes(normalizedDoc);
+		})
+		.slice(0, RECENTS_DISPLAY_CAP);
+
+	return matches.map((entry, index) => ({
+		label: entry.filter.expression,
+		type: RECENT_COMPLETION_TYPE,
+		// CodeMirror sorts within a section by boost desc, then label asc. The store
+		// returns entries newest-first, so we mirror that by giving the newest entry
+		// the highest boost — otherwise CM falls back to alphabetical order and the
+		// "most recently used" expectation breaks. Stays within the recents section
+		// because section.rank keeps recents above suggestions regardless of boost.
+		boost: matches.length - index,
+		section: RECENTS_SECTION,
+		detail: dayjs(entry.lastUsedAt).fromNow(),
+		recentId: entry.id,
+		recentSignal: entry.signal,
+		recentSource: entry.source,
+		apply: (view: EditorView): void => {
+			view.dispatch({
+				changes: {
+					from: 0,
+					to: view.state.doc.length,
+					insert: entry.filter.expression,
+				},
+				selection: { anchor: entry.filter.expression.length },
+			});
+			closeCompletion(view);
+		},
+	}));
+}
+
+export function renderRecentDeleteButton(
+	completion: Completion,
+	_state: unknown,
+	view: EditorView | null,
+): Node | null {
+	if (completion.type !== RECENT_COMPLETION_TYPE) {
+		return null;
+	}
+
+	const c = completion as Completion & {
+		recentId?: string;
+		recentSignal?: SignalType;
+		recentSource?: string;
+	};
+
+	const btn = document.createElement('button');
+	btn.type = 'button';
+	btn.className = 'cm-recent-delete';
+	btn.setAttribute('aria-label', 'Remove from recent searches');
+	btn.title = 'Remove from recent searches';
+	btn.textContent = '×';
+	queueMicrotask(() => {
+		if (btn.parentElement) {
+			btn.parentElement.title = completion.label;
+		}
+	});
+
+	const stop = (e: Event): void => {
+		e.preventDefault();
+		e.stopPropagation();
+	};
+	// CodeMirror's autocomplete closes the popup on pointerdown / mousedown outside
+	// the editor. The delete button lives inside the popup, so we must stop those
+	// events early — otherwise clicking × would dismiss the dropdown before the
+	// click handler fires and the entry wouldn't actually get removed.
+	btn.addEventListener('pointerdown', stop);
+	btn.addEventListener('mousedown', stop);
+	btn.addEventListener('click', (e) => {
+		stop(e);
+		if (!c.recentId || !c.recentSignal) {
+			return;
+		}
+		recentQueriesStore.remove(c.recentId, c.recentSignal, c.recentSource ?? '');
+		if (view) {
+			view.focus();
+			startCompletion(view);
+		}
+	});
+
+	return btn;
+}
--- a/frontend/src/constants/env.ts
+++ b/frontend/src/constants/env.ts
@@ -1,7 +1,9 @@
 export const ENVIRONMENT = {
-	baseURL:
-		process?.env?.FRONTEND_API_ENDPOINT ||
-		process?.env?.GITPOD_WORKSPACE_URL?.replace('://', '://8080-') ||
-		'',
-	wsURL: process?.env?.WEBSOCKET_API_ENDPOINT || '',
+	// baseURL:
+	// 	process?.env?.FRONTEND_API_ENDPOINT ||
+	// 	process?.env?.GITPOD_WORKSPACE_URL?.replace('://', '://8080-') ||
+	// 	'',
+	// wsURL: process?.env?.WEBSOCKET_API_ENDPOINT || '',
+	baseURL: 'https://app.us.staging.signoz.cloud',
+	wsURL: 'ws://app.us.staging.signoz.cloud',
 };
--- a/frontend/src/constants/routes.ts
+++ b/frontend/src/constants/routes.ts
@@ -91,6 +91,9 @@ const ROUTES = {
 	AI_ASSISTANT_BASE: '/ai-assistant',
 	AI_ASSISTANT_ICON_PREVIEW: '/ai-assistant-icon-preview',
 	MCP_SERVER: '/settings/mcp-server',
+	LLM_OBSERVABILITY_MODEL_PRICING: '/llm-observability/settings/model-pricing',
+	LLM_OBSERVABILITY_ATTRIBUTE_MAPPING:
+		'/llm-observability/settings/attribute-mapping',
 } as const;

 export default ROUTES;
--- a/frontend/src/container/LLMObservabilityAttributeMapping/AttributeMappingHeader.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/AttributeMappingHeader.tsx
@@ -0,0 +1,52 @@
+import { Button } from '@signozhq/ui/button';
+
+interface AttributeMappingHeaderProps {
+	isDirty: boolean;
+	isSaving: boolean;
+	onDiscard: () => void;
+	onSave: () => void;
+}
+
+function AttributeMappingHeader({
+	isDirty,
+	isSaving,
+	onDiscard,
+	onSave,
+}: AttributeMappingHeaderProps): JSX.Element {
+	return (
+		<header className="page-header">
+			<div className="page-header__title">
+				<h1>Attribute Mapping</h1>
+				<p>Configure source-to-target attribute remapping for LLM traces</p>
+			</div>
+			<div className="page-header__actions">
+				{isDirty && (
+					<span className="page-header__unsaved" data-testid="unsaved-changes">
+						Unsaved changes
+					</span>
+				)}
+				<Button
+					variant="outlined"
+					color="secondary"
+					onClick={onDiscard}
+					disabled={!isDirty || isSaving}
+					testId="discard-changes-btn"
+				>
+					Discard
+				</Button>
+				<Button
+					variant="solid"
+					color="primary"
+					onClick={onSave}
+					loading={isSaving}
+					disabled={!isDirty || isSaving}
+					testId="save-changes-btn"
+				>
+					{isSaving ? 'Saving…' : 'Save changes'}
+				</Button>
+			</div>
+		</header>
+	);
+}
+
+export default AttributeMappingHeader;
--- a/frontend/src/container/LLMObservabilityAttributeMapping/ConditionKeyList.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/ConditionKeyList.tsx
@@ -0,0 +1,90 @@
+import { Button } from '@signozhq/ui/button';
+import { Plus, X } from '@signozhq/icons';
+
+import KeySearchInput from './KeySearchInput';
+import { FieldContextValue } from './types';
+
+interface ConditionKeyListProps {
+	label: string;
+	labelHint?: string;
+	keys: string[];
+	placeholder: string;
+	addLabel: string;
+	testIdPrefix: string;
+	fieldContext: FieldContextValue;
+	onChange: (keys: string[]) => void;
+}
+
+// Editor for one list of condition keys (the group's span-attribute or
+// resource gating keys). Substring "contains" match, order irrelevant.
+function ConditionKeyList({
+	label,
+	labelHint,
+	keys,
+	placeholder,
+	addLabel,
+	testIdPrefix,
+	fieldContext,
+	onChange,
+}: ConditionKeyListProps): JSX.Element {
+	const updateKey = (index: number, value: string): void => {
+		onChange(keys.map((key, i) => (i === index ? value : key)));
+	};
+
+	const addKey = (): void => {
+		onChange([...keys, '']);
+	};
+
+	const removeKey = (index: number): void => {
+		onChange(keys.filter((_, i) => i !== index));
+	};
+
+	return (
+		<div className="group-form__field">
+			<span className="group-form__label">
+				{label}
+				{labelHint && <span className="group-form__label-hint"> {labelHint}</span>}
+			</span>
+
+			{keys.length > 0 && (
+				<div className="group-form__keys">
+					{keys.map((key, index) => (
+						// eslint-disable-next-line react/no-array-index-key
+						<div className="group-form__key" key={index}>
+							<KeySearchInput
+								className="group-form__key-input"
+								placeholder={placeholder}
+								value={key}
+								fieldContext={fieldContext}
+								onChange={(next): void => updateKey(index, next)}
+								testId={`${testIdPrefix}-${index}`}
+							/>
+							<Button
+								variant="ghost"
+								color="secondary"
+								size="icon"
+								aria-label="Remove key"
+								onClick={(): void => removeKey(index)}
+								testId={`${testIdPrefix}-remove-${index}`}
+							>
+								<X size={14} />
+							</Button>
+						</div>
+					))}
+				</div>
+			)}
+
+			<Button
+				variant="dashed"
+				color="secondary"
+				prefix={<Plus size={14} />}
+				onClick={addKey}
+				testId={`${testIdPrefix}-add`}
+			>
+				{addLabel}
+			</Button>
+		</div>
+	);
+}
+
+export default ConditionKeyList;
--- a/frontend/src/container/LLMObservabilityAttributeMapping/GroupFormDrawer.styles.scss
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/GroupFormDrawer.styles.scss
@@ -0,0 +1,76 @@
+.group-form {
+	display: flex;
+	flex-direction: column;
+	gap: 20px;
+	padding: 4px 0;
+
+	&__field {
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+
+		&--row {
+			flex-direction: row;
+			align-items: center;
+			justify-content: space-between;
+		}
+	}
+
+	&__label {
+		font-size: 12px;
+		font-weight: 600;
+		text-transform: uppercase;
+		letter-spacing: 0.04em;
+		color: var(--bg-vanilla-400);
+	}
+
+	&__label-hint {
+		font-weight: 400;
+		text-transform: none;
+		letter-spacing: normal;
+	}
+
+	&__hint {
+		font-size: 12px;
+		color: var(--bg-vanilla-400);
+	}
+
+	&__keys {
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+	}
+
+	&__key {
+		display: flex;
+		align-items: center;
+		gap: 6px;
+	}
+
+	&__key-input {
+		flex: 1;
+		font-family: 'Geist Mono', monospace;
+	}
+
+	&__error {
+		padding: 10px 12px;
+		border-radius: 4px;
+		background: rgba(229, 72, 77, 0.1);
+		color: var(--bg-cherry-400);
+		font-size: 13px;
+	}
+
+	&__footer {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		width: 100%;
+		gap: 8px;
+	}
+
+	&__footer-actions {
+		display: flex;
+		gap: 8px;
+		margin-left: auto;
+	}
+}
--- a/frontend/src/container/LLMObservabilityAttributeMapping/GroupFormDrawer.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/GroupFormDrawer.tsx
@@ -0,0 +1,148 @@
+import { Button } from '@signozhq/ui/button';
+import { DrawerWrapper } from '@signozhq/ui/drawer';
+import { Input } from '@signozhq/ui/input';
+import { Switch } from '@signozhq/ui/switch';
+import { Trash2 } from '@signozhq/icons';
+
+import ConditionKeyList from './ConditionKeyList';
+import { FieldContext, GroupDraft, MapperDraftMode } from './types';
+import { isGroupDraftValid } from './utils';
+
+import './GroupFormDrawer.styles.scss';
+
+interface GroupFormDrawerProps {
+	isOpen: boolean;
+	mode: MapperDraftMode;
+	draft: GroupDraft;
+	setDraft: (next: GroupDraft) => void;
+	onClose: () => void;
+	onSave: () => void;
+	onDelete: () => void;
+	isSaving: boolean;
+	isDeleting: boolean;
+	saveError: string | null;
+}
+
+function GroupFormDrawer({
+	isOpen,
+	mode,
+	draft,
+	setDraft,
+	onClose,
+	onSave,
+	onDelete,
+	isSaving,
+	isDeleting,
+	saveError,
+}: GroupFormDrawerProps): JSX.Element {
+	const isEdit = mode === 'edit';
+	const isValid = isGroupDraftValid(draft);
+
+	return (
+		<DrawerWrapper
+			open={isOpen}
+			onOpenChange={(open): void => {
+				if (!open) {
+					onClose();
+				}
+			}}
+			title={isEdit ? 'Edit group' : 'New group'}
+			subTitle="A group gates which spans its mappings run on"
+			width="wide"
+			testId="group-form-drawer"
+			footer={
+				<div className="group-form__footer">
+					{isEdit && (
+						<Button
+							variant="ghost"
+							color="destructive"
+							prefix={<Trash2 size={14} />}
+							onClick={onDelete}
+							disabled={isDeleting}
+							testId="group-form-delete"
+						>
+							{isDeleting ? 'Deleting…' : 'Delete'}
+						</Button>
+					)}
+					<div className="group-form__footer-actions">
+						<Button
+							variant="ghost"
+							color="secondary"
+							onClick={onClose}
+							testId="group-form-cancel"
+						>
+							Cancel
+						</Button>
+						<Button
+							variant="solid"
+							color="primary"
+							onClick={onSave}
+							disabled={!isValid || isSaving}
+							testId="group-form-save"
+						>
+							{/* eslint-disable-next-line no-nested-ternary */}
+							{isSaving ? 'Saving…' : isEdit ? 'Save group' : 'Create group'}
+						</Button>
+					</div>
+				</div>
+			}
+		>
+			<div className="group-form">
+				<div className="group-form__field">
+					<span className="group-form__label">Group name</span>
+					<Input
+						placeholder="e.g. OpenAI gateway"
+						value={draft.name}
+						onChange={(event): void =>
+							setDraft({ ...draft, name: event.target.value })
+						}
+						testId="group-form-name"
+					/>
+				</div>
+
+				<div className="group-form__field group-form__field--row">
+					<span className="group-form__label">Enabled</span>
+					<Switch
+						value={draft.enabled}
+						onChange={(checked): void => setDraft({ ...draft, enabled: checked })}
+						testId="group-form-enabled"
+					/>
+				</div>
+
+				<ConditionKeyList
+					label="Condition · span attribute keys"
+					labelHint="· runs when a span attribute key contains any of these"
+					keys={draft.attributes}
+					placeholder="e.g. gen_ai."
+					addLabel="Add attribute key"
+					testIdPrefix="group-form-attribute"
+					fieldContext={FieldContext.attribute}
+					onChange={(attributes): void => setDraft({ ...draft, attributes })}
+				/>
+
+				<ConditionKeyList
+					label="Condition · resource keys"
+					labelHint="· or when a resource key contains any of these"
+					keys={draft.resource}
+					placeholder="e.g. service.name"
+					addLabel="Add resource key"
+					testIdPrefix="group-form-resource"
+					fieldContext={FieldContext.resource}
+					onChange={(resource): void => setDraft({ ...draft, resource })}
+				/>
+
+				<span className="group-form__hint">
+					Leave both empty to run this group on every span.
+				</span>
+
+				{saveError && (
+					<div className="group-form__error" role="alert">
+						{saveError}
+					</div>
+				)}
+			</div>
+		</DrawerWrapper>
+	);
+}
+
+export default GroupFormDrawer;
--- a/frontend/src/container/LLMObservabilityAttributeMapping/IndexBadge.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/IndexBadge.tsx
@@ -0,0 +1,10 @@
+interface IndexBadgeProps {
+	index: number;
+}
+
+// Small positional badge mirroring the Pipelines list ordering chip.
+function IndexBadge({ index }: IndexBadgeProps): JSX.Element {
+	return <span className="am-index-badge">{index + 1}</span>;
+}
+
+export default IndexBadge;
--- a/frontend/src/container/LLMObservabilityAttributeMapping/KeySearchInput.styles.scss
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/KeySearchInput.styles.scss
@@ -0,0 +1,51 @@
+.key-search {
+	position: relative;
+	flex: 1;
+	min-width: 0;
+
+	&__dropdown {
+		position: absolute;
+		top: calc(100% + 4px);
+		left: 0;
+		z-index: 20;
+		min-width: 100%;
+		width: max-content;
+		max-width: 420px;
+		max-height: 240px;
+		overflow-x: hidden;
+		overflow-y: auto;
+		padding: 4px;
+		border: 1px solid var(--bg-slate-400, rgba(255, 255, 255, 0.12));
+		border-radius: 6px;
+		background: var(--bg-ink-400, #121317);
+		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
+
+		&--empty {
+			padding: 8px 10px;
+			font-size: 12px;
+			color: var(--bg-vanilla-400);
+		}
+	}
+
+	&__option {
+		display: block;
+		width: 100%;
+		max-width: 100%;
+		padding: 6px 10px;
+		border: none;
+		border-radius: 3px;
+		background: transparent;
+		color: var(--bg-vanilla-100);
+		font-family: 'Geist Mono', monospace;
+		font-size: 12px;
+		text-align: left;
+		white-space: nowrap;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		cursor: pointer;
+
+		&:hover {
+			background: var(--bg-slate-400, rgba(255, 255, 255, 0.08));
+		}
+	}
+}
--- a/frontend/src/container/LLMObservabilityAttributeMapping/KeySearchInput.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/KeySearchInput.tsx
@@ -0,0 +1,112 @@
+import { useMemo, useState } from 'react';
+import { Input } from '@signozhq/ui/input';
+import { useGetFieldsKeys } from 'api/generated/services/fields';
+import {
+	TelemetrytypesFieldContextDTO,
+	TelemetrytypesSignalDTO,
+} from 'api/generated/services/sigNoz.schemas';
+import cx from 'classnames';
+import useDebounce from 'hooks/useDebounce';
+
+import { FieldContext, FieldContextValue } from './types';
+
+import './KeySearchInput.styles.scss';
+
+const SUGGESTION_LIMIT = 50;
+const DEBOUNCE_MS = 300;
+
+interface KeySearchInputProps {
+	value: string;
+	fieldContext: FieldContextValue;
+	placeholder?: string;
+	className?: string;
+	disabled?: boolean;
+	testId?: string;
+	onChange: (value: string) => void;
+}
+
+// Maps the mapper's attribute/resource context to the fields-endpoint context.
+function toFieldsContext(
+	context: FieldContextValue,
+): TelemetrytypesFieldContextDTO {
+	return context === FieldContext.resource
+		? TelemetrytypesFieldContextDTO.resource
+		: TelemetrytypesFieldContextDTO.attribute;
+}
+
+// Free-text input with span/resource key suggestions from /api/v1/fields/keys
+// (signal=traces). Typing keeps the custom value; suggestions are assistive.
+function KeySearchInput({
+	value,
+	fieldContext,
+	placeholder,
+	className,
+	disabled,
+	testId,
+	onChange,
+}: KeySearchInputProps): JSX.Element {
+	const [isOpen, setIsOpen] = useState(false);
+	const debouncedSearch = useDebounce(value, DEBOUNCE_MS);
+
+	const { data, isFetching } = useGetFieldsKeys(
+		{
+			signal: TelemetrytypesSignalDTO.traces,
+			fieldContext: toFieldsContext(fieldContext),
+			searchText: debouncedSearch,
+			limit: SUGGESTION_LIMIT,
+		},
+		{ query: { enabled: isOpen && !disabled, keepPreviousData: true } },
+	);
+
+	const suggestions = useMemo(() => {
+		const keys = data?.data?.keys ?? {};
+		return Object.keys(keys)
+			.filter((key) => key !== value)
+			.slice(0, SUGGESTION_LIMIT);
+	}, [data, value]);
+
+	return (
+		<div className={cx('key-search', className)}>
+			<Input
+				placeholder={placeholder}
+				value={value}
+				disabled={disabled}
+				autoComplete="off"
+				onChange={(event): void => {
+					onChange(event.target.value);
+					setIsOpen(true);
+				}}
+				onFocus={(): void => setIsOpen(true)}
+				onBlur={(): void => setIsOpen(false)}
+				testId={testId}
+			/>
+			{isOpen && suggestions.length > 0 && (
+				<div className="key-search__dropdown" data-testid={`${testId}-dropdown`}>
+					{suggestions.map((name) => (
+						<button
+							type="button"
+							key={name}
+							className="key-search__option"
+							// onMouseDown (not onClick) so selection runs before the input blur.
+							onMouseDown={(event): void => {
+								event.preventDefault();
+								onChange(name);
+								setIsOpen(false);
+							}}
+							data-testid={`${testId}-option-${name}`}
+						>
+							{name}
+						</button>
+					))}
+				</div>
+			)}
+			{isOpen && isFetching && suggestions.length === 0 && (
+				<div className="key-search__dropdown key-search__dropdown--empty">
+					Searching…
+				</div>
+			)}
+		</div>
+	);
+}
+
+export default KeySearchInput;
--- a/frontend/src/container/LLMObservabilityAttributeMapping/LLMObservabilityAttributeMapping.styles.scss
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/LLMObservabilityAttributeMapping.styles.scss
@@ -0,0 +1,183 @@
+.llm-observability-attribute-mapping {
+	padding: 24px;
+	display: flex;
+	flex-direction: column;
+	gap: 16px;
+
+	.page-header {
+		display: flex;
+		align-items: flex-start;
+		justify-content: space-between;
+		gap: 16px;
+
+		&__title {
+			h1 {
+				margin: 0;
+				font-size: 18px;
+				font-weight: 600;
+			}
+
+			p {
+				margin: 4px 0 0;
+				font-size: 13px;
+				color: var(--bg-vanilla-400);
+			}
+		}
+
+		&__actions {
+			display: flex;
+			align-items: center;
+			gap: 12px;
+		}
+
+		&__unsaved {
+			font-size: 13px;
+			color: var(--bg-amber-400);
+		}
+	}
+
+	.page-error {
+		padding: 12px 16px;
+		border-radius: 4px;
+		background: var(--bg-cherry-500-opacity-10, rgba(229, 72, 77, 0.1));
+		color: var(--bg-cherry-400);
+		font-size: 13px;
+	}
+
+	.page-footer {
+		font-size: 12px;
+		color: var(--bg-vanilla-400);
+	}
+
+	.muted {
+		color: var(--bg-vanilla-400);
+	}
+
+	.am-index-badge {
+		display: inline-flex;
+		align-items: center;
+		justify-content: center;
+		min-width: 22px;
+		height: 22px;
+		padding: 0 6px;
+		border-radius: 999px;
+		background: var(--bg-robin-500);
+		color: var(--bg-vanilla-100);
+		font-size: 12px;
+		font-weight: 600;
+	}
+
+	.am-row-actions {
+		display: flex;
+		align-items: center;
+		gap: 6px;
+	}
+
+	.am-add-row {
+		align-self: flex-start;
+	}
+
+	.groups-table__wrapper {
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+	}
+
+	.am-table {
+		&__empty {
+			padding: 24px 12px;
+			text-align: center;
+			color: var(--bg-vanilla-400);
+			font-size: 13px;
+		}
+	}
+
+	.groups-table {
+		&__name {
+			font-weight: 600;
+		}
+
+		&__name-cell {
+			display: flex;
+			align-items: center;
+			gap: 8px;
+		}
+
+		&__sub-row > td {
+			padding: 0 16px 12px;
+			background: var(--bg-ink-400, rgba(255, 255, 255, 0.02));
+		}
+
+		&__filters {
+			display: flex;
+			flex-direction: column;
+			gap: 6px;
+		}
+
+		&__filter {
+			display: flex;
+			align-items: center;
+			gap: 8px;
+			font-size: 13px;
+		}
+
+		&__filter-key {
+			font-family: 'Geist Mono', monospace;
+		}
+
+		&__edited {
+			display: flex;
+			flex-direction: column;
+			font-size: 12px;
+		}
+	}
+
+	.mappers-table__wrapper {
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+		margin: 4px 0;
+	}
+
+	.mappers-table {
+		margin: 4px 0;
+
+		&__target {
+			font-family: 'Geist Mono', monospace;
+			font-weight: 600;
+		}
+
+		&__sources {
+			display: flex;
+			flex-wrap: wrap;
+			align-items: center;
+			gap: 6px;
+		}
+
+		&__source-chip {
+			display: inline-flex;
+			align-items: center;
+			max-width: 220px;
+			padding: 2px 8px;
+			border: 1px solid var(--bg-slate-400, rgba(255, 255, 255, 0.12));
+			border-radius: 6px;
+			background: var(--bg-ink-300, rgba(255, 255, 255, 0.04));
+			font-family: 'Geist Mono', monospace;
+			font-size: 12px;
+			white-space: nowrap;
+			overflow: hidden;
+			text-overflow: ellipsis;
+		}
+
+		&__source-more {
+			font-size: 12px;
+			white-space: nowrap;
+		}
+
+		&__error {
+			padding: 12px;
+			font-size: 13px;
+			color: var(--bg-cherry-400);
+		}
+	}
+}
--- a/frontend/src/container/LLMObservabilityAttributeMapping/LLMObservabilityAttributeMapping.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/LLMObservabilityAttributeMapping.tsx
@@ -0,0 +1,77 @@
+import { useCallback } from 'react';
+
+import AttributeMappingHeader from './AttributeMappingHeader';
+import GroupFormDrawer from './GroupFormDrawer';
+import MapperGroupsTable from './MapperGroupsTable';
+import { useAttributeMappingStore } from './useAttributeMappingStore';
+import { useGroupFormDrawer } from './useGroupFormDrawer';
+
+import './LLMObservabilityAttributeMapping.styles.scss';
+
+function LLMObservabilityAttributeMapping(): JSX.Element {
+	const store = useAttributeMappingStore();
+	const groupDrawer = useGroupFormDrawer();
+
+	const handleGroupSave = useCallback((): void => {
+		store.upsertGroup(groupDrawer.draft);
+		groupDrawer.close();
+	}, [store, groupDrawer]);
+
+	const handleGroupDelete = useCallback((): void => {
+		if (groupDrawer.draft.id) {
+			store.removeGroup(groupDrawer.draft.id);
+		}
+		groupDrawer.close();
+	}, [store, groupDrawer]);
+
+	return (
+		<div
+			className="llm-observability-attribute-mapping"
+			data-testid="llm-observability-attribute-mapping-page"
+		>
+			<AttributeMappingHeader
+				isDirty={store.isDirty}
+				isSaving={store.isSaving}
+				onDiscard={store.discard}
+				onSave={store.save}
+			/>
+
+			{store.saveError && (
+				<div className="page-error" role="alert">
+					{store.saveError}
+				</div>
+			)}
+
+			{store.isError && (
+				<div className="page-error" role="alert">
+					Failed to load mapping groups. Please try again.
+				</div>
+			)}
+
+			<MapperGroupsTable
+				store={store}
+				onEditGroup={groupDrawer.openForEdit}
+				onAddGroup={groupDrawer.openForAdd}
+			/>
+
+			<footer className="page-footer">
+				Showing {store.groups.length} group{store.groups.length === 1 ? '' : 's'}
+			</footer>
+
+			<GroupFormDrawer
+				isOpen={groupDrawer.isOpen}
+				mode={groupDrawer.mode}
+				draft={groupDrawer.draft}
+				setDraft={groupDrawer.setDraft}
+				onClose={groupDrawer.close}
+				onSave={handleGroupSave}
+				onDelete={handleGroupDelete}
+				isSaving={false}
+				isDeleting={false}
+				saveError={null}
+			/>
+		</div>
+	);
+}
+
+export default LLMObservabilityAttributeMapping;
--- a/frontend/src/container/LLMObservabilityAttributeMapping/MapperFormDrawer.styles.scss
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/MapperFormDrawer.styles.scss
@@ -0,0 +1,104 @@
+.mapper-form {
+	display: flex;
+	flex-direction: column;
+	gap: 20px;
+	padding: 4px 0;
+
+	&__field {
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+	}
+
+	&__label {
+		font-size: 12px;
+		font-weight: 600;
+		text-transform: uppercase;
+		letter-spacing: 0.04em;
+		color: var(--bg-vanilla-400);
+	}
+
+	&__label-hint {
+		font-weight: 400;
+		text-transform: none;
+		letter-spacing: normal;
+	}
+
+	&__hint {
+		font-size: 12px;
+		color: var(--bg-vanilla-400);
+	}
+
+	&__sources {
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+	}
+
+	&__source {
+		display: flex;
+		align-items: center;
+		gap: 6px;
+	}
+
+	&__source-handle {
+		display: inline-flex;
+		align-items: center;
+		justify-content: center;
+		padding: 4px;
+		border: none;
+		background: transparent;
+		color: var(--bg-vanilla-400);
+		cursor: grab;
+		touch-action: none;
+		user-select: none;
+
+		&:active {
+			cursor: grabbing;
+		}
+	}
+
+	&__source-index {
+		width: 20px;
+		text-align: center;
+		font-size: 12px;
+		color: var(--bg-vanilla-400);
+	}
+
+	&__source-input {
+		flex: 1;
+		min-width: 0;
+		font-family: 'Geist Mono', monospace;
+	}
+
+	&__source-select {
+		flex: 0 0 auto;
+		width: 120px;
+	}
+
+	&__field-context {
+		width: 200px;
+	}
+
+	&__error {
+		padding: 10px 12px;
+		border-radius: 4px;
+		background: rgba(229, 72, 77, 0.1);
+		color: var(--bg-cherry-400);
+		font-size: 13px;
+	}
+
+	&__footer {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		width: 100%;
+		gap: 8px;
+	}
+
+	&__footer-actions {
+		display: flex;
+		gap: 8px;
+		margin-left: auto;
+	}
+}
--- a/frontend/src/container/LLMObservabilityAttributeMapping/MapperFormDrawer.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/MapperFormDrawer.tsx
@@ -0,0 +1,267 @@
+import { useEffect, useRef, useState } from 'react';
+import { Button } from '@signozhq/ui/button';
+import { DrawerWrapper } from '@signozhq/ui/drawer';
+import { SelectSimple } from '@signozhq/ui/select';
+import {
+	closestCenter,
+	DndContext,
+	DragEndEvent,
+	PointerSensor,
+	useSensor,
+	useSensors,
+} from '@dnd-kit/core';
+import { restrictToVerticalAxis } from '@dnd-kit/modifiers';
+import {
+	arrayMove,
+	SortableContext,
+	verticalListSortingStrategy,
+} from '@dnd-kit/sortable';
+import { Plus, Trash2 } from '@signozhq/icons';
+import { v4 as uuid } from 'uuid';
+
+import KeySearchInput from './KeySearchInput';
+import SourceAttributeRow from './SourceAttributeRow';
+import {
+	FieldContext,
+	FieldContextValue,
+	MapperDraft,
+	MapperDraftMode,
+	SourceConfig,
+} from './types';
+import { createEmptySource, isMapperDraftValid } from './utils';
+
+import './MapperFormDrawer.styles.scss';
+
+const FIELD_CONTEXT_OPTIONS = [
+	{ value: FieldContext.attribute, label: 'Span attribute' },
+	{ value: FieldContext.resource, label: 'Resource' },
+];
+
+interface MapperFormDrawerProps {
+	isOpen: boolean;
+	mode: MapperDraftMode;
+	draft: MapperDraft;
+	setDraft: (next: MapperDraft) => void;
+	onClose: () => void;
+	onSave: () => void;
+	onDelete: () => void;
+	isSaving: boolean;
+	isDeleting: boolean;
+	saveError: string | null;
+}
+
+function MapperFormDrawer({
+	isOpen,
+	mode,
+	draft,
+	setDraft,
+	onClose,
+	onSave,
+	onDelete,
+	isSaving,
+	isDeleting,
+	saveError,
+}: MapperFormDrawerProps): JSX.Element {
+	const isEdit = mode === 'edit';
+	const isValid = isMapperDraftValid(draft);
+
+	// Stable per-row ids for the sortable list. These are UI-only (never sent to
+	// the API and excluded from the draft), so dnd-kit can track rows reliably
+	// even though sources are stored as a plain array. Re-seeded each time the
+	// drawer opens; kept in lockstep with the sources array on add/remove/drag.
+	const [rowIds, setRowIds] = useState<string[]>([]);
+	const wasOpen = useRef(false);
+
+	useEffect(() => {
+		if (isOpen && !wasOpen.current) {
+			setRowIds(draft.sources.map(() => uuid()));
+		}
+		wasOpen.current = isOpen;
+		// Only re-seed on the closed→open transition.
+		// eslint-disable-next-line react-hooks/exhaustive-deps
+	}, [isOpen]);
+
+	const sourceIds = draft.sources.map(
+		(_, index) => rowIds[index] ?? `pending-${index}`,
+	);
+
+	// 5px activation distance so clicking into the input never starts a drag.
+	const sensors = useSensors(
+		useSensor(PointerSensor, { activationConstraint: { distance: 5 } }),
+	);
+
+	const updateSource = (index: number, patch: Partial<SourceConfig>): void => {
+		const sources = draft.sources.map((source, i) =>
+			i === index ? { ...source, ...patch } : source,
+		);
+		setDraft({ ...draft, sources });
+	};
+
+	const addSource = (): void => {
+		setDraft({ ...draft, sources: [...draft.sources, createEmptySource()] });
+		setRowIds((prev) => [...prev, uuid()]);
+	};
+
+	const removeSource = (index: number): void => {
+		const sources = draft.sources.filter((_, i) => i !== index);
+		if (sources.length === 0) {
+			setDraft({ ...draft, sources: [createEmptySource()] });
+			setRowIds([uuid()]);
+			return;
+		}
+		setDraft({ ...draft, sources });
+		setRowIds((prev) => prev.filter((_, i) => i !== index));
+	};
+
+	const handleDragEnd = (event: DragEndEvent): void => {
+		const { active, over } = event;
+		if (!over || active.id === over.id) {
+			return;
+		}
+		const from = sourceIds.indexOf(String(active.id));
+		const to = sourceIds.indexOf(String(over.id));
+		if (from === -1 || to === -1) {
+			return;
+		}
+		setDraft({ ...draft, sources: arrayMove(draft.sources, from, to) });
+		setRowIds((prev) => arrayMove(prev, from, to));
+	};
+
+	return (
+		<DrawerWrapper
+			open={isOpen}
+			onOpenChange={(open): void => {
+				if (!open) {
+					onClose();
+				}
+			}}
+			title={isEdit ? 'Edit mapping' : 'New custom mapping'}
+			subTitle="Map source attributes onto a canonical target attribute"
+			width="wide"
+			testId="mapper-form-drawer"
+			footer={
+				<div className="mapper-form__footer">
+					{isEdit && (
+						<Button
+							variant="ghost"
+							color="destructive"
+							prefix={<Trash2 size={14} />}
+							onClick={onDelete}
+							disabled={isDeleting}
+							testId="mapper-form-delete"
+						>
+							{isDeleting ? 'Deleting…' : 'Delete'}
+						</Button>
+					)}
+					<div className="mapper-form__footer-actions">
+						<Button
+							variant="ghost"
+							color="secondary"
+							onClick={onClose}
+							testId="mapper-form-cancel"
+						>
+							Cancel
+						</Button>
+						<Button
+							variant="solid"
+							color="primary"
+							onClick={onSave}
+							disabled={!isValid || isSaving}
+							testId="mapper-form-save"
+						>
+							{/* eslint-disable-next-line no-nested-ternary */}
+							{isSaving ? 'Saving…' : isEdit ? 'Save mapping' : 'Create mapping'}
+						</Button>
+					</div>
+				</div>
+			}
+		>
+			<div className="mapper-form">
+				<div className="mapper-form__field">
+					<span className="mapper-form__label">Target attribute</span>
+					<KeySearchInput
+						placeholder="e.g. gen_ai.content.prompt"
+						value={draft.name}
+						fieldContext={draft.fieldContext}
+						disabled={isEdit}
+						onChange={(name): void => setDraft({ ...draft, name })}
+						testId="mapper-form-target"
+					/>
+					{isEdit && (
+						<span className="mapper-form__hint">
+							The target attribute can&apos;t be changed after creation.
+						</span>
+					)}
+				</div>
+
+				<div className="mapper-form__field">
+					<span className="mapper-form__label">Write target to</span>
+					<SelectSimple
+						className="mapper-form__field-context"
+						items={FIELD_CONTEXT_OPTIONS}
+						value={draft.fieldContext}
+						withPortal={false}
+						onChange={(next): void =>
+							setDraft({ ...draft, fieldContext: next as FieldContextValue })
+						}
+						testId="mapper-form-field-context"
+					/>
+					<span className="mapper-form__hint">
+						Where the standardized attribute is written.
+					</span>
+				</div>
+
+				<div className="mapper-form__field">
+					<span className="mapper-form__label">
+						Source attributes
+						<span className="mapper-form__label-hint">
+							{' '}
+							· priority: top → bottom · drag to reorder
+						</span>
+					</span>
+
+					<DndContext
+						sensors={sensors}
+						collisionDetection={closestCenter}
+						modifiers={[restrictToVerticalAxis]}
+						onDragEnd={handleDragEnd}
+					>
+						<SortableContext items={sourceIds} strategy={verticalListSortingStrategy}>
+							<div className="mapper-form__sources">
+								{draft.sources.map((source, index) => (
+									<SourceAttributeRow
+										key={sourceIds[index]}
+										id={sourceIds[index]}
+										index={index}
+										value={source}
+										canRemove={draft.sources.length > 1}
+										onChange={updateSource}
+										onRemove={removeSource}
+									/>
+								))}
+							</div>
+						</SortableContext>
+					</DndContext>
+
+					<Button
+						variant="dashed"
+						color="secondary"
+						prefix={<Plus size={14} />}
+						onClick={addSource}
+						testId="mapper-form-add-source"
+					>
+						Add another source
+					</Button>
+				</div>
+
+				{saveError && (
+					<div className="mapper-form__error" role="alert">
+						{saveError}
+					</div>
+				)}
+			</div>
+		</DrawerWrapper>
+	);
+}
+
+export default MapperFormDrawer;
--- a/frontend/src/container/LLMObservabilityAttributeMapping/MapperGroupsTable.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/MapperGroupsTable.tsx
@@ -0,0 +1,212 @@
+import { useState } from 'react';
+import { Badge } from '@signozhq/ui/badge';
+import { Button } from '@signozhq/ui/button';
+import { Switch } from '@signozhq/ui/switch';
+import {
+	Table,
+	TableBody,
+	TableCell,
+	TableHead,
+	TableHeader,
+	TableRow,
+} from '@signozhq/ui/table';
+import {
+	ChevronDown,
+	ChevronRight,
+	Pencil,
+	Plus,
+	Trash2,
+} from '@signozhq/icons';
+
+import MappersTable from './MappersTable';
+import { DraftGroup } from './types';
+import { AttributeMappingStore } from './useAttributeMappingStore';
+import { conditionFiltersFromGroup } from './utils';
+
+const COLUMN_COUNT = 4;
+
+interface MapperGroupsTableProps {
+	store: AttributeMappingStore;
+	onEditGroup: (group: DraftGroup) => void;
+	onAddGroup: () => void;
+}
+
+function FiltersCell({ group }: { group: DraftGroup }): JSX.Element {
+	const filters = conditionFiltersFromGroup(group);
+	if (filters.length === 0) {
+		return <span className="muted">No condition · always runs</span>;
+	}
+
+	return (
+		<div
+			className="groups-table__filters"
+			data-testid={`group-filters-${group.localId}`}
+		>
+			{filters.map((filter) => (
+				<div
+					className="groups-table__filter"
+					key={`${filter.context}:${filter.key}`}
+				>
+					<Badge
+						color={filter.context === 'resource' ? 'amber' : 'robin'}
+						variant="outline"
+					>
+						{filter.context}
+					</Badge>
+					<span className="groups-table__filter-key">contains {filter.key}</span>
+				</div>
+			))}
+		</div>
+	);
+}
+
+interface GroupRowProps {
+	group: DraftGroup;
+	store: AttributeMappingStore;
+	isExpanded: boolean;
+	onToggleExpand: (localId: string) => void;
+	onEditGroup: (group: DraftGroup) => void;
+}
+
+function GroupRow({
+	group,
+	store,
+	isExpanded,
+	onToggleExpand,
+	onEditGroup,
+}: GroupRowProps): JSX.Element {
+	return (
+		<>
+			<TableRow data-testid={`group-row-${group.localId}`}>
+				<TableCell>
+					<div className="groups-table__name-cell">
+						<Button
+							variant="ghost"
+							color="secondary"
+							size="icon"
+							aria-label={isExpanded ? 'Collapse group' : 'Expand group'}
+							onClick={(): void => onToggleExpand(group.localId)}
+							testId={`group-expand-${group.localId}`}
+						>
+							{isExpanded ? <ChevronDown size={14} /> : <ChevronRight size={14} />}
+						</Button>
+						<span
+							className="groups-table__name"
+							data-testid={`group-name-${group.localId}`}
+						>
+							{group.name}
+						</span>
+					</div>
+				</TableCell>
+				<TableCell>
+					<FiltersCell group={group} />
+				</TableCell>
+				<TableCell>
+					<span className="muted">{group.mappers.length} mappings</span>
+				</TableCell>
+				<TableCell>
+					<div className="am-row-actions">
+						<Button
+							variant="ghost"
+							color="secondary"
+							size="icon"
+							aria-label="Edit group"
+							onClick={(): void => onEditGroup(group)}
+							testId={`group-edit-${group.localId}`}
+						>
+							<Pencil size={14} />
+						</Button>
+						<Button
+							variant="ghost"
+							color="destructive"
+							size="icon"
+							aria-label="Delete group"
+							onClick={(): void => store.removeGroup(group.localId)}
+							testId={`group-delete-${group.localId}`}
+						>
+							<Trash2 size={14} />
+						</Button>
+						<Switch
+							value={group.enabled}
+							onChange={(checked): void => store.toggleGroup(group.localId, checked)}
+							testId={`group-enabled-${group.localId}`}
+						/>
+					</div>
+				</TableCell>
+			</TableRow>
+			{isExpanded && (
+				<TableRow className="groups-table__sub-row">
+					<TableCell colSpan={COLUMN_COUNT}>
+						<MappersTable group={group} store={store} />
+					</TableCell>
+				</TableRow>
+			)}
+		</>
+	);
+}
+
+function MapperGroupsTable({
+	store,
+	onEditGroup,
+	onAddGroup,
+}: MapperGroupsTableProps): JSX.Element {
+	const [expandedId, setExpandedId] = useState<string | null>(null);
+
+	const toggleExpand = (localId: string): void => {
+		setExpandedId((current) => (current === localId ? null : localId));
+	};
+
+	return (
+		<div className="groups-table__wrapper">
+			<Table testId="mapper-groups-table" className="am-table">
+				<TableHeader>
+					<TableRow>
+						<TableHead>Group name</TableHead>
+						<TableHead>Filters</TableHead>
+						<TableHead>Mappings</TableHead>
+						<TableHead>Actions</TableHead>
+					</TableRow>
+				</TableHeader>
+				<TableBody>
+					{store.isLoading && store.groups.length === 0 && (
+						<TableRow>
+							<TableCell colSpan={COLUMN_COUNT} className="am-table__empty">
+								Loading groups…
+							</TableCell>
+						</TableRow>
+					)}
+					{!store.isLoading && store.groups.length === 0 && (
+						<TableRow>
+							<TableCell colSpan={COLUMN_COUNT} className="am-table__empty">
+								No mapping groups yet.
+							</TableCell>
+						</TableRow>
+					)}
+					{store.groups.map((group) => (
+						<GroupRow
+							key={group.localId}
+							group={group}
+							store={store}
+							isExpanded={expandedId === group.localId}
+							onToggleExpand={toggleExpand}
+							onEditGroup={onEditGroup}
+						/>
+					))}
+				</TableBody>
+			</Table>
+
+			<Button
+				variant="ghost"
+				color="primary"
+				prefix={<Plus size={14} />}
+				className="am-add-row"
+				onClick={onAddGroup}
+				testId="add-group-row"
+			>
+				Add a new group
+			</Button>
+		</div>
+	);
+}
+
+export default MapperGroupsTable;
--- a/frontend/src/container/LLMObservabilityAttributeMapping/MappersTable.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/MappersTable.tsx
@@ -0,0 +1,208 @@
+import { useCallback } from 'react';
+import { Badge } from '@signozhq/ui/badge';
+import { Button } from '@signozhq/ui/button';
+import { Switch } from '@signozhq/ui/switch';
+import {
+	Table,
+	TableBody,
+	TableCell,
+	TableHead,
+	TableHeader,
+	TableRow,
+} from '@signozhq/ui/table';
+import { Pencil, Plus, Trash2 } from '@signozhq/icons';
+
+import IndexBadge from './IndexBadge';
+import MapperFormDrawer from './MapperFormDrawer';
+import { DraftGroup, DraftMapper, FieldContext } from './types';
+import { AttributeMappingStore } from './useAttributeMappingStore';
+import { useMapperFormDrawer } from './useMapperFormDrawer';
+
+const MAX_VISIBLE_SOURCES = 3;
+const COLUMN_COUNT = 5;
+
+interface MappersTableProps {
+	group: DraftGroup;
+	store: AttributeMappingStore;
+}
+
+function SourcesCell({ mapper }: { mapper: DraftMapper }): JSX.Element {
+	if (mapper.sources.length === 0) {
+		return <span className="muted">—</span>;
+	}
+
+	const visible = mapper.sources.slice(0, MAX_VISIBLE_SOURCES);
+	const remaining = mapper.sources.length - visible.length;
+
+	return (
+		<div
+			className="mappers-table__sources"
+			data-testid={`mapper-sources-${mapper.localId}`}
+		>
+			{visible.map((source) => (
+				<span
+					className="mappers-table__source-chip"
+					key={`${source.context}:${source.key}`}
+					title={source.key}
+				>
+					{source.key}
+				</span>
+			))}
+			{remaining > 0 && (
+				<span className="mappers-table__source-more muted">+{remaining} more</span>
+			)}
+		</div>
+	);
+}
+
+interface MapperRowProps {
+	mapper: DraftMapper;
+	index: number;
+	onEdit: (mapper: DraftMapper) => void;
+	onDelete: (mapperLocalId: string) => void;
+	onToggle: (mapperLocalId: string, enabled: boolean) => void;
+}
+
+function MapperRow({
+	mapper,
+	index,
+	onEdit,
+	onDelete,
+	onToggle,
+}: MapperRowProps): JSX.Element {
+	return (
+		<TableRow data-testid={`mapper-row-${mapper.localId}`}>
+			<TableCell>
+				<IndexBadge index={index} />
+			</TableCell>
+			<TableCell>
+				<span
+					className="mappers-table__target"
+					data-testid={`mapper-target-${mapper.localId}`}
+				>
+					{mapper.name}
+				</span>
+			</TableCell>
+			<TableCell>
+				<SourcesCell mapper={mapper} />
+			</TableCell>
+			<TableCell>
+				<Badge
+					color={mapper.fieldContext === FieldContext.resource ? 'amber' : 'robin'}
+					variant="outline"
+				>
+					{mapper.fieldContext}
+				</Badge>
+			</TableCell>
+			<TableCell>
+				<div className="am-row-actions">
+					<Button
+						variant="ghost"
+						color="secondary"
+						size="icon"
+						aria-label="Edit mapping"
+						onClick={(): void => onEdit(mapper)}
+						testId={`mapper-edit-${mapper.localId}`}
+					>
+						<Pencil size={14} />
+					</Button>
+					<Button
+						variant="ghost"
+						color="destructive"
+						size="icon"
+						aria-label="Delete mapping"
+						onClick={(): void => onDelete(mapper.localId)}
+						testId={`mapper-delete-${mapper.localId}`}
+					>
+						<Trash2 size={14} />
+					</Button>
+					<Switch
+						value={mapper.enabled}
+						onChange={(checked): void => onToggle(mapper.localId, checked)}
+						testId={`mapper-enabled-${mapper.localId}`}
+					/>
+				</div>
+			</TableCell>
+		</TableRow>
+	);
+}
+
+function MappersTable({ group, store }: MappersTableProps): JSX.Element {
+	const drawer = useMapperFormDrawer();
+
+	const handleSave = useCallback((): void => {
+		store.upsertMapper(group.localId, drawer.draft);
+		drawer.close();
+	}, [store, group.localId, drawer]);
+
+	const handleDelete = useCallback((): void => {
+		if (drawer.draft.id) {
+			store.removeMapper(group.localId, drawer.draft.id);
+		}
+		drawer.close();
+	}, [store, group.localId, drawer]);
+
+	return (
+		<div className="mappers-table__wrapper">
+			<Table testId={`mappers-table-${group.localId}`} className="am-table">
+				<TableHeader>
+					<TableRow>
+						<TableHead>#</TableHead>
+						<TableHead>Target</TableHead>
+						<TableHead>Sources</TableHead>
+						<TableHead>Writes to</TableHead>
+						<TableHead>Actions</TableHead>
+					</TableRow>
+				</TableHeader>
+				<TableBody>
+					{group.mappers.length === 0 && (
+						<TableRow>
+							<TableCell colSpan={COLUMN_COUNT} className="am-table__empty">
+								No mappings in this group yet.
+							</TableCell>
+						</TableRow>
+					)}
+					{group.mappers.map((mapper, index) => (
+						<MapperRow
+							key={mapper.localId}
+							mapper={mapper}
+							index={index}
+							onEdit={drawer.openForEdit}
+							onDelete={(localId): void => store.removeMapper(group.localId, localId)}
+							onToggle={(localId, enabled): void =>
+								store.toggleMapper(group.localId, localId, enabled)
+							}
+						/>
+					))}
+				</TableBody>
+			</Table>
+
+			<Button
+				variant="ghost"
+				color="primary"
+				size="sm"
+				prefix={<Plus size={14} />}
+				className="am-add-row"
+				onClick={drawer.openForAdd}
+				testId={`add-mapper-${group.localId}`}
+			>
+				Add mapping
+			</Button>
+
+			<MapperFormDrawer
+				isOpen={drawer.isOpen}
+				mode={drawer.mode}
+				draft={drawer.draft}
+				setDraft={drawer.setDraft}
+				onClose={drawer.close}
+				onSave={handleSave}
+				onDelete={handleDelete}
+				isSaving={false}
+				isDeleting={false}
+				saveError={null}
+			/>
+		</div>
+	);
+}
+
+export default MappersTable;
--- a/frontend/src/container/LLMObservabilityAttributeMapping/SourceAttributeRow.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/SourceAttributeRow.tsx
@@ -0,0 +1,115 @@
+import { Button } from '@signozhq/ui/button';
+import { SelectSimple } from '@signozhq/ui/select';
+import { useSortable } from '@dnd-kit/sortable';
+import { CSS } from '@dnd-kit/utilities';
+import { GripVertical, X } from '@signozhq/icons';
+
+import KeySearchInput from './KeySearchInput';
+import {
+	FieldContext,
+	FieldContextValue,
+	MapperOperation,
+	MapperOperationValue,
+	SourceConfig,
+} from './types';
+
+const CONTEXT_OPTIONS = [
+	{ value: FieldContext.attribute, label: 'Attribute' },
+	{ value: FieldContext.resource, label: 'Resource' },
+];
+
+const OPERATION_OPTIONS = [
+	{ value: MapperOperation.move, label: 'Move' },
+	{ value: MapperOperation.copy, label: 'Copy' },
+];
+
+interface SourceAttributeRowProps {
+	id: string;
+	index: number;
+	value: SourceConfig;
+	canRemove: boolean;
+	onChange: (index: number, patch: Partial<SourceConfig>) => void;
+	onRemove: (index: number) => void;
+}
+
+// A single draggable source row. Order = priority (top wins). Each source can
+// be read from a span attribute or the resource, and moved (delete source) or
+// copied (keep source). Only the grip is a drag handle.
+function SourceAttributeRow({
+	id,
+	index,
+	value,
+	canRemove,
+	onChange,
+	onRemove,
+}: SourceAttributeRowProps): JSX.Element {
+	const {
+		attributes,
+		listeners,
+		setNodeRef,
+		transform,
+		transition,
+		isDragging,
+	} = useSortable({ id });
+
+	const style = {
+		transform: CSS.Transform.toString(transform),
+		transition,
+		opacity: isDragging ? 0.6 : 1,
+	};
+
+	return (
+		<div className="mapper-form__source" ref={setNodeRef} style={style}>
+			<div
+				className="mapper-form__source-handle"
+				data-testid={`mapper-form-source-handle-${index}`}
+				{...attributes}
+				{...listeners}
+			>
+				<GripVertical size={14} />
+			</div>
+			<span className="mapper-form__source-index">{index + 1}</span>
+			<KeySearchInput
+				className="mapper-form__source-input"
+				placeholder="Source attribute key"
+				value={value.key}
+				fieldContext={value.context}
+				onChange={(key): void => onChange(index, { key })}
+				testId={`mapper-form-source-${index}`}
+			/>
+			<SelectSimple
+				className="mapper-form__source-select"
+				items={CONTEXT_OPTIONS}
+				value={value.context}
+				withPortal={false}
+				onChange={(next): void =>
+					onChange(index, { context: next as FieldContextValue })
+				}
+				testId={`mapper-form-source-context-${index}`}
+			/>
+			<SelectSimple
+				className="mapper-form__source-select"
+				items={OPERATION_OPTIONS}
+				value={value.operation}
+				withPortal={false}
+				onChange={(next): void =>
+					onChange(index, { operation: next as MapperOperationValue })
+				}
+				testId={`mapper-form-source-operation-${index}`}
+			/>
+			<Button
+				variant="ghost"
+				color="secondary"
+				size="icon"
+				aria-label="Remove source"
+				disabled={!canRemove}
+				onClick={(): void => onRemove(index)}
+				testId={`mapper-form-source-remove-${index}`}
+			>
+				<X size={14} />
+			</Button>
+		</div>
+	);
+}
+
+export default SourceAttributeRow;
--- a/frontend/src/container/LLMObservabilityAttributeMapping/tests/ConditionKeyList.test.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/tests/ConditionKeyList.test.tsx
@@ -0,0 +1,64 @@
+import { useState } from 'react';
+import { rest, server } from 'mocks-server/server';
+import { fireEvent, render, screen } from 'tests/test-utils';
+
+import ConditionKeyList from '../ConditionKeyList';
+import { FieldContext } from '../types';
+
+const FIELDS_ENDPOINT = '*/api/v1/fields/keys';
+
+function Harness({ initial = [] as string[] }): JSX.Element {
+	const [keys, setKeys] = useState<string[]>(initial);
+	return (
+		<ConditionKeyList
+			label="Attributes"
+			keys={keys}
+			placeholder="key"
+			addLabel="Add attribute key"
+			testIdPrefix="cond"
+			fieldContext={FieldContext.attribute}
+			onChange={setKeys}
+		/>
+	);
+}
+
+describe('ConditionKeyList', () => {
+	beforeEach(() => {
+		server.use(
+			rest.get(FIELDS_ENDPOINT, (_, res, ctx) =>
+				res(
+					ctx.status(200),
+					ctx.json({ status: 'success', data: { complete: true, keys: {} } }),
+				),
+			),
+		);
+	});
+
+	afterEach(() => {
+		server.resetHandlers();
+	});
+
+	it('renders no key rows and only the add button when empty', () => {
+		render(<Harness />);
+		expect(screen.queryByTestId('cond-0')).not.toBeInTheDocument();
+		expect(screen.getByTestId('cond-add')).toBeInTheDocument();
+	});
+
+	it('adds a key row when the add button is clicked', () => {
+		render(<Harness />);
+		fireEvent.click(screen.getByTestId('cond-add'));
+		expect(screen.getByTestId('cond-0')).toBeInTheDocument();
+	});
+
+	it('removes a key row when its remove button is clicked', () => {
+		render(<Harness initial={['gen_ai.', 'llm.']} />);
+
+		expect(screen.getByTestId('cond-0')).toBeInTheDocument();
+		expect(screen.getByTestId('cond-1')).toBeInTheDocument();
+
+		fireEvent.click(screen.getByTestId('cond-remove-1'));
+
+		expect(screen.queryByTestId('cond-1')).not.toBeInTheDocument();
+		expect(screen.getByTestId('cond-0')).toBeInTheDocument();
+	});
+});
--- a/frontend/src/container/LLMObservabilityAttributeMapping/tests/KeySearchInput.test.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/tests/KeySearchInput.test.tsx
@@ -0,0 +1,123 @@
+import { rest, server } from 'mocks-server/server';
+import { fireEvent, render, screen, waitFor } from 'tests/test-utils';
+
+import KeySearchInput from '../KeySearchInput';
+import { FieldContext } from '../types';
+
+const FIELDS_ENDPOINT = '*/api/v1/fields/keys';
+
+const mockKeysResponse = {
+	status: 'success',
+	data: {
+		complete: true,
+		keys: {
+			'gen_ai.request.model': [
+				{ name: 'gen_ai.request.model', fieldContext: 'attribute' },
+			],
+			'llm.model': [{ name: 'llm.model', fieldContext: 'attribute' }],
+		},
+	},
+};
+
+describe('KeySearchInput', () => {
+	let lastRequestParams: Record<string, string | null> = {};
+
+	beforeEach(() => {
+		lastRequestParams = {};
+		server.use(
+			rest.get(FIELDS_ENDPOINT, (req, res, ctx) => {
+				lastRequestParams = {
+					signal: req.url.searchParams.get('signal'),
+					fieldContext: req.url.searchParams.get('fieldContext'),
+					searchText: req.url.searchParams.get('searchText'),
+				};
+				return res(ctx.status(200), ctx.json(mockKeysResponse));
+			}),
+		);
+	});
+
+	afterEach(() => {
+		server.resetHandlers();
+	});
+
+	it('does not show suggestions until the input is focused', () => {
+		render(
+			<KeySearchInput
+				value=""
+				fieldContext={FieldContext.attribute}
+				onChange={jest.fn()}
+				testId="key"
+			/>,
+		);
+
+		expect(screen.queryByTestId('key-dropdown')).not.toBeInTheDocument();
+	});
+
+	it('shows suggestions on focus and selecting one calls onChange with the key', async () => {
+		const onChange = jest.fn();
+		render(
+			<KeySearchInput
+				value=""
+				fieldContext={FieldContext.attribute}
+				onChange={onChange}
+				testId="key"
+			/>,
+		);
+
+		fireEvent.focus(screen.getByTestId('key'));
+
+		const option = await screen.findByTestId('key-option-gen_ai.request.model');
+		fireEvent.mouseDown(option);
+
+		expect(onChange).toHaveBeenCalledWith('gen_ai.request.model');
+	});
+
+	it('queries traces with the resource context when fieldContext is resource', async () => {
+		render(
+			<KeySearchInput
+				value=""
+				fieldContext={FieldContext.resource}
+				onChange={jest.fn()}
+				testId="key"
+			/>,
+		);
+
+		fireEvent.focus(screen.getByTestId('key'));
+
+		await waitFor(() => expect(lastRequestParams.fieldContext).toBe('resource'));
+		expect(lastRequestParams.signal).toBe('traces');
+	});
+
+	it('accepts free text typed by the user (custom key)', () => {
+		const onChange = jest.fn();
+		render(
+			<KeySearchInput
+				value=""
+				fieldContext={FieldContext.attribute}
+				onChange={onChange}
+				testId="key"
+			/>,
+		);
+
+		fireEvent.change(screen.getByTestId('key'), {
+			target: { value: 'my.custom.key' },
+		});
+
+		expect(onChange).toHaveBeenCalledWith('my.custom.key');
+	});
+
+	it('does not query while disabled', () => {
+		render(
+			<KeySearchInput
+				value=""
+				fieldContext={FieldContext.attribute}
+				disabled
+				onChange={jest.fn()}
+				testId="key"
+			/>,
+		);
+
+		fireEvent.focus(screen.getByTestId('key'));
+		expect(screen.queryByTestId('key-dropdown')).not.toBeInTheDocument();
+	});
+});
--- a/frontend/src/container/LLMObservabilityAttributeMapping/tests/LLMObservabilityAttributeMapping.test.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/tests/LLMObservabilityAttributeMapping.test.tsx
@@ -0,0 +1,72 @@
+import { SpantypesSpanMapperGroupDTO } from 'api/generated/services/sigNoz.schemas';
+import { rest, server } from 'mocks-server/server';
+import { fireEvent, render, screen } from 'tests/test-utils';
+
+import LLMObservabilityAttributeMapping from '../LLMObservabilityAttributeMapping';
+
+const GROUPS_ENDPOINT = '*/api/v1/span_mapper_groups';
+const MAPPERS_ENDPOINT = '*/api/v1/span_mapper_groups/:groupId/span_mappers';
+
+const mockGroups: SpantypesSpanMapperGroupDTO[] = [
+	{
+		id: 'group-openai',
+		orgId: 'org-1',
+		name: 'OpenAI gateway',
+		enabled: true,
+		condition: { attributes: ['gen_ai.'], resource: [] },
+		updatedBy: 'gaurav.tewari@signoz.io',
+		updatedAt: '2026-06-10T09:30:00Z',
+	},
+];
+
+describe('LLMObservabilityAttributeMapping', () => {
+	beforeEach(() => {
+		server.use(
+			rest.get(MAPPERS_ENDPOINT, (_, res, ctx) =>
+				res(ctx.status(200), ctx.json({ status: 'success', data: { items: [] } })),
+			),
+			rest.get(GROUPS_ENDPOINT, (_, res, ctx) =>
+				res(
+					ctx.status(200),
+					ctx.json({ status: 'success', data: { items: mockGroups } }),
+				),
+			),
+		);
+	});
+
+	afterEach(() => {
+		server.resetHandlers();
+	});
+
+	it('renders the page header and the group row', async () => {
+		render(<LLMObservabilityAttributeMapping />);
+
+		await screen.findByTestId('group-name-group-openai');
+		expect(screen.getByText('Attribute Mapping')).toBeInTheDocument();
+		expect(screen.getByText('OpenAI gateway')).toBeInTheDocument();
+	});
+
+	it('opens the group drawer in Add mode with empty name', async () => {
+		render(<LLMObservabilityAttributeMapping />);
+
+		await screen.findByTestId('group-name-group-openai');
+		fireEvent.click(screen.getByTestId('add-group-row'));
+
+		const input = (await screen.findByTestId(
+			'group-form-name',
+		)) as HTMLInputElement;
+		expect(input.value).toBe('');
+	});
+
+	it('opens the group drawer in Edit mode prefilled with the group name', async () => {
+		render(<LLMObservabilityAttributeMapping />);
+
+		await screen.findByTestId('group-name-group-openai');
+		fireEvent.click(screen.getByTestId('group-edit-group-openai'));
+
+		const input = (await screen.findByTestId(
+			'group-form-name',
+		)) as HTMLInputElement;
+		expect(input.value).toBe('OpenAI gateway');
+	});
+});
--- a/frontend/src/container/LLMObservabilityAttributeMapping/tests/MapperFormDrawer.test.tsx
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/tests/MapperFormDrawer.test.tsx
@@ -0,0 +1,115 @@
+import { useState } from 'react';
+import { rest, server } from 'mocks-server/server';
+import { fireEvent, render, screen } from 'tests/test-utils';
+
+import MapperFormDrawer from '../MapperFormDrawer';
+import {
+	FieldContext,
+	MapperDraft,
+	MapperDraftMode,
+	MapperOperation,
+} from '../types';
+import { EMPTY_MAPPER_DRAFT } from '../utils';
+
+const FIELDS_ENDPOINT = '*/api/v1/fields/keys';
+
+const filledDraft: MapperDraft = {
+	id: null,
+	name: 'gen_ai.request.model',
+	fieldContext: FieldContext.attribute,
+	sources: [
+		{
+			key: 'llm.model',
+			context: FieldContext.attribute,
+			operation: MapperOperation.move,
+		},
+	],
+	enabled: true,
+};
+
+interface HarnessProps {
+	initialDraft?: MapperDraft;
+	mode?: MapperDraftMode;
+	onSave?: () => void;
+	onDelete?: () => void;
+}
+
+function Harness({
+	initialDraft = EMPTY_MAPPER_DRAFT,
+	mode = 'add',
+	onSave = jest.fn(),
+	onDelete = jest.fn(),
+}: HarnessProps): JSX.Element {
+	const [draft, setDraft] = useState<MapperDraft>(initialDraft);
+	return (
+		<MapperFormDrawer
+			isOpen
+			mode={mode}
+			draft={draft}
+			setDraft={setDraft}
+			onClose={jest.fn()}
+			onSave={onSave}
+			onDelete={onDelete}
+			isSaving={false}
+			isDeleting={false}
+			saveError={null}
+		/>
+	);
+}
+
+describe('MapperFormDrawer', () => {
+	beforeEach(() => {
+		server.use(
+			rest.get(FIELDS_ENDPOINT, (_, res, ctx) =>
+				res(
+					ctx.status(200),
+					ctx.json({ status: 'success', data: { complete: true, keys: {} } }),
+				),
+			),
+		);
+	});
+
+	afterEach(() => {
+		server.resetHandlers();
+	});
+
+	it('disables Create when the target/sources are empty', () => {
+		render(<Harness />);
+		expect(screen.getByTestId('mapper-form-save')).toBeDisabled();
+	});
+
+	it('enables Create with a target and a source key, and calls onSave', () => {
+		const onSave = jest.fn();
+		render(<Harness initialDraft={filledDraft} onSave={onSave} />);
+
+		const save = screen.getByTestId('mapper-form-save');
+		expect(save).not.toBeDisabled();
+
+		fireEvent.click(save);
+		expect(onSave).toHaveBeenCalledTimes(1);
+	});
+
+	it('adds a source row when "Add another source" is clicked', () => {
+		render(<Harness initialDraft={filledDraft} />);
+
+		expect(screen.queryByTestId('mapper-form-source-1')).not.toBeInTheDocument();
+		fireEvent.click(screen.getByTestId('mapper-form-add-source'));
+		expect(screen.getByTestId('mapper-form-source-1')).toBeInTheDocument();
+	});
+
+	it('makes the target read-only in edit mode and shows delete', () => {
+		const onDelete = jest.fn();
+		render(
+			<Harness
+				initialDraft={{ ...filledDraft, id: 'local-mapper-1' }}
+				mode="edit"
+				onDelete={onDelete}
+			/>,
+		);
+
+		expect(screen.getByTestId('mapper-form-target')).toBeDisabled();
+
+		fireEvent.click(screen.getByTestId('mapper-form-delete'));
+		expect(onDelete).toHaveBeenCalledTimes(1);
+	});
+});
--- a/frontend/src/container/LLMObservabilityAttributeMapping/tests/saveDraft.test.ts
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/tests/saveDraft.test.ts
@@ -0,0 +1,146 @@
+import { persistDraft, SaveMutations } from '../saveDraft';
+import {
+	DraftGroup,
+	DraftMapper,
+	FieldContext,
+	MapperOperation,
+} from '../types';
+
+function mapper(over: Partial<DraftMapper>): DraftMapper {
+	return {
+		localId: 'm',
+		serverId: 'm',
+		name: 'm',
+		fieldContext: FieldContext.attribute,
+		sources: [
+			{
+				key: 'x',
+				context: FieldContext.attribute,
+				operation: MapperOperation.move,
+			},
+		],
+		enabled: true,
+		...over,
+	};
+}
+
+function group(over: Partial<DraftGroup>): DraftGroup {
+	return {
+		localId: 'g',
+		serverId: 'g',
+		name: 'g',
+		attributes: [],
+		resource: [],
+		enabled: true,
+		mappers: [],
+		...over,
+	};
+}
+
+interface RecordedCalls {
+	createGroup: unknown[];
+	updateGroup: [string, unknown][];
+	deleteGroup: string[];
+	createMapper: [string, unknown][];
+	updateMapper: [string, string, unknown][];
+	deleteMapper: [string, string][];
+}
+
+function makeMutations(): { calls: RecordedCalls; mutations: SaveMutations } {
+	const calls: RecordedCalls = {
+		createGroup: [],
+		updateGroup: [],
+		deleteGroup: [],
+		createMapper: [],
+		updateMapper: [],
+		deleteMapper: [],
+	};
+	const mutations: SaveMutations = {
+		createGroup: async (data): Promise<string> => {
+			calls.createGroup.push(data);
+			return 'new-group-id';
+		},
+		updateGroup: async (id, data): Promise<void> => {
+			calls.updateGroup.push([id, data]);
+		},
+		deleteGroup: async (id): Promise<void> => {
+			calls.deleteGroup.push(id);
+		},
+		createMapper: async (gid, data): Promise<void> => {
+			calls.createMapper.push([gid, data]);
+		},
+		updateMapper: async (gid, mid, data): Promise<void> => {
+			calls.updateMapper.push([gid, mid, data]);
+		},
+		deleteMapper: async (gid, mid): Promise<void> => {
+			calls.deleteMapper.push([gid, mid]);
+		},
+	};
+	return { calls, mutations };
+}
+
+describe('persistDraft', () => {
+	it('issues the minimal set of create/update/delete calls', async () => {
+		const snapshot: DraftGroup[] = [
+			group({
+				localId: 'g1',
+				serverId: 'g1',
+				name: 'G1',
+				mappers: [
+					mapper({ localId: 'm1', serverId: 'm1', name: 'keep' }),
+					mapper({ localId: 'mdel', serverId: 'mdel', name: 'del' }),
+				],
+			}),
+			group({ localId: 'g2', serverId: 'g2', name: 'G2' }),
+		];
+
+		const draft: DraftGroup[] = [
+			group({
+				localId: 'g1',
+				serverId: 'g1',
+				name: 'G1-renamed', // changed -> update
+				mappers: [
+					mapper({ localId: 'm1', serverId: 'm1', name: 'keep' }), // unchanged
+					mapper({ localId: 'local-mapper-x', serverId: null, name: 'fresh' }), // new
+				],
+			}),
+			// g2 removed -> delete
+			group({
+				localId: 'local-group-y',
+				serverId: null,
+				name: 'G3',
+				mappers: [
+					mapper({ localId: 'local-mapper-z', serverId: null, name: 'g3map' }),
+				],
+			}),
+		];
+
+		const { calls, mutations } = makeMutations();
+		await persistDraft(snapshot, draft, mutations);
+
+		expect(calls.deleteGroup).toStrictEqual(['g2']);
+		expect(calls.updateGroup.map(([id]) => id)).toStrictEqual(['g1']);
+		expect(calls.deleteMapper).toStrictEqual([['g1', 'mdel']]);
+		// no-op mapper is not updated
+		expect(calls.updateMapper).toStrictEqual([]);
+		// new group created once, then its mapper created under the returned id
+		expect(calls.createGroup).toHaveLength(1);
+		const createMapperGroupIds = calls.createMapper.map(([gid]) => gid).sort();
+		expect(createMapperGroupIds).toStrictEqual(['g1', 'new-group-id']);
+	});
+
+	it('does nothing when the draft equals the snapshot', async () => {
+		const snapshot: DraftGroup[] = [group({ localId: 'g1', serverId: 'g1' })];
+		const draft: DraftGroup[] = [group({ localId: 'g1', serverId: 'g1' })];
+
+		const { calls, mutations } = makeMutations();
+		await persistDraft(snapshot, draft, mutations);
+
+		expect(calls.createGroup).toHaveLength(0);
+		expect(calls.updateGroup).toHaveLength(0);
+		expect(calls.deleteGroup).toHaveLength(0);
+		expect(calls.createMapper).toHaveLength(0);
+		expect(calls.updateMapper).toHaveLength(0);
+		expect(calls.deleteMapper).toHaveLength(0);
+	});
+});
--- a/frontend/src/container/LLMObservabilityAttributeMapping/tests/utils.test.ts
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/tests/utils.test.ts
@@ -0,0 +1,330 @@
+import {
+	DraftGroup,
+	FieldContext,
+	Mapper,
+	MapperDraft,
+	MapperGroup,
+	MapperOperation,
+	SourceConfig,
+} from '../types';
+import {
+	buildDraftGroup,
+	buildDraftMapper,
+	buildPostableGroup,
+	buildPostableMapper,
+	buildUpdatableMapper,
+	cleanKeys,
+	conditionFiltersFromGroup,
+	EMPTY_GROUP_DRAFT,
+	EMPTY_MAPPER_DRAFT,
+	formatTimestamp,
+	getMapperSources,
+	groupDraftFromNode,
+	isGroupDraftValid,
+	isMapperDraftValid,
+	mapperDraftFromNode,
+	nodeFromGroupDraft,
+	nodeFromMapperDraft,
+} from '../utils';
+
+function src(
+	key: string,
+	operation = MapperOperation.copy,
+	context = FieldContext.attribute,
+): SourceConfig {
+	return { key, context, operation };
+}
+
+function mapperDraft(over: Partial<MapperDraft>): MapperDraft {
+	return {
+		id: null,
+		name: 'target',
+		fieldContext: FieldContext.attribute,
+		sources: [src('a')],
+		enabled: true,
+		...over,
+	};
+}
+
+const mapper: Mapper = {
+	id: 'm1',
+	group_id: 'g1',
+	name: 'gen_ai.request.model',
+	enabled: true,
+	fieldContext: FieldContext.attribute,
+	config: {
+		sources: [
+			{
+				key: 'low',
+				context: FieldContext.attribute,
+				operation: MapperOperation.copy,
+				priority: 1,
+			},
+			{
+				key: 'high',
+				context: FieldContext.resource,
+				operation: MapperOperation.move,
+				priority: 3,
+			},
+			{
+				key: 'mid',
+				context: FieldContext.attribute,
+				operation: MapperOperation.copy,
+				priority: 2,
+			},
+		],
+	},
+};
+
+const group: MapperGroup = {
+	id: 'g1',
+	orgId: 'org1',
+	name: 'OpenAI',
+	enabled: true,
+	condition: { attributes: ['gen_ai.', 'llm.'], resource: [] },
+};
+
+describe('attribute-mapping utils', () => {
+	describe('cleanKeys', () => {
+		it('trims, drops empties, and de-duplicates preserving order', () => {
+			expect(cleanKeys([' a ', '', 'b', 'a', '  '])).toStrictEqual(['a', 'b']);
+		});
+	});
+
+	describe('getMapperSources', () => {
+		it('returns sources sorted by priority descending, preserving context/operation', () => {
+			expect(getMapperSources(mapper)).toStrictEqual([
+				{
+					key: 'high',
+					context: FieldContext.resource,
+					operation: MapperOperation.move,
+				},
+				{
+					key: 'mid',
+					context: FieldContext.attribute,
+					operation: MapperOperation.copy,
+				},
+				{
+					key: 'low',
+					context: FieldContext.attribute,
+					operation: MapperOperation.copy,
+				},
+			]);
+		});
+
+		it('returns empty array when there are no sources', () => {
+			expect(
+				getMapperSources({ ...mapper, config: { sources: null } }),
+			).toStrictEqual([]);
+		});
+	});
+
+	describe('conditionFiltersFromGroup', () => {
+		it('lists attribute clauses first, then resource clauses', () => {
+			expect(
+				conditionFiltersFromGroup({
+					attributes: ['gen_ai.', 'llm.'],
+					resource: ['service.name'],
+				}),
+			).toStrictEqual([
+				{ context: 'attribute', key: 'gen_ai.' },
+				{ context: 'attribute', key: 'llm.' },
+				{ context: 'resource', key: 'service.name' },
+			]);
+		});
+	});
+
+	describe('formatTimestamp', () => {
+		it('renders a dash for missing timestamps', () => {
+			expect(formatTimestamp(undefined)).toBe('—');
+		});
+	});
+
+	describe('draft-tree builders', () => {
+		it('builds a draft mapper node carrying server id, fieldContext and sources', () => {
+			expect(buildDraftMapper(mapper)).toStrictEqual({
+				localId: 'm1',
+				serverId: 'm1',
+				name: 'gen_ai.request.model',
+				fieldContext: FieldContext.attribute,
+				sources: [
+					{
+						key: 'high',
+						context: FieldContext.resource,
+						operation: MapperOperation.move,
+					},
+					{
+						key: 'mid',
+						context: FieldContext.attribute,
+						operation: MapperOperation.copy,
+					},
+					{
+						key: 'low',
+						context: FieldContext.attribute,
+						operation: MapperOperation.copy,
+					},
+				],
+				enabled: true,
+			});
+		});
+
+		it('builds a draft group node with nested mappers', () => {
+			const node = buildDraftGroup(group, [mapper]);
+			expect(node.localId).toBe('g1');
+			expect(node.attributes).toStrictEqual(['gen_ai.', 'llm.']);
+			expect(node.mappers).toHaveLength(1);
+			expect(node.mappers[0].localId).toBe('m1');
+		});
+	});
+
+	describe('node <-> form conversions', () => {
+		const node: DraftGroup = {
+			localId: 'g1',
+			serverId: 'g1',
+			name: 'OpenAI',
+			attributes: ['gen_ai.'],
+			resource: ['service.name'],
+			enabled: true,
+			mappers: [],
+		};
+
+		it('builds a form draft from a group node', () => {
+			expect(groupDraftFromNode(node)).toStrictEqual({
+				id: 'g1',
+				name: 'OpenAI',
+				attributes: ['gen_ai.'],
+				resource: ['service.name'],
+				enabled: true,
+			});
+		});
+
+		it('updates an existing group node, preserving its ids and mappers', () => {
+			const existing = { ...node, mappers: [buildDraftMapper(mapper)] };
+			const updated = nodeFromGroupDraft(
+				{
+					id: 'g1',
+					name: '  Renamed  ',
+					attributes: ['a', '', 'a'],
+					resource: ['service.name', ''],
+					enabled: false,
+				},
+				existing,
+			);
+			expect(updated.serverId).toBe('g1');
+			expect(updated.name).toBe('Renamed');
+			expect(updated.attributes).toStrictEqual(['a']);
+			expect(updated.resource).toStrictEqual(['service.name']);
+			expect(updated.mappers).toHaveLength(1);
+		});
+
+		it('round-trips a mapper node through the form and de-dups sources by key', () => {
+			const draft = mapperDraftFromNode(buildDraftMapper(mapper));
+			expect(draft.id).toBe('m1');
+			expect(draft.fieldContext).toBe(FieldContext.attribute);
+
+			const created = nodeFromMapperDraft(
+				mapperDraft({
+					id: null,
+					sources: [src('a', MapperOperation.move), src(' '), src('a'), src('b')],
+				}),
+			);
+			expect(created.serverId).toBeNull();
+			expect(created.localId).toMatch(/^local-mapper-/);
+			expect(created.sources).toStrictEqual([
+				{
+					key: 'a',
+					context: FieldContext.attribute,
+					operation: MapperOperation.move,
+				},
+				{
+					key: 'b',
+					context: FieldContext.attribute,
+					operation: MapperOperation.copy,
+				},
+			]);
+		});
+	});
+
+	describe('validation', () => {
+		it('validates a mapper draft (name + at least one keyed source)', () => {
+			expect(isMapperDraftValid(EMPTY_MAPPER_DRAFT)).toBe(false);
+			expect(
+				isMapperDraftValid(mapperDraft({ name: 'x', sources: [src(' ')] })),
+			).toBe(false);
+			expect(
+				isMapperDraftValid(mapperDraft({ name: 'x', sources: [src('a')] })),
+			).toBe(true);
+		});
+
+		it('validates a group draft (name only)', () => {
+			expect(isGroupDraftValid(EMPTY_GROUP_DRAFT)).toBe(false);
+			expect(
+				isGroupDraftValid({
+					id: null,
+					name: 'g',
+					attributes: [],
+					resource: [],
+					enabled: true,
+				}),
+			).toBe(true);
+		});
+	});
+
+	describe('API payload builders', () => {
+		it('derives descending priorities and carries per-source context/operation', () => {
+			const payload = buildPostableMapper(
+				mapperDraft({
+					name: ' target ',
+					fieldContext: FieldContext.resource,
+					sources: [
+						src('a', MapperOperation.move),
+						src('b', MapperOperation.copy, FieldContext.resource),
+					],
+				}),
+			);
+			expect(payload.name).toBe('target');
+			expect(payload.fieldContext).toBe(FieldContext.resource);
+			expect(payload.config.sources).toStrictEqual([
+				{
+					key: 'a',
+					context: FieldContext.attribute,
+					operation: MapperOperation.move,
+					priority: 2,
+				},
+				{
+					key: 'b',
+					context: FieldContext.resource,
+					operation: MapperOperation.copy,
+					priority: 1,
+				},
+			]);
+		});
+
+		it('omits name on the mapper update payload (immutable target)', () => {
+			const payload = buildUpdatableMapper(
+				mapperDraft({
+					id: 'm1',
+					enabled: false,
+					fieldContext: FieldContext.resource,
+				}),
+			);
+			expect(payload).not.toHaveProperty('name');
+			expect(payload.enabled).toBe(false);
+			expect(payload.fieldContext).toBe(FieldContext.resource);
+		});
+
+		it('cleans both attribute and resource condition keys', () => {
+			const payload = buildPostableGroup({
+				id: null,
+				name: 'g',
+				attributes: ['gen_ai.', '', 'gen_ai.'],
+				resource: ['service.name', '  ', 'service.name'],
+				enabled: true,
+			});
+			expect(payload.condition).toStrictEqual({
+				attributes: ['gen_ai.'],
+				resource: ['service.name'],
+			});
+		});
+	});
+});
--- a/frontend/src/container/LLMObservabilityAttributeMapping/saveDraft.ts
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/saveDraft.ts
@@ -0,0 +1,185 @@
+import {
+	SpantypesPostableSpanMapperDTO,
+	SpantypesPostableSpanMapperGroupDTO,
+	SpantypesUpdatableSpanMapperDTO,
+	SpantypesUpdatableSpanMapperGroupDTO,
+} from 'api/generated/services/sigNoz.schemas';
+
+import { DraftGroup, DraftMapper, SourceConfig } from './types';
+import {
+	buildPostableGroup,
+	buildPostableMapper,
+	buildUpdatableGroup,
+	buildUpdatableMapper,
+} from './utils';
+
+// Thin persistence surface the store wires to the generated mutations.
+// createGroup returns the new server id so its mappers can be created under it.
+export interface SaveMutations {
+	createGroup: (data: SpantypesPostableSpanMapperGroupDTO) => Promise<string>;
+	updateGroup: (
+		groupId: string,
+		data: SpantypesUpdatableSpanMapperGroupDTO,
+	) => Promise<void>;
+	deleteGroup: (groupId: string) => Promise<void>;
+	createMapper: (
+		groupId: string,
+		data: SpantypesPostableSpanMapperDTO,
+	) => Promise<void>;
+	updateMapper: (
+		groupId: string,
+		mapperId: string,
+		data: SpantypesUpdatableSpanMapperDTO,
+	) => Promise<void>;
+	deleteMapper: (groupId: string, mapperId: string) => Promise<void>;
+}
+
+function arraysEqual(a: string[], b: string[]): boolean {
+	return a.length === b.length && a.every((value, index) => value === b[index]);
+}
+
+function sourcesEqual(a: SourceConfig[], b: SourceConfig[]): boolean {
+	return (
+		a.length === b.length &&
+		a.every(
+			(source, index) =>
+				source.key === b[index].key &&
+				source.context === b[index].context &&
+				source.operation === b[index].operation,
+		)
+	);
+}
+
+function groupChanged(snapshot: DraftGroup, draft: DraftGroup): boolean {
+	return (
+		snapshot.name !== draft.name ||
+		snapshot.enabled !== draft.enabled ||
+		!arraysEqual(snapshot.attributes, draft.attributes) ||
+		!arraysEqual(snapshot.resource, draft.resource)
+	);
+}
+
+function mapperChanged(snapshot: DraftMapper, draft: DraftMapper): boolean {
+	return (
+		snapshot.enabled !== draft.enabled ||
+		snapshot.fieldContext !== draft.fieldContext ||
+		!sourcesEqual(snapshot.sources, draft.sources)
+	);
+}
+
+function groupDraftOf(
+	node: DraftGroup,
+): Parameters<typeof buildPostableGroup>[0] {
+	return {
+		id: node.serverId,
+		name: node.name,
+		attributes: node.attributes,
+		resource: node.resource,
+		enabled: node.enabled,
+	};
+}
+
+function mapperDraftOf(
+	node: DraftMapper,
+): Parameters<typeof buildPostableMapper>[0] {
+	return {
+		id: node.serverId,
+		name: node.name,
+		fieldContext: node.fieldContext,
+		sources: node.sources,
+		enabled: node.enabled,
+	};
+}
+
+async function persistMappers(
+	groupServerId: string,
+	snapshotMappers: DraftMapper[],
+	draftMappers: DraftMapper[],
+	m: SaveMutations,
+): Promise<void> {
+	const snapById = new Map(
+		snapshotMappers
+			.filter((mapper) => mapper.serverId)
+			.map((mapper) => [mapper.serverId as string, mapper]),
+	);
+	const draftServerIds = new Set(
+		draftMappers
+			.filter((mapper) => mapper.serverId)
+			.map((mapper) => mapper.serverId as string),
+	);
+
+	// Deleted mappers.
+	await Promise.all(
+		snapshotMappers
+			.filter((mapper) => mapper.serverId && !draftServerIds.has(mapper.serverId))
+			.map((mapper) => m.deleteMapper(groupServerId, mapper.serverId as string)),
+	);
+
+	// Created + updated mappers (sequential to keep ordering deterministic).
+	for (const mapper of draftMappers) {
+		if (!mapper.serverId) {
+			// eslint-disable-next-line no-await-in-loop
+			await m.createMapper(
+				groupServerId,
+				buildPostableMapper(mapperDraftOf(mapper)),
+			);
+		} else {
+			const snap = snapById.get(mapper.serverId);
+			if (!snap || mapperChanged(snap, mapper)) {
+				// eslint-disable-next-line no-await-in-loop
+				await m.updateMapper(
+					groupServerId,
+					mapper.serverId,
+					buildUpdatableMapper(mapperDraftOf(mapper)),
+				);
+			}
+		}
+	}
+}
+
+// Diffs the staged tree against the server snapshot and issues the minimal set
+// of create/update/delete calls to reconcile them.
+export async function persistDraft(
+	snapshot: DraftGroup[],
+	draft: DraftGroup[],
+	m: SaveMutations,
+): Promise<void> {
+	const snapById = new Map(
+		snapshot
+			.filter((group) => group.serverId)
+			.map((group) => [group.serverId as string, group]),
+	);
+	const draftServerIds = new Set(
+		draft
+			.filter((group) => group.serverId)
+			.map((group) => group.serverId as string),
+	);
+
+	// Deleted groups (cascades mappers server-side).
+	await Promise.all(
+		snapshot
+			.filter((group) => group.serverId && !draftServerIds.has(group.serverId))
+			.map((group) => m.deleteGroup(group.serverId as string)),
+	);
+
+	for (const group of draft) {
+		if (!group.serverId) {
+			// eslint-disable-next-line no-await-in-loop
+			const newId = await m.createGroup(buildPostableGroup(groupDraftOf(group)));
+			// eslint-disable-next-line no-await-in-loop
+			await persistMappers(newId, [], group.mappers, m);
+			continue;
+		}
+
+		const snap = snapById.get(group.serverId);
+		if (!snap || groupChanged(snap, group)) {
+			// eslint-disable-next-line no-await-in-loop
+			await m.updateGroup(
+				group.serverId,
+				buildUpdatableGroup(groupDraftOf(group)),
+			);
+		}
+		// eslint-disable-next-line no-await-in-loop
+		await persistMappers(group.serverId, snap?.mappers ?? [], group.mappers, m);
+	}
+}
--- a/frontend/src/container/LLMObservabilityAttributeMapping/types.ts
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/types.ts
@@ -0,0 +1,84 @@
+import {
+	SpantypesFieldContextDTO,
+	SpantypesSpanMapperConfigDTO,
+	SpantypesSpanMapperDTO,
+	SpantypesSpanMapperGroupConditionDTO,
+	SpantypesSpanMapperGroupDTO,
+	SpantypesSpanMapperOperationDTO,
+	SpantypesSpanMapperSourceDTO,
+} from 'api/generated/services/sigNoz.schemas';
+
+export type MapperGroup = SpantypesSpanMapperGroupDTO;
+export type MapperGroupCondition =
+	NonNullable<SpantypesSpanMapperGroupConditionDTO>;
+export type Mapper = SpantypesSpanMapperDTO;
+export type MapperConfig = SpantypesSpanMapperConfigDTO;
+export type MapperSource = SpantypesSpanMapperSourceDTO;
+
+export const FieldContext = SpantypesFieldContextDTO;
+export const MapperOperation = SpantypesSpanMapperOperationDTO;
+
+export type FieldContextValue = SpantypesFieldContextDTO;
+export type MapperOperationValue = SpantypesSpanMapperOperationDTO;
+
+// A single human-readable condition clause shown in the group's Filters column.
+export interface ConditionFilter {
+	context: 'attribute' | 'resource';
+	key: string;
+}
+
+export type MapperDraftMode = 'add' | 'edit';
+
+// One source candidate. `context` is where the key is read from (span
+// attribute or resource); `operation` is move (delete source) or copy (keep).
+// Priority is implicit in list order (top wins), derived on save.
+export interface SourceConfig {
+	key: string;
+	context: SpantypesFieldContextDTO;
+	operation: SpantypesSpanMapperOperationDTO;
+}
+
+// Editable form state for a mapper. `sources` is ordered highest priority
+// first; `fieldContext` is where the standardized target is written.
+export interface MapperDraft {
+	id: string | null;
+	name: string;
+	fieldContext: SpantypesFieldContextDTO;
+	sources: SourceConfig[];
+	enabled: boolean;
+}
+
+// Editable form state for a group. The group runs when a span carries a
+// span-attribute key matching `attributes` OR a resource key matching
+// `resource` (plain substring match).
+export interface GroupDraft {
+	id: string | null;
+	name: string;
+	attributes: string[];
+	resource: string[];
+	enabled: boolean;
+}
+
+// Working-copy node for a mapper. `localId` is a stable client key (the server
+// id once persisted, or a temporary id for not-yet-saved rows). `serverId` is
+// null until the row has been persisted.
+export interface DraftMapper {
+	localId: string;
+	serverId: string | null;
+	name: string;
+	fieldContext: SpantypesFieldContextDTO;
+	sources: SourceConfig[];
+	enabled: boolean;
+}
+
+// Working-copy node for a group, holding its mappers inline so the whole tree
+// can be staged locally and diffed against the server snapshot on save.
+export interface DraftGroup {
+	localId: string;
+	serverId: string | null;
+	name: string;
+	attributes: string[];
+	resource: string[];
+	enabled: boolean;
+	mappers: DraftMapper[];
+}
--- a/frontend/src/container/LLMObservabilityAttributeMapping/useAttributeMappingStore.ts
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/useAttributeMappingStore.ts
@@ -0,0 +1,287 @@
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { toast } from '@signozhq/ui/sonner';
+import { useQueries, useQueryClient } from 'react-query';
+import {
+	getListSpanMappersQueryOptions,
+	useCreateSpanMapper,
+	useCreateSpanMapperGroup,
+	useDeleteSpanMapper,
+	useDeleteSpanMapperGroup,
+	useListSpanMapperGroups,
+	useUpdateSpanMapper,
+	useUpdateSpanMapperGroup,
+} from 'api/generated/services/spanmapper';
+
+import { persistDraft, SaveMutations } from './saveDraft';
+import {
+	DraftGroup,
+	GroupDraft,
+	Mapper,
+	MapperDraft,
+	MapperGroup,
+} from './types';
+import {
+	buildDraftGroup,
+	nodeFromGroupDraft,
+	nodeFromMapperDraft,
+} from './utils';
+
+const GROUPS_KEY_PREFIX = '/api/v1/span_mapper_groups';
+
+function clone(groups: DraftGroup[]): DraftGroup[] {
+	return JSON.parse(JSON.stringify(groups)) as DraftGroup[];
+}
+
+export interface AttributeMappingStore {
+	groups: DraftGroup[];
+	isLoading: boolean;
+	isError: boolean;
+	isDirty: boolean;
+	isSaving: boolean;
+	saveError: string | null;
+	upsertGroup: (draft: GroupDraft) => void;
+	removeGroup: (localId: string) => void;
+	toggleGroup: (localId: string, enabled: boolean) => void;
+	upsertMapper: (groupLocalId: string, draft: MapperDraft) => void;
+	removeMapper: (groupLocalId: string, mapperLocalId: string) => void;
+	toggleMapper: (
+		groupLocalId: string,
+		mapperLocalId: string,
+		enabled: boolean,
+	) => void;
+	save: () => Promise<void>;
+	discard: () => void;
+}
+
+export function useAttributeMappingStore(): AttributeMappingStore {
+	const queryClient = useQueryClient();
+
+	const groupsQuery = useListSpanMapperGroups();
+	const serverGroups: MapperGroup[] = useMemo(
+		() => groupsQuery.data?.data?.items ?? [],
+		[groupsQuery.data],
+	);
+
+	const mapperQueries = useQueries(
+		serverGroups.map((group) =>
+			getListSpanMappersQueryOptions({ groupId: group.id }),
+		),
+	);
+
+	const mappersReady = mapperQueries.every((query) => !query.isLoading);
+	const ready = !groupsQuery.isLoading && mappersReady;
+
+	// Stable signature so the snapshot only rebuilds when server data changes.
+	const dataSignature = useMemo(
+		() =>
+			JSON.stringify(serverGroups) +
+			JSON.stringify(mapperQueries.map((query) => query.data?.data?.items ?? [])),
+		[serverGroups, mapperQueries],
+	);
+
+	const snapshot = useMemo<DraftGroup[]>(() => {
+		if (!ready) {
+			return [];
+		}
+		return serverGroups.map((group, index) =>
+			buildDraftGroup(
+				group,
+				(mapperQueries[index]?.data?.data?.items ?? []) as unknown as Mapper[],
+			),
+		);
+		// eslint-disable-next-line react-hooks/exhaustive-deps
+	}, [ready, dataSignature]);
+
+	const [draft, setDraft] = useState<DraftGroup[] | null>(null);
+
+	// Initialise the working copy once data is ready (and re-init after a save
+	// clears it). Never clobbers in-flight edits — only runs when draft is null.
+	useEffect(() => {
+		if (ready && draft === null) {
+			setDraft(clone(snapshot));
+		}
+	}, [ready, draft, snapshot]);
+
+	const [isSaving, setIsSaving] = useState(false);
+	const [saveError, setSaveError] = useState<string | null>(null);
+
+	const { mutateAsync: createGroup } = useCreateSpanMapperGroup();
+	const { mutateAsync: updateGroup } = useUpdateSpanMapperGroup();
+	const { mutateAsync: deleteGroup } = useDeleteSpanMapperGroup();
+	const { mutateAsync: createMapper } = useCreateSpanMapper();
+	const { mutateAsync: updateMapper } = useUpdateSpanMapper();
+	const { mutateAsync: deleteMapper } = useDeleteSpanMapper();
+
+	const mutations: SaveMutations = useMemo(
+		() => ({
+			createGroup: async (data): Promise<string> => {
+				const result = await createGroup({ data });
+				return result.data.id;
+			},
+			updateGroup: async (groupId, data): Promise<void> => {
+				await updateGroup({ pathParams: { groupId }, data });
+			},
+			deleteGroup: async (groupId): Promise<void> => {
+				await deleteGroup({ pathParams: { groupId } });
+			},
+			createMapper: async (groupId, data): Promise<void> => {
+				await createMapper({ pathParams: { groupId }, data });
+			},
+			updateMapper: async (groupId, mapperId, data): Promise<void> => {
+				await updateMapper({ pathParams: { groupId, mapperId }, data });
+			},
+			deleteMapper: async (groupId, mapperId): Promise<void> => {
+				await deleteMapper({ pathParams: { groupId, mapperId } });
+			},
+		}),
+		[
+			createGroup,
+			updateGroup,
+			deleteGroup,
+			createMapper,
+			updateMapper,
+			deleteMapper,
+		],
+	);
+
+	const upsertGroup = useCallback((groupDraft: GroupDraft): void => {
+		setDraft((prev) => {
+			const groups = prev ?? [];
+			if (groupDraft.id) {
+				return groups.map((group) =>
+					group.localId === groupDraft.id
+						? nodeFromGroupDraft(groupDraft, group)
+						: group,
+				);
+			}
+			return [...groups, nodeFromGroupDraft(groupDraft)];
+		});
+	}, []);
+
+	const removeGroup = useCallback((localId: string): void => {
+		setDraft((prev) => (prev ?? []).filter((group) => group.localId !== localId));
+	}, []);
+
+	const toggleGroup = useCallback((localId: string, enabled: boolean): void => {
+		setDraft((prev) =>
+			(prev ?? []).map((group) =>
+				group.localId === localId ? { ...group, enabled } : group,
+			),
+		);
+	}, []);
+
+	const upsertMapper = useCallback(
+		(groupLocalId: string, mapperDraft: MapperDraft): void => {
+			setDraft((prev) =>
+				(prev ?? []).map((group) => {
+					if (group.localId !== groupLocalId) {
+						return group;
+					}
+					if (mapperDraft.id) {
+						return {
+							...group,
+							mappers: group.mappers.map((mapper) =>
+								mapper.localId === mapperDraft.id
+									? nodeFromMapperDraft(mapperDraft, mapper)
+									: mapper,
+							),
+						};
+					}
+					return {
+						...group,
+						mappers: [...group.mappers, nodeFromMapperDraft(mapperDraft)],
+					};
+				}),
+			);
+		},
+		[],
+	);
+
+	const removeMapper = useCallback(
+		(groupLocalId: string, mapperLocalId: string): void => {
+			setDraft((prev) =>
+				(prev ?? []).map((group) =>
+					group.localId === groupLocalId
+						? {
+								...group,
+								mappers: group.mappers.filter(
+									(mapper) => mapper.localId !== mapperLocalId,
+								),
+							}
+						: group,
+				),
+			);
+		},
+		[],
+	);
+
+	const toggleMapper = useCallback(
+		(groupLocalId: string, mapperLocalId: string, enabled: boolean): void => {
+			setDraft((prev) =>
+				(prev ?? []).map((group) =>
+					group.localId === groupLocalId
+						? {
+								...group,
+								mappers: group.mappers.map((mapper) =>
+									mapper.localId === mapperLocalId ? { ...mapper, enabled } : mapper,
+								),
+							}
+						: group,
+				),
+			);
+		},
+		[],
+	);
+
+	const discard = useCallback((): void => {
+		setSaveError(null);
+		setDraft(clone(snapshot));
+	}, [snapshot]);
+
+	const save = useCallback(async (): Promise<void> => {
+		if (!draft) {
+			return;
+		}
+		setIsSaving(true);
+		setSaveError(null);
+		try {
+			await persistDraft(snapshot, draft, mutations);
+			await queryClient.invalidateQueries({
+				predicate: (query) =>
+					typeof query.queryKey?.[0] === 'string' &&
+					(query.queryKey[0] as string).startsWith(GROUPS_KEY_PREFIX),
+			});
+			// Re-initialise the working copy from the freshly-fetched server data.
+			setDraft(null);
+			toast.success('Attribute mapping changes saved');
+		} catch (error) {
+			const message = error instanceof Error ? error.message : 'Save failed';
+			setSaveError(message);
+			toast.error(`Failed to save changes: ${message}`);
+		} finally {
+			setIsSaving(false);
+		}
+	}, [draft, snapshot, mutations, queryClient]);
+
+	const isDirty = useMemo(
+		() => draft !== null && JSON.stringify(draft) !== JSON.stringify(snapshot),
+		[draft, snapshot],
+	);
+
+	return {
+		groups: draft ?? [],
+		isLoading: !ready || draft === null,
+		isError: groupsQuery.isError,
+		isDirty,
+		isSaving,
+		saveError,
+		upsertGroup,
+		removeGroup,
+		toggleGroup,
+		upsertMapper,
+		removeMapper,
+		toggleMapper,
+		save,
+		discard,
+	};
+}
--- a/frontend/src/container/LLMObservabilityAttributeMapping/useGroupFormDrawer.ts
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/useGroupFormDrawer.ts
@@ -0,0 +1,40 @@
+import { useCallback, useState } from 'react';
+
+import { DraftGroup, GroupDraft, MapperDraftMode } from './types';
+import { EMPTY_GROUP_DRAFT, groupDraftFromNode } from './utils';
+
+interface UseGroupFormDrawerResult {
+	isOpen: boolean;
+	mode: MapperDraftMode;
+	draft: GroupDraft;
+	setDraft: (next: GroupDraft) => void;
+	openForAdd: () => void;
+	openForEdit: (group: DraftGroup) => void;
+	close: () => void;
+}
+
+// Form state for the group drawer. Persistence is staged through the store,
+// so this hook only owns open/draft/mode.
+export function useGroupFormDrawer(): UseGroupFormDrawerResult {
+	const [isOpen, setIsOpen] = useState<boolean>(false);
+	const [mode, setMode] = useState<MapperDraftMode>('add');
+	const [draft, setDraft] = useState<GroupDraft>(EMPTY_GROUP_DRAFT);
+
+	const openForAdd = useCallback((): void => {
+		setMode('add');
+		setDraft(EMPTY_GROUP_DRAFT);
+		setIsOpen(true);
+	}, []);
+
+	const openForEdit = useCallback((group: DraftGroup): void => {
+		setMode('edit');
+		setDraft(groupDraftFromNode(group));
+		setIsOpen(true);
+	}, []);
+
+	const close = useCallback((): void => {
+		setIsOpen(false);
+	}, []);
+
+	return { isOpen, mode, draft, setDraft, openForAdd, openForEdit, close };
+}
--- a/frontend/src/container/LLMObservabilityAttributeMapping/useMapperFormDrawer.ts
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/useMapperFormDrawer.ts
@@ -0,0 +1,40 @@
+import { useCallback, useState } from 'react';
+
+import { DraftMapper, MapperDraft, MapperDraftMode } from './types';
+import { EMPTY_MAPPER_DRAFT, mapperDraftFromNode } from './utils';
+
+interface UseMapperFormDrawerResult {
+	isOpen: boolean;
+	mode: MapperDraftMode;
+	draft: MapperDraft;
+	setDraft: (next: MapperDraft) => void;
+	openForAdd: () => void;
+	openForEdit: (mapper: DraftMapper) => void;
+	close: () => void;
+}
+
+// Form state for the mapper drawer. Persistence is staged through the store,
+// so this hook only owns open/draft/mode.
+export function useMapperFormDrawer(): UseMapperFormDrawerResult {
+	const [isOpen, setIsOpen] = useState<boolean>(false);
+	const [mode, setMode] = useState<MapperDraftMode>('add');
+	const [draft, setDraft] = useState<MapperDraft>(EMPTY_MAPPER_DRAFT);
+
+	const openForAdd = useCallback((): void => {
+		setMode('add');
+		setDraft(EMPTY_MAPPER_DRAFT);
+		setIsOpen(true);
+	}, []);
+
+	const openForEdit = useCallback((mapper: DraftMapper): void => {
+		setMode('edit');
+		setDraft(mapperDraftFromNode(mapper));
+		setIsOpen(true);
+	}, []);
+
+	const close = useCallback((): void => {
+		setIsOpen(false);
+	}, []);
+
+	return { isOpen, mode, draft, setDraft, openForAdd, openForEdit, close };
+}
--- a/frontend/src/container/LLMObservabilityAttributeMapping/utils.ts
+++ b/frontend/src/container/LLMObservabilityAttributeMapping/utils.ts
@@ -0,0 +1,262 @@
+import {
+	SpantypesPostableSpanMapperDTO,
+	SpantypesPostableSpanMapperGroupDTO,
+	SpantypesUpdatableSpanMapperDTO,
+	SpantypesUpdatableSpanMapperGroupDTO,
+} from 'api/generated/services/sigNoz.schemas';
+import dayjs from 'dayjs';
+import { v4 as uuid } from 'uuid';
+
+import {
+	ConditionFilter,
+	DraftGroup,
+	DraftMapper,
+	FieldContext,
+	GroupDraft,
+	Mapper,
+	MapperDraft,
+	MapperGroup,
+	MapperOperation,
+	SourceConfig,
+} from './types';
+
+// Client-side id for not-yet-persisted rows. Prefixed so it never collides
+// with a server UUID and is easy to spot in logs.
+export function genLocalId(prefix: 'group' | 'mapper'): string {
+	return `local-${prefix}-${uuid()}`;
+}
+
+// Trimmed, de-duplicated, non-empty keys preserving input order.
+export function cleanKeys(keys: string[]): string[] {
+	const seen = new Set<string>();
+	const result: string[] = [];
+	keys.forEach((raw) => {
+		const key = raw.trim();
+		if (key && !seen.has(key)) {
+			seen.add(key);
+			result.push(key);
+		}
+	});
+	return result;
+}
+
+// Display clauses for a group's staged condition keys (span attribute keys
+// first, then resource keys).
+export function conditionFiltersFromGroup(group: {
+	attributes: string[];
+	resource: string[];
+}): ConditionFilter[] {
+	return [
+		...group.attributes.map((key) => ({ context: 'attribute' as const, key })),
+		...group.resource.map((key) => ({ context: 'resource' as const, key })),
+	];
+}
+
+// Source configs for a mapper, highest priority first (first match wins at
+// evaluation time).
+export function getMapperSources(mapper: Mapper): SourceConfig[] {
+	const sources = mapper.config?.sources ?? [];
+	return [...sources]
+		.sort((a, b) => b.priority - a.priority)
+		.map((source) => ({
+			key: source.key,
+			context: source.context,
+			operation: source.operation,
+		}));
+}
+
+// A blank source row. New sources default to `move` so the original key is
+// removed once standardized (the PRD default — minimizes duplication).
+export function createEmptySource(): SourceConfig {
+	return {
+		key: '',
+		context: FieldContext.attribute,
+		operation: MapperOperation.move,
+	};
+}
+
+export function formatTimestamp(iso?: string): string {
+	if (!iso) {
+		return '—';
+	}
+	return dayjs(iso).format('MMM D, YYYY HH:mm');
+}
+
+export const EMPTY_MAPPER_DRAFT: MapperDraft = {
+	id: null,
+	name: '',
+	fieldContext: FieldContext.attribute,
+	sources: [createEmptySource()],
+	enabled: true,
+};
+
+// Trimmed, de-duplicated (by key), non-empty sources in priority order,
+// preserving each source's context and operation.
+export function getCleanSources(draft: MapperDraft): SourceConfig[] {
+	const seen = new Set<string>();
+	const result: SourceConfig[] = [];
+	draft.sources.forEach((source) => {
+		const key = source.key.trim();
+		if (key && !seen.has(key)) {
+			seen.add(key);
+			result.push({ ...source, key });
+		}
+	});
+	return result;
+}
+
+export function isMapperDraftValid(draft: MapperDraft): boolean {
+	return draft.name.trim().length > 0 && getCleanSources(draft).length > 0;
+}
+
+// Priority is derived from list order so the first row wins.
+function buildSources(
+	draft: MapperDraft,
+): SpantypesPostableSpanMapperDTO['config']['sources'] {
+	const sources = getCleanSources(draft);
+	return sources.map((source, index) => ({
+		key: source.key,
+		context: source.context,
+		operation: source.operation,
+		priority: sources.length - index,
+	}));
+}
+
+export function buildPostableMapper(
+	draft: MapperDraft,
+): SpantypesPostableSpanMapperDTO {
+	return {
+		name: draft.name.trim(),
+		fieldContext: draft.fieldContext,
+		enabled: draft.enabled,
+		config: { sources: buildSources(draft) },
+	};
+}
+
+// The target name is immutable on update (UpdatableSpanMapper has no name).
+export function buildUpdatableMapper(
+	draft: MapperDraft,
+): SpantypesUpdatableSpanMapperDTO {
+	return {
+		fieldContext: draft.fieldContext,
+		enabled: draft.enabled,
+		config: { sources: buildSources(draft) },
+	};
+}
+
+export const EMPTY_GROUP_DRAFT: GroupDraft = {
+	id: null,
+	name: '',
+	attributes: [''],
+	resource: [],
+	enabled: true,
+};
+
+export function isGroupDraftValid(draft: GroupDraft): boolean {
+	return draft.name.trim().length > 0;
+}
+
+export function buildPostableGroup(
+	draft: GroupDraft,
+): SpantypesPostableSpanMapperGroupDTO {
+	return {
+		name: draft.name.trim(),
+		enabled: draft.enabled,
+		condition: {
+			attributes: cleanKeys(draft.attributes),
+			resource: cleanKeys(draft.resource),
+		},
+	};
+}
+
+// A full group payload is also a valid partial-update payload (all updatable
+// fields are present), so we reuse the postable builder.
+export function buildUpdatableGroup(
+	draft: GroupDraft,
+): SpantypesUpdatableSpanMapperGroupDTO {
+	return buildPostableGroup(draft);
+}
+
+// ---- working-copy (draft tree) helpers ----
+
+export function buildDraftMapper(mapper: Mapper): DraftMapper {
+	return {
+		localId: mapper.id,
+		serverId: mapper.id,
+		name: mapper.name,
+		fieldContext: mapper.fieldContext,
+		sources: getMapperSources(mapper),
+		enabled: mapper.enabled,
+	};
+}
+
+export function buildDraftGroup(
+	group: MapperGroup,
+	mappers: Mapper[],
+): DraftGroup {
+	return {
+		localId: group.id,
+		serverId: group.id,
+		name: group.name,
+		attributes: group.condition?.attributes ?? [],
+		resource: group.condition?.resource ?? [],
+		enabled: group.enabled,
+		mappers: mappers.map(buildDraftMapper),
+	};
+}
+
+// DraftGroup -> editable form state (id carries the localId).
+export function groupDraftFromNode(group: DraftGroup): GroupDraft {
+	return {
+		id: group.localId,
+		name: group.name,
+		attributes: group.attributes.length > 0 ? group.attributes : [''],
+		resource: group.resource,
+		enabled: group.enabled,
+	};
+}
+
+// DraftMapper -> editable form state (id carries the localId).
+export function mapperDraftFromNode(mapper: DraftMapper): MapperDraft {
+	return {
+		id: mapper.localId,
+		name: mapper.name,
+		fieldContext: mapper.fieldContext,
+		sources:
+			mapper.sources.length > 0
+				? mapper.sources.map((source) => ({ ...source }))
+				: [createEmptySource()],
+		enabled: mapper.enabled,
+	};
+}
+
+// Form state -> working-copy node. Reuses cleanKeys/getCleanSourceKeys so the
+// staged tree already holds normalized values.
+export function nodeFromGroupDraft(
+	draft: GroupDraft,
+	existing?: DraftGroup,
+): DraftGroup {
+	return {
+		localId: existing?.localId ?? genLocalId('group'),
+		serverId: existing?.serverId ?? null,
+		name: draft.name.trim(),
+		attributes: cleanKeys(draft.attributes),
+		resource: cleanKeys(draft.resource),
+		enabled: draft.enabled,
+		mappers: existing?.mappers ?? [],
+	};
+}
+
+export function nodeFromMapperDraft(
+	draft: MapperDraft,
+	existing?: DraftMapper,
+): DraftMapper {
+	return {
+		localId: existing?.localId ?? genLocalId('mapper'),
+		serverId: existing?.serverId ?? null,
+		name: draft.name.trim(),
+		fieldContext: draft.fieldContext,
+		sources: getCleanSources(draft),
+		enabled: draft.enabled,
+	};
+}
--- a/frontend/src/container/LLMObservabilityModelPricing/LLMObservabilityModelPricing.styles.scss
+++ b/frontend/src/container/LLMObservabilityModelPricing/LLMObservabilityModelPricing.styles.scss
@@ -0,0 +1,172 @@
+.llm-observability-model-pricing {
+	display: flex;
+	flex-direction: column;
+	gap: 16px;
+	padding: 24px 32px;
+
+	.page-header {
+		display: flex;
+		align-items: flex-start;
+		justify-content: space-between;
+		gap: 16px;
+
+		&__title {
+			h1 {
+				margin: 0;
+				font-size: 22px;
+				font-weight: 600;
+			}
+
+			p {
+				margin: 4px 0 0;
+				color: var(--bg-vanilla-400);
+				font-size: 13px;
+			}
+		}
+
+		&__actions {
+			display: flex;
+			gap: 8px;
+		}
+	}
+
+	.page-tabs {
+		.ant-tabs-nav {
+			margin-bottom: 0;
+		}
+	}
+
+	.filters-bar {
+		display: flex;
+		gap: 12px;
+		align-items: center;
+
+		&__search {
+			flex: 1;
+			max-width: 360px;
+		}
+
+		&__source,
+		&__currency {
+			min-width: 160px;
+		}
+
+		&__add {
+			margin-left: auto;
+		}
+	}
+
+	.page-error {
+		padding: 12px 16px;
+		border-radius: 4px;
+		background: rgba(255, 90, 90, 0.08);
+		color: var(--bg-cherry-400);
+		font-size: 13px;
+	}
+
+	.page-pagination {
+		display: flex;
+		justify-content: flex-end;
+		margin-top: 8px;
+	}
+
+	.page-footer {
+		color: var(--bg-vanilla-400);
+		font-size: 12px;
+	}
+}
+
+.model-costs-table {
+	.ant-table-thead > tr > th {
+		color: var(--bg-vanilla-400) !important;
+		font-size: 11px;
+		font-weight: 600;
+		letter-spacing: 0.08em;
+		text-transform: uppercase;
+	}
+
+	.ant-table-tbody > tr > td {
+		color: var(--bg-vanilla-400);
+	}
+
+	.model-cell {
+		display: flex;
+		flex-direction: column;
+		gap: 2px;
+		// Allow the flex children to shrink below their content width so the
+		// table's fixed-layout / nowrap cells truncate instead of overflowing
+		// into the Provider column.
+		min-width: 0;
+
+		&__name {
+			color: var(--bg-vanilla-100);
+			font-weight: 600;
+		}
+
+		&__name,
+		&__canonical-id {
+			max-width: 100%;
+			overflow: hidden;
+			text-overflow: ellipsis;
+			white-space: nowrap;
+		}
+
+		&__canonical-id {
+			color: var(--bg-vanilla-400);
+			font-family: var(--code-font-family, monospace);
+			font-size: 12px;
+		}
+	}
+
+	.price-cell {
+		font-family: var(--code-font-family, monospace);
+		color: var(--bg-vanilla-400);
+	}
+
+	.extra-buckets {
+		display: flex;
+		flex-wrap: wrap;
+		gap: 6px;
+
+		&__chip {
+			display: inline-flex;
+			align-items: center;
+			gap: 6px;
+			margin: 0;
+		}
+
+		&__key {
+			font-family: var(--code-font-family, monospace);
+			font-size: 12px;
+		}
+
+		&__price {
+			font-family: var(--code-font-family, monospace);
+			font-weight: 600;
+		}
+	}
+
+	.muted {
+		color: var(--bg-vanilla-400);
+	}
+
+	.source-badge {
+		margin: 0;
+
+		&--auto {
+			background: rgba(78, 116, 248, 0.12);
+			color: var(--bg-robin-400);
+			border-color: rgba(78, 116, 248, 0.24);
+		}
+
+		&--override {
+			background: rgba(245, 175, 25, 0.12);
+			color: var(--bg-amber-400);
+			border-color: rgba(245, 175, 25, 0.24);
+		}
+	}
+
+	&__row--selected {
+		background: rgba(78, 116, 248, 0.06);
+	}
+}
--- a/frontend/src/container/LLMObservabilityModelPricing/LLMObservabilityModelPricing.tsx
+++ b/frontend/src/container/LLMObservabilityModelPricing/LLMObservabilityModelPricing.tsx
@@ -0,0 +1,180 @@
+import { useMemo, useState } from 'react';
+import { Button } from '@signozhq/ui/button';
+import { Input } from '@signozhq/ui/input';
+import { Pagination } from '@signozhq/ui/pagination';
+import { SelectSimple } from '@signozhq/ui/select';
+import { Tabs } from '@signozhq/ui/tabs';
+import { Plus, Search } from '@signozhq/icons';
+import { useListLLMPricingRules } from 'api/generated/services/llmpricingrules';
+import useComponentPermission from 'hooks/useComponentPermission';
+import { useAppContext } from 'providers/App/App';
+
+import ModelCostDrawer from './ModelCostDrawer';
+import ModelCostsTable from './ModelCostsTable';
+import { useModelCostDrawer } from './useModelCostDrawer';
+import type { PricingRule, SourceFilter } from './types';
+import { filterRules } from './utils';
+
+import './LLMObservabilityModelPricing.styles.scss';
+
+const SOURCE_OPTIONS: { value: SourceFilter; label: string }[] = [
+	{ value: 'all', label: 'Source: All' },
+	{ value: 'auto', label: 'Auto-populated' },
+	{ value: 'override', label: 'User override' },
+];
+
+const CURRENCY_OPTIONS = [
+	{ value: 'USD', label: 'USD' },
+	{ value: 'EUR', label: 'EUR', disabled: true },
+	{ value: 'INR', label: 'INR', disabled: true },
+];
+
+const PAGE_SIZE = 20;
+
+function LLMObservabilityModelPricing(): JSX.Element {
+	const [search, setSearch] = useState<string>('');
+	const [source, setSource] = useState<SourceFilter>('all');
+	const [currency, setCurrency] = useState<string>('USD');
+	const [page, setPage] = useState<number>(1);
+
+	const { data, isLoading, isError } = useListLLMPricingRules({
+		offset: (page - 1) * PAGE_SIZE,
+		limit: PAGE_SIZE,
+	});
+
+	const { user } = useAppContext();
+	const [canManagePricing] = useComponentPermission(
+		['manage_llm_pricing'],
+		user.role,
+	);
+
+	const rules: PricingRule[] = useMemo(() => data?.data?.items || [], [data]);
+	const total = data?.data?.total ?? 0;
+
+	const filteredRules = useMemo(
+		() => filterRules(rules, search, source),
+		[rules, search, source],
+	);
+
+	const drawer = useModelCostDrawer();
+
+	// Search/source filter the current page client-side (the list endpoint only
+	// supports offset/limit), so reset to the first page when they change.
+	const resetToFirstPage = (): void => setPage(1);
+
+	return (
+		<div
+			className="llm-observability-model-pricing"
+			data-testid="llm-observability-model-pricing-page"
+		>
+			<header className="page-header">
+				<div className="page-header__title">
+					<h1>Configuration</h1>
+					<p>Model pricing and cost estimation settings</p>
+				</div>
+			</header>
+
+			<Tabs
+				className="page-tabs"
+				defaultValue="model-costs"
+				items={[
+					{ key: 'model-costs', label: 'Model costs', children: null },
+					{
+						key: 'unpriced-models',
+						label: 'Unpriced models',
+						disabled: true,
+						children: null,
+					},
+				]}
+			/>
+
+			<div className="filters-bar">
+				<Input
+					className="filters-bar__search"
+					placeholder="Search by model or provider…"
+					prefix={<Search size={14} />}
+					value={search}
+					onChange={(event): void => {
+						setSearch(event.target.value);
+						resetToFirstPage();
+					}}
+					testId="search-input"
+				/>
+				<SelectSimple
+					className="filters-bar__source"
+					value={source}
+					onChange={(value): void => {
+						setSource(value as SourceFilter);
+						resetToFirstPage();
+					}}
+					items={SOURCE_OPTIONS}
+					testId="source-select"
+				/>
+				<SelectSimple
+					className="filters-bar__currency"
+					value={currency}
+					onChange={(value): void => setCurrency(value as string)}
+					items={CURRENCY_OPTIONS}
+					testId="currency-select"
+				/>
+				{canManagePricing && (
+					<Button
+						variant="solid"
+						color="primary"
+						className="filters-bar__add"
+						prefix={<Plus size={14} />}
+						onClick={(): void => drawer.openForAdd()}
+						testId="add-model-cost-btn"
+					>
+						Add model cost
+					</Button>
+				)}
+			</div>
+
+			{isError && (
+				<div className="page-error" role="alert">
+					Failed to load pricing rules. Please try again.
+				</div>
+			)}
+
+			<ModelCostsTable
+				rules={filteredRules}
+				isLoading={isLoading}
+				selectedRuleId={drawer.selectedRuleId}
+				canManage={canManagePricing}
+				onEdit={drawer.openForEdit}
+			/>
+
+			{total > PAGE_SIZE && (
+				<Pagination
+					className="page-pagination"
+					total={total}
+					pageSize={PAGE_SIZE}
+					current={page}
+					onPageChange={setPage}
+				/>
+			)}
+
+			<footer className="page-footer">
+				Showing {filteredRules.length} of {total} model{total === 1 ? '' : 's'}
+				{' · '}All prices per 1M tokens (USD)
+			</footer>
+
+			<ModelCostDrawer
+				isOpen={drawer.isOpen}
+				mode={drawer.mode}
+				draft={drawer.draft}
+				setDraft={drawer.setDraft}
+				onClose={drawer.close}
+				onSave={drawer.save}
+				onDelete={drawer.deleteRule}
+				isSaving={drawer.isSaving}
+				isDeleting={drawer.isDeleting}
+				saveError={drawer.saveError}
+				canManage={canManagePricing}
+			/>
+		</div>
+	);
+}
+
+export default LLMObservabilityModelPricing;
--- a/frontend/src/container/LLMObservabilityModelPricing/ModelCostDrawer.styles.scss
+++ b/frontend/src/container/LLMObservabilityModelPricing/ModelCostDrawer.styles.scss
@@ -0,0 +1,313 @@
+.model-cost-drawer {
+	// Uniform horizontal padding across header / body / footer. The header and
+	// footer read these dialog vars; the body (rendered in drawer-description)
+	// is set directly below.
+	--dialog-header-padding: 20px 24px;
+	--dialog-footer-padding: 16px 24px;
+
+	// The drawer body — children render inside [data-slot='drawer-description']
+	// (this is the @signozhq drawer, not antd, so .ant-drawer-body was a no-op).
+	[data-slot='drawer-description'] {
+		display: flex;
+		flex-direction: column;
+		gap: 18px;
+		padding: 20px 24px;
+	}
+
+	[data-slot='select-content'] {
+		width: var(--radix-select-trigger-width);
+	}
+	display: flex;
+	overflow-y: auto;
+
+	&__title {
+		h3 {
+			margin: 0;
+			font-size: 16px;
+			font-weight: 600;
+		}
+
+		p {
+			margin: 4px 0 0;
+			color: var(--bg-vanilla-400);
+			font-size: 12px;
+		}
+	}
+
+	&__footer {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		// Horizontal padding is provided by the drawer-footer slot var above.
+		padding: 0;
+		width: 100%;
+
+		&-right {
+			display: flex;
+			gap: 8px;
+			margin-left: auto;
+		}
+	}
+
+	.drawer-section {
+		display: flex;
+		flex-direction: column;
+		gap: 6px;
+
+		label,
+		.field-label {
+			font-size: 12px;
+			font-weight: 600;
+			color: var(--bg-vanilla-200);
+		}
+
+		.help {
+			margin: 0;
+			font-size: 11px;
+		}
+	}
+
+	.muted {
+		color: var(--bg-vanilla-400);
+	}
+
+	.required {
+		color: var(--bg-cherry-400);
+	}
+
+	.full-width {
+		width: 100%;
+	}
+
+	.drawer-surface {
+		padding: 14px;
+		border-radius: 6px;
+		background: rgba(255, 255, 255, 0.02);
+		border: 1px solid var(--bg-slate-300);
+
+		&__head {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			margin-bottom: 10px;
+
+			h4 {
+				margin: 0;
+				font-size: 13px;
+				font-weight: 600;
+				text-transform: uppercase;
+				letter-spacing: 0.04em;
+				color: var(--bg-vanilla-300);
+			}
+		}
+	}
+
+	.managed-label {
+		display: inline-flex;
+		align-items: center;
+		gap: 4px;
+		font-size: 11px;
+		color: var(--bg-vanilla-400);
+	}
+
+	.pattern-box {
+		display: flex;
+		flex-direction: column;
+		gap: 12px;
+		padding: 12px;
+		border-radius: 6px;
+		background: rgba(255, 255, 255, 0.02);
+		border: 1px solid var(--bg-slate-300);
+	}
+
+	.pattern-chips {
+		display: flex;
+		flex-wrap: wrap;
+		gap: 6px;
+		min-height: 28px;
+	}
+
+	.pattern-chip {
+		display: inline-flex;
+		align-items: center;
+		gap: 4px;
+
+		&__remove {
+			background: transparent;
+			border: none;
+			padding: 0;
+			margin-left: 2px;
+			cursor: pointer;
+			color: inherit;
+			display: inline-flex;
+			align-items: center;
+
+			&:hover {
+				color: var(--bg-cherry-400);
+			}
+		}
+	}
+
+	.pattern-add {
+		display: flex;
+		gap: 6px;
+	}
+
+	.help {
+		code {
+			padding: 1px 4px;
+			border-radius: 3px;
+			background: rgba(255, 255, 255, 0.06);
+			font-family: var(--code-font-family, monospace);
+			font-size: 10px;
+		}
+	}
+
+	.source-radio-group {
+		// @signozhq/ui's RadioGroupItem defaults its unchecked border to
+		// --l3-background, which matches the drawer surface and makes the dot
+		// invisible. Override with a contrasting border so users can see the
+		// unchecked state.
+		--radio-group-item-border-color: var(--bg-slate-200);
+
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+		width: 100%;
+
+		// Layout overrides for @signozhq/ui's RadioGroupItem wrapper. The
+		// library injects single-class CSS at runtime (after our bundled
+		// stylesheet loads), so we use a two-class selector to win the
+		// cascade and force the wrapper to lay the dot on the left with the
+		// label text flush beside it.
+		.source-radio {
+			display: flex;
+			flex-direction: row;
+			align-items: flex-start;
+			justify-content: flex-start;
+			gap: 10px;
+			padding: 10px 12px;
+			border-radius: 4px;
+			border: 1px solid transparent;
+			background: rgba(255, 255, 255, 0.02);
+			margin: 0;
+			width: 100%;
+			// Include padding + border in the 100% width so the card fits inside
+			// the SOURCE surface instead of overflowing its right edge.
+			box-sizing: border-box;
+			cursor: pointer;
+			transition:
+				background-color 0.12s ease,
+				border-color 0.12s ease;
+
+			// The radio button itself: keep it fixed-size and aligned with
+			// the title baseline (margin-top compensates for align-items:
+			// flex-start vs the title's line-box).
+			> button[role='radio'] {
+				flex: 0 0 16px;
+				width: 16px;
+				height: 16px;
+				margin-top: 3px;
+			}
+
+			// The library wraps children in a <label>. Make it grow into the
+			// remaining width and reset the .drawer-section label typography
+			// leak (set earlier in this file) so the title/desc divs use
+			// their own styles.
+			> label {
+				flex: 1 1 auto;
+				min-width: 0;
+				display: block;
+				text-align: left;
+				cursor: pointer;
+				font-size: inherit;
+				font-weight: inherit;
+				color: inherit;
+			}
+
+			&__title {
+				font-weight: 600;
+				font-size: 13px;
+				color: var(--bg-vanilla-100);
+			}
+
+			&__desc {
+				margin-top: 2px;
+				font-size: 12px;
+				color: var(--bg-vanilla-400);
+			}
+
+			// Radix RadioGroupItem renders <button data-state="checked|unchecked">.
+			// Use :has() to highlight the wrapper card when its inner button is checked.
+			&.source-radio--auto:has(button[data-state='checked']) {
+				background: rgba(78, 116, 248, 0.1);
+				border-color: rgba(78, 116, 248, 0.3);
+			}
+
+			&.source-radio--override:has(button[data-state='checked']) {
+				background: rgba(245, 175, 25, 0.1);
+				border-color: rgba(245, 175, 25, 0.3);
+			}
+
+			&:hover {
+				background: rgba(255, 255, 255, 0.04);
+			}
+		}
+	}
+
+	.reset-confirm {
+		margin-top: 12px;
+		padding: 12px;
+		border-radius: 4px;
+		background: rgba(78, 116, 248, 0.06);
+		border: 1px solid rgba(78, 116, 248, 0.2);
+
+		p {
+			margin: 0 0 10px;
+			font-size: 12px;
+		}
+
+		&__actions {
+			display: flex;
+			gap: 8px;
+			justify-content: flex-end;
+		}
+	}
+
+	.pricing-grid {
+		display: grid;
+		grid-template-columns: 1fr 1fr;
+		gap: 12px;
+	}
+
+	.pricing-field {
+		display: flex;
+		flex-direction: column;
+		gap: 4px;
+
+		input {
+			width: 100%;
+		}
+	}
+
+	.cache-mode-field {
+		margin-top: 10px;
+	}
+
+	.extras-divider {
+		margin-top: 14px;
+		margin-bottom: 6px;
+		font-size: 11px;
+		text-transform: uppercase;
+		letter-spacing: 0.04em;
+		color: var(--bg-vanilla-400);
+	}
+
+	.drawer-error {
+		padding: 10px 12px;
+		border-radius: 4px;
+		background: rgba(255, 90, 90, 0.08);
+		color: var(--bg-cherry-400);
+		font-size: 12px;
+	}
+}
--- a/frontend/src/container/LLMObservabilityModelPricing/ModelCostDrawer.tsx
+++ b/frontend/src/container/LLMObservabilityModelPricing/ModelCostDrawer.tsx
@@ -0,0 +1,176 @@
+import { Button } from '@signozhq/ui/button';
+import { DrawerWrapper } from '@signozhq/ui/drawer';
+import { Input } from '@signozhq/ui/input';
+import { SelectSimple } from '@signozhq/ui/select';
+import { TooltipSimple } from '@signozhq/ui/tooltip';
+import { Trash2 } from '@signozhq/icons';
+
+import PatternEditor from './PatternEditor';
+import PricingFields from './PricingFields';
+import SourceSelector from './SourceSelector';
+import { PROVIDER_OPTIONS } from './constants';
+import { validateDraft } from './utils';
+import type { DrawerDraft, DrawerMode } from './types';
+import './ModelCostDrawer.styles.scss';
+
+interface ModelCostDrawerProps {
+	isOpen: boolean;
+	mode: DrawerMode;
+	draft: DrawerDraft;
+	setDraft: (next: DrawerDraft) => void;
+	onClose: () => void;
+	onSave: () => void;
+	onDelete: () => void;
+	isSaving: boolean;
+	isDeleting: boolean;
+	saveError: string | null;
+	canManage: boolean;
+}
+
+function ModelCostDrawer({
+	isOpen,
+	mode,
+	draft,
+	setDraft,
+	onClose,
+	onSave,
+	onDelete,
+	isSaving,
+	isDeleting,
+	saveError,
+	canManage,
+}: ModelCostDrawerProps): JSX.Element {
+	// Metadata (model id / provider / patterns / source) is editable by any
+	// manager. Pricing fields are editable only once the user picks "User
+	// override" — auto-populated pricing is managed by SigNoz. Write APIs are
+	// Admin-only, so non-managers can't edit anything.
+	const metadataReadOnly = !canManage;
+	const pricingReadOnly = !canManage || !draft.isOverride;
+
+	const validation = validateDraft(draft, mode);
+	const showValidationTooltip =
+		canManage && !validation.ok && !!validation.message;
+
+	const update = (patch: Partial<DrawerDraft>): void => {
+		setDraft({ ...draft, ...patch });
+	};
+
+	const footer = (
+		<div className="model-cost-drawer__footer">
+			{mode === 'edit' && canManage && (
+				<Button
+					variant="ghost"
+					color="destructive"
+					prefix={<Trash2 size={14} />}
+					onClick={onDelete}
+					loading={isDeleting}
+					testId="drawer-delete-btn"
+				>
+					Delete
+				</Button>
+			)}
+			<div className="model-cost-drawer__footer-right">
+				<Button
+					variant="outlined"
+					color="secondary"
+					onClick={onClose}
+					testId="drawer-cancel-btn"
+				>
+					{canManage ? 'Cancel' : 'Close'}
+				</Button>
+				{canManage && (
+					<TooltipSimple
+						title={showValidationTooltip ? validation.message : ''}
+						withPortal={false}
+					>
+						{/* span wrapper so the tooltip fires even when the button is disabled */}
+						<span className="model-cost-drawer__save-wrap">
+							<Button
+								variant="solid"
+								color="primary"
+								onClick={onSave}
+								loading={isSaving}
+								disabled={!validation.ok}
+								testId="drawer-save-btn"
+							>
+								Save
+							</Button>
+						</span>
+					</TooltipSimple>
+				)}
+			</div>
+		</div>
+	);
+
+	return (
+		<DrawerWrapper
+			open={isOpen}
+			onOpenChange={(open): void => {
+				if (!open) {
+					onClose();
+				}
+			}}
+			direction="right"
+			width="base"
+			className="model-cost-drawer"
+			footer={footer}
+			title={mode === 'edit' ? 'Edit model cost' : 'Add model cost'}
+			subTitle="Pricing computes gen_ai.estimated_total_cost at ingest."
+			drawerHeaderProps={{ className: 'model-cost-drawer__title' }}
+		>
+			<div className="drawer-section">
+				<label htmlFor="billing-model-id">Billing model ID</label>
+				<Input
+					id="billing-model-id"
+					placeholder="e.g. openai:gpt-4o"
+					value={draft.modelName}
+					disabled={mode === 'edit' || metadataReadOnly}
+					onChange={(e): void => update({ modelName: e.target.value })}
+					testId="drawer-model-id-input"
+				/>
+			</div>
+
+			<div className="drawer-section">
+				<label htmlFor="provider-select">Provider</label>
+				<SelectSimple
+					id="provider-select"
+					value={draft.provider}
+					onChange={(value): void => update({ provider: value as string })}
+					items={PROVIDER_OPTIONS}
+					disabled={mode === 'edit' || metadataReadOnly}
+					className="full-width"
+					withPortal={false}
+					testId="drawer-provider-select"
+				/>
+			</div>
+
+			<PatternEditor
+				patterns={draft.patterns}
+				isReadOnly={metadataReadOnly}
+				onChange={(patterns): void => update({ patterns })}
+			/>
+
+			<SourceSelector
+				isOverride={draft.isOverride}
+				isReadOnly={metadataReadOnly}
+				onChange={(isOverride): void => update({ isOverride })}
+			/>
+
+			<PricingFields
+				pricing={draft.pricing}
+				isReadOnly={pricingReadOnly}
+				onChange={(patch): void =>
+					setDraft({ ...draft, pricing: { ...draft.pricing, ...patch } })
+				}
+			/>
+
+			{saveError && (
+				<div className="drawer-error" role="alert">
+					{saveError}
+				</div>
+			)}
+		</DrawerWrapper>
+	);
+}
+
+export default ModelCostDrawer;
--- a/frontend/src/container/LLMObservabilityModelPricing/ModelCostsTable.tsx
+++ b/frontend/src/container/LLMObservabilityModelPricing/ModelCostsTable.tsx
@@ -0,0 +1,179 @@
+import { Badge } from '@signozhq/ui/badge';
+import { Button } from '@signozhq/ui/button';
+import {
+	Table,
+	TableBody,
+	TableCell,
+	TableHead,
+	TableHeader,
+	TableRow,
+} from '@signozhq/ui/table';
+import { ChevronDown } from '@signozhq/icons';
+import cx from 'classnames';
+import { startCase } from 'lodash-es';
+
+import type { PricingRule } from './types';
+import {
+	formatPricePerMillion,
+	getCanonicalId,
+	getExtraBuckets,
+	getRelativeLastSeen,
+	getSourceLabel,
+} from './utils';
+
+const COLUMN_COUNT = 8;
+
+interface ModelCostsTableProps {
+	rules: PricingRule[];
+	isLoading: boolean;
+	selectedRuleId: string | null;
+	canManage: boolean;
+	onEdit: (rule: PricingRule) => void;
+}
+
+interface RowProps {
+	rule: PricingRule;
+	isSelected: boolean;
+	canManage: boolean;
+	onEdit: (rule: PricingRule) => void;
+}
+
+function ModelCostRow({
+	rule,
+	isSelected,
+	canManage,
+	onEdit,
+}: RowProps): JSX.Element {
+	const buckets = getExtraBuckets(rule);
+
+	return (
+		<TableRow
+			className={cx({ 'model-costs-table__row--selected': isSelected })}
+			data-testid={`model-cost-row-${rule.id}`}
+		>
+			<TableCell>
+				<div className="model-cell">
+					<div
+						className="model-cell__name"
+						data-testid={`model-cell-name-${rule.id}`}
+					>
+						{rule.modelName}
+					</div>
+					<div
+						className="model-cell__canonical-id"
+						data-testid={`model-cell-canonical-id-${rule.id}`}
+					>
+						{getCanonicalId(rule)}
+					</div>
+				</div>
+			</TableCell>
+			<TableCell>{rule.provider}</TableCell>
+			<TableCell>
+				<span className="price-cell" data-testid={`price-cell-input-${rule.id}`}>
+					{formatPricePerMillion(rule.pricing?.input)}
+				</span>
+			</TableCell>
+			<TableCell>
+				<span className="price-cell" data-testid={`price-cell-output-${rule.id}`}>
+					{formatPricePerMillion(rule.pricing?.output)}
+				</span>
+			</TableCell>
+			<TableCell>
+				{buckets.length === 0 ? (
+					<span className="muted">—</span>
+				) : (
+					<div className="extra-buckets">
+						{buckets.map((bucket) => (
+							<Badge
+								key={bucket.key}
+								color="vanilla"
+								variant="outline"
+								className="extra-buckets__chip"
+							>
+								<span className="extra-buckets__key">{startCase(bucket.key)}</span>
+								<span className="extra-buckets__price">
+									{formatPricePerMillion(bucket.pricePerMillion)}
+								</span>
+							</Badge>
+						))}
+					</div>
+				)}
+			</TableCell>
+			<TableCell>
+				<Badge
+					color={rule.isOverride ? 'amber' : 'robin'}
+					variant="outline"
+					className="source-badge"
+					data-testid={`source-badge-${rule.id}`}
+				>
+					{getSourceLabel(rule)}
+				</Badge>
+			</TableCell>
+			<TableCell>{getRelativeLastSeen(rule)}</TableCell>
+			<TableCell>
+				<Button
+					variant="ghost"
+					color="secondary"
+					size="sm"
+					suffix={<ChevronDown size={14} />}
+					testId={`edit-rule-${rule.id}`}
+					onClick={(): void => onEdit(rule)}
+				>
+					{canManage ? 'Edit' : 'View'}
+				</Button>
+			</TableCell>
+		</TableRow>
+	);
+}
+
+function ModelCostsTable({
+	rules,
+	isLoading,
+	selectedRuleId,
+	canManage,
+	onEdit,
+}: ModelCostsTableProps): JSX.Element {
+	return (
+		<Table className="model-costs-table" testId="model-costs-table">
+			<TableHeader>
+				<TableRow>
+					<TableHead>Model</TableHead>
+					<TableHead>Provider</TableHead>
+					<TableHead>Input / 1M</TableHead>
+					<TableHead>Output / 1M</TableHead>
+					<TableHead>Extra buckets</TableHead>
+					<TableHead>Source</TableHead>
+					<TableHead>Last seen</TableHead>
+					<TableHead aria-label="Actions" />
+				</TableRow>
+			</TableHeader>
+			<TableBody>
+				{isLoading && rules.length === 0 && (
+					<TableRow>
+						<TableCell colSpan={COLUMN_COUNT} className="model-costs-table__empty">
+							Loading pricing rules…
+						</TableCell>
+					</TableRow>
+				)}
+				{!isLoading && rules.length === 0 && (
+					<TableRow>
+						<TableCell colSpan={COLUMN_COUNT} className="model-costs-table__empty">
+							No model costs yet.
+						</TableCell>
+					</TableRow>
+				)}
+				{rules.map((rule) => (
+					<ModelCostRow
+						key={rule.id}
+						rule={rule}
+						isSelected={rule.id === selectedRuleId}
+						canManage={canManage}
+						onEdit={onEdit}
+					/>
+				))}
+			</TableBody>
+		</Table>
+	);
+}
+
+export default ModelCostsTable;
--- a/frontend/src/container/LLMObservabilityModelPricing/PatternEditor.tsx
+++ b/frontend/src/container/LLMObservabilityModelPricing/PatternEditor.tsx
@@ -0,0 +1,96 @@
+import { useState } from 'react';
+import { Badge } from '@signozhq/ui/badge';
+import { Button } from '@signozhq/ui/button';
+import { Input } from '@signozhq/ui/input';
+import { X } from '@signozhq/icons';
+
+interface PatternEditorProps {
+	patterns: string[];
+	isReadOnly: boolean;
+	onChange: (patterns: string[]) => void;
+}
+
+// Model-name prefix patterns as removable chips + an add input.
+function PatternEditor({
+	patterns,
+	isReadOnly,
+	onChange,
+}: PatternEditorProps): JSX.Element {
+	const [patternInput, setPatternInput] = useState<string>('');
+
+	const addPattern = (): void => {
+		const next = patternInput.trim();
+		if (!next || patterns.includes(next)) {
+			setPatternInput('');
+			return;
+		}
+		onChange([...patterns, next]);
+		setPatternInput('');
+	};
+
+	const removePattern = (pattern: string): void => {
+		onChange(patterns.filter((p) => p !== pattern));
+	};
+
+	return (
+		<div className="drawer-section">
+			<span className="field-label">
+				Model name patterns <span className="muted">(prefix match)</span>
+			</span>
+			<div className="pattern-box">
+				<div className="pattern-chips">
+					{patterns.map((pattern) => (
+						<Badge
+							key={pattern}
+							color="vanilla"
+							variant="outline"
+							className="pattern-chip"
+						>
+							{pattern}*
+							{!isReadOnly && (
+								<button
+									type="button"
+									aria-label={`Remove pattern ${pattern}`}
+									className="pattern-chip__remove"
+									onClick={(): void => removePattern(pattern)}
+								>
+									<X size={10} />
+								</button>
+							)}
+						</Badge>
+					))}
+				</div>
+				{!isReadOnly && (
+					<div className="pattern-add">
+						<Input
+							placeholder="Add pattern…"
+							value={patternInput}
+							onChange={(e): void => setPatternInput(e.target.value)}
+							onKeyDown={(e): void => {
+								if (e.key === 'Enter') {
+									e.preventDefault();
+									addPattern();
+								}
+							}}
+							testId="drawer-pattern-input"
+						/>
+						<Button
+							variant="outlined"
+							color="secondary"
+							onClick={addPattern}
+							testId="drawer-pattern-add-btn"
+						>
+							+ Add
+						</Button>
+					</div>
+				)}
+			</div>
+			<p className="muted help">
+				Each pattern uses <strong>prefix matching</strong> against{' '}
+				<code>gen_ai.request.model</code>.
+			</p>
+		</div>
+	);
+}
+
+export default PatternEditor;
--- a/frontend/src/container/LLMObservabilityModelPricing/PricingFields.tsx
+++ b/frontend/src/container/LLMObservabilityModelPricing/PricingFields.tsx
@@ -0,0 +1,137 @@
+import { Input } from '@signozhq/ui/input';
+import { SelectSimple } from '@signozhq/ui/select';
+import { Lock } from '@signozhq/icons';
+import { LlmpricingruletypesLLMPricingRuleCacheModeDTO as CacheModeDTO } from 'api/generated/services/sigNoz.schemas';
+
+import { CACHE_MODE_OPTIONS } from './constants';
+import type { DrawerDraft } from './types';
+
+type Pricing = DrawerDraft['pricing'];
+
+interface PricingFieldsProps {
+	pricing: Pricing;
+	isReadOnly: boolean;
+	onChange: (patch: Partial<Pricing>) => void;
+}
+
+// Parses a number input's raw string. Empty → null (used by optional buckets),
+// otherwise a finite number (NaN coerced to 0).
+function parseAmount(raw: string): number | null {
+	if (raw.trim() === '') {
+		return null;
+	}
+	const value = Number(raw);
+	return Number.isFinite(value) ? value : 0;
+}
+
+function PricingFields({
+	pricing,
+	isReadOnly,
+	onChange,
+}: PricingFieldsProps): JSX.Element {
+	const hasCacheBucket =
+		pricing.cacheRead !== null || pricing.cacheWrite !== null;
+
+	return (
+		<div className="drawer-section drawer-surface">
+			<div className="drawer-surface__head">
+				<h4>Pricing (per 1M tokens, USD)</h4>
+				{isReadOnly && (
+					<span className="managed-label" data-testid="drawer-readonly-label">
+						<Lock size={12} />
+						Read-only
+					</span>
+				)}
+			</div>
+			<div className="pricing-grid">
+				<div className="pricing-field">
+					<label htmlFor="input-cost">
+						Input cost <span className="required">*</span>
+					</label>
+					<Input
+						id="input-cost"
+						type="number"
+						min={0}
+						step={0.01}
+						value={pricing.input}
+						disabled={isReadOnly}
+						onChange={(e): void =>
+							onChange({ input: parseAmount(e.target.value) ?? 0 })
+						}
+						testId="drawer-input-cost"
+					/>
+				</div>
+				<div className="pricing-field">
+					<label htmlFor="output-cost">
+						Output cost <span className="required">*</span>
+					</label>
+					<Input
+						id="output-cost"
+						type="number"
+						min={0}
+						step={0.01}
+						value={pricing.output}
+						disabled={isReadOnly}
+						onChange={(e): void =>
+							onChange({ output: parseAmount(e.target.value) ?? 0 })
+						}
+						testId="drawer-output-cost"
+					/>
+				</div>
+			</div>
+
+			<div className="extras-divider">Extra pricing buckets</div>
+			<div className="pricing-grid">
+				<div className="pricing-field">
+					<label htmlFor="cache-read">cache_read</label>
+					<Input
+						id="cache-read"
+						type="number"
+						min={0}
+						step={0.01}
+						value={pricing.cacheRead ?? ''}
+						placeholder="—"
+						disabled={isReadOnly}
+						onChange={(e): void =>
+							onChange({ cacheRead: parseAmount(e.target.value) })
+						}
+						testId="drawer-cache-read-cost"
+					/>
+				</div>
+				<div className="pricing-field">
+					<label htmlFor="cache-write">cache_write</label>
+					<Input
+						id="cache-write"
+						type="number"
+						min={0}
+						step={0.01}
+						value={pricing.cacheWrite ?? ''}
+						placeholder="—"
+						disabled={isReadOnly}
+						onChange={(e): void =>
+							onChange({ cacheWrite: parseAmount(e.target.value) })
+						}
+						testId="drawer-cache-write-cost"
+					/>
+				</div>
+			</div>
+			{hasCacheBucket && (
+				<div className="pricing-field cache-mode-field">
+					<label htmlFor="cache-mode">Cache mode</label>
+					<SelectSimple
+						id="cache-mode"
+						value={pricing.cacheMode}
+						items={CACHE_MODE_OPTIONS}
+						onChange={(v): void => onChange({ cacheMode: v as CacheModeDTO })}
+						disabled={isReadOnly}
+						className="full-width"
+						withPortal={false}
+						testId="drawer-cache-mode"
+					/>
+				</div>
+			)}
+		</div>
+	);
+}
+
+export default PricingFields;
--- a/frontend/src/container/LLMObservabilityModelPricing/SourceSelector.tsx
+++ b/frontend/src/container/LLMObservabilityModelPricing/SourceSelector.tsx
@@ -0,0 +1,103 @@
+import { useState } from 'react';
+import { Button } from '@signozhq/ui/button';
+import { RadioGroup, RadioGroupItem } from '@signozhq/ui/radio-group';
+import { Lock } from '@signozhq/icons';
+
+interface SourceSelectorProps {
+	isOverride: boolean;
+	isReadOnly: boolean;
+	onChange: (isOverride: boolean) => void;
+}
+
+// Auto-populated vs user-override selector, with a confirm step before
+// discarding custom values back to defaults.
+function SourceSelector({
+	isOverride,
+	isReadOnly,
+	onChange,
+}: SourceSelectorProps): JSX.Element {
+	const [showResetConfirm, setShowResetConfirm] = useState<boolean>(false);
+
+	const handleSourceChange = (value: 'auto' | 'override'): void => {
+		if (value === 'auto' && isOverride) {
+			setShowResetConfirm(true);
+			return;
+		}
+		if (value === 'override' && !isOverride) {
+			onChange(true);
+		}
+	};
+
+	const confirmReset = (): void => {
+		onChange(false);
+		setShowResetConfirm(false);
+	};
+
+	return (
+		<div className="drawer-section drawer-surface">
+			<div className="drawer-surface__head">
+				<h4>Source</h4>
+				{isReadOnly && (
+					<span className="managed-label" data-testid="drawer-managed-label">
+						<Lock size={12} />
+						Managed by SigNoz
+					</span>
+				)}
+			</div>
+			<RadioGroup
+				value={isOverride ? 'override' : 'auto'}
+				onChange={(value): void => handleSourceChange(value as 'auto' | 'override')}
+				className="source-radio-group"
+			>
+				<RadioGroupItem
+					value="auto"
+					containerClassName="source-radio source-radio--auto"
+					testId="drawer-source-auto"
+				>
+					<div className="source-radio__title">Auto-populated</div>
+					<div className="source-radio__desc">Default pricing from SigNoz.</div>
+				</RadioGroupItem>
+				<RadioGroupItem
+					value="override"
+					containerClassName="source-radio source-radio--override"
+					testId="drawer-source-override"
+				>
+					<div className="source-radio__title">User override</div>
+					<div className="source-radio__desc">Custom pricing. Takes precedence.</div>
+				</RadioGroupItem>
+			</RadioGroup>
+			{showResetConfirm && (
+				<div
+					className="reset-confirm"
+					role="dialog"
+					aria-label="Reset to default pricing"
+				>
+					<p>
+						Reset to default pricing? Custom values will be discarded. it might take
+						24 hours for changes to take effect.
+					</p>
+					<div className="reset-confirm__actions">
+						<Button
+							variant="outlined"
+							color="secondary"
+							onClick={(): void => setShowResetConfirm(false)}
+							testId="drawer-reset-keep-btn"
+						>
+							Keep
+						</Button>
+						<Button
+							variant="solid"
+							color="primary"
+							onClick={confirmReset}
+							testId="drawer-reset-confirm-btn"
+						>
+							Reset
+						</Button>
+					</div>
+				</div>
+			)}
+		</div>
+	);
+}
+
+export default SourceSelector;
--- a/frontend/src/container/LLMObservabilityModelPricing/tests/LLMObservabilityModelPricing.test.tsx
+++ b/frontend/src/container/LLMObservabilityModelPricing/tests/LLMObservabilityModelPricing.test.tsx
@@ -0,0 +1,149 @@
+import {
+	LlmpricingruletypesLLMPricingRuleUnitDTO as UnitDTO,
+	type LlmpricingruletypesLLMPricingRuleDTO,
+} from 'api/generated/services/sigNoz.schemas';
+import { rest, server } from 'mocks-server/server';
+import { fireEvent, render, screen } from 'tests/test-utils';
+
+import LLMObservabilityModelPricing from '../LLMObservabilityModelPricing';
+
+const ENDPOINT = '*/api/v1/llm_pricing_rules';
+
+const mockRules: LlmpricingruletypesLLMPricingRuleDTO[] = [
+	{
+		id: 'rule-gpt4o',
+		orgId: 'org-1',
+		modelName: 'gpt-4o',
+		provider: 'OpenAI',
+		modelPattern: ['gpt-4o'],
+		isOverride: false,
+		enabled: true,
+		unit: UnitDTO.per_million_tokens,
+		pricing: { input: 15, output: 60 },
+	},
+	{
+		id: 'rule-llama',
+		orgId: 'org-1',
+		modelName: 'llama-3.1-70b',
+		provider: 'Self-hosted',
+		modelPattern: ['llama-3.1'],
+		isOverride: true,
+		enabled: true,
+		unit: UnitDTO.per_million_tokens,
+		pricing: { input: 0, output: 0 },
+	},
+];
+
+describe('LLMObservabilityModelPricing', () => {
+	beforeEach(() => {
+		server.use(
+			rest.get(ENDPOINT, (_, res, ctx) =>
+				res(
+					ctx.status(200),
+					ctx.json({
+						status: 'success',
+						data: {
+							items: mockRules,
+							limit: 100,
+							offset: 0,
+							total: mockRules.length,
+						},
+					}),
+				),
+			),
+		);
+	});
+
+	afterEach(() => {
+		server.resetHandlers();
+	});
+
+	it('renders the page header and both rules', async () => {
+		render(<LLMObservabilityModelPricing />);
+
+		await screen.findByText('gpt-4o');
+		expect(screen.getByText('Configuration')).toBeInTheDocument();
+		expect(screen.getByText('llama-3.1-70b')).toBeInTheDocument();
+		expect(screen.getByText('openai:gpt-4o')).toBeInTheDocument();
+	});
+
+	it('filters rules by the search input', async () => {
+		render(<LLMObservabilityModelPricing />);
+
+		await screen.findByText('gpt-4o');
+
+		fireEvent.change(screen.getByTestId('search-input'), {
+			target: { value: 'llama' },
+		});
+
+		expect(screen.queryByText('gpt-4o')).not.toBeInTheDocument();
+		expect(screen.getByText('llama-3.1-70b')).toBeInTheDocument();
+	});
+
+	it('opens the drawer in Add mode when the Add button is clicked', async () => {
+		render(<LLMObservabilityModelPricing />);
+
+		await screen.findByText('gpt-4o');
+		fireEvent.click(screen.getByTestId('add-model-cost-btn'));
+
+		const input = (await screen.findByTestId(
+			'drawer-model-id-input',
+		)) as HTMLInputElement;
+		expect(input).toBeInTheDocument();
+		expect(input.value).toBe('');
+	});
+
+	it('opens the drawer in Edit mode with prefilled values when a row Edit is clicked', async () => {
+		render(<LLMObservabilityModelPricing />);
+
+		await screen.findByText('gpt-4o');
+		fireEvent.click(screen.getByTestId('edit-rule-rule-gpt4o'));
+
+		const input = (await screen.findByTestId(
+			'drawer-model-id-input',
+		)) as HTMLInputElement;
+		expect(input).toBeInTheDocument();
+		expect(input.value).toBe('gpt-4o');
+	});
+
+	it('hides the Add button for non-admin users (write APIs are Admin-only)', async () => {
+		render(<LLMObservabilityModelPricing />, {}, { role: 'VIEWER' });
+
+		await screen.findByText('gpt-4o');
+		expect(screen.queryByTestId('add-model-cost-btn')).not.toBeInTheDocument();
+		// rows still open in read-only "View" mode
+		expect(screen.getByTestId('edit-rule-rule-gpt4o')).toHaveTextContent('View');
+	});
+
+	it('paginates server-side: selecting page 2 requests the next offset', async () => {
+		const requestedOffsets: number[] = [];
+		server.use(
+			rest.get(ENDPOINT, (req, res, ctx) => {
+				const offset = Number(req.url.searchParams.get('offset') ?? '0');
+				requestedOffsets.push(offset);
+				return res(
+					ctx.status(200),
+					ctx.json({
+						status: 'success',
+						data: {
+							items: [
+								{ ...mockRules[0], id: `rule-${offset}`, modelName: `model-${offset}` },
+							],
+							limit: 20,
+							offset,
+							total: 25,
+						},
+					}),
+				);
+			}),
+		);
+
+		render(<LLMObservabilityModelPricing />);
+
+		await screen.findByText('model-0');
+		fireEvent.click(screen.getByRole('button', { name: '2' }));
+
+		await screen.findByText('model-20');
+		expect(requestedOffsets).toContain(20);
+	});
+});
--- a/frontend/src/container/LLMObservabilityModelPricing/tests/ModelCostDrawer.test.tsx
+++ b/frontend/src/container/LLMObservabilityModelPricing/tests/ModelCostDrawer.test.tsx
@@ -0,0 +1,220 @@
+import { useState } from 'react';
+import userEvent from '@testing-library/user-event';
+import { fireEvent, render, screen } from 'tests/test-utils';
+
+import { EMPTY_DRAFT } from '../constants';
+import type { DrawerDraft } from '../types';
+import ModelCostDrawer from '../ModelCostDrawer';
+
+interface HarnessProps {
+	initialDraft?: DrawerDraft;
+	mode?: 'add' | 'edit';
+	canManage?: boolean;
+	onSave?: () => void;
+	onDelete?: () => void;
+}
+
+function Harness({
+	initialDraft = {
+		...EMPTY_DRAFT,
+		modelName: 'gpt-4o',
+		pricing: { ...EMPTY_DRAFT.pricing, input: 1, output: 1 },
+	},
+	mode = 'add',
+	canManage = true,
+	onSave = jest.fn(),
+	onDelete = jest.fn(),
+}: HarnessProps): JSX.Element {
+	const [draft, setDraft] = useState<DrawerDraft>(initialDraft);
+	return (
+		<ModelCostDrawer
+			isOpen
+			mode={mode}
+			draft={draft}
+			setDraft={setDraft}
+			onClose={jest.fn()}
+			onSave={onSave}
+			onDelete={onDelete}
+			isSaving={false}
+			isDeleting={false}
+			saveError={null}
+			canManage={canManage}
+		/>
+	);
+}
+
+describe('ModelCostDrawer', () => {
+	it('adds a pattern chip when the user types and presses Enter', () => {
+		render(<Harness />);
+
+		fireEvent.change(screen.getByTestId('drawer-pattern-input'), {
+			target: { value: 'gpt-4o-mini' },
+		});
+		fireEvent.keyDown(screen.getByTestId('drawer-pattern-input'), {
+			key: 'Enter',
+			code: 'Enter',
+		});
+
+		expect(screen.getByText('gpt-4o-mini*')).toBeInTheDocument();
+	});
+
+	it('disables pricing fields when isOverride is false', () => {
+		render(
+			<Harness
+				mode="edit"
+				initialDraft={{
+					...EMPTY_DRAFT,
+					id: 'rule-1',
+					modelName: 'gpt-4o',
+					provider: 'OpenAI',
+					isOverride: false,
+				}}
+			/>,
+		);
+
+		expect(screen.getByTestId('drawer-input-cost')).toBeDisabled();
+		expect(screen.getByTestId('drawer-output-cost')).toBeDisabled();
+	});
+
+	it('enables pricing fields when isOverride is true', () => {
+		render(
+			<Harness
+				mode="edit"
+				initialDraft={{
+					...EMPTY_DRAFT,
+					id: 'rule-1',
+					modelName: 'gpt-4o',
+					provider: 'OpenAI',
+					isOverride: true,
+				}}
+			/>,
+		);
+
+		expect(screen.getByTestId('drawer-input-cost')).not.toBeDisabled();
+		expect(screen.getByTestId('drawer-output-cost')).not.toBeDisabled();
+	});
+
+	it('disables the Provider select in Edit mode but allows it in Add mode', () => {
+		const { unmount } = render(<Harness mode="add" />);
+
+		expect(screen.getByTestId('drawer-provider-select')).not.toHaveAttribute(
+			'data-disabled',
+		);
+		unmount();
+
+		render(
+			<Harness
+				mode="edit"
+				initialDraft={{
+					...EMPTY_DRAFT,
+					id: 'rule-1',
+					modelName: 'gpt-4o',
+					provider: 'OpenAI',
+					isOverride: true,
+				}}
+			/>,
+		);
+
+		expect(screen.getByTestId('drawer-provider-select')).toHaveAttribute(
+			'data-disabled',
+		);
+	});
+
+	it('keeps metadata editable but locks pricing when source is auto-populated', () => {
+		render(
+			<Harness
+				mode="add"
+				initialDraft={{ ...EMPTY_DRAFT, modelName: 'gpt-4o', isOverride: false }}
+			/>,
+		);
+
+		// Metadata stays editable while the rule is auto-populated…
+		expect(screen.getByTestId('drawer-model-id-input')).not.toBeDisabled();
+		// …but pricing is read-only until "User override" is chosen.
+		expect(screen.getByTestId('drawer-input-cost')).toBeDisabled();
+	});
+
+	it('shows a reset confirmation when switching from Override to Auto', async () => {
+		const user = userEvent.setup({ pointerEventsCheck: 0 });
+		render(
+			<Harness
+				initialDraft={{
+					...EMPTY_DRAFT,
+					modelName: 'gpt-4o',
+					isOverride: true,
+				}}
+			/>,
+		);
+
+		await user.click(screen.getByTestId('drawer-source-auto'));
+
+		expect(screen.getByTestId('drawer-reset-confirm-btn')).toBeInTheDocument();
+		expect(screen.getByTestId('drawer-reset-keep-btn')).toBeInTheDocument();
+	});
+
+	it('hides the Delete action in Add mode', () => {
+		render(<Harness mode="add" />);
+		expect(screen.queryByTestId('drawer-delete-btn')).not.toBeInTheDocument();
+	});
+
+	it('shows the Delete action in Edit mode', () => {
+		render(
+			<Harness
+				mode="edit"
+				initialDraft={{
+					...EMPTY_DRAFT,
+					id: 'rule-1',
+					modelName: 'gpt-4o',
+					isOverride: true,
+				}}
+			/>,
+		);
+		expect(screen.getByTestId('drawer-delete-btn')).toBeInTheDocument();
+	});
+
+	it('disables the provider select in Edit mode', () => {
+		render(
+			<Harness
+				mode="edit"
+				initialDraft={{
+					...EMPTY_DRAFT,
+					id: 'rule-1',
+					modelName: 'gpt-4o',
+					provider: 'OpenAI',
+					isOverride: true,
+				}}
+			/>,
+		);
+
+		const providerNode = screen.getByTestId('drawer-provider-select');
+		expect(providerNode.className).toMatch(/ant-select-disabled/);
+	});
+
+	it('calls onSave when the Save button is clicked', async () => {
+		const user = userEvent.setup({ pointerEventsCheck: 0 });
+		const onSave = jest.fn();
+		render(<Harness onSave={onSave} />);
+
+		await user.click(screen.getByTestId('drawer-save-btn'));
+		expect(onSave).toHaveBeenCalledTimes(1);
+	});
+
+	it('is read-only when the user cannot manage pricing (hides Save/Delete)', () => {
+		render(
+			<Harness
+				mode="edit"
+				canManage={false}
+				initialDraft={{
+					...EMPTY_DRAFT,
+					id: 'rule-1',
+					modelName: 'gpt-4o',
+					isOverride: true,
+				}}
+			/>,
+		);
+
+		expect(screen.queryByTestId('drawer-save-btn')).not.toBeInTheDocument();
+		expect(screen.queryByTestId('drawer-delete-btn')).not.toBeInTheDocument();
+		expect(screen.getByTestId('drawer-model-id-input')).toBeDisabled();
+	});
+});
--- a/frontend/src/container/LLMObservabilityModelPricing/tests/drawerUtils.test.ts
+++ b/frontend/src/container/LLMObservabilityModelPricing/tests/drawerUtils.test.ts
@@ -0,0 +1,149 @@
+import {
+	LlmpricingruletypesLLMPricingRuleCacheModeDTO as CacheModeDTO,
+	LlmpricingruletypesLLMPricingRuleUnitDTO as UnitDTO,
+} from 'api/generated/services/sigNoz.schemas';
+
+import { EMPTY_DRAFT } from '../constants';
+import type { DrawerDraft, PricingRule } from '../types';
+import {
+	buildPricingPayload,
+	buildRulePayload,
+	draftFromRule,
+	validateDraft,
+} from '../utils';
+
+const makeRule = (overrides: Partial<PricingRule> = {}): PricingRule => ({
+	id: 'rule-1',
+	orgId: 'org-1',
+	modelName: 'gpt-4o',
+	provider: 'OpenAI',
+	modelPattern: ['gpt-4o'],
+	isOverride: false,
+	enabled: true,
+	unit: UnitDTO.per_million_tokens,
+	pricing: { input: 15, output: 60 },
+	...overrides,
+});
+
+describe('drawer draft utils', () => {
+	describe('draftFromRule', () => {
+		it('maps a rule to a draft with cache values when present', () => {
+			const rule = makeRule({
+				pricing: {
+					input: 3,
+					output: 15,
+					cache: {
+						mode: CacheModeDTO.additive,
+						read: 0.3,
+						write: 3.75,
+					},
+				},
+			});
+			const draft = draftFromRule(rule);
+			expect(draft.modelName).toBe('gpt-4o');
+			expect(draft.pricing.input).toBe(3);
+			expect(draft.pricing.cacheRead).toBe(0.3);
+			expect(draft.pricing.cacheWrite).toBe(3.75);
+			expect(draft.pricing.cacheMode).toBe(CacheModeDTO.additive);
+		});
+
+		it('falls back to defaults when cache is missing', () => {
+			const draft = draftFromRule(makeRule());
+			expect(draft.pricing.cacheRead).toBeNull();
+			expect(draft.pricing.cacheWrite).toBeNull();
+			expect(draft.pricing.cacheMode).toBe(CacheModeDTO.unknown);
+		});
+	});
+
+	describe('buildPricingPayload', () => {
+		it('omits the cache block when no cache values are set', () => {
+			const payload = buildPricingPayload(EMPTY_DRAFT);
+			expect(payload.cache).toBeUndefined();
+		});
+
+		it('includes only the cache values that are > 0', () => {
+			const draft: DrawerDraft = {
+				...EMPTY_DRAFT,
+				pricing: {
+					...EMPTY_DRAFT.pricing,
+					cacheRead: 1.5,
+					cacheWrite: 0,
+					cacheMode: CacheModeDTO.subtract,
+				},
+			};
+			const payload = buildPricingPayload(draft);
+			expect(payload.cache?.read).toBe(1.5);
+			expect(payload.cache?.write).toBeUndefined();
+			expect(payload.cache?.mode).toBe(CacheModeDTO.subtract);
+		});
+	});
+
+	describe('buildRulePayload', () => {
+		it('uses the modelName as a default pattern when no patterns are supplied', () => {
+			const draft: DrawerDraft = {
+				...EMPTY_DRAFT,
+				modelName: 'gpt-4o',
+				patterns: [],
+				provider: 'OpenAI',
+			};
+			const payload = buildRulePayload(draft);
+			expect(payload.modelPattern).toStrictEqual(['gpt-4o']);
+			expect(payload.unit).toBe(UnitDTO.per_million_tokens);
+			expect(payload.enabled).toBe(true);
+		});
+
+		it('omits id and sourceId for an Add draft', () => {
+			const payload = buildRulePayload(EMPTY_DRAFT);
+			expect(payload.id).toBeUndefined();
+			expect(payload.sourceId).toBeUndefined();
+		});
+	});
+
+	describe('validateDraft', () => {
+		it('requires a model name in Add mode', () => {
+			const result = validateDraft(EMPTY_DRAFT, 'add');
+			expect(result.ok).toBe(false);
+			expect(result.message).toMatch(/billing model id/i);
+		});
+
+		it('rejects negative pricing', () => {
+			const draft: DrawerDraft = {
+				...EMPTY_DRAFT,
+				modelName: 'gpt-4o',
+				pricing: { ...EMPTY_DRAFT.pricing, input: -1 },
+			};
+			expect(validateDraft(draft, 'add').ok).toBe(false);
+		});
+
+		it('accepts a valid Add draft', () => {
+			const draft: DrawerDraft = {
+				...EMPTY_DRAFT,
+				modelName: 'gpt-4o',
+				pricing: { ...EMPTY_DRAFT.pricing, input: 1, output: 2 },
+			};
+			expect(validateDraft(draft, 'add').ok).toBe(true);
+		});
+
+		it('rejects zero input/output cost for overrides', () => {
+			const draft: DrawerDraft = {
+				...EMPTY_DRAFT,
+				modelName: 'gpt-4o',
+				isOverride: true,
+				pricing: { ...EMPTY_DRAFT.pricing, input: 0, output: 5 },
+			};
+			const result = validateDraft(draft, 'add');
+			expect(result.ok).toBe(false);
+			expect(result.message).toMatch(/input cost must be greater than 0/i);
+		});
+
+		it('skips pricing validation for auto-populated (non-override) rules', () => {
+			const draft: DrawerDraft = {
+				...EMPTY_DRAFT,
+				modelName: 'gpt-4o',
+				isOverride: false,
+				pricing: { ...EMPTY_DRAFT.pricing, input: 0, output: 0 },
+			};
+			expect(validateDraft(draft, 'edit').ok).toBe(true);
+		});
+	});
+});
--- a/frontend/src/container/LLMObservabilityModelPricing/tests/utils.test.ts
+++ b/frontend/src/container/LLMObservabilityModelPricing/tests/utils.test.ts
@@ -0,0 +1,119 @@
+import {
+	LlmpricingruletypesLLMPricingRuleCacheModeDTO as CacheModeDTO,
+	LlmpricingruletypesLLMPricingRuleUnitDTO as UnitDTO,
+} from 'api/generated/services/sigNoz.schemas';
+
+import type { PricingRule } from '../types';
+import {
+	filterRules,
+	formatPricePerMillion,
+	getCanonicalId,
+	getExtraBuckets,
+	getRelativeLastSeen,
+	getSourceLabel,
+} from '../utils';
+
+const makeRule = (overrides: Partial<PricingRule> = {}): PricingRule => ({
+	id: 'rule-1',
+	orgId: 'org-1',
+	modelName: 'gpt-4o',
+	provider: 'OpenAI',
+	modelPattern: ['gpt-4o'],
+	isOverride: false,
+	enabled: true,
+	unit: UnitDTO.per_million_tokens,
+	pricing: { input: 15, output: 60 },
+	...overrides,
+});
+
+describe('utils', () => {
+	describe('formatPricePerMillion', () => {
+		it('formats numbers with 2 decimals and dollar prefix', () => {
+			expect(formatPricePerMillion(15)).toBe('$15.00');
+			expect(formatPricePerMillion(0.15)).toBe('$0.15');
+		});
+
+		it('returns em-dash for nullish or NaN', () => {
+			expect(formatPricePerMillion(undefined)).toBe('—');
+			expect(formatPricePerMillion(Number.NaN)).toBe('—');
+		});
+	});
+
+	describe('getExtraBuckets', () => {
+		it('returns an empty array when there is no cache pricing', () => {
+			expect(getExtraBuckets(makeRule())).toStrictEqual([]);
+		});
+
+		it('returns only buckets with values > 0', () => {
+			const rule = makeRule({
+				pricing: {
+					input: 3,
+					output: 15,
+					cache: {
+						mode: CacheModeDTO.additive,
+						read: 0.3,
+						write: 0,
+					},
+				},
+			});
+			const buckets = getExtraBuckets(rule);
+			expect(buckets).toStrictEqual([{ key: 'cache_read', pricePerMillion: 0.3 }]);
+		});
+	});
+
+	describe('getSourceLabel', () => {
+		it('returns "Auto" for non-override and "User override" otherwise', () => {
+			expect(getSourceLabel(makeRule({ isOverride: false }))).toBe('Auto');
+			expect(getSourceLabel(makeRule({ isOverride: true }))).toBe('User override');
+		});
+	});
+
+	describe('getCanonicalId', () => {
+		it('lowercases the provider and joins with the model name', () => {
+			expect(getCanonicalId(makeRule({ provider: 'OpenAI' }))).toBe(
+				'openai:gpt-4o',
+			);
+		});
+	});
+
+	describe('getRelativeLastSeen', () => {
+		it('returns em-dash when no timestamp is present', () => {
+			expect(getRelativeLastSeen(makeRule())).toBe('—');
+		});
+
+		it('formats minutes-old timestamps via dayjs fromNow', () => {
+			const recent = new Date(Date.now() - 5 * 60 * 1000).toISOString();
+			expect(getRelativeLastSeen(makeRule({ updatedAt: recent }))).toMatch(
+				/minutes? ago/,
+			);
+		});
+	});
+
+	describe('filterRules', () => {
+		const auto = makeRule({ id: 'r1', modelName: 'gpt-4o', isOverride: false });
+		const override = makeRule({
+			id: 'r2',
+			modelName: 'llama-3',
+			provider: 'Self-hosted',
+			modelPattern: ['llama-3'],
+			isOverride: true,
+		});
+
+		it('returns everything when no filters are applied', () => {
+			expect(filterRules([auto, override], '', 'all')).toHaveLength(2);
+		});
+
+		it('narrows by source = override', () => {
+			expect(filterRules([auto, override], '', 'override')).toStrictEqual([
+				override,
+			]);
+		});
+
+		it('narrows by free-text search across model and provider', () => {
+			expect(filterRules([auto, override], 'self', 'all')).toStrictEqual([
+				override,
+			]);
+			expect(filterRules([auto, override], 'gpt-4', 'all')).toStrictEqual([auto]);
+		});
+	});
+});
--- a/frontend/src/container/LLMObservabilityModelPricing/constants.ts
+++ b/frontend/src/container/LLMObservabilityModelPricing/constants.ts
@@ -0,0 +1,34 @@
+import { LlmpricingruletypesLLMPricingRuleCacheModeDTO as CacheModeDTO } from 'api/generated/services/sigNoz.schemas';
+
+import type { DrawerDraft } from './types';
+
+export const PROVIDER_OPTIONS = [
+	{ value: 'OpenAI', label: 'OpenAI' },
+	{ value: 'Anthropic', label: 'Anthropic' },
+	{ value: 'Azure OpenAI', label: 'Azure OpenAI' },
+	{ value: 'Google', label: 'Google' },
+	{ value: 'Self-hosted', label: 'Self-hosted' },
+	{ value: 'Other', label: 'Other' },
+];
+
+export const CACHE_MODE_OPTIONS = [
+	{ value: CacheModeDTO.subtract, label: 'Subtract (OpenAI style)' },
+	{ value: CacheModeDTO.additive, label: 'Additive (Anthropic style)' },
+	{ value: CacheModeDTO.unknown, label: 'Unknown' },
+];
+
+export const EMPTY_DRAFT: DrawerDraft = {
+	id: null,
+	sourceId: null,
+	modelName: '',
+	provider: 'OpenAI',
+	patterns: [],
+	isOverride: true,
+	pricing: {
+		input: 0,
+		output: 0,
+		cacheMode: CacheModeDTO.unknown,
+		cacheRead: null,
+		cacheWrite: null,
+	},
+};
--- a/frontend/src/container/LLMObservabilityModelPricing/types.ts
+++ b/frontend/src/container/LLMObservabilityModelPricing/types.ts
@@ -0,0 +1,36 @@
+import {
+	LlmpricingruletypesLLMPricingRuleCacheModeDTO as CacheModeDTO,
+	type LlmpricingruletypesLLMPricingRuleDTO,
+} from 'api/generated/services/sigNoz.schemas';
+
+export type PricingRule = LlmpricingruletypesLLMPricingRuleDTO;
+
+export type SourceFilter = 'all' | 'auto' | 'override';
+
+export interface ExtraBucket {
+	key: string;
+	pricePerMillion: number;
+}
+
+export type DrawerMode = 'add' | 'edit';
+
+export interface DrawerDraft {
+	id: string | null;
+	sourceId: string | null;
+	modelName: string;
+	provider: string;
+	patterns: string[];
+	isOverride: boolean;
+	pricing: {
+		input: number;
+		output: number;
+		cacheMode: CacheModeDTO;
+		cacheRead: number | null;
+		cacheWrite: number | null;
+	};
+}
+
+export interface ValidationResult {
+	ok: boolean;
+	message?: string;
+}
--- a/frontend/src/container/LLMObservabilityModelPricing/useModelCostDrawer.ts
+++ b/frontend/src/container/LLMObservabilityModelPricing/useModelCostDrawer.ts
@@ -0,0 +1,123 @@
+import { useCallback, useState } from 'react';
+import { toast } from '@signozhq/ui/sonner';
+import { useQueryClient } from 'react-query';
+import {
+	getListLLMPricingRulesQueryKey,
+	useCreateOrUpdateLLMPricingRules,
+	useDeleteLLMPricingRule,
+} from 'api/generated/services/llmpricingrules';
+
+import { EMPTY_DRAFT } from './constants';
+import type { DrawerDraft, DrawerMode, PricingRule } from './types';
+import { buildRulePayload, draftFromRule } from './utils';
+
+interface UseModelCostDrawerResult {
+	isOpen: boolean;
+	mode: DrawerMode;
+	draft: DrawerDraft;
+	setDraft: (next: DrawerDraft) => void;
+	openForAdd: (prefillModelName?: string) => void;
+	openForEdit: (rule: PricingRule) => void;
+	close: () => void;
+	save: () => Promise<void>;
+	deleteRule: () => Promise<void>;
+	isSaving: boolean;
+	isDeleting: boolean;
+	saveError: string | null;
+	selectedRuleId: string | null;
+}
+
+export function useModelCostDrawer(): UseModelCostDrawerResult {
+	const queryClient = useQueryClient();
+	const [isOpen, setIsOpen] = useState<boolean>(false);
+	const [mode, setMode] = useState<DrawerMode>('add');
+	const [draft, setDraft] = useState<DrawerDraft>(EMPTY_DRAFT);
+	const [selectedRuleId, setSelectedRuleId] = useState<string | null>(null);
+	const [saveError, setSaveError] = useState<string | null>(null);
+
+	const { mutateAsync: createOrUpdate, isLoading: isSaving } =
+		useCreateOrUpdateLLMPricingRules();
+	const { mutateAsync: deleteRuleApi, isLoading: isDeleting } =
+		useDeleteLLMPricingRule();
+
+	const invalidateList = useCallback(async (): Promise<void> => {
+		await queryClient.invalidateQueries({
+			queryKey: getListLLMPricingRulesQueryKey(),
+		});
+	}, [queryClient]);
+
+	const openForAdd = useCallback((prefillModelName?: string): void => {
+		setMode('add');
+		setDraft({
+			...EMPTY_DRAFT,
+			modelName: prefillModelName || '',
+			patterns: prefillModelName ? [prefillModelName] : [],
+		});
+		setSelectedRuleId(null);
+		setSaveError(null);
+		setIsOpen(true);
+	}, []);
+
+	const openForEdit = useCallback((rule: PricingRule): void => {
+		setMode('edit');
+		setDraft(draftFromRule(rule));
+		setSelectedRuleId(rule.id);
+		setSaveError(null);
+		setIsOpen(true);
+	}, []);
+
+	const close = useCallback((): void => {
+		setIsOpen(false);
+		setSelectedRuleId(null);
+		setSaveError(null);
+	}, []);
+
+	const save = useCallback(async (): Promise<void> => {
+		setSaveError(null);
+		try {
+			await createOrUpdate({
+				data: { rules: [buildRulePayload(draft)] },
+			});
+			await invalidateList();
+			setIsOpen(false);
+			setSelectedRuleId(null);
+			toast.success(mode === 'edit' ? 'Model cost updated' : 'Model cost added');
+		} catch (error) {
+			const message = error instanceof Error ? error.message : 'Save failed';
+			setSaveError(message);
+		}
+	}, [createOrUpdate, draft, invalidateList, mode]);
+
+	const deleteRule = useCallback(async (): Promise<void> => {
+		if (!draft.id) {
+			return;
+		}
+		setSaveError(null);
+		try {
+			await deleteRuleApi({ pathParams: { id: draft.id } });
+			await invalidateList();
+			setIsOpen(false);
+			setSelectedRuleId(null);
+			toast.success('Model cost deleted');
+		} catch (error) {
+			const message = error instanceof Error ? error.message : 'Delete failed';
+			setSaveError(message);
+		}
+	}, [deleteRuleApi, draft.id, invalidateList]);
+
+	return {
+		isOpen,
+		mode,
+		draft,
+		setDraft,
+		openForAdd,
+		openForEdit,
+		close,
+		save,
+		deleteRule,
+		isSaving,
+		isDeleting,
+		saveError,
+		selectedRuleId,
+	};
+}
--- a/frontend/src/container/LLMObservabilityModelPricing/utils.ts
+++ b/frontend/src/container/LLMObservabilityModelPricing/utils.ts
@@ -0,0 +1,175 @@
+import {
+	LlmpricingruletypesLLMPricingRuleCacheModeDTO as CacheModeDTO,
+	LlmpricingruletypesLLMPricingRuleUnitDTO as UnitDTO,
+	type LlmpricingruletypesLLMPricingCacheCostsDTO,
+	type LlmpricingruletypesLLMRulePricingDTO,
+	type LlmpricingruletypesUpdatableLLMPricingRuleDTO,
+} from 'api/generated/services/sigNoz.schemas';
+import dayjs from 'dayjs';
+import relativeTime from 'dayjs/plugin/relativeTime';
+
+import type {
+	DrawerDraft,
+	DrawerMode,
+	ExtraBucket,
+	PricingRule,
+	SourceFilter,
+	ValidationResult,
+} from './types';
+
+// Idempotent — relativeTime is also extended globally in utils/timeUtils.
+dayjs.extend(relativeTime);
+
+const lc = (value: string): string => value.toLowerCase();
+
+const hasCacheValue = (value: number | null): boolean =>
+	typeof value === 'number' && value > 0;
+
+// ─── Display helpers ─────────────────────────────────────────────────────────
+
+export const formatPricePerMillion = (value: number | undefined): string => {
+	if (value === undefined || value === null || Number.isNaN(value)) {
+		return '—';
+	}
+	return `$${value.toFixed(2)}`;
+};
+
+export const getExtraBuckets = (rule: PricingRule): ExtraBucket[] => {
+	const cache = rule.pricing?.cache;
+	if (!cache) {
+		return [];
+	}
+	const buckets: ExtraBucket[] = [];
+	if (typeof cache.read === 'number' && cache.read > 0) {
+		buckets.push({ key: 'cache_read', pricePerMillion: cache.read });
+	}
+	if (typeof cache.write === 'number' && cache.write > 0) {
+		buckets.push({ key: 'cache_write', pricePerMillion: cache.write });
+	}
+	return buckets;
+};
+
+export const getSourceLabel = (rule: PricingRule): 'Auto' | 'User override' =>
+	rule.isOverride ? 'User override' : 'Auto';
+
+export const getRelativeLastSeen = (rule: PricingRule): string => {
+	const ts = rule.updatedAt || rule.syncedAt || rule.createdAt;
+	const parsed = ts ? dayjs(ts) : null;
+	return parsed?.isValid() ? parsed.fromNow() : '—';
+};
+
+export const filterRules = (
+	rules: PricingRule[],
+	search: string,
+	source: SourceFilter,
+): PricingRule[] => {
+	const normalized = lc(search.trim());
+	return rules.filter((rule) => {
+		if (source === 'auto' && rule.isOverride) {
+			return false;
+		}
+		if (source === 'override' && !rule.isOverride) {
+			return false;
+		}
+		if (!normalized) {
+			return true;
+		}
+		return (
+			lc(rule.modelName).includes(normalized) ||
+			lc(rule.provider).includes(normalized) ||
+			(rule.modelPattern || []).some((pattern) => lc(pattern).includes(normalized))
+		);
+	});
+};
+
+export const getCanonicalId = (rule: PricingRule): string => {
+	const provider = rule.provider?.trim() || 'unknown';
+	return `${lc(provider)}:${rule.modelName}`;
+};
+
+// ─── Drawer draft <-> API helpers ────────────────────────────────────────────
+
+export const draftFromRule = (rule: PricingRule): DrawerDraft => ({
+	id: rule.id,
+	sourceId: rule.sourceId ?? null,
+	modelName: rule.modelName,
+	provider: rule.provider || 'OpenAI',
+	patterns: rule.modelPattern || [],
+	isOverride: !!rule.isOverride,
+	pricing: {
+		input: rule.pricing?.input ?? 0,
+		output: rule.pricing?.output ?? 0,
+		cacheMode: rule.pricing?.cache?.mode ?? CacheModeDTO.unknown,
+		cacheRead: rule.pricing?.cache?.read ?? null,
+		cacheWrite: rule.pricing?.cache?.write ?? null,
+	},
+});
+
+export const buildPricingPayload = (
+	draft: DrawerDraft,
+): LlmpricingruletypesLLMRulePricingDTO => {
+	const pricing: LlmpricingruletypesLLMRulePricingDTO = {
+		input: draft.pricing.input,
+		output: draft.pricing.output,
+	};
+	if (
+		hasCacheValue(draft.pricing.cacheRead) ||
+		hasCacheValue(draft.pricing.cacheWrite)
+	) {
+		const cache: LlmpricingruletypesLLMPricingCacheCostsDTO = {
+			mode: draft.pricing.cacheMode,
+		};
+		if (hasCacheValue(draft.pricing.cacheRead)) {
+			cache.read = draft.pricing.cacheRead as number;
+		}
+		if (hasCacheValue(draft.pricing.cacheWrite)) {
+			cache.write = draft.pricing.cacheWrite as number;
+		}
+		pricing.cache = cache;
+	}
+	return pricing;
+};
+
+export const buildRulePayload = (
+	draft: DrawerDraft,
+): LlmpricingruletypesUpdatableLLMPricingRuleDTO => ({
+	id: draft.id || undefined,
+	sourceId: draft.sourceId || undefined,
+	modelName: draft.modelName.trim(),
+	provider: draft.provider.trim(),
+	modelPattern:
+		draft.patterns.length > 0 ? draft.patterns : [draft.modelName.trim()],
+	isOverride: draft.isOverride,
+	enabled: true,
+	unit: UnitDTO.per_million_tokens,
+	pricing: buildPricingPayload(draft),
+});
+
+export const validateDraft = (
+	draft: DrawerDraft,
+	mode: DrawerMode,
+): ValidationResult => {
+	if (mode === 'add' && !draft.modelName.trim()) {
+		return { ok: false, message: 'Billing model ID is required.' };
+	}
+	if (!draft.provider.trim()) {
+		return { ok: false, message: 'Provider is required.' };
+	}
+	// Pricing is only user-entered for overrides; auto-populated rules are
+	// managed by SigNoz (and may legitimately be 0 for self-hosted models).
+	if (draft.isOverride) {
+		if (!(draft.pricing.input > 0)) {
+			return { ok: false, message: 'Input cost must be greater than 0.' };
+		}
+		if (!(draft.pricing.output > 0)) {
+			return { ok: false, message: 'Output cost must be greater than 0.' };
+		}
+		if (
+			(draft.pricing.cacheRead !== null && draft.pricing.cacheRead < 0) ||
+			(draft.pricing.cacheWrite !== null && draft.pricing.cacheWrite < 0)
+		) {
+			return { ok: false, message: 'Cache costs must be non-negative.' };
+		}
+	}
+	return { ok: true };
+};
--- a/frontend/src/container/TopNav/DateTimeSelectionV2/constants.ts
+++ b/frontend/src/container/TopNav/DateTimeSelectionV2/constants.ts
@@ -206,6 +206,8 @@ export const routesToSkip = [
 	ROUTES.METER,
 	ROUTES.METER_EXPLORER_VIEWS,
 	ROUTES.SOMETHING_WENT_WRONG,
+	ROUTES.LLM_OBSERVABILITY_MODEL_PRICING,
+	ROUTES.LLM_OBSERVABILITY_ATTRIBUTE_MAPPING,
 ];

 export const routesToDisable = [ROUTES.LOGS_EXPLORER, ROUTES.LIVE_LOGS];
--- a/frontend/src/lib/recentQueries/constants.ts
+++ b/frontend/src/lib/recentQueries/constants.ts
@@ -0,0 +1,5 @@
+export const STORAGE_KEY_PREFIX = 'qb_recent_v1';
+export const STORAGE_VERSION = 1;
+// Maximum entries kept per (signal, source) bucket. Larger than the UI's
+// RECENTS_DISPLAY_CAP so deleting a visible entry surfaces an older one.
+export const MAX_ENTRIES = 10;
--- a/frontend/src/lib/recentQueries/getRecentQueries.ts
+++ b/frontend/src/lib/recentQueries/getRecentQueries.ts
@@ -0,0 +1,15 @@
+import type { SignalType } from 'types/api/v5/queryRange';
+
+import * as store from './recentQueriesStore';
+import type { RecentQueryEntry } from './types';
+
+// Synchronous, non-subscribing read of the recent-queries bucket for a given
+// (signal, source). Read-on-demand by design — subscribing here would
+// reconfigure CodeMirror on every store change and close any open completion
+// popup. Pair with saveQuery() for the write path.
+export function getRecentQueries(
+	signal: SignalType,
+	source = '',
+): RecentQueryEntry[] {
+	return store.list(signal, source);
+}
--- a/frontend/src/lib/recentQueries/normalize.test.ts
+++ b/frontend/src/lib/recentQueries/normalize.test.ts
@@ -0,0 +1,100 @@
+import { normalizeFilterExpression } from './normalize';
+
+describe('normalizeFilterExpression', () => {
+	it('returns empty string for empty input', () => {
+		expect(normalizeFilterExpression('')).toBe('');
+	});
+
+	it('returns empty string for whitespace-only input', () => {
+		expect(normalizeFilterExpression('   \t  ')).toBe('');
+	});
+
+	it('strips whitespace around operators', () => {
+		expect(normalizeFilterExpression('  a = 1  ')).toBe('a=1');
+		expect(normalizeFilterExpression('a   =    1')).toBe('a=1');
+		expect(normalizeFilterExpression('a=1')).toBe('a=1');
+	});
+
+	it('lowercases AND / OR / NOT outside quotes', () => {
+		expect(normalizeFilterExpression('A AND B OR NOT C')).toBe('AandBornotC');
+	});
+
+	it('lowercases IN / LIKE / ILIKE / CONTAINS', () => {
+		expect(normalizeFilterExpression('host IN [1, 2] AND name LIKE "foo"')).toBe(
+			'hostin[1,2]andnamelike"foo"',
+		);
+	});
+
+	it('lowercases REGEXP', () => {
+		expect(normalizeFilterExpression('path REGEXP "foo"')).toBe(
+			'pathregexp"foo"',
+		);
+		expect(normalizeFilterExpression('path REGEXP "foo"')).toBe(
+			normalizeFilterExpression('path regexp "foo"'),
+		);
+	});
+
+	it('lowercases HAS / HASANY / HASALL / HASTOKEN function names', () => {
+		expect(normalizeFilterExpression('HAS(tags, "x")')).toBe(
+			normalizeFilterExpression('has(tags, "x")'),
+		);
+		expect(normalizeFilterExpression('HASANY(tags, ["a","b"])')).toBe(
+			normalizeFilterExpression('hasAny(tags, ["a","b"])'),
+		);
+		expect(normalizeFilterExpression('HASALL(tags, ["a","b"])')).toBe(
+			normalizeFilterExpression('hasAll(tags, ["a","b"])'),
+		);
+		expect(normalizeFilterExpression('HASTOKEN(msg, "err")')).toBe(
+			normalizeFilterExpression('hasToken(msg, "err")'),
+		);
+	});
+
+	it('lowercases TRUE / FALSE boolean literals', () => {
+		expect(normalizeFilterExpression('active = TRUE')).toBe(
+			normalizeFilterExpression('active = true'),
+		);
+		expect(normalizeFilterExpression('active = FALSE')).toBe(
+			normalizeFilterExpression('active = false'),
+		);
+	});
+
+	it('preserves whitespace and casing inside single-quoted strings', () => {
+		expect(normalizeFilterExpression("a = 'X  Y'")).toBe("a='X  Y'");
+	});
+
+	it('preserves whitespace and casing inside double-quoted strings', () => {
+		expect(normalizeFilterExpression('a   =   "X  Y"')).toBe('a="X  Y"');
+	});
+
+	it('does not lowercase keyword-looking substrings inside quotes', () => {
+		expect(normalizeFilterExpression("msg = 'AND ERROR'")).toBe(
+			"msg='AND ERROR'",
+		);
+	});
+
+	it('handles escaped quotes inside strings', () => {
+		expect(normalizeFilterExpression("msg = 'a\\'b' AND x = 1")).toBe(
+			"msg='a\\'b'andx=1",
+		);
+	});
+
+	it('treats two formattings of the same expression as identical', () => {
+		const a = normalizeFilterExpression(
+			'service.name = "frontend" AND severity = error',
+		);
+		const b = normalizeFilterExpression(
+			'service.name="frontend"   and  severity=error',
+		);
+		expect(a).toBe(b);
+	});
+
+	it('preserves unquoted value casing (treats them as identifiers)', () => {
+		expect(normalizeFilterExpression('status = OK')).toBe('status=OK');
+	});
+
+	it('handles mixed quotes in one expression', () => {
+		expect(normalizeFilterExpression(`a = 'X' AND b = "Y"`)).toBe(
+			`a='X'andb="Y"`,
+		);
+	});
+});
--- a/frontend/src/lib/recentQueries/normalize.ts
+++ b/frontend/src/lib/recentQueries/normalize.ts
@@ -0,0 +1,56 @@
+import {
+	OPERATORS,
+	QUERY_BUILDER_FUNCTIONS,
+	TRACE_OPERATOR_OPERATORS,
+} from 'constants/antlrQueryConstants';
+
+// Reserved keywords sourced from the ANTLR grammar constants so this list stays
+// in sync with the parser. `\b` prevents partial matches inside identifiers
+// (e.g. `OR` inside `originator`). `TRUE`/`FALSE` are BOOL literals, included
+// so case variants of boolean values also dedup.
+const WORD_KEYWORDS = [
+	...Object.keys(OPERATORS).filter((k) => /^[A-Z]+$/.test(k)),
+	...Object.keys(TRACE_OPERATOR_OPERATORS).filter((k) => /^[A-Z]+$/.test(k)),
+	...Object.values(QUERY_BUILDER_FUNCTIONS),
+	'TRUE',
+	'FALSE',
+];
+
+const KEYWORDS_RE = new RegExp(`\\b(${WORD_KEYWORDS.join('|')})\\b`, 'gi');
+
+// Matches single- or double-quoted string literals, supporting escaped quotes
+// (e.g. `'it\'s'` or `"a \" b"`). We preserve quoted spans verbatim during
+// normalisation so user-meaningful whitespace and casing inside string values
+// stays intact: `name = "Foo Bar"` must not collapse to `name="foobar"`.
+const QUOTED_RE = /'(?:\\.|[^'\\])*'|"(?:\\.|[^"\\])*"/g;
+
+// Lowercases reserved keywords and strips ALL whitespace from the unquoted regions
+// of the input. Keywords are normalised so casing variants dedup; whitespace is
+// dropped so formatting variants (`a=1` vs `a = 1`) dedup too.
+function processOutsideQuotes(s: string): string {
+	return s.replace(KEYWORDS_RE, (m) => m.toLowerCase()).replace(/\s+/g, '');
+}
+
+// Produces a canonical form of a filter expression suitable for dedup-key derivation.
+// Walks the input alternating between unquoted regions (where we normalise keywords
+// and whitespace) and quoted regions (which we copy verbatim).
+export function normalizeFilterExpression(input: string): string {
+	if (!input) {
+		return '';
+	}
+
+	let result = '';
+	let lastIndex = 0;
+	QUOTED_RE.lastIndex = 0;
+
+	let match = QUOTED_RE.exec(input);
+	while (match !== null) {
+		result += processOutsideQuotes(input.slice(lastIndex, match.index));
+		result += match[0];
+		lastIndex = QUOTED_RE.lastIndex;
+		match = QUOTED_RE.exec(input);
+	}
+	result += processOutsideQuotes(input.slice(lastIndex));
+
+	return result.trim();
+}
--- a/frontend/src/lib/recentQueries/recentQueriesStore.test.ts
+++ b/frontend/src/lib/recentQueries/recentQueriesStore.test.ts
@@ -0,0 +1,247 @@
+import { MAX_ENTRIES } from './constants';
+import * as store from './recentQueriesStore';
+import type { RecentQueryInput } from './recentQueriesStore';
+import type { RecentQueryEntry } from './types';
+
+const baseInput = (
+	overrides: Partial<RecentQueryInput> = {},
+): RecentQueryInput => ({
+	signal: 'logs',
+	filter: { expression: "service.name = 'frontend'" },
+	...overrides,
+});
+
+function saveOrThrow(input: RecentQueryInput): RecentQueryEntry {
+	const saved = store.save(input);
+	if (!saved) {
+		throw new Error('expected save to return an entry');
+	}
+	return saved;
+}
+
+describe('recentQueries store', () => {
+	beforeEach(() => {
+		store.useRecentQueriesStore.setState({ buckets: {} });
+		localStorage.clear();
+	});
+
+	describe('save + list', () => {
+		it('saves an entry and lists it', () => {
+			store.save(baseInput());
+			const entries = store.list('logs');
+			expect(entries).toHaveLength(1);
+			expect(entries[0].filter.expression).toBe("service.name = 'frontend'");
+			expect(entries[0].id).toBeTruthy();
+			expect(entries[0].lastUsedAt).toBeGreaterThan(0);
+		});
+
+		it('does not save when the filter expression is empty', () => {
+			const result = store.save(baseInput({ filter: { expression: '' } }));
+			expect(result).toBeNull();
+			expect(store.list('logs')).toHaveLength(0);
+		});
+
+		it('does not save when the filter expression is whitespace only', () => {
+			const result = store.save(baseInput({ filter: { expression: '   ' } }));
+			expect(result).toBeNull();
+			expect(store.list('logs')).toHaveLength(0);
+		});
+	});
+
+	describe('LRU ordering', () => {
+		it('places the most recently saved entry at the front', () => {
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			store.save(baseInput({ filter: { expression: 'http.status_code >= 500' } }));
+			store.save(baseInput({ filter: { expression: 'attempt = 1' } }));
+
+			const entries = store.list('logs');
+			expect(entries.map((e) => e.filter.expression)).toStrictEqual([
+				'attempt = 1',
+				'http.status_code >= 500',
+				"severity_text = 'ERROR'",
+			]);
+		});
+
+		it('re-saving an existing filter bumps it to the front', () => {
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			store.save(baseInput({ filter: { expression: 'http.status_code >= 500' } }));
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+
+			const entries = store.list('logs');
+			expect(entries).toHaveLength(2);
+			expect(entries.map((e) => e.filter.expression)).toStrictEqual([
+				"severity_text = 'ERROR'",
+				'http.status_code >= 500',
+			]);
+		});
+	});
+
+	describe('dedup', () => {
+		it('treats formatting variations of the same filter as one entry', () => {
+			store.save(
+				baseInput({
+					filter: { expression: "severity_text = 'ERROR' AND attempt = 1" },
+				}),
+			);
+			store.save(
+				baseInput({
+					filter: { expression: "severity_text='ERROR'   and    attempt=1" },
+				}),
+			);
+
+			expect(store.list('logs')).toHaveLength(1);
+		});
+	});
+
+	describe('signal partitioning', () => {
+		it('saves to the right bucket per signal', () => {
+			store.save(
+				baseInput({
+					signal: 'logs',
+					filter: { expression: "severity_text = 'ERROR'" },
+				}),
+			);
+			store.save(
+				baseInput({
+					signal: 'traces',
+					filter: { expression: "service.name = 'orders-api'" },
+				}),
+			);
+			store.save(
+				baseInput({
+					signal: 'metrics',
+					filter: { expression: 'cpu_usage > 80' },
+				}),
+			);
+
+			expect(store.list('logs')).toHaveLength(1);
+			expect(store.list('traces')).toHaveLength(1);
+			expect(store.list('metrics')).toHaveLength(1);
+			expect(store.list('logs')[0].filter.expression).toBe(
+				"severity_text = 'ERROR'",
+			);
+			expect(store.list('traces')[0].filter.expression).toBe(
+				"service.name = 'orders-api'",
+			);
+			expect(store.list('metrics')[0].filter.expression).toBe('cpu_usage > 80');
+		});
+
+		it('does not leak between signals on dedup', () => {
+			store.save(
+				baseInput({
+					signal: 'logs',
+					filter: { expression: "service.name = 'frontend'" },
+				}),
+			);
+			store.save(
+				baseInput({
+					signal: 'traces',
+					filter: { expression: "service.name = 'frontend'" },
+				}),
+			);
+
+			expect(store.list('logs')).toHaveLength(1);
+			expect(store.list('traces')).toHaveLength(1);
+		});
+	});
+
+	describe('LRU cap', () => {
+		it('caps the bucket at MAX_ENTRIES and evicts the oldest', () => {
+			const total = MAX_ENTRIES + 1;
+			for (let i = 0; i < total; i += 1) {
+				store.save(baseInput({ filter: { expression: `attempt = ${i}` } }));
+			}
+
+			const entries = store.list('logs');
+			expect(entries).toHaveLength(MAX_ENTRIES);
+			expect(entries[0].filter.expression).toBe(`attempt = ${total - 1}`);
+			expect(entries.some((e) => e.filter.expression === 'attempt = 0')).toBe(
+				false,
+			);
+		});
+	});
+
+	describe('remove', () => {
+		it('removes an entry by id', () => {
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			const saved = saveOrThrow(
+				baseInput({ filter: { expression: 'http.status_code >= 500' } }),
+			);
+			store.remove(saved.id, 'logs');
+
+			const entries = store.list('logs');
+			expect(entries).toHaveLength(1);
+			expect(entries[0].filter.expression).toBe("severity_text = 'ERROR'");
+		});
+
+		it('is a no-op when the id does not exist', () => {
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			store.remove('does-not-exist', 'logs');
+			expect(store.list('logs')).toHaveLength(1);
+		});
+
+		it('does not touch other signals', () => {
+			const logsEntry = saveOrThrow(
+				baseInput({
+					signal: 'logs',
+					filter: { expression: "service.name = 'frontend'" },
+				}),
+			);
+			store.save(
+				baseInput({
+					signal: 'traces',
+					filter: { expression: "service.name = 'frontend'" },
+				}),
+			);
+
+			store.remove(logsEntry.id, 'logs');
+
+			expect(store.list('logs')).toHaveLength(0);
+			expect(store.list('traces')).toHaveLength(1);
+		});
+	});
+
+	describe('persistence', () => {
+		it('reads back the same entries after the in-memory state is reset', () => {
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			store.save(baseInput({ filter: { expression: 'http.status_code >= 500' } }));
+
+			store.useRecentQueriesStore.setState({ buckets: {} });
+
+			const entries = store.list('logs');
+			expect(entries.map((e) => e.filter.expression)).toStrictEqual([
+				'http.status_code >= 500',
+				"severity_text = 'ERROR'",
+			]);
+		});
+	});
+
+	describe('reactive subscription via zustand', () => {
+		it('notifies zustand subscribers on save', () => {
+			const cb = jest.fn();
+			const unsubscribe = store.useRecentQueriesStore.subscribe(cb);
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			expect(cb).toHaveBeenCalledTimes(1);
+			unsubscribe();
+		});
+
+		it('notifies zustand subscribers on remove', () => {
+			const saved = saveOrThrow(
+				baseInput({ filter: { expression: "severity_text = 'ERROR'" } }),
+			);
+			const cb = jest.fn();
+			const unsubscribe = store.useRecentQueriesStore.subscribe(cb);
+			store.remove(saved.id, 'logs');
+			expect(cb).toHaveBeenCalledTimes(1);
+			unsubscribe();
+		});
+
+		it('stops notifying after unsubscribe', () => {
+			const cb = jest.fn();
+			const unsubscribe = store.useRecentQueriesStore.subscribe(cb);
+			unsubscribe();
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			expect(cb).not.toHaveBeenCalled();
+		});
+	});
+});
--- a/frontend/src/lib/recentQueries/recentQueriesStore.ts
+++ b/frontend/src/lib/recentQueries/recentQueriesStore.ts
@@ -0,0 +1,144 @@
+import get from 'api/browser/localstorage/get';
+import set from 'api/browser/localstorage/set';
+import type { SignalType } from 'types/api/v5/queryRange';
+import { create } from 'zustand';
+
+import { MAX_ENTRIES, STORAGE_VERSION } from './constants';
+import { normalizeFilterExpression } from './normalize';
+import type { RecentQueriesStoreShape, RecentQueryEntry } from './types';
+import { bucketKey, makeId, normalizeSource, storageKeyFor } from './utils';
+
+// Mirrors parsed localStorage so equal raw strings return the same array ref —
+// preserves Object.is for zustand selector bail-out.
+const persistedBucketCache = new Map<
+	string,
+	{ raw: string; parsed: RecentQueryEntry[] }
+>();
+
+function loadBucketFromStorage(
+	signal: SignalType,
+	source: string,
+): RecentQueryEntry[] | null {
+	const key = bucketKey(signal, source);
+	try {
+		const raw = get(storageKeyFor(signal, source));
+		if (!raw) {
+			persistedBucketCache.delete(key);
+			return null;
+		}
+		const cached = persistedBucketCache.get(key);
+		if (cached && cached.raw === raw) {
+			return cached.parsed;
+		}
+		const parsedShape = JSON.parse(raw) as RecentQueriesStoreShape;
+		if (
+			parsedShape?.version !== STORAGE_VERSION ||
+			!Array.isArray(parsedShape.entries)
+		) {
+			persistedBucketCache.delete(key);
+			return null;
+		}
+		persistedBucketCache.set(key, { raw, parsed: parsedShape.entries });
+		return parsedShape.entries;
+	} catch {
+		persistedBucketCache.delete(key);
+		return null;
+	}
+}
+
+function saveBucketToStorage(
+	signal: SignalType,
+	source: string,
+	entries: RecentQueryEntry[],
+): void {
+	try {
+		const raw = JSON.stringify({ version: STORAGE_VERSION, entries });
+		if (set(storageKeyFor(signal, source), raw)) {
+			persistedBucketCache.set(bucketKey(signal, source), {
+				raw,
+				parsed: entries,
+			});
+		}
+	} catch {
+		// Ignore storage errors (e.g. quota exceeded, JSON.stringify failure).
+	}
+}
+
+export type RecentQueryInput = Omit<
+	RecentQueryEntry,
+	'id' | 'lastUsedAt' | 'source'
+> & {
+	source?: string;
+};
+
+type RecentQueriesState = {
+	buckets: Record<string, RecentQueryEntry[]>;
+	save: (entry: RecentQueryInput) => RecentQueryEntry | null;
+	remove: (id: string, signal: SignalType, source?: string) => void;
+};
+
+export const useRecentQueriesStore = create<RecentQueriesState>()(
+	(set, get) => ({
+		buckets: {},
+
+		save: (entry): RecentQueryEntry | null => {
+			const normalized = normalizeFilterExpression(entry.filter.expression);
+			if (!normalized) {
+				return null;
+			}
+			const source = normalizeSource(entry.source);
+			const key = bucketKey(entry.signal, source);
+
+			const current =
+				get().buckets[key] ?? loadBucketFromStorage(entry.signal, source) ?? [];
+			const filtered = current.filter(
+				(e) => normalizeFilterExpression(e.filter.expression) !== normalized,
+			);
+
+			const newEntry: RecentQueryEntry = {
+				...entry,
+				source,
+				id: makeId(entry.signal, source, normalized),
+				lastUsedAt: Date.now(),
+			};
+
+			const next = [newEntry, ...filtered].slice(0, MAX_ENTRIES);
+			set({ buckets: { ...get().buckets, [key]: next } });
+			saveBucketToStorage(entry.signal, source, next);
+			return newEntry;
+		},
+
+		remove: (id, signal, source = ''): void => {
+			const key = bucketKey(signal, source);
+			const current = get().buckets[key] ?? loadBucketFromStorage(signal, source);
+			if (!current) {
+				return;
+			}
+			const next = current.filter((e) => e.id !== id);
+			if (next.length === current.length) {
+				return;
+			}
+			set({ buckets: { ...get().buckets, [key]: next } });
+			saveBucketToStorage(signal, source, next);
+		},
+	}),
+);
+
+// Plain-function wrappers for non-React callers — same pattern as useColumnStore.ts.
+export function save(entry: RecentQueryInput): RecentQueryEntry | null {
+	return useRecentQueriesStore.getState().save(entry);
+}
+
+export function remove(id: string, signal: SignalType, source = ''): void {
+	useRecentQueriesStore.getState().remove(id, signal, source);
+}
+
+// Synchronous bucket read with localStorage fallback for non-React callers.
+export function list(signal: SignalType, source = ''): RecentQueryEntry[] {
+	const key = bucketKey(signal, source);
+	const state = useRecentQueriesStore.getState();
+	if (state.buckets[key]) {
+		return state.buckets[key];
+	}
+	return loadBucketFromStorage(signal, source) ?? [];
+}
--- a/frontend/src/lib/recentQueries/saveRecentQuery.test.ts
+++ b/frontend/src/lib/recentQueries/saveRecentQuery.test.ts
@@ -0,0 +1,113 @@
+import { DataSource } from 'types/common/queryBuilder';
+import type { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
+import { validateQuery } from 'utils/queryValidationUtils';
+
+import * as store from './recentQueriesStore';
+import { saveRecentQuery } from './saveRecentQuery';
+
+jest.mock('utils/queryValidationUtils', () => ({
+	validateQuery: jest.fn(),
+}));
+
+const mockedValidateQuery = validateQuery as jest.MockedFunction<
+	typeof validateQuery
+>;
+
+const buildComposite = (
+	overrides: Partial<IBuilderQuery>[] = [{}],
+): { builder: { queryData: IBuilderQuery[] } } => ({
+	builder: {
+		queryData: overrides.map((o, i) => ({
+			queryName: `Q${i}`,
+			dataSource: DataSource.LOGS,
+			aggregateOperator: 'count',
+			aggregateAttribute: undefined as never,
+			functions: [],
+			filter: { expression: 'service.name = "frontend"' },
+			groupBy: [],
+			expression: `Q${i}`,
+			disabled: false,
+			having: [],
+			limit: null,
+			stepInterval: null,
+			orderBy: [],
+			legend: '',
+			...o,
+		})) as IBuilderQuery[],
+	},
+});
+
+describe('saveRecentQuery', () => {
+	beforeEach(() => {
+		store.useRecentQueriesStore.setState({ buckets: {} });
+		localStorage.clear();
+		mockedValidateQuery.mockReturnValue({
+			isValid: true,
+			message: '',
+			errors: [],
+		});
+	});
+
+	it('saves the composite query when validation passes', () => {
+		saveRecentQuery(buildComposite());
+
+		const entries = store.list('logs');
+		expect(entries).toHaveLength(1);
+		expect(entries[0].filter.expression).toBe('service.name = "frontend"');
+	});
+
+	it('does not save when validateQuery rejects the expression', () => {
+		mockedValidateQuery.mockReturnValue({
+			isValid: false,
+			message: 'bad',
+			errors: [],
+		});
+
+		saveRecentQuery(buildComposite());
+
+		expect(store.list('logs')).toHaveLength(0);
+	});
+
+	it('does not save a builder query with an empty filter expression', () => {
+		saveRecentQuery(buildComposite([{ filter: { expression: '' } }]));
+
+		expect(store.list('logs')).toHaveLength(0);
+	});
+
+	it('saves each builder query in the composite separately', () => {
+		saveRecentQuery(
+			buildComposite([
+				{
+					dataSource: DataSource.LOGS,
+					filter: { expression: "service.name = 'frontend'" },
+				},
+				{
+					dataSource: DataSource.TRACES,
+					filter: { expression: "service.name = 'orders-api'" },
+				},
+			]),
+		);
+
+		expect(store.list('logs')).toHaveLength(1);
+		expect(store.list('traces')).toHaveLength(1);
+	});
+
+	it('skips builder queries whose dataSource is not a supported signal', () => {
+		saveRecentQuery(
+			buildComposite([{ dataSource: 'unknown' as IBuilderQuery['dataSource'] }]),
+		);
+
+		expect(store.list('logs')).toHaveLength(0);
+		expect(store.list('traces')).toHaveLength(0);
+		expect(store.list('metrics')).toHaveLength(0);
+	});
+
+	it('is a no-op when the composite is null, undefined, or empty', () => {
+		saveRecentQuery(null);
+		saveRecentQuery(undefined);
+		saveRecentQuery({ builder: { queryData: [] } });
+		saveRecentQuery({});
+
+		expect(store.list('logs')).toHaveLength(0);
+	});
+});
--- a/frontend/src/lib/recentQueries/saveRecentQuery.ts
+++ b/frontend/src/lib/recentQueries/saveRecentQuery.ts
@@ -0,0 +1,52 @@
+import type { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
+import type { SignalType } from 'types/api/v5/queryRange';
+import { validateQuery } from 'utils/queryValidationUtils';
+
+import * as store from './recentQueriesStore';
+
+function toSignal(dataSource: IBuilderQuery['dataSource']): SignalType | null {
+	if (
+		dataSource === 'logs' ||
+		dataSource === 'traces' ||
+		dataSource === 'metrics'
+	) {
+		return dataSource;
+	}
+	return null;
+}
+
+type CompositeWithBuilder = {
+	builder?: { queryData?: IBuilderQuery[] };
+};
+
+// Persists each builder query in the composite as a recent entry. Call this
+// only from explicit user-driven Run triggers — reacting to stagedQuery or any
+// other derived state pollutes recents with navigation/refresh/go-to traffic.
+export function saveRecentQuery(
+	query: CompositeWithBuilder | null | undefined,
+): void {
+	const queryData = query?.builder?.queryData;
+	if (!Array.isArray(queryData) || queryData.length === 0) {
+		return;
+	}
+
+	queryData.forEach((q) => {
+		const expression = q.filter?.expression?.trim();
+		if (!expression) {
+			return;
+		}
+		const validation = validateQuery(expression);
+		if (!validation.isValid) {
+			return;
+		}
+		const signal = toSignal(q.dataSource);
+		if (!signal) {
+			return;
+		}
+		store.save({
+			signal,
+			source: q.source ?? '',
+			filter: q.filter ?? { expression: '' },
+		});
+	});
+}
--- a/frontend/src/lib/recentQueries/types.ts
+++ b/frontend/src/lib/recentQueries/types.ts
@@ -0,0 +1,14 @@
+import type { Filter, SignalType } from 'types/api/v5/queryRange';
+
+export interface RecentQueryEntry {
+	id: string;
+	signal: SignalType;
+	source: string;
+	filter: Filter;
+	lastUsedAt: number;
+}
+
+export interface RecentQueriesStoreShape {
+	version: 1;
+	entries: RecentQueryEntry[];
+}
--- a/frontend/src/lib/recentQueries/utils.ts
+++ b/frontend/src/lib/recentQueries/utils.ts
@@ -0,0 +1,24 @@
+import type { SignalType } from 'types/api/v5/queryRange';
+
+import { STORAGE_KEY_PREFIX } from './constants';
+
+export function normalizeSource(source: string | undefined): string {
+	return source ?? '';
+}
+
+export function bucketKey(signal: SignalType, source: string): string {
+	return `${signal}:${source}`;
+}
+
+export function storageKeyFor(signal: SignalType, source: string): string {
+	return `${STORAGE_KEY_PREFIX}:${bucketKey(signal, source)}`;
+}
+
+// Same (signal, source, normalized filter) ⇒ same id ⇒ upsert.
+export function makeId(
+	signal: SignalType,
+	source: string,
+	normalizedFilter: string,
+): string {
+	return `${signal}|${source}|${normalizedFilter}`;
+}
--- a/frontend/src/pages/LLMObservabilityAttributeMapping/index.tsx
+++ b/frontend/src/pages/LLMObservabilityAttributeMapping/index.tsx
@@ -0,0 +1,7 @@
+import LLMObservabilityAttributeMapping from 'container/LLMObservabilityAttributeMapping/LLMObservabilityAttributeMapping';
+
+function LLMObservabilityAttributeMappingPage(): JSX.Element {
+	return <LLMObservabilityAttributeMapping />;
+}
+
+export default LLMObservabilityAttributeMappingPage;
--- a/frontend/src/pages/LLMObservabilityModelPricing/index.tsx
+++ b/frontend/src/pages/LLMObservabilityModelPricing/index.tsx
@@ -0,0 +1,7 @@
+import LLMObservabilityModelPricing from 'container/LLMObservabilityModelPricing/LLMObservabilityModelPricing';
+
+function LLMObservabilityModelPricingPage(): JSX.Element {
+	return <LLMObservabilityModelPricing />;
+}
+
+export default LLMObservabilityModelPricingPage;
--- a/frontend/src/providers/QueryBuilder.tsx
+++ b/frontend/src/providers/QueryBuilder.tsx
@@ -41,6 +41,7 @@ import useUrlQuery from 'hooks/useUrlQuery';
 import { createIdFromObjectFields } from 'lib/createIdFromObjectFields';
 import { createNewBuilderItemName } from 'lib/newQueryBuilder/createNewBuilderItemName';
 import { getOperatorsBySourceAndPanelType } from 'lib/newQueryBuilder/getOperatorsBySourceAndPanelType';
+import { saveRecentQuery } from 'lib/recentQueries/saveRecentQuery';
 import { replaceIncorrectObjectFields } from 'lib/replaceIncorrectObjectFields';
 import { cloneDeep, get, isEqual, set } from 'lodash-es';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
@@ -1031,6 +1032,8 @@ export function QueryBuilderProvider({
 		if (isExplorer) {
 			setCalledFromHandleRunQuery(true);
 		}
+		saveRecentQuery(currentQuery);
+
 		const currentQueryData = {
 			...currentQuery,
 			builder: {
--- a/frontend/src/tests/test-utils.tsx
+++ b/frontend/src/tests/test-utils.tsx
@@ -4,6 +4,7 @@ import { QueryClient, QueryClientProvider } from 'react-query';
 import { Provider } from 'react-redux';
 import { MemoryRouter } from 'react-router-dom';
 import { render, RenderOptions, RenderResult } from '@testing-library/react';
+import { TooltipProvider } from '@signozhq/ui/tooltip';
 import { FeatureKeys } from 'constants/features';
 import { ORG_PREFERENCES } from 'constants/orgPreferences';
 import { ResourceProvider } from 'hooks/useResourceAttribute';
@@ -301,7 +302,7 @@ export function AllTheProviders({
 								<ErrorModalProvider>
 									<TimezoneProvider>
 										<PreferenceContextProvider>
-											{queryBuilderContent}
+											<TooltipProvider>{queryBuilderContent}</TooltipProvider>
 										</PreferenceContextProvider>
 									</TimezoneProvider>
 								</ErrorModalProvider>
--- a/frontend/src/utils/permission/index.ts
+++ b/frontend/src/utils/permission/index.ts
@@ -20,7 +20,8 @@ export type ComponentTypes =
 	| 'add_panel'
 	| 'page_pipelines'
 	| 'edit_locked_dashboard'
-	| 'add_panel_locked_dashboard';
+	| 'add_panel_locked_dashboard'
+	| 'manage_llm_pricing';

 export const componentPermission: Record<ComponentTypes, ROLES[]> = {
 	current_org_settings: ['ADMIN'],
@@ -42,6 +43,7 @@ export const componentPermission: Record<ComponentTypes, ROLES[]> = {
 	page_pipelines: ['ADMIN', 'EDITOR'],
 	edit_locked_dashboard: ['ADMIN', 'AUTHOR'],
 	add_panel_locked_dashboard: ['ADMIN', 'AUTHOR'],
+	manage_llm_pricing: ['ADMIN', 'EDITOR', 'AUTHOR'],
 };

 export const routePermission: Record<keyof typeof ROUTES, ROLES[]> = {
@@ -136,4 +138,6 @@ export const routePermission: Record<keyof typeof ROUTES, ROLES[]> = {
 	AI_ASSISTANT_ICON_PREVIEW: ['ADMIN', 'EDITOR', 'VIEWER'],
 	MCP_SERVER: ['ADMIN', 'EDITOR', 'VIEWER'],
 	AI_ASSISTANT_BASE: ['ADMIN', 'EDITOR', 'VIEWER'],
+	LLM_OBSERVABILITY_MODEL_PRICING: ['ADMIN', 'EDITOR', 'VIEWER'],
+	LLM_OBSERVABILITY_ATTRIBUTE_MAPPING: ['ADMIN', 'EDITOR', 'VIEWER'],
 };
--- a/frontend/src/utils/timeUtils.ts
+++ b/frontend/src/utils/timeUtils.ts
@@ -2,6 +2,7 @@ import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
 import dayjs from 'dayjs';
 import customParseFormat from 'dayjs/plugin/customParseFormat';
 import duration from 'dayjs/plugin/duration';
+import relativeTime from 'dayjs/plugin/relativeTime';
 import timezone from 'dayjs/plugin/timezone';
 import utc from 'dayjs/plugin/utc';

@@ -9,6 +10,7 @@ dayjs.extend(utc);
 dayjs.extend(customParseFormat);
 dayjs.extend(duration);
 dayjs.extend(timezone);
+dayjs.extend(relativeTime);

 export function toUTCEpoch(time: number): number {
 	const x = new Date();
--- a/pkg/apiserver/signozapiserver/dashboard.go
+++ b/pkg/apiserver/signozapiserver/dashboard.go
@@ -14,6 +14,42 @@ import (
 )

 func (provider *provider) addDashboardRoutes(router *mux.Router) error {
+	if err := router.Handle("/api/v2/dashboards", handler.New(provider.authzMiddleware.ViewAccess(provider.dashboardHandler.ListV2), handler.OpenAPIDef{
+		ID:                  "ListDashboardsV2",
+		Tags:                []string{"dashboard"},
+		Summary:             "List dashboards (v2)",
+		Description:         "Returns a page of v2-shape dashboards for the org. This is the pure, user-independent list — it carries no pin state. Use ListDashboardsForUserV2 for the personalized, pin-aware list. Supports a filter DSL (`query`), sort (`updated_at`/`created_at`/`name`), order (`asc`/`desc`), and offset-based pagination (`limit`/`offset`).",
+		Request:             nil,
+		RequestQuery:        new(dashboardtypes.ListDashboardsV2Params),
+		RequestContentType:  "",
+		Response:            new(dashboardtypes.ListableDashboardV2),
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusOK,
+		ErrorStatusCodes:    []int{http.StatusBadRequest},
+		Deprecated:          false,
+		SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
+	})).Methods(http.MethodGet).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v2/users/me/dashboards", handler.New(provider.authzMiddleware.ViewAccess(provider.dashboardHandler.ListForUserV2), handler.OpenAPIDef{
+		ID:                  "ListDashboardsForUserV2",
+		Tags:                []string{"dashboard"},
+		Summary:             "List dashboards for the current user (v2)",
+		Description:         "Same as ListDashboardsV2 but personalized for the calling user: each dashboard carries the caller's `pinned` state, and pinned dashboards float to the top of the requested ordering. Supports the same filter DSL, sort, order, and pagination.",
+		Request:             nil,
+		RequestQuery:        new(dashboardtypes.ListDashboardsV2Params),
+		RequestContentType:  "",
+		Response:            new(dashboardtypes.ListableDashboardForUserV2),
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusOK,
+		ErrorStatusCodes:    []int{http.StatusBadRequest},
+		Deprecated:          false,
+		SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
+	})).Methods(http.MethodGet).GetError(); err != nil {
+		return err
+	}
+
 	if err := router.Handle("/api/v2/dashboards", handler.New(provider.authzMiddleware.EditAccess(provider.dashboardHandler.CreateV2), handler.OpenAPIDef{
 		ID:                  "CreateDashboardV2",
 		Tags:                []string{"dashboard"},
@@ -89,6 +125,23 @@ func (provider *provider) addDashboardRoutes(router *mux.Router) error {
 		return err
 	}

+	if err := router.Handle("/api/v2/dashboards/{id}", handler.New(provider.authzMiddleware.EditAccess(provider.dashboardHandler.DeleteV2), handler.OpenAPIDef{
+		ID:                  "DeleteDashboardV2",
+		Tags:                []string{"dashboard"},
+		Summary:             "Delete dashboard (v2)",
+		Description:         "This endpoint deletes a v2-shape dashboard along with its tag relations. Locked dashboards are rejected.",
+		Request:             nil,
+		RequestContentType:  "",
+		Response:            nil,
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusNoContent,
+		ErrorStatusCodes:    []int{http.StatusBadRequest, http.StatusNotFound},
+		Deprecated:          false,
+		SecuritySchemes:     newSecuritySchemes(types.RoleEditor),
+	})).Methods(http.MethodDelete).GetError(); err != nil {
+		return err
+	}
+
 	if err := router.Handle("/api/v2/dashboards/{id}/lock", handler.New(provider.authzMiddleware.EditAccess(provider.dashboardHandler.LockV2), handler.OpenAPIDef{
 		ID:                  "LockDashboardV2",
 		Tags:                []string{"dashboard"},
@@ -123,6 +176,42 @@ func (provider *provider) addDashboardRoutes(router *mux.Router) error {
 		return err
 	}

+	// ViewAccess: pinning only mutates the calling user's pin list, not the
+	// dashboard itself — anyone who can view a dashboard can bookmark it.
+	if err := router.Handle("/api/v2/users/me/dashboards/{id}/pins", handler.New(provider.authzMiddleware.ViewAccess(provider.dashboardHandler.PinV2), handler.OpenAPIDef{
+		ID:                  "PinDashboardV2",
+		Tags:                []string{"dashboard"},
+		Summary:             "Pin a dashboard for the current user (v2)",
+		Description:         "Pins the dashboard for the calling user. A user can pin at most 10 dashboards; pinning when at the limit returns 409. Re-pinning an already-pinned dashboard is a no-op success.",
+		Request:             nil,
+		RequestContentType:  "",
+		Response:            nil,
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusNoContent,
+		ErrorStatusCodes:    []int{http.StatusBadRequest, http.StatusNotFound, http.StatusConflict},
+		Deprecated:          false,
+		SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
+	})).Methods(http.MethodPut).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v2/users/me/dashboards/{id}/pins", handler.New(provider.authzMiddleware.ViewAccess(provider.dashboardHandler.UnpinV2), handler.OpenAPIDef{
+		ID:                  "UnpinDashboardV2",
+		Tags:                []string{"dashboard"},
+		Summary:             "Unpin a dashboard for the current user (v2)",
+		Description:         "Removes the pin for the calling user. Idempotent — unpinning a dashboard that wasn't pinned still returns 204.",
+		Request:             nil,
+		RequestContentType:  "",
+		Response:            nil,
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusNoContent,
+		ErrorStatusCodes:    []int{http.StatusBadRequest},
+		Deprecated:          false,
+		SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
+	})).Methods(http.MethodDelete).GetError(); err != nil {
+		return err
+	}
+
 	if err := router.Handle("/api/v1/dashboards/{id}/public", handler.New(provider.authzMiddleware.AdminAccess(provider.dashboardHandler.CreatePublic), handler.OpenAPIDef{
 		ID:                  "CreatePublicDashboard",
 		Tags:                []string{"dashboard"},
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cassandradb/assets/dashboards/overview.json
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cassandradb/assets/dashboards/overview.json
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cassandradb/icon.svg
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cassandradb/icon.svg
@@ -1 +0,0 @@
-<svg id="ba7e3c83-4ea6-40d5-820f-746ccedb8156" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><linearGradient id="e74ddf23-fe74-4f89-9a49-c7f2e22be284" x1="3.707" y1="5.123" x2="3.707" y2="2.061" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#0078d4"/><stop offset="1" stop-color="#5ea0ef"/></linearGradient><linearGradient id="bcce3b94-6b83-44c5-9bf7-a89d666f3d1e" x1="12.741" y1="10.558" x2="12.741" y2="5.161" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#0078d4"/><stop offset="1" stop-color="#5ea0ef"/></linearGradient><linearGradient id="f9b0803f-41e5-4165-9230-e220427ec475" x1="3.707" y1="13.723" x2="3.707" y2="10.378" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#0078d4"/><stop offset="1" stop-color="#5ea0ef"/></linearGradient></defs><g><g><rect x="7.923" y="1.922" width="0.98" height="6.183" transform="translate(0.013 10.048) rotate(-61.725)" fill="#003067"/><path d="M7.081,4.2V1.5H.33v2.7h0v0c0,.716,1.511,1.3,3.376,1.3s3.376-.58,3.376-1.3Z" fill="url(#e74ddf23-fe74-4f89-9a49-c7f2e22be284)"/><ellipse cx="3.707" cy="1.546" rx="3.376" ry="1.296" fill="#83b9f9"/><path d="M16.115,8.616v-2.7H9.365v2.7h0v0c0,.716,1.511,1.3,3.376,1.3s3.376-.58,3.376-1.3Z" fill="url(#bcce3b94-6b83-44c5-9bf7-a89d666f3d1e)"/><ellipse cx="12.741" cy="5.96" rx="3.376" ry="1.296" fill="#83b9f9"/><rect x="3.22" y="4.168" width="0.98" height="7.962" fill="#003067"/><circle cx="3.75" cy="3.337" r="1.157" fill="#c3f1ff"/><path d="M7.081,12.824v-2.7H.33v2.7h0v0c0,.716,1.511,1.3,3.376,1.3s3.376-.58,3.376-1.3Z" fill="url(#f9b0803f-41e5-4165-9230-e220427ec475)"/><ellipse cx="3.707" cy="10.167" rx="3.376" ry="1.296" fill="#83b9f9"/><rect x="3.708" y="9.164" width="9.741" height="0.98" transform="translate(-3.376 4.767) rotate(-26.14)" fill="#003067"/><circle cx="3.701" cy="11.939" r="1.157" fill="#c3f1ff"/><circle cx="12.743" cy="7.548" r="1.157" fill="#c3f1ff"/></g><g><path d="M17.166,15.5h0a.255.255,0,0,0-.1-.185A17,17,0,0,0,15.563,14a3.563,3.563,0,0,0-2.638-.706,5.515,5.515,0,0,0-3.339,2.066.224.224,0,0,0-.058.14h0v0h0a.26.26,0,0,0,.1.186,17.319,17.319,0,0,0,1.507,1.315,3.568,3.568,0,0,0,2.637.706,5.517,5.517,0,0,0,3.339-2.066.229.229,0,0,0,.059-.141h0Z" fill="#003067"/><circle cx="13.381" cy="15.501" r="1.846" fill="#c3f1ff"/><path d="M13.389,14.478a.875.875,0,0,0-.144.029.537.537,0,0,1,.1.292.559.559,0,0,1-.559.558.548.548,0,0,1-.368-.145.985.985,0,0,0-.062.3,1.038,1.038,0,1,0,1.038-1.037Z" fill="#003067"/><path d="M17.529,13.472A6.582,6.582,0,0,0,15.6,12.241l.437-.776a.458.458,0,0,0,.044-.34.441.441,0,0,0-.806-.106l-.535.952a5.762,5.762,0,0,0-.914-.143v-.975a.442.442,0,0,0-.883,0v.974a5.879,5.879,0,0,0-.934.144l-.536-.952a.442.442,0,0,0-.6-.158.45.45,0,0,0-.159.6q.219.387.437.776a6.582,6.582,0,0,0-1.931,1.231c-.422.382.2,1,.624.624a5.183,5.183,0,0,1,7.067,0C17.326,14.476,17.951,13.854,17.529,13.472Z" fill="#003067"/></g></g><rect x="-4.934" y="-3.691" width="29.331" height="34.261" fill="none" stroke="#b31b1b" stroke-miterlimit="10"/></svg>
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cassandradb/integration.json
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cassandradb/integration.json
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cassandradb/overview.md
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cassandradb/overview.md
@@ -1,7 +0,0 @@
-### Monitor Azure Managed Instance for Apache Cassandra with SigNoz
-
-Collect key Azure Managed Instance for Apache Cassandra metrics and view them with an out of the box dashboard.
-
-This integration collects platform metrics for the `Microsoft.DocumentDB/cassandraClusters` resource type.
-
-Note: This integration is for Azure Managed Instance for Apache Cassandra. Azure Cosmos DB for Apache Cassandra (the API offering) exposes a different set of metrics and is not covered here.
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cosmosdb/assets/dashboards/overview.json
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cosmosdb/assets/dashboards/overview.json
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cosmosdb/icon.svg
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cosmosdb/icon.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><radialGradient id="a" cx="-105.006" cy="-10.409" r="5.954" gradientTransform="matrix(1.036 0 0 1.027 117.739 19.644)" gradientUnits="userSpaceOnUse"><stop offset=".183" stop-color="#5ea0ef"/><stop offset="1" stop-color="#0078d4"/></radialGradient><clipPath id="b"><path d="M14.969 7.53a6.137 6.137 0 11-7.395-4.543 6.137 6.137 0 017.395 4.543z" fill="none"/></clipPath></defs><path d="M2.954 5.266a.175.175 0 01-.176-.176A2.012 2.012 0 00.769 3.081a.176.176 0 01-.176-.175.176.176 0 01.176-.176A2.012 2.012 0 002.778.72a.175.175 0 01.176-.176.175.175 0 01.176.176 2.012 2.012 0 002.009 2.009.175.175 0 01.176.176.175.175 0 01-.176.176A2.011 2.011 0 003.13 5.09a.177.177 0 01-.176.176zM15.611 17.456a.141.141 0 01-.141-.141 1.609 1.609 0 00-1.607-1.607.141.141 0 01-.141-.14.141.141 0 01.141-.141 1.608 1.608 0 001.607-1.607.141.141 0 01.141-.141.141.141 0 01.141.141 1.608 1.608 0 001.607 1.607.141.141 0 110 .282 1.609 1.609 0 00-1.607 1.607.141.141 0 01-.141.14z" fill="#50e6ff"/><path d="M14.969 7.53a6.137 6.137 0 11-7.395-4.543 6.137 6.137 0 017.395 4.543z" fill="url(#a)"/><g clip-path="url(#b)" fill="#f2f2f2"><path d="M5.709 13.115a1.638 1.638 0 10.005-3.275 1.307 1.307 0 00.007-.14A1.651 1.651 0 004.06 8.064H2.832a6.251 6.251 0 001.595 5.051zM15.045 7.815c0-.015 0-.03-.007-.044a5.978 5.978 0 00-1.406-2.88 1.825 1.825 0 00-.289-.09 1.806 1.806 0 00-2.3 1.663 2 2 0 00-.2-.013 1.737 1.737 0 00-.581 3.374 1.451 1.451 0 00.541.1h2.03a13.453 13.453 0 002.212-2.11z"/></g><path d="M17.191 3.832c-.629-1.047-2.1-1.455-4.155-1.149a14.606 14.606 0 00-2.082.452 6.456 6.456 0 011.528.767c.241-.053.483-.116.715-.151a7.49 7.49 0 011.103-.089 2.188 2.188 0 011.959.725c.383.638.06 1.729-.886 3a16.723 16.723 0 01-4.749 4.051A16.758 16.758 0 014.8 13.7c-1.564.234-2.682 0-3.065-.636s-.06-1.73.886-2.995c.117-.157.146-.234.279-.392a6.252 6.252 0 01.026-1.63 11.552 11.552 0 00-1.17 1.372C.517 11.076.181 12.566.809 13.613a3.165 3.165 0 002.9 1.249 8.434 8.434 0 001.251-.1 17.855 17.855 0 006.219-2.4A17.808 17.808 0 0016.24 8.03c1.243-1.661 1.579-3.15.951-4.198z" fill="#50e6ff"/></svg>
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cosmosdb/integration.json
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cosmosdb/integration.json
@@ -1,529 +0,0 @@
-{
-  "id": "cosmosdb",
-  "title": "Cosmos DB",
-  "icon": "file://icon.svg",
-  "overview": "file://overview.md",
-  "supportedSignals": {
-    "metrics": true,
-    "logs": true
-  },
-  "dataCollected": {
-    "metrics": [
-      {
-        "name": "azure_totalrequests_count",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of requests made against the account."
-      },
-      {
-        "name": "azure_totalrequestunits_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Request Units (RUs) consumed."
-      },
-      {
-        "name": "azure_totalrequestunits_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Request Units (RUs) consumed."
-      },
-      {
-        "name": "azure_totalrequestunits_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Request Units (RUs) consumed."
-      },
-      {
-        "name": "azure_normalizedruconsumption_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Maximum RU consumption percentage per minute."
-      },
-      {
-        "name": "azure_normalizedruconsumption_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Maximum RU consumption percentage per minute."
-      },
-      {
-        "name": "azure_metadatarequests_count",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Count of metadata requests (enumerating databases/collections and their configurations)."
-      },
-      {
-        "name": "azure_datausage_total",
-        "unit": "Bytes",
-        "type": "Sum",
-        "description": "Total data usage, reported at 5-minute granularity."
-      },
-      {
-        "name": "azure_datausage_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Total data usage, reported at 5-minute granularity."
-      },
-      {
-        "name": "azure_datausage_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Total data usage, reported at 5-minute granularity."
-      },
-      {
-        "name": "azure_datausage_minimum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Total data usage, reported at 5-minute granularity."
-      },
-      {
-        "name": "azure_indexusage_total",
-        "unit": "Bytes",
-        "type": "Sum",
-        "description": "Total index usage, reported at 5-minute granularity."
-      },
-      {
-        "name": "azure_indexusage_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Total index usage, reported at 5-minute granularity."
-      },
-      {
-        "name": "azure_indexusage_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Total index usage, reported at 5-minute granularity."
-      },
-      {
-        "name": "azure_indexusage_minimum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Total index usage, reported at 5-minute granularity."
-      },
-      {
-        "name": "azure_documentcountv2_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Total document count."
-      },
-      {
-        "name": "azure_documentcountv2_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Total document count."
-      },
-      {
-        "name": "azure_documentquota_total",
-        "unit": "Bytes",
-        "type": "Sum",
-        "description": "Total storage quota, reported at 5-minute granularity."
-      },
-      {
-        "name": "azure_documentquota_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Total storage quota, reported at 5-minute granularity."
-      },
-      {
-        "name": "azure_provisionedthroughput_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Provisioned throughput (RU/s)."
-      },
-      {
-        "name": "azure_autoscalemaxthroughput_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Autoscale maximum throughput (RU/s)."
-      },
-      {
-        "name": "azure_autoscaledru_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Autoscaled RU consumption per region and per partition."
-      },
-      {
-        "name": "azure_serversidelatencydirect_average",
-        "unit": "MilliSeconds",
-        "type": "Gauge",
-        "description": "Server-side latency in Direct connection mode."
-      },
-      {
-        "name": "azure_serversidelatencydirect_minimum",
-        "unit": "MilliSeconds",
-        "type": "Gauge",
-        "description": "Server-side latency in Direct connection mode."
-      },
-      {
-        "name": "azure_serversidelatencydirect_maximum",
-        "unit": "MilliSeconds",
-        "type": "Gauge",
-        "description": "Server-side latency in Direct connection mode."
-      },
-      {
-        "name": "azure_serversidelatencydirect_total",
-        "unit": "MilliSeconds",
-        "type": "Sum",
-        "description": "Server-side latency in Direct connection mode."
-      },
-      {
-        "name": "azure_serversidelatencygateway_average",
-        "unit": "MilliSeconds",
-        "type": "Gauge",
-        "description": "Server-side latency in Gateway connection mode."
-      },
-      {
-        "name": "azure_serversidelatencygateway_minimum",
-        "unit": "MilliSeconds",
-        "type": "Gauge",
-        "description": "Server-side latency in Gateway connection mode."
-      },
-      {
-        "name": "azure_serversidelatencygateway_maximum",
-        "unit": "MilliSeconds",
-        "type": "Gauge",
-        "description": "Server-side latency in Gateway connection mode."
-      },
-      {
-        "name": "azure_serversidelatencygateway_total",
-        "unit": "MilliSeconds",
-        "type": "Sum",
-        "description": "Server-side latency in Gateway connection mode."
-      },
-      {
-        "name": "azure_replicationlatency_minimum",
-        "unit": "MilliSeconds",
-        "type": "Gauge",
-        "description": "P99 replication latency across source and target regions for a geo-enabled account."
-      },
-      {
-        "name": "azure_replicationlatency_maximum",
-        "unit": "MilliSeconds",
-        "type": "Gauge",
-        "description": "P99 replication latency across source and target regions for a geo-enabled account."
-      },
-      {
-        "name": "azure_replicationlatency_average",
-        "unit": "MilliSeconds",
-        "type": "Gauge",
-        "description": "P99 replication latency across source and target regions for a geo-enabled account."
-      },
-      {
-        "name": "azure_serviceavailability_minimum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Account requests availability at one-hour, day, or month granularity."
-      },
-      {
-        "name": "azure_serviceavailability_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Account requests availability at one-hour, day, or month granularity."
-      },
-      {
-        "name": "azure_serviceavailability_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Account requests availability at one-hour, day, or month granularity."
-      },
-      {
-        "name": "azure_physicalpartitioncount_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Physical partition count."
-      },
-      {
-        "name": "azure_physicalpartitionsizeinfo_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Physical partition size in bytes."
-      },
-      {
-        "name": "azure_physicalpartitionsizeinfo_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Physical partition size in bytes."
-      },
-      {
-        "name": "azure_physicalpartitionthroughputinfo_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Physical partition throughput (RU/s)."
-      },
-      {
-        "name": "azure_cassandrarequests_count",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of Cassandra API requests made."
-      },
-      {
-        "name": "azure_cassandrarequestcharges_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Request Units consumed for Cassandra API requests."
-      },
-      {
-        "name": "azure_cassandrarequestcharges_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Request Units consumed for Cassandra API requests."
-      },
-      {
-        "name": "azure_cassandrarequestcharges_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Request Units consumed for Cassandra API requests."
-      },
-      {
-        "name": "azure_cassandrarequestcharges_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Request Units consumed for Cassandra API requests."
-      },
-      {
-        "name": "azure_cassandraconnectionclosures_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of Cassandra connections that were closed, reported at 1-minute granularity."
-      },
-      {
-        "name": "azure_cassandraconnectionclosures_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of Cassandra connections that were closed, reported at 1-minute granularity."
-      },
-      {
-        "name": "azure_cassandraconnectionclosures_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of Cassandra connections that were closed, reported at 1-minute granularity."
-      },
-      {
-        "name": "azure_cassandraconnectionclosures_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of Cassandra connections that were closed, reported at 1-minute granularity."
-      },
-      {
-        "name": "azure_gremlinrequests_count",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of Gremlin API requests made."
-      },
-      {
-        "name": "azure_gremlinrequestcharges_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Request Units consumed for Gremlin API requests."
-      },
-      {
-        "name": "azure_gremlinrequestcharges_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Request Units consumed for Gremlin API requests."
-      },
-      {
-        "name": "azure_gremlinrequestcharges_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Request Units consumed for Gremlin API requests."
-      },
-      {
-        "name": "azure_gremlinrequestcharges_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Request Units consumed for Gremlin API requests."
-      },
-      {
-        "name": "azure_mongorequests_count",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of Mongo API requests made."
-      },
-      {
-        "name": "azure_mongorequestcharge_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Request Units consumed for Mongo API requests."
-      },
-      {
-        "name": "azure_mongorequestcharge_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Request Units consumed for Mongo API requests."
-      },
-      {
-        "name": "azure_mongorequestcharge_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Request Units consumed for Mongo API requests."
-      },
-      {
-        "name": "azure_dedicatedgatewayaveragecpuusage_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Average CPU usage across dedicated gateway instances."
-      },
-      {
-        "name": "azure_dedicatedgatewaymaximumcpuusage_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Average maximum CPU usage across dedicated gateway instances."
-      },
-      {
-        "name": "azure_dedicatedgatewaymaximumcpuusage_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Average maximum CPU usage across dedicated gateway instances."
-      },
-      {
-        "name": "azure_dedicatedgatewaycpuusage_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "CPU usage across dedicated gateway instances."
-      },
-      {
-        "name": "azure_dedicatedgatewaycpuusage_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "CPU usage across dedicated gateway instances."
-      },
-      {
-        "name": "azure_dedicatedgatewaycpuusage_minimum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "CPU usage across dedicated gateway instances."
-      },
-      {
-        "name": "azure_dedicatedgatewayaveragememoryusage_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Average memory usage across dedicated gateway instances."
-      },
-      {
-        "name": "azure_dedicatedgatewaymemoryusage_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Memory usage across dedicated gateway instances."
-      },
-      {
-        "name": "azure_dedicatedgatewaymemoryusage_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Memory usage across dedicated gateway instances."
-      },
-      {
-        "name": "azure_dedicatedgatewaymemoryusage_minimum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Memory usage across dedicated gateway instances."
-      },
-      {
-        "name": "azure_dedicatedgatewayrequests_count",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Requests at the dedicated gateway."
-      },
-      {
-        "name": "azure_integratedcacheevictedentriessize_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Size of the entries evicted from the integrated cache."
-      },
-      {
-        "name": "azure_integratedcacheitemexpirationcount_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of items evicted from the integrated cache due to TTL expiration."
-      },
-      {
-        "name": "azure_integratedcacheitemhitrate_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Point reads that used the integrated cache divided by point reads routed through the dedicated gateway with eventual consistency."
-      },
-      {
-        "name": "azure_integratedcachequeryexpirationcount_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of queries evicted from the integrated cache due to TTL expiration."
-      },
-      {
-        "name": "azure_integratedcachequeryhitrate_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Queries that used the integrated cache divided by queries routed through the dedicated gateway with eventual consistency."
-      },
-      {
-        "name": "azure_materializedviewcatchupgapinminutes_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Maximum time difference (minutes) between data in the source container and data propagated to the materialized view."
-      },
-      {
-        "name": "azure_materializedviewsbuilderaveragecpuusage_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Average CPU usage across materialized view builder instances."
-      },
-      {
-        "name": "azure_materializedviewsbuildermaximumcpuusage_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Average maximum CPU usage across materialized view builder instances."
-      },
-      {
-        "name": "azure_materializedviewsbuildermaximumcpuusage_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Average maximum CPU usage across materialized view builder instances."
-      },
-      {
-        "name": "azure_materializedviewsbuilderaveragememoryusage_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Average memory usage across materialized view builder instances."
-      },
-      {
-        "name": "azure_globalsecondaryindexcatchupgapinminutes_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Maximum time difference (minutes) between data in the source container and data propagated to the global secondary index."
-      },
-      {
-        "name": "azure_globalsecondaryindexpropagationlatencyinseconds_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Average time difference (seconds) between data in the source container and data propagated to the global secondary index."
-      }
-    ],
-    "logs": [
-      {
-        "name": "Resource ID",
-        "path": "resources.azure.resource.id",
-        "type": "string"
-      }
-    ]
-  },
-  "telemetryCollectionStrategy": {
-    "azure": {
-      "resourceProvider": "Microsoft.DocumentDB",
-      "resourceType": "databaseAccounts",
-      "metrics": {},
-      "logs": {
-        "categoryGroups": [
-          "allLogs"
-        ]
-      }
-    }
-  },
-  "assets": {
-    "dashboards": [
-      {
-        "id": "overview",
-        "title": "Azure Cosmos DB Overview",
-        "description": "Overview of Azure Cosmos DB metrics",
-        "definition": "file://assets/dashboards/overview.json"
-      }
-    ]
-  }
-}
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cosmosdb/overview.md
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/cosmosdb/overview.md
@@ -1,7 +0,0 @@
-### Monitor Azure Cosmos DB with SigNoz
-
-Collect key Azure Cosmos DB metrics and view them with an out of the box dashboard.
-
-This integration collects platform metrics for the `Microsoft.DocumentDB/databaseAccounts` resource type — the Request Unit (RU) based Azure Cosmos DB account. A single account resource type is used across all Cosmos DB APIs (NoSQL, Cassandra, Gremlin, Table, and MongoDB for RU), so per-API request metrics are only reported for the API your account uses.
-
-Note: This integration is for the RU-based Cosmos DB account (`Microsoft.DocumentDB/databaseAccounts`).
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mongodb/assets/dashboards/overview.json
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mongodb/assets/dashboards/overview.json
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mongodb/icon.svg
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mongodb/icon.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 61 81" fill="#fff" fill-rule="evenodd" stroke="#000" stroke-linecap="round" stroke-linejoin="round"><use xlink:href="#A" x=".5" y=".5"/><symbol id="A" overflow="visible"><g stroke="none"><path d="M0 10.88v58.08c0 6.08 13.333 10.88 30 10.88V10.88H0z" fill="#3999c6"/><path d="M29.524 80H30c16.508 0 30-4.96 30-10.88V10.88H29.524V80z" fill="#59b4d9"/><path d="M60 10.88c0 6.08-13.333 10.88-30 10.88S0 16.96 0 10.88C0 4.96 13.492 0 30 0s30 4.96 30 10.88"/><path d="M53.81 10.24c0 4-10.635 7.2-23.81 7.2s-23.809-3.2-23.809-7.2 10.635-7.2 23.81-7.2 23.81 3.2 23.81 7.2" fill="#7fba00"/><path d="M48.889 14.72c3.175-1.28 4.921-2.72 4.921-4.48 0-4-10.635-7.2-23.81-7.2s-23.809 3.2-23.809 7.2c0 1.6 1.905 3.2 4.921 4.48 4.286-1.76 11.111-2.88 18.889-2.88 7.619 0 14.444 1.12 18.889 2.88" fill="#b8d432"/><path d="M21.429 66.88c-2.381 0-4.286-.32-5.555-.8-1.429-.48-2.381-1.28-3.016-2.24-.635-1.12-.952-2.72-.952-4.8v-3.52c0-2.24-.952-3.52-2.857-3.52v-4.32c1.905 0 2.857-1.12 2.857-3.52v-3.2c0-2.24.317-4 .952-4.96.635-1.12 1.587-1.76 2.857-2.4 1.429-.48 3.175-.8 5.556-.8v4.32c-1.111 0-1.746.16-2.381.64-.476.48-.794 1.28-.794 2.4v2.72c0 1.76-.159 3.2-.635 4.32s-1.27 1.92-2.381 2.4h0c1.111.48 1.905 1.28 2.381 2.56.476 1.12.794 2.72.794 4.48v2.4c0 1.12.159 1.92.635 2.4s1.27.8 2.381.8v4.64zM48.413 52c-1.905 0-2.857 1.12-2.857 3.52v3.2c0 2.24-.318 4-.952 4.96-.635 1.12-1.587 1.76-2.857 2.4-1.428.48-3.175.8-5.556.8v-4.32c1.111 0 1.905-.16 2.381-.64s.794-1.28.794-2.4V56.8c0-1.76.159-3.2.635-4.32a4.39 4.39 0 0 1 2.381-2.4h0c-1.111-.48-1.905-1.44-2.381-2.56s-.794-2.72-.794-4.48v-2.4c0-1.12-.159-1.92-.635-2.4s-1.27-.8-2.381-.8v-4.32c2.381 0 4.286.32 5.556.8 1.428.48 2.381 1.28 3.016 2.24.635 1.12.953 2.72.953 4.8v3.52c0 2.24.952 3.52 2.857 3.52v4z"/></g></symbol></svg>
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mongodb/integration.json
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mongodb/integration.json
@@ -1,247 +0,0 @@
-{
-  "id": "mongodb",
-  "title": "MongoDB (DocumentDB)",
-  "icon": "file://icon.svg",
-  "overview": "file://overview.md",
-  "supportedSignals": {
-    "metrics": true,
-    "logs": true
-  },
-  "dataCollected": {
-    "metrics": [
-      {
-        "name": "azure_cpupercent_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percent CPU utilization on the node."
-      },
-      {
-        "name": "azure_cpupercent_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percent CPU utilization on the node."
-      },
-      {
-        "name": "azure_cpupercent_minimum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percent CPU utilization on the node."
-      },
-      {
-        "name": "azure_memorypercent_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percent memory utilization on the node."
-      },
-      {
-        "name": "azure_memorypercent_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percent memory utilization on the node."
-      },
-      {
-        "name": "azure_memorypercent_minimum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percent memory utilization on the node."
-      },
-      {
-        "name": "azure_committedmemorypercent_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percentage of the commit memory limit allocated by applications on the node."
-      },
-      {
-        "name": "azure_committedmemorypercent_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percentage of the commit memory limit allocated by applications on the node."
-      },
-      {
-        "name": "azure_committedmemorypercent_minimum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percentage of the commit memory limit allocated by applications on the node."
-      },
-      {
-        "name": "azure_storagepercent_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percent of available storage used on the node."
-      },
-      {
-        "name": "azure_storagepercent_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percent of available storage used on the node."
-      },
-      {
-        "name": "azure_storagepercent_minimum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percent of available storage used on the node."
-      },
-      {
-        "name": "azure_storageused_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Quantity of available storage used on the node."
-      },
-      {
-        "name": "azure_storageused_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Quantity of available storage used on the node."
-      },
-      {
-        "name": "azure_storageused_minimum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Quantity of available storage used on the node."
-      },
-      {
-        "name": "azure_autoscaleutilizationpercent_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percent autoscale utilization."
-      },
-      {
-        "name": "azure_autoscaleutilizationpercent_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percent autoscale utilization."
-      },
-      {
-        "name": "azure_autoscaleutilizationpercent_minimum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Percent autoscale utilization."
-      },
-      {
-        "name": "azure_iops_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Disk IO operations per second on the node."
-      },
-      {
-        "name": "azure_iops_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Disk IO operations per second on the node."
-      },
-      {
-        "name": "azure_iops_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Disk IO operations per second on the node."
-      },
-      {
-        "name": "azure_networkbytesegress_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Network bytes sent on the node."
-      },
-      {
-        "name": "azure_networkbytesegress_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Network bytes sent on the node."
-      },
-      {
-        "name": "azure_networkbytesegress_minimum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Network bytes sent on the node."
-      },
-      {
-        "name": "azure_networkbytesegress_total",
-        "unit": "Bytes",
-        "type": "Sum",
-        "description": "Network bytes sent on the node."
-      },
-      {
-        "name": "azure_networkbytesingress_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Network bytes received on the node."
-      },
-      {
-        "name": "azure_networkbytesingress_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Network bytes received on the node."
-      },
-      {
-        "name": "azure_networkbytesingress_minimum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Network bytes received on the node."
-      },
-      {
-        "name": "azure_networkbytesingress_total",
-        "unit": "Bytes",
-        "type": "Sum",
-        "description": "Network bytes received on the node."
-      },
-      {
-        "name": "azure_mongorequestdurationms_average",
-        "unit": "Milliseconds",
-        "type": "Gauge",
-        "description": "End-to-end duration in milliseconds of client MongoDB requests handled by the cluster."
-      },
-      {
-        "name": "azure_mongorequestdurationms_maximum",
-        "unit": "Milliseconds",
-        "type": "Gauge",
-        "description": "End-to-end duration in milliseconds of client MongoDB requests handled by the cluster."
-      },
-      {
-        "name": "azure_mongorequestdurationms_minimum",
-        "unit": "Milliseconds",
-        "type": "Gauge",
-        "description": "End-to-end duration in milliseconds of client MongoDB requests handled by the cluster."
-      },
-      {
-        "name": "azure_mongorequestdurationms_total",
-        "unit": "Milliseconds",
-        "type": "Sum",
-        "description": "End-to-end duration in milliseconds of client MongoDB requests handled by the cluster."
-      },
-      {
-        "name": "azure_mongorequestdurationms_count",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of client MongoDB requests handled by the cluster."
-      }
-    ],
-    "logs": [
-      {
-        "name": "Resource ID",
-        "path": "resources.azure.resource.id",
-        "type": "string"
-      }
-    ]
-  },
-  "telemetryCollectionStrategy": {
-    "azure": {
-      "resourceProvider": "Microsoft.DocumentDB",
-      "resourceType": "mongoClusters",
-      "metrics": {},
-      "logs": {
-        "categoryGroups": [
-          "allLogs"
-        ]
-      }
-    }
-  },
-  "assets": {
-    "dashboards": [
-      {
-        "id": "overview",
-        "title": "Azure MongoDB (DocumentDB) Overview",
-        "description": "Overview of Azure MongoDB (DocumentDB) metrics",
-        "definition": "file://assets/dashboards/overview.json"
-      }
-    ]
-  }
-}
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mongodb/overview.md
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mongodb/overview.md
@@ -1,5 +0,0 @@
-### Monitor Azure MongoDB with SigNoz
-
-Collect key Azure MongoDB (DocumentDB) cluster metrics and view them with an out of the box dashboard.
-
-This integration collects platform metrics for the `Microsoft.DocumentDB/mongoClusters` resource type — the vCore-based Azure DocumentDB offering with MongoDB compatibility.
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mysqlflexibleserver/assets/dashboards/overview.json
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mysqlflexibleserver/assets/dashboards/overview.json
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mysqlflexibleserver/icon.svg
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mysqlflexibleserver/icon.svg
@@ -1 +0,0 @@
-<svg id="e05c9575-4c38-4bcd-90eb-276caf26e3d0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><linearGradient id="e291aba6-8038-4db1-a04d-c7be74f5a3e6" x1="2.59" y1="10.16" x2="15.41" y2="10.16" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#005ba1"/><stop offset="0.07" stop-color="#0060a9"/><stop offset="0.36" stop-color="#0071c8"/><stop offset="0.52" stop-color="#0078d4"/><stop offset="0.64" stop-color="#0074cd"/><stop offset="0.82" stop-color="#006abb"/><stop offset="1" stop-color="#005ba1"/></linearGradient></defs><title>Icon-databases-122</title><path d="M9,5.14c-3.54,0-6.41-1-6.41-2.32V15.18c0,1.27,2.82,2.3,6.32,2.32H9c3.54,0,6.41-1,6.41-2.32V2.82C15.41,4.11,12.54,5.14,9,5.14Z" fill="url(#e291aba6-8038-4db1-a04d-c7be74f5a3e6)"/><path d="M15.41,2.82c0,1.29-2.87,2.32-6.41,2.32s-6.41-1-6.41-2.32S5.46.5,9,.5s6.41,1,6.41,2.32" fill="#e8e8e8"/><path d="M13.92,2.63c0,.82-2.21,1.48-4.92,1.48S4.08,3.45,4.08,2.63,6.29,1.16,9,1.16s4.92.66,4.92,1.47" fill="#50e6ff"/><path d="M9,3a11.55,11.55,0,0,0-3.89.57A11.42,11.42,0,0,0,9,4.11a11.15,11.15,0,0,0,3.89-.58A11.84,11.84,0,0,0,9,3Z" fill="#198ab3"/><path d="M12.64,9v1.63h-1a.39.39,0,0,1-.29-.14V9H10v1.78a.92.92,0,0,0,1,.89h1.49l.26-.13s-.11.41-.26.43H10.11v1h2.66A1.21,1.21,0,0,0,14,11.7V9Z" fill="#f2f2f2"/><path d="M9.53,9s0,0,0,0V8.51a.7.7,0,0,0-.48-.77,1.74,1.74,0,0,0-.5-.08.94.94,0,0,0-.91.58l-.78,1.9-1-1.9A.93.93,0,0,0,5,7.66a1.44,1.44,0,0,0-.51.09c-.35.11-.43.34-.43.73v3.31H5.23V9.56l.63,1.57a1.08,1.08,0,0,0,1,.66c.44,0,.62-.26.8-.66l.67-1.51v2.15H9.51V9h0Z" fill="#f2f2f2"/></svg>
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mysqlflexibleserver/integration.json
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mysqlflexibleserver/integration.json
@@ -1,787 +0,0 @@
-{
-  "id": "mysqlflexibleserver",
-  "title": "MySQL - Flexible Server",
-  "icon": "file://icon.svg",
-  "overview": "file://overview.md",
-  "supportedSignals": {
-    "metrics": true,
-    "logs": true
-  },
-  "dataCollected": {
-    "metrics": [
-      {
-        "name": "azure_ha_io_status_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Status for replication IO thread running (HA)."
-      },
-      {
-        "name": "azure_ha_sql_status_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Status for replication SQL thread running (HA)."
-      },
-      {
-        "name": "azure_replica_io_running_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Status for replication IO thread running (replica)."
-      },
-      {
-        "name": "azure_replica_sql_running_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Status for replication SQL thread running (replica)."
-      },
-      {
-        "name": "azure_aborted_connections_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of failed attempts to connect to the MySQL server."
-      },
-      {
-        "name": "azure_ha_replication_lag_average",
-        "unit": "Seconds",
-        "type": "Gauge",
-        "description": "HA replication lag in seconds."
-      },
-      {
-        "name": "azure_ha_replication_lag_maximum",
-        "unit": "Seconds",
-        "type": "Gauge",
-        "description": "HA replication lag in seconds."
-      },
-      {
-        "name": "azure_ha_replication_lag_minimum",
-        "unit": "Seconds",
-        "type": "Gauge",
-        "description": "HA replication lag in seconds."
-      },
-      {
-        "name": "azure_innodb_row_lock_time_average",
-        "unit": "Milliseconds",
-        "type": "Gauge",
-        "description": "Total time spent acquiring row locks for InnoDB tables, in milliseconds."
-      },
-      {
-        "name": "azure_innodb_row_lock_time_maximum",
-        "unit": "Milliseconds",
-        "type": "Gauge",
-        "description": "Total time spent acquiring row locks for InnoDB tables, in milliseconds."
-      },
-      {
-        "name": "azure_innodb_row_lock_time_minimum",
-        "unit": "Milliseconds",
-        "type": "Gauge",
-        "description": "Total time spent acquiring row locks for InnoDB tables, in milliseconds."
-      },
-      {
-        "name": "azure_innodb_row_lock_waits_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of times operations on InnoDB tables had to wait for a row lock."
-      },
-      {
-        "name": "azure_innodb_row_lock_waits_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of times operations on InnoDB tables had to wait for a row lock."
-      },
-      {
-        "name": "azure_innodb_row_lock_waits_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of times operations on InnoDB tables had to wait for a row lock."
-      },
-      {
-        "name": "azure_replication_lag_average",
-        "unit": "Seconds",
-        "type": "Gauge",
-        "description": "Replication lag in seconds."
-      },
-      {
-        "name": "azure_replication_lag_maximum",
-        "unit": "Seconds",
-        "type": "Gauge",
-        "description": "Replication lag in seconds."
-      },
-      {
-        "name": "azure_replication_lag_minimum",
-        "unit": "Seconds",
-        "type": "Gauge",
-        "description": "Replication lag in seconds."
-      },
-      {
-        "name": "azure_uptime_total",
-        "unit": "Seconds",
-        "type": "Sum",
-        "description": "Number of seconds that the server has been up."
-      },
-      {
-        "name": "azure_uptime_maximum",
-        "unit": "Seconds",
-        "type": "Gauge",
-        "description": "Number of seconds that the server has been up."
-      },
-      {
-        "name": "azure_backup_storage_used_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Backup storage used."
-      },
-      {
-        "name": "azure_backup_storage_used_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Backup storage used."
-      },
-      {
-        "name": "azure_backup_storage_used_minimum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Backup storage used."
-      },
-      {
-        "name": "azure_binlog_storage_used_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used by binlog files."
-      },
-      {
-        "name": "azure_binlog_storage_used_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used by binlog files."
-      },
-      {
-        "name": "azure_binlog_storage_used_minimum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used by binlog files."
-      },
-      {
-        "name": "azure_cpu_credits_consumed_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "CPU credits consumed (Burstable SKU)."
-      },
-      {
-        "name": "azure_cpu_credits_consumed_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "CPU credits consumed (Burstable SKU)."
-      },
-      {
-        "name": "azure_cpu_credits_consumed_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "CPU credits consumed (Burstable SKU)."
-      },
-      {
-        "name": "azure_cpu_credits_remaining_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "CPU credits remaining (Burstable SKU)."
-      },
-      {
-        "name": "azure_cpu_credits_remaining_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "CPU credits remaining (Burstable SKU)."
-      },
-      {
-        "name": "azure_cpu_credits_remaining_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "CPU credits remaining (Burstable SKU)."
-      },
-      {
-        "name": "azure_cpu_percent_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Host CPU percent."
-      },
-      {
-        "name": "azure_cpu_percent_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Host CPU percent."
-      },
-      {
-        "name": "azure_cpu_percent_minimum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Host CPU percent."
-      },
-      {
-        "name": "azure_data_storage_used_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used by data files."
-      },
-      {
-        "name": "azure_data_storage_used_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used by data files."
-      },
-      {
-        "name": "azure_data_storage_used_minimum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used by data files."
-      },
-      {
-        "name": "azure_ibdata1_storage_used_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used by ibdata1 files."
-      },
-      {
-        "name": "azure_ibdata1_storage_used_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used by ibdata1 files."
-      },
-      {
-        "name": "azure_ibdata1_storage_used_minimum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used by ibdata1 files."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_pages_data_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of pages in the InnoDB buffer pool containing data."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_pages_data_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of pages in the InnoDB buffer pool containing data."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_pages_data_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of pages in the InnoDB buffer pool containing data."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_pages_dirty_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Current number of dirty pages in the InnoDB buffer pool."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_pages_dirty_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Current number of dirty pages in the InnoDB buffer pool."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_pages_dirty_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Current number of dirty pages in the InnoDB buffer pool."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_pages_free_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of free pages in the InnoDB buffer pool."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_pages_free_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of free pages in the InnoDB buffer pool."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_pages_free_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of free pages in the InnoDB buffer pool."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_read_requests_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of logical read requests."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_read_requests_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of logical read requests."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_read_requests_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of logical read requests."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_reads_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of logical reads that InnoDB could not satisfy from the buffer pool and had to read from disk."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_reads_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of logical reads that InnoDB could not satisfy from the buffer pool and had to read from disk."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_reads_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of logical reads that InnoDB could not satisfy from the buffer pool and had to read from disk."
-      },
-      {
-        "name": "azure_io_consumption_percent_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Storage I/O consumption percent."
-      },
-      {
-        "name": "azure_io_consumption_percent_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Storage I/O consumption percent."
-      },
-      {
-        "name": "azure_io_consumption_percent_minimum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Storage I/O consumption percent."
-      },
-      {
-        "name": "azure_memory_percent_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Memory percent."
-      },
-      {
-        "name": "azure_memory_percent_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Memory percent."
-      },
-      {
-        "name": "azure_memory_percent_minimum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Memory percent."
-      },
-      {
-        "name": "azure_others_storage_used_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used by other files."
-      },
-      {
-        "name": "azure_others_storage_used_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used by other files."
-      },
-      {
-        "name": "azure_others_storage_used_minimum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used by other files."
-      },
-      {
-        "name": "azure_serverlog_storage_limit_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Server log storage limit."
-      },
-      {
-        "name": "azure_serverlog_storage_percent_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Server log storage percent."
-      },
-      {
-        "name": "azure_serverlog_storage_percent_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Server log storage percent."
-      },
-      {
-        "name": "azure_serverlog_storage_percent_minimum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Server log storage percent."
-      },
-      {
-        "name": "azure_serverlog_storage_usage_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Server log storage used."
-      },
-      {
-        "name": "azure_serverlog_storage_usage_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Server log storage used."
-      },
-      {
-        "name": "azure_serverlog_storage_usage_minimum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Server log storage used."
-      },
-      {
-        "name": "azure_sort_merge_passes_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of merge passes the sort algorithm has had to do."
-      },
-      {
-        "name": "azure_sort_merge_passes_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of merge passes the sort algorithm has had to do."
-      },
-      {
-        "name": "azure_sort_merge_passes_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of merge passes the sort algorithm has had to do."
-      },
-      {
-        "name": "azure_storage_limit_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage limit."
-      },
-      {
-        "name": "azure_storage_percent_average",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Storage percent."
-      },
-      {
-        "name": "azure_storage_percent_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Storage percent."
-      },
-      {
-        "name": "azure_storage_percent_minimum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "Storage percent."
-      },
-      {
-        "name": "azure_storage_used_average",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used."
-      },
-      {
-        "name": "azure_storage_used_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used."
-      },
-      {
-        "name": "azure_storage_used_minimum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "Storage used."
-      },
-      {
-        "name": "azure_threads_running_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of threads that are not sleeping."
-      },
-      {
-        "name": "azure_threads_running_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of threads that are not sleeping."
-      },
-      {
-        "name": "azure_threads_running_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of threads that are not sleeping."
-      },
-      {
-        "name": "azure_active_connections_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Active connections."
-      },
-      {
-        "name": "azure_active_connections_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Active connections."
-      },
-      {
-        "name": "azure_active_connections_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Active connections."
-      },
-      {
-        "name": "azure_active_transactions_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of active transactions."
-      },
-      {
-        "name": "azure_active_transactions_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of active transactions."
-      },
-      {
-        "name": "azure_active_transactions_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of active transactions."
-      },
-      {
-        "name": "azure_active_transactions_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of active transactions."
-      },
-      {
-        "name": "azure_com_alter_table_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of times ALTER TABLE statement has been executed."
-      },
-      {
-        "name": "azure_com_create_db_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of times CREATE DB statement has been executed."
-      },
-      {
-        "name": "azure_com_create_table_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of times CREATE TABLE statement has been executed."
-      },
-      {
-        "name": "azure_com_delete_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of times DELETE statement has been executed."
-      },
-      {
-        "name": "azure_com_drop_db_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of times DROP DB statement has been executed."
-      },
-      {
-        "name": "azure_com_drop_table_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of times DROP TABLE statement has been executed."
-      },
-      {
-        "name": "azure_com_insert_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of times INSERT statement has been executed."
-      },
-      {
-        "name": "azure_com_select_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of times SELECT statement has been executed."
-      },
-      {
-        "name": "azure_com_update_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of times UPDATE statement has been executed."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_pages_flushed_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of requests to flush pages from the InnoDB buffer pool."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_pages_flushed_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of requests to flush pages from the InnoDB buffer pool."
-      },
-      {
-        "name": "azure_innodb_buffer_pool_pages_flushed_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of requests to flush pages from the InnoDB buffer pool."
-      },
-      {
-        "name": "azure_innodb_data_writes_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Total number of data writes."
-      },
-      {
-        "name": "azure_innodb_data_writes_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Total number of data writes."
-      },
-      {
-        "name": "azure_innodb_data_writes_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Total number of data writes."
-      },
-      {
-        "name": "azure_lock_deadlocks_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of deadlocks."
-      },
-      {
-        "name": "azure_lock_deadlocks_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of deadlocks."
-      },
-      {
-        "name": "azure_lock_deadlocks_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of deadlocks."
-      },
-      {
-        "name": "azure_lock_deadlocks_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of deadlocks."
-      },
-      {
-        "name": "azure_lock_timeouts_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of lock timeouts."
-      },
-      {
-        "name": "azure_lock_timeouts_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of lock timeouts."
-      },
-      {
-        "name": "azure_lock_timeouts_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of lock timeouts."
-      },
-      {
-        "name": "azure_lock_timeouts_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Number of lock timeouts."
-      },
-      {
-        "name": "azure_network_bytes_egress_total",
-        "unit": "Bytes",
-        "type": "Sum",
-        "description": "Host network egress in bytes."
-      },
-      {
-        "name": "azure_network_bytes_ingress_total",
-        "unit": "Bytes",
-        "type": "Sum",
-        "description": "Host network ingress in bytes."
-      },
-      {
-        "name": "azure_queries_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of queries executed."
-      },
-      {
-        "name": "azure_slow_queries_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of queries that have taken more than long_query_time seconds."
-      },
-      {
-        "name": "azure_storage_io_count_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Number of storage I/O operations consumed."
-      },
-      {
-        "name": "azure_total_connections_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Total connections."
-      },
-      {
-        "name": "azure_trx_rseg_history_len_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "Length of the TRX_RSEG_HISTORY list."
-      },
-      {
-        "name": "azure_trx_rseg_history_len_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Length of the TRX_RSEG_HISTORY list."
-      },
-      {
-        "name": "azure_trx_rseg_history_len_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Length of the TRX_RSEG_HISTORY list."
-      },
-      {
-        "name": "azure_trx_rseg_history_len_minimum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "Length of the TRX_RSEG_HISTORY list."
-      }
-    ],
-    "logs": [
-      {
-        "name": "Resource ID",
-        "path": "resources.azure.resource.id",
-        "type": "string"
-      }
-    ]
-  },
-  "telemetryCollectionStrategy": {
-    "azure": {
-      "resourceProvider": "Microsoft.DBforMySQL",
-      "resourceType": "flexibleServers",
-      "metrics": {},
-      "logs": {
-        "categoryGroups": [
-          "allLogs"
-        ]
-      }
-    }
-  },
-  "assets": {
-    "dashboards": [
-      {
-        "id": "overview",
-        "title": "Azure Database for MySQL - Flexible Server Overview",
-        "description": "Overview of Azure Database for MySQL - Flexible Server metrics",
-        "definition": "file://assets/dashboards/overview.json"
-      }
-    ]
-  }
-}
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mysqlflexibleserver/overview.md
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/mysqlflexibleserver/overview.md
@@ -1,5 +0,0 @@
-### Monitor Azure Database for MySQL - Flexible Server with SigNoz
-
-Collect key Azure Database for MySQL - Flexible Server metrics and view them with an out of the box dashboard.
-
-This integration collects platform metrics for the `Microsoft.DBforMySQL/flexibleServers` resource type.
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/postgresqlflexibleserver/assets/dashboards/overview.json
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/postgresqlflexibleserver/assets/dashboards/overview.json
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/postgresqlflexibleserver/icon.svg
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/postgresqlflexibleserver/icon.svg
@@ -1 +0,0 @@
-<svg id="fc890127-728b-4ac0-b5da-86cdfc191e86" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><linearGradient id="a28dee20-4c71-46b5-b957-804c67da725a" x1="2.44" y1="10.67" x2="15.27" y2="10.67" gradientTransform="translate(0.14 -0.5) rotate(-0.01)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#005ba1"/><stop offset="0.07" stop-color="#0060a9"/><stop offset="0.36" stop-color="#0071c8"/><stop offset="0.52" stop-color="#0078d4"/><stop offset="0.64" stop-color="#0074cd"/><stop offset="0.82" stop-color="#006abb"/><stop offset="1" stop-color="#005ba1"/></linearGradient></defs><title>Icon-databases-131</title><path d="M9,5.14c-3.54,0-6.41-1-6.41-2.32V15.18c0,1.27,2.82,2.3,6.32,2.32H9c3.54,0,6.41-1,6.41-2.32V2.82C15.41,4.1,12.54,5.14,9,5.14Z" fill="url(#a28dee20-4c71-46b5-b957-804c67da725a)"/><path d="M15.41,2.82c0,1.28-2.87,2.32-6.41,2.32s-6.41-1-6.41-2.32S5.46.5,9,.5s6.41,1,6.41,2.32" fill="#e8e8e8"/><path d="M13.91,2.63c0,.82-2.2,1.48-4.91,1.48S4.08,3.45,4.08,2.64,6.28,1.16,9,1.16s4.91.66,4.91,1.47" fill="#50e6ff"/><path d="M9,3a11.65,11.65,0,0,0-3.9.57A11.53,11.53,0,0,0,9,4.11a11.47,11.47,0,0,0,3.89-.58A11.93,11.93,0,0,0,9,3Z" fill="#198ab3"/><path d="M12,9c0,.08,0,.24,0,.42a5.12,5.12,0,0,0-.08.63c0,.12,0,.3.05.46s0,.27,0,.36a1.68,1.68,0,0,1-.25.86.43.43,0,0,0,0,.07l.1.12a10.55,10.55,0,0,0,1.06-2.38h0c.28-.95.31-1.63.09-1.92a2.58,2.58,0,0,0-2.68-.86,3.29,3.29,0,0,1,.91.67A2.28,2.28,0,0,1,12,9Zm-.31.08a1.15,1.15,0,0,0-.79.09c-.29.18-.2.55,0,1a7.77,7.77,0,0,0,.35.85l.09.16h0c.05.08.08.15.11.2l.08.13a1.28,1.28,0,0,0,.18-.65,2.86,2.86,0,0,0,0-.33c0-.17,0-.36-.05-.49a6.1,6.1,0,0,1,.08-.69C11.71,9.24,11.72,9.13,11.73,9.05Zm-.3.41a.4.4,0,0,1-.18.1h0a.33.33,0,0,1-.14,0A.23.23,0,0,1,11,9.4h0c0-.07.11-.13.24-.15h.19s.09,0,.09.08A.2.2,0,0,1,11.43,9.46Zm-4.69.89c0-.07,0-.13,0-.17a1,1,0,0,0,0-.17,5.55,5.55,0,0,1,0-1A5.22,5.22,0,0,1,7,7.94,2.41,2.41,0,0,1,7.58,7,4.78,4.78,0,0,0,6.23,6.8a1.87,1.87,0,0,0-1.1.3A2,2,0,0,0,4.5,8.92,12.27,12.27,0,0,0,5,11.16c.34,1.14.73,1.84,1.07,1.95h0c.15.05.31,0,.47-.21.28-.34.54-.63.69-.8A1.88,1.88,0,0,1,6.74,10.35Zm.26.4a2.18,2.18,0,0,0,.06.56,1.5,1.5,0,0,0,.26.44,1.07,1.07,0,0,0,.35.25,1.09,1.09,0,0,0,.39.08c0-.17.14-.38.23-.6a4.35,4.35,0,0,0,.21-.59,6.61,6.61,0,0,0,0-1.11c0-.09,0-.19-.06-.3a.45.45,0,0,0-.12-.27l0,0A.66.66,0,0,0,8,9.08H7.8a1.56,1.56,0,0,0-.48.14A2,2,0,0,0,7,9.41v.11c0,.2,0,.41,0,.61v0a.86.86,0,0,1,0,.15l0,.39H7Zm.66-1.34,0,0a.46.46,0,0,1,.28,0,.6.6,0,0,1,.19.06c.09,0,.1.11.09.14h0a.37.37,0,0,1-.12.13A.3.3,0,0,1,8,9.73h0a.34.34,0,0,1-.28-.28Zm.74,3a.23.23,0,0,0-.13.06l-.14.17c-.17.21-.24.28-.73.38a.52.52,0,0,0-.26.1.58.58,0,0,0,.24.11,1.18,1.18,0,0,0,.72,0A1.7,1.7,0,0,0,8.45,13a.61.61,0,0,0,.2-.31.36.36,0,0,0-.1-.28A.15.15,0,0,0,8.4,12.39Zm4.61,0a1.63,1.63,0,0,1-1.13,0,.22.22,0,0,0-.14,0,.3.3,0,0,0-.17.14,1.09,1.09,0,0,0,0,.31,1.8,1.8,0,0,0,1.1-.1,1.36,1.36,0,0,0,.48-.34Zm-2.4-2.14c-.14-.41-.34-1,.18-1.36a1.35,1.35,0,0,1,.89-.15A3.18,3.18,0,0,0,11,7.64l-.1-.1-.06-.06h0a.34.34,0,0,0-.06-.06l0,0,0,0A2.34,2.34,0,0,0,10.11,7,2.63,2.63,0,0,0,9,6.78a1.52,1.52,0,0,0-.7.11A1.77,1.77,0,0,0,8,7a2.1,2.1,0,0,0-.74,1,5.84,5.84,0,0,0-.21,1,1.66,1.66,0,0,1,1-.23.84.84,0,0,1,.77.91,7.26,7.26,0,0,1,0,1.27,3.87,3.87,0,0,1-.23.63c-.06.17-.14.35-.18.49a.5.5,0,0,1,.38.14.66.66,0,0,1,.19.53H9c0,.08,0,.16,0,.24a6.55,6.55,0,0,0,.24,2.44.54.54,0,0,0,.24.21.6.6,0,0,0,.31.1,1.3,1.3,0,0,0,1-.34,1.05,1.05,0,0,0,.29-.66c.07-.45.22-1.7.24-2h0a.72.72,0,0,1,.09-.44.63.63,0,0,1,.27-.24A5.36,5.36,0,0,1,10.61,10.24Z" fill="#f2f2f2"/></svg>
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/postgresqlflexibleserver/integration.json
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/postgresqlflexibleserver/integration.json
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/postgresqlflexibleserver/overview.md
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/postgresqlflexibleserver/overview.md
@@ -1,7 +0,0 @@
-### Monitor Azure Database for PostgreSQL - Flexible Server with SigNoz
-
-Collect key Azure Database for PostgreSQL - Flexible Server metrics and view them with an out of the box dashboard.
-
-This integration collects platform metrics for the `Microsoft.DBforPostgreSQL/flexibleServers` resource type.
-
-Note: PgBouncer metrics are only emitted when the built-in PgBouncer connection pooler is enabled.
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/redis/assets/dashboards/overview.json
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/redis/assets/dashboards/overview.json
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/redis/icon.svg
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/redis/icon.svg
@@ -1 +0,0 @@
-<svg id="uuid-8e49878e-6f1e-45dc-b13f-de3f3b0a3028" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><linearGradient id="uuid-e275200f-8047-483d-9165-335881dc0492" x1=".562" y1="2.684" x2="17.561" y2="19.437" gradientTransform="translate(0 20) scale(1 -1)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#757575"/><stop offset=".915" stop-color="#b0b0b0"/></linearGradient><linearGradient id="uuid-a8467988-fb81-47a9-9300-4fac9dcb97a4" x1="13.321" y1="15.339" x2="4.581" y2="6.563" gradientTransform="translate(0 20) scale(1 -1)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#0078d4"/><stop offset="1" stop-color="#005ba1"/></linearGradient></defs><path d="M9,.5c.276,0,.5.224.5.5v1h2v-1c0-.276.224-.5.5-.5s.5.224.5.5v1h1.5c1.105,0,2,.895,2,2v1.5h1c.276,0,.5.224.5.5s-.224.5-.5.5h-1v2h1c.276,0,.5.224.5.5s-.224.5-.5.5h-1v2h1c.276,0,.5.224.5.5s-.224.5-.5.5h-1v1.5c0,1.105-.895,2-2,2h-1.5v1c0,.276-.224.5-.5.5s-.5-.224-.5-.5v-1h-2v1c0,.276-.224.5-.5.5s-.5-.224-.5-.5v-1h-2v1c0,.276-.224.5-.5.5s-.5-.224-.5-.5v-1h-1.5c-1.105,0-2-.895-2-2v-1.5h-1c-.276,0-.5-.224-.5-.5s.224-.5.5-.5h1v-2h-1c-.276,0-.5-.224-.5-.5s.224-.5.5-.5h1v-2h-1c-.276,0-.5-.224-.5-.5s.224-.5.5-.5h1v-1.5c0-1.105.895-2,2-2h1.5v-1c0-.276.224-.5.5-.5s.5.224.5.5v1h2v-1c0-.276.224-.5.5-.5ZM8.984,3h-2.968c-.005,0-.01,0-.016,0s-.011,0-.016,0h-1.984c-.552,0-1,.448-1,1v10c0,.552.448,1,1,1h1.984c.005,0,.01,0,.016,0s.011,0,.016,0h2.968c.005,0,.01,0,.016,0s.011,0,.016,0h2.968c.005,0,.01,0,.016,0,.005,0,.01,0,.016,0h1.984c.552,0,1-.448,1-1v-1.978c0-.007,0-.015,0-.022s0-.015,0-.022v-2.955c0-.007,0-.015,0-.022s0-.015,0-.022v-2.955c0-.007,0-.015,0-.022s0-.015,0-.022v-1.978c0-.552-.448-1-1-1h-1.984c-.005,0-.01,0-.016,0-.005,0-.011,0-.016,0h-2.968c-.005,0-.01,0-.016,0s-.011,0-.016,0Z" fill="url(#uuid-e275200f-8047-483d-9165-335881dc0492)" fill-rule="evenodd"/><rect x="4" y="4" width="10" height="10" rx=".5" ry=".5" fill="url(#uuid-a8467988-fb81-47a9-9300-4fac9dcb97a4)"/><path d="M12.124,9.31c-.484.567-1.007,1.214-2.053,1.214-.934,0-1.282-.765-1.307-1.387.205.402.605.728,1.229.713,1.201-.036,2.024-1.043,2.024-1.961,0-1.097-.881-1.889-2.411-1.889-1.094,0-2.45.387-3.341.998-.01.63.368,1.448.504,1.358.772-.516,1.385-.848,1.979-1.014-.879.911-2.989,3.026-3.248,3.398.029.342.484,1.259.707,1.259.068,0,.126-.036.194-.099.636-.664,1.155-1.259,1.616-1.833.065.841.51,1.869,1.754,1.869,1.114,0,2.218-.747,2.721-2.429.058-.207-.213-.369-.368-.198ZM10.855,7.952c0,.531-.562.792-1.075.792-.274,0-.485-.067-.652-.154.307-.431.61-.874.936-1.347.575.09.79.387.79.709Z" fill="#fff"/></svg>
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/redis/integration.json
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/redis/integration.json
@@ -1,151 +0,0 @@
-{
-  "id": "redis",
-  "title": "Redis",
-  "icon": "file://icon.svg",
-  "overview": "file://overview.md",
-  "supportedSignals": {
-    "metrics": true,
-    "logs": true
-  },
-  "dataCollected": {
-    "metrics": [
-      {
-        "name": "azure_cachehits_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "The number of successful key lookups."
-      },
-      {
-        "name": "azure_cachemisses_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "The number of failed key lookups."
-      },
-      {
-        "name": "azure_evictedkeys_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "The number of items evicted from the cache."
-      },
-      {
-        "name": "azure_expiredkeys_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "The number of items expired from the cache."
-      },
-      {
-        "name": "azure_getcommands_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "The number of get operations from the cache."
-      },
-      {
-        "name": "azure_setcommands_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "The number of set operations to the cache."
-      },
-      {
-        "name": "azure_totalcommandsprocessed_total",
-        "unit": "Count",
-        "type": "Sum",
-        "description": "The total number of commands processed by the cache server."
-      },
-      {
-        "name": "azure_cachelatency_average",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "The latency to the cache in microseconds (preview)."
-      },
-      {
-        "name": "azure_cacheread_maximum",
-        "unit": "BytesPerSecond",
-        "type": "Gauge",
-        "description": "The amount of data read from the cache in Megabytes per second (MB/s)."
-      },
-      {
-        "name": "azure_cachewrite_maximum",
-        "unit": "BytesPerSecond",
-        "type": "Gauge",
-        "description": "The amount of data written to the cache in Megabytes per second (MB/s)."
-      },
-      {
-        "name": "azure_connectedclients_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "The number of client connections to the cache."
-      },
-      {
-        "name": "azure_operationspersecond_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "The number of instantaneous operations per second executed on the cache."
-      },
-      {
-        "name": "azure_totalkeys_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "The total number of items in the cache."
-      },
-      {
-        "name": "azure_percentprocessortime_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "The CPU utilization of the Azure Redis Cache server as a percentage."
-      },
-      {
-        "name": "azure_serverload_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "The percentage of cycles in which the Redis server is busy processing and not waiting idle for messages."
-      },
-      {
-        "name": "azure_usedmemory_maximum",
-        "unit": "Bytes",
-        "type": "Gauge",
-        "description": "The amount of cache memory used for key/value pairs in the cache in MB."
-      },
-      {
-        "name": "azure_usedmemorypercentage_maximum",
-        "unit": "Percent",
-        "type": "Gauge",
-        "description": "The percentage of cache memory used for key/value pairs."
-      },
-      {
-        "name": "azure_georeplicationhealthy_maximum",
-        "unit": "Count",
-        "type": "Gauge",
-        "description": "The health of geo replication in an Active Geo-Replication group. 0 represents Unhealthy and 1 represents Healthy."
-      }
-    ],
-    "logs": [
-      {
-        "name": "Resource ID",
-        "path": "resources.azure.resource.id",
-        "type": "string"
-      }
-    ]
-  },
-  "telemetryCollectionStrategy": {
-    "azure": {
-      "resourceProvider": "Microsoft.Cache",
-      "resourceType": "redisEnterprise",
-      "metrics": {},
-      "logs": {
-        "categoryGroups": [
-          "allLogs"
-        ]
-      }
-    }
-  },
-  "assets": {
-    "dashboards": [
-      {
-        "id": "overview",
-        "title": "Azure Redis Overview",
-        "description": "Overview of Azure Redis metrics",
-        "definition": "file://assets/dashboards/overview.json"
-      }
-    ]
-  }
-}
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/redis/overview.md
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/redis/overview.md
@@ -1,5 +0,0 @@
-### Monitor Azure Redis with SigNoz
-
-Collect key Azure Redis metrics and view them with an out of the box dashboard.
-
-This integration collects platform metrics for the `Microsoft.Cache/redisEnterprise` resource type.
--- a/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/sqldatabase/assets/dashboards/overview.json
+++ b/pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/sqldatabase/assets/dashboards/overview.json
--- a/Show More
+++ b/Show More
				`@@ -1 +0,0 @@`
				<svg id="ba7e3c83-4ea6-40d5-820f-746ccedb8156" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><linearGradient id="e74ddf23-fe74-4f89-9a49-c7f2e22be284" x1="3.707" y1="5.123" x2="3.707" y2="2.061" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#0078d4"/><stop offset="1" stop-color="#5ea0ef"/></linearGradient><linearGradient id="bcce3b94-6b83-44c5-9bf7-a89d666f3d1e" x1="12.741" y1="10.558" x2="12.741" y2="5.161" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#0078d4"/><stop offset="1" stop-color="#5ea0ef"/></linearGradient><linearGradient id="f9b0803f-41e5-4165-9230-e220427ec475" x1="3.707" y1="13.723" x2="3.707" y2="10.378" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#0078d4"/><stop offset="1" stop-color="#5ea0ef"/></linearGradient></defs><g><g><rect x="7.923" y="1.922" width="0.98" height="6.183" transform="translate(0.013 10.048) rotate(-61.725)" fill="#003067"/><path d="M7.081,4.2V1.5H.33v2.7h0v0c0,.716,1.511,1.3,3.376,1.3s3.376-.58,3.376-1.3Z" fill="url(#e74ddf23-fe74-4f89-9a49-c7f2e22be284)"/><ellipse cx="3.707" cy="1.546" rx="3.376" ry="1.296" fill="#83b9f9"/><path d="M16.115,8.616v-2.7H9.365v2.7h0v0c0,.716,1.511,1.3,3.376,1.3s3.376-.58,3.376-1.3Z" fill="url(#bcce3b94-6b83-44c5-9bf7-a89d666f3d1e)"/><ellipse cx="12.741" cy="5.96" rx="3.376" ry="1.296" fill="#83b9f9"/><rect x="3.22" y="4.168" width="0.98" height="7.962" fill="#003067"/><circle cx="3.75" cy="3.337" r="1.157" fill="#c3f1ff"/><path d="M7.081,12.824v-2.7H.33v2.7h0v0c0,.716,1.511,1.3,3.376,1.3s3.376-.58,3.376-1.3Z" fill="url(#f9b0803f-41e5-4165-9230-e220427ec475)"/><ellipse cx="3.707" cy="10.167" rx="3.376" ry="1.296" fill="#83b9f9"/><rect x="3.708" y="9.164" width="9.741" height="0.98" transform="translate(-3.376 4.767) rotate(-26.14)" fill="#003067"/><circle cx="3.701" cy="11.939" r="1.157" fill="#c3f1ff"/><circle cx="12.743" cy="7.548" r="1.157" fill="#c3f1ff"/></g><g><path d="M17.166,15.5h0a.255.255,0,0,0-.1-.185A17,17,0,0,0,15.563,14a3.563,3.563,0,0,0-2.638-.706,5.515,5.515,0,0,0-3.339,2.066.224.224,0,0,0-.058.14h0v0h0a.26.26,0,0,0,.1.186,17.319,17.319,0,0,0,1.507,1.315,3.568,3.568,0,0,0,2.637.706,5.517,5.517,0,0,0,3.339-2.066.229.229,0,0,0,.059-.141h0Z" fill="#003067"/><circle cx="13.381" cy="15.501" r="1.846" fill="#c3f1ff"/><path d="M13.389,14.478a.875.875,0,0,0-.144.029.537.537,0,0,1,.1.292.559.559,0,0,1-.559.558.548.548,0,0,1-.368-.145.985.985,0,0,0-.062.3,1.038,1.038,0,1,0,1.038-1.037Z" fill="#003067"/><path d="M17.529,13.472A6.582,6.582,0,0,0,15.6,12.241l.437-.776a.458.458,0,0,0,.044-.34.441.441,0,0,0-.806-.106l-.535.952a5.762,5.762,0,0,0-.914-.143v-.975a.442.442,0,0,0-.883,0v.974a5.879,5.879,0,0,0-.934.144l-.536-.952a.442.442,0,0,0-.6-.158.45.45,0,0,0-.159.6q.219.387.437.776a6.582,6.582,0,0,0-1.931,1.231c-.422.382.2,1,.624.624a5.183,5.183,0,0,1,7.067,0C17.326,14.476,17.951,13.854,17.529,13.472Z" fill="#003067"/></g></g><rect x="-4.934" y="-3.691" width="29.331" height="34.261" fill="none" stroke="#b31b1b" stroke-miterlimit="10"/></svg>
				`@@ -1 +0,0 @@`
				<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><radialGradient id="a" cx="-105.006" cy="-10.409" r="5.954" gradientTransform="matrix(1.036 0 0 1.027 117.739 19.644)" gradientUnits="userSpaceOnUse"><stop offset=".183" stop-color="#5ea0ef"/><stop offset="1" stop-color="#0078d4"/></radialGradient><clipPath id="b"><path d="M14.969 7.53a6.137 6.137 0 11-7.395-4.543 6.137 6.137 0 017.395 4.543z" fill="none"/></clipPath></defs><path d="M2.954 5.266a.175.175 0 01-.176-.176A2.012 2.012 0 00.769 3.081a.176.176 0 01-.176-.175.176.176 0 01.176-.176A2.012 2.012 0 002.778.72a.175.175 0 01.176-.176.175.175 0 01.176.176 2.012 2.012 0 002.009 2.009.175.175 0 01.176.176.175.175 0 01-.176.176A2.011 2.011 0 003.13 5.09a.177.177 0 01-.176.176zM15.611 17.456a.141.141 0 01-.141-.141 1.609 1.609 0 00-1.607-1.607.141.141 0 01-.141-.14.141.141 0 01.141-.141 1.608 1.608 0 001.607-1.607.141.141 0 01.141-.141.141.141 0 01.141.141 1.608 1.608 0 001.607 1.607.141.141 0 110 .282 1.609 1.609 0 00-1.607 1.607.141.141 0 01-.141.14z" fill="#50e6ff"/><path d="M14.969 7.53a6.137 6.137 0 11-7.395-4.543 6.137 6.137 0 017.395 4.543z" fill="url(#a)"/><g clip-path="url(#b)" fill="#f2f2f2"><path d="M5.709 13.115a1.638 1.638 0 10.005-3.275 1.307 1.307 0 00.007-.14A1.651 1.651 0 004.06 8.064H2.832a6.251 6.251 0 001.595 5.051zM15.045 7.815c0-.015 0-.03-.007-.044a5.978 5.978 0 00-1.406-2.88 1.825 1.825 0 00-.289-.09 1.806 1.806 0 00-2.3 1.663 2 2 0 00-.2-.013 1.737 1.737 0 00-.581 3.374 1.451 1.451 0 00.541.1h2.03a13.453 13.453 0 002.212-2.11z"/></g><path d="M17.191 3.832c-.629-1.047-2.1-1.455-4.155-1.149a14.606 14.606 0 00-2.082.452 6.456 6.456 0 011.528.767c.241-.053.483-.116.715-.151a7.49 7.49 0 011.103-.089 2.188 2.188 0 011.959.725c.383.638.06 1.729-.886 3a16.723 16.723 0 01-4.749 4.051A16.758 16.758 0 014.8 13.7c-1.564.234-2.682 0-3.065-.636s-.06-1.73.886-2.995c.117-.157.146-.234.279-.392a6.252 6.252 0 01.026-1.63 11.552 11.552 0 00-1.17 1.372C.517 11.076.181 12.566.809 13.613a3.165 3.165 0 002.9 1.249 8.434 8.434 0 001.251-.1 17.855 17.855 0 006.219-2.4A17.808 17.808 0 0016.24 8.03c1.243-1.661 1.579-3.15.951-4.198z" fill="#50e6ff"/></svg>
				`@@ -1 +0,0 @@`
				<svg id="e05c9575-4c38-4bcd-90eb-276caf26e3d0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><linearGradient id="e291aba6-8038-4db1-a04d-c7be74f5a3e6" x1="2.59" y1="10.16" x2="15.41" y2="10.16" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#005ba1"/><stop offset="0.07" stop-color="#0060a9"/><stop offset="0.36" stop-color="#0071c8"/><stop offset="0.52" stop-color="#0078d4"/><stop offset="0.64" stop-color="#0074cd"/><stop offset="0.82" stop-color="#006abb"/><stop offset="1" stop-color="#005ba1"/></linearGradient></defs><title>Icon-databases-122</title><path d="M9,5.14c-3.54,0-6.41-1-6.41-2.32V15.18c0,1.27,2.82,2.3,6.32,2.32H9c3.54,0,6.41-1,6.41-2.32V2.82C15.41,4.11,12.54,5.14,9,5.14Z" fill="url(#e291aba6-8038-4db1-a04d-c7be74f5a3e6)"/><path d="M15.41,2.82c0,1.29-2.87,2.32-6.41,2.32s-6.41-1-6.41-2.32S5.46.5,9,.5s6.41,1,6.41,2.32" fill="#e8e8e8"/><path d="M13.92,2.63c0,.82-2.21,1.48-4.92,1.48S4.08,3.45,4.08,2.63,6.29,1.16,9,1.16s4.92.66,4.92,1.47" fill="#50e6ff"/><path d="M9,3a11.55,11.55,0,0,0-3.89.57A11.42,11.42,0,0,0,9,4.11a11.15,11.15,0,0,0,3.89-.58A11.84,11.84,0,0,0,9,3Z" fill="#198ab3"/><path d="M12.64,9v1.63h-1a.39.39,0,0,1-.29-.14V9H10v1.78a.92.92,0,0,0,1,.89h1.49l.26-.13s-.11.41-.26.43H10.11v1h2.66A1.21,1.21,0,0,0,14,11.7V9Z" fill="#f2f2f2"/><path d="M9.53,9s0,0,0,0V8.51a.7.7,0,0,0-.48-.77,1.74,1.74,0,0,0-.5-.08.94.94,0,0,0-.91.58l-.78,1.9-1-1.9A.93.93,0,0,0,5,7.66a1.44,1.44,0,0,0-.51.09c-.35.11-.43.34-.43.73v3.31H5.23V9.56l.63,1.57a1.08,1.08,0,0,0,1,.66c.44,0,.62-.26.8-.66l.67-1.51v2.15H9.51V9h0Z" fill="#f2f2f2"/></svg>
				`@@ -1 +0,0 @@`
				<svg id="fc890127-728b-4ac0-b5da-86cdfc191e86" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><linearGradient id="a28dee20-4c71-46b5-b957-804c67da725a" x1="2.44" y1="10.67" x2="15.27" y2="10.67" gradientTransform="translate(0.14 -0.5) rotate(-0.01)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#005ba1"/><stop offset="0.07" stop-color="#0060a9"/><stop offset="0.36" stop-color="#0071c8"/><stop offset="0.52" stop-color="#0078d4"/><stop offset="0.64" stop-color="#0074cd"/><stop offset="0.82" stop-color="#006abb"/><stop offset="1" stop-color="#005ba1"/></linearGradient></defs><title>Icon-databases-131</title><path d="M9,5.14c-3.54,0-6.41-1-6.41-2.32V15.18c0,1.27,2.82,2.3,6.32,2.32H9c3.54,0,6.41-1,6.41-2.32V2.82C15.41,4.1,12.54,5.14,9,5.14Z" fill="url(#a28dee20-4c71-46b5-b957-804c67da725a)"/><path d="M15.41,2.82c0,1.28-2.87,2.32-6.41,2.32s-6.41-1-6.41-2.32S5.46.5,9,.5s6.41,1,6.41,2.32" fill="#e8e8e8"/><path d="M13.91,2.63c0,.82-2.2,1.48-4.91,1.48S4.08,3.45,4.08,2.64,6.28,1.16,9,1.16s4.91.66,4.91,1.47" fill="#50e6ff"/><path d="M9,3a11.65,11.65,0,0,0-3.9.57A11.53,11.53,0,0,0,9,4.11a11.47,11.47,0,0,0,3.89-.58A11.93,11.93,0,0,0,9,3Z" fill="#198ab3"/><path d="M12,9c0,.08,0,.24,0,.42a5.12,5.12,0,0,0-.08.63c0,.12,0,.3.05.46s0,.27,0,.36a1.68,1.68,0,0,1-.25.86.43.43,0,0,0,0,.07l.1.12a10.55,10.55,0,0,0,1.06-2.38h0c.28-.95.31-1.63.09-1.92a2.58,2.58,0,0,0-2.68-.86,3.29,3.29,0,0,1,.91.67A2.28,2.28,0,0,1,12,9Zm-.31.08a1.15,1.15,0,0,0-.79.09c-.29.18-.2.55,0,1a7.77,7.77,0,0,0,.35.85l.09.16h0c.05.08.08.15.11.2l.08.13a1.28,1.28,0,0,0,.18-.65,2.86,2.86,0,0,0,0-.33c0-.17,0-.36-.05-.49a6.1,6.1,0,0,1,.08-.69C11.71,9.24,11.72,9.13,11.73,9.05Zm-.3.41a.4.4,0,0,1-.18.1h0a.33.33,0,0,1-.14,0A.23.23,0,0,1,11,9.4h0c0-.07.11-.13.24-.15h.19s.09,0,.09.08A.2.2,0,0,1,11.43,9.46Zm-4.69.89c0-.07,0-.13,0-.17a1,1,0,0,0,0-.17,5.55,5.55,0,0,1,0-1A5.22,5.22,0,0,1,7,7.94,2.41,2.41,0,0,1,7.58,7,4.78,4.78,0,0,0,6.23,6.8a1.87,1.87,0,0,0-1.1.3A2,2,0,0,0,4.5,8.92,12.27,12.27,0,0,0,5,11.16c.34,1.14.73,1.84,1.07,1.95h0c.15.05.31,0,.47-.21.28-.34.54-.63.69-.8A1.88,1.88,0,0,1,6.74,10.35Zm.26.4a2.18,2.18,0,0,0,.06.56,1.5,1.5,0,0,0,.26.44,1.07,1.07,0,0,0,.35.25,1.09,1.09,0,0,0,.39.08c0-.17.14-.38.23-.6a4.35,4.35,0,0,0,.21-.59,6.61,6.61,0,0,0,0-1.11c0-.09,0-.19-.06-.3a.45.45,0,0,0-.12-.27l0,0A.66.66,0,0,0,8,9.08H7.8a1.56,1.56,0,0,0-.48.14A2,2,0,0,0,7,9.41v.11c0,.2,0,.41,0,.61v0a.86.86,0,0,1,0,.15l0,.39H7Zm.66-1.34,0,0a.46.46,0,0,1,.28,0,.6.6,0,0,1,.19.06c.09,0,.1.11.09.14h0a.37.37,0,0,1-.12.13A.3.3,0,0,1,8,9.73h0a.34.34,0,0,1-.28-.28Zm.74,3a.23.23,0,0,0-.13.06l-.14.17c-.17.21-.24.28-.73.38a.52.52,0,0,0-.26.1.58.58,0,0,0,.24.11,1.18,1.18,0,0,0,.72,0A1.7,1.7,0,0,0,8.45,13a.61.61,0,0,0,.2-.31.36.36,0,0,0-.1-.28A.15.15,0,0,0,8.4,12.39Zm4.61,0a1.63,1.63,0,0,1-1.13,0,.22.22,0,0,0-.14,0,.3.3,0,0,0-.17.14,1.09,1.09,0,0,0,0,.31,1.8,1.8,0,0,0,1.1-.1,1.36,1.36,0,0,0,.48-.34Zm-2.4-2.14c-.14-.41-.34-1,.18-1.36a1.35,1.35,0,0,1,.89-.15A3.18,3.18,0,0,0,11,7.64l-.1-.1-.06-.06h0a.34.34,0,0,0-.06-.06l0,0,0,0A2.34,2.34,0,0,0,10.11,7,2.63,2.63,0,0,0,9,6.78a1.52,1.52,0,0,0-.7.11A1.77,1.77,0,0,0,8,7a2.1,2.1,0,0,0-.74,1,5.84,5.84,0,0,0-.21,1,1.66,1.66,0,0,1,1-.23.84.84,0,0,1,.77.91,7.26,7.26,0,0,1,0,1.27,3.87,3.87,0,0,1-.23.63c-.06.17-.14.35-.18.49a.5.5,0,0,1,.38.14.66.66,0,0,1,.19.53H9c0,.08,0,.16,0,.24a6.55,6.55,0,0,0,.24,2.44.54.54,0,0,0,.24.21.6.6,0,0,0,.31.1,1.3,1.3,0,0,0,1-.34,1.05,1.05,0,0,0,.29-.66c.07-.45.22-1.7.24-2h0a.72.72,0,0,1,.09-.44.63.63,0,0,1,.27-.24A5.36,5.36,0,0,1,10.61,10.24Z" fill="#f2f2f2"/></svg>
				`@@ -1 +0,0 @@`
				<svg id="uuid-8e49878e-6f1e-45dc-b13f-de3f3b0a3028" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><linearGradient id="uuid-e275200f-8047-483d-9165-335881dc0492" x1=".562" y1="2.684" x2="17.561" y2="19.437" gradientTransform="translate(0 20) scale(1 -1)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#757575"/><stop offset=".915" stop-color="#b0b0b0"/></linearGradient><linearGradient id="uuid-a8467988-fb81-47a9-9300-4fac9dcb97a4" x1="13.321" y1="15.339" x2="4.581" y2="6.563" gradientTransform="translate(0 20) scale(1 -1)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#0078d4"/><stop offset="1" stop-color="#005ba1"/></linearGradient></defs><path d="M9,.5c.276,0,.5.224.5.5v1h2v-1c0-.276.224-.5.5-.5s.5.224.5.5v1h1.5c1.105,0,2,.895,2,2v1.5h1c.276,0,.5.224.5.5s-.224.5-.5.5h-1v2h1c.276,0,.5.224.5.5s-.224.5-.5.5h-1v2h1c.276,0,.5.224.5.5s-.224.5-.5.5h-1v1.5c0,1.105-.895,2-2,2h-1.5v1c0,.276-.224.5-.5.5s-.5-.224-.5-.5v-1h-2v1c0,.276-.224.5-.5.5s-.5-.224-.5-.5v-1h-2v1c0,.276-.224.5-.5.5s-.5-.224-.5-.5v-1h-1.5c-1.105,0-2-.895-2-2v-1.5h-1c-.276,0-.5-.224-.5-.5s.224-.5.5-.5h1v-2h-1c-.276,0-.5-.224-.5-.5s.224-.5.5-.5h1v-2h-1c-.276,0-.5-.224-.5-.5s.224-.5.5-.5h1v-1.5c0-1.105.895-2,2-2h1.5v-1c0-.276.224-.5.5-.5s.5.224.5.5v1h2v-1c0-.276.224-.5.5-.5ZM8.984,3h-2.968c-.005,0-.01,0-.016,0s-.011,0-.016,0h-1.984c-.552,0-1,.448-1,1v10c0,.552.448,1,1,1h1.984c.005,0,.01,0,.016,0s.011,0,.016,0h2.968c.005,0,.01,0,.016,0s.011,0,.016,0h2.968c.005,0,.01,0,.016,0,.005,0,.01,0,.016,0h1.984c.552,0,1-.448,1-1v-1.978c0-.007,0-.015,0-.022s0-.015,0-.022v-2.955c0-.007,0-.015,0-.022s0-.015,0-.022v-2.955c0-.007,0-.015,0-.022s0-.015,0-.022v-1.978c0-.552-.448-1-1-1h-1.984c-.005,0-.01,0-.016,0-.005,0-.011,0-.016,0h-2.968c-.005,0-.01,0-.016,0s-.011,0-.016,0Z" fill="url(#uuid-e275200f-8047-483d-9165-335881dc0492)" fill-rule="evenodd"/><rect x="4" y="4" width="10" height="10" rx=".5" ry=".5" fill="url(#uuid-a8467988-fb81-47a9-9300-4fac9dcb97a4)"/><path d="M12.124,9.31c-.484.567-1.007,1.214-2.053,1.214-.934,0-1.282-.765-1.307-1.387.205.402.605.728,1.229.713,1.201-.036,2.024-1.043,2.024-1.961,0-1.097-.881-1.889-2.411-1.889-1.094,0-2.45.387-3.341.998-.01.63.368,1.448.504,1.358.772-.516,1.385-.848,1.979-1.014-.879.911-2.989,3.026-3.248,3.398.029.342.484,1.259.707,1.259.068,0,.126-.036.194-.099.636-.664,1.155-1.259,1.616-1.833.065.841.51,1.869,1.754,1.869,1.114,0,2.218-.747,2.721-2.429.058-.207-.213-.369-.368-.198ZM10.855,7.952c0,.531-.562.792-1.075.792-.274,0-.485-.067-.652-.154.307-.431.61-.874.936-1.347.575.09.79.387.79.709Z" fill="#fff"/></svg>