Add mutable fragment

package-lock.json

@@ -3110,6 +3110,32 @@
         }
       }
     },
+    "apollo-utilities": {
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/apollo-utilities/-/apollo-utilities-1.3.4.tgz",
+      "integrity": "sha512-pk2hiWrCXMAy2fRPwEyhvka+mqwzeP60Jr1tRYi5xru+3ko94HI9o6lK0CT33/w4RDlxWchmdhDCrvdr+pHCig==",
+      "requires": {
+        "@wry/equality": "^0.1.2",
+        "fast-json-stable-stringify": "^2.0.0",
+        "ts-invariant": "^0.4.0",
+        "tslib": "^1.10.0"
+      },
+      "dependencies": {
+        "@wry/equality": {
+          "version": "0.1.11",
+          "resolved": "https://registry.npmjs.org/@wry/equality/-/equality-0.1.11.tgz",
+          "integrity": "sha512-mwEVBDUVODlsQQ5dfuLUS5/Tf7jqUKyhKYHmVi4fPB6bDMOfWvUPJmKgS1Z7Za/sOI3vzWt4+O7yCiL/70MogA==",
+          "requires": {
+            "tslib": "^1.9.3"
+          }
+        },
+        "tslib": {
+          "version": "1.13.0",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.13.0.tgz",
+          "integrity": "sha512-i/6DQjL8Xf3be4K/E6Wgpekn5Qasl1usyw++dAA35Ue5orEn65VIxOA+YvNNl9HV3qv70T7CNwjODHZrLwvd1Q=="
+        }
+      }
+    },
     "app-root-path": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/app-root-path/-/app-root-path-3.0.0.tgz",
@@ -6696,6 +6722,31 @@
       "resolved": "https://registry.npmjs.org/graphql/-/graphql-15.3.0.tgz",
       "integrity": "sha512-GTCJtzJmkFLWRfFJuoo9RWWa/FfamUHgiFosxi/X1Ani4AVWbeyBenZTNX6dM+7WSbbFfTo/25eh0LLkwHMw2w=="
     },
+    "graphql-anywhere": {
+      "version": "4.2.7",
+      "resolved": "https://registry.npmjs.org/graphql-anywhere/-/graphql-anywhere-4.2.7.tgz",
+      "integrity": "sha512-fJHvVywWVWjiHuPIMs16Nfjf4zdQUwSO1LKycwBJCWIPeoeQ8LqXK2BgYoZAHkhKEFktZZeYyzS4o/uIUG0z5A==",
+      "requires": {
+        "apollo-utilities": "^1.3.4",
+        "ts-invariant": "^0.3.2",
+        "tslib": "^1.10.0"
+      },
+      "dependencies": {
+        "ts-invariant": {
+          "version": "0.3.3",
+          "resolved": "https://registry.npmjs.org/ts-invariant/-/ts-invariant-0.3.3.tgz",
+          "integrity": "sha512-UReOKsrJFGC9tUblgSRWo+BsVNbEd77Cl6WiV/XpMlkifXwNIJbknViCucHvVZkXSC/mcWeRnIGdY7uprcwvdQ==",
+          "requires": {
+            "tslib": "^1.9.3"
+          }
+        },
+        "tslib": {
+          "version": "1.13.0",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.13.0.tgz",
+          "integrity": "sha512-i/6DQjL8Xf3be4K/E6Wgpekn5Qasl1usyw++dAA35Ue5orEn65VIxOA+YvNNl9HV3qv70T7CNwjODHZrLwvd1Q=="
+        }
+      }
+    },
     "graphql-config": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/graphql-config/-/graphql-config-3.0.3.tgz",

package.json

@@ -27,6 +27,7 @@
     "@apollo/client": "^3.0.0",
     "apollo-angular": "^2.0.4",
     "graphql": "^15.3.0",
+    "graphql-anywhere": "^4.2.7",
     "rxjs": "~6.5.5",
     "ts-deep-extract-types": "^1.0.1",
     "tslib": "^2.0.0",

src/app/graphqlOperations/fragments/bikeFragment.graphql

@@ -1,28 +1,24 @@
-fragment CargoBikeFields on CargoBike {
-    id
-    group
-    name
-    bikeEvents {
-      date
-      id  
-    }
-    insuranceData {
+fragment CargoBikeFieldsMutable on CargoBike {
+  id
+  group
+  name
+  insuranceData {
     billing
     hasFixedRate
-    }
-    dimensionsAndLoad {
+  }
+  dimensionsAndLoad {
     bikeLength
     bikeWeight
-    }
-    numberOfChildren
-    security {
+  }
+  numberOfChildren
+  security {
     frameNumber
     adfcCoding
     keyNumberAXAChain
     keyNumberFrameLock
     policeCoding
-    }
-    dimensionsAndLoad {
+  }
+  dimensionsAndLoad {
     bikeHeight
     bikeLength
     bikeWeight
@@ -35,6 +31,13 @@ fragment CargoBikeFields on CargoBike {
     maxWeightBox
     maxWeightLuggageRack
     maxWeightTotal
-    }
+  }
 }
 
+fragment CargoBikeFields on CargoBike {
+  ...CargoBikeFieldsMutable
+  bikeEvents {
+    date
+    id
+  }
+}

src/app/pages/tables/bikes/bikes.component.ts

@@ -3,6 +3,8 @@ import { Component } from '@angular/core';
 import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
 import { BikesService, CargoBikeResult } from 'src/app/services/bikes.service';
 import { deepCopy } from 'src/app/helperFunctions/deepCopy';
+import { filter } from 'graphql-anywhere';
+import {CargoBikeFieldsMutableFragmentDoc} from 'src/generated/graphql';
 
 type CargoBikeDataRow = CargoBikeResult & {
   waitingForEditPermissions: boolean;
@@ -55,7 +57,7 @@ export class BikesComponent {
 
   save(row: CargoBikeDataRow) {
     //remove lock
-    this.bikesService.updateBike({bike: row})
+    this.bikesService.updateBike({bike: filter(CargoBikeFieldsMutableFragmentDoc, row)})
   }
 
   cancel(row: CargoBikeDataRow) {

src/generated/graphql.ts

@@ -900,13 +900,10 @@ export type GetCargoBikesQuery = (
   )>> }
 );
 
-export type CargoBikeFieldsFragment = (
+export type CargoBikeFieldsMutableFragment = (
   { __typename?: 'CargoBike' }
   & Pick<CargoBike, 'id' | 'group' | 'name' | 'numberOfChildren'>
-  & { bikeEvents?: Maybe<Array<Maybe<(
-    { __typename?: 'BikeEvent' }
-    & Pick<BikeEvent, 'date' | 'id'>
-  )>>>, insuranceData: (
+  & { insuranceData: (
     { __typename?: 'InsuranceData' }
     & Pick<InsuranceData, 'billing' | 'hasFixedRate'>
   ), dimensionsAndLoad: (
@@ -918,15 +915,20 @@ export type CargoBikeFieldsFragment = (
   ) }
 );
 
-export const CargoBikeFieldsFragmentDoc = gql`
-    fragment CargoBikeFields on CargoBike {
+export type CargoBikeFieldsFragment = (
+  { __typename?: 'CargoBike' }
+  & { bikeEvents?: Maybe<Array<Maybe<(
+    { __typename?: 'BikeEvent' }
+    & Pick<BikeEvent, 'date' | 'id'>
+  )>>> }
+  & CargoBikeFieldsMutableFragment
+);
+
+export const CargoBikeFieldsMutableFragmentDoc = gql`
+    fragment CargoBikeFieldsMutable on CargoBike {
   id
   group
   name
-  bikeEvents {
-    date
-    id
-  }
   insuranceData {
     billing
     hasFixedRate
@@ -969,6 +971,15 @@ export const CargoBikeFieldsFragmentDoc = gql`
   }
 }
     `;
+export const CargoBikeFieldsFragmentDoc = gql`
+    fragment CargoBikeFields on CargoBike {
+  ...CargoBikeFieldsMutable
+  bikeEvents {
+    date
+    id
+  }
+}
+    ${CargoBikeFieldsMutableFragmentDoc}`;
 export const GetCargoBikeByIdDocument = gql`
     query GetCargoBikeById($id: ID!) {
   cargoBikeById(id: $id) {