#862 Fix qingdao facilities name change on save

src/components/svgs/nodes/facilities.tsx

@@ -8,6 +8,9 @@ import { AttrsProps } from '../../../constants/constants';
  * Facilities type
  *
  * Note that the value should match the filename without the extension under public/images/facilities.
+ *
+ * Note changing the value needs both filename update and save version (type) update.
+ * See change of Qingdao in #809 and fix in #862.
  */
 export enum FacilitiesType {
     Airport = 'airport',

src/util/save.test.ts

@@ -509,4 +509,16 @@ describe('Unit tests for param upgrade function', () => {
             '{"graph":{"options":{"type":"directed","multi":true,"allowSelfLoops":true},"attributes":{},"nodes":[],"edges":[]},"svgViewBoxZoom":100,"svgViewBoxMin":{"x":0,"y":0},"version":39}';
         expect(newParam).toEqual(expectParam);
     });
+
+    it('39 -> 40', () => {
+        // Bump save version to support Qingdao facilities name change.
+        const oldParam =
+            '{"graph":{"options":{"type":"directed","multi":true,"allowSelfLoops":true},"attributes":{},"nodes":[{"key":"misc_node_Of3OsZGk2E","attributes":{"visible":true,"zIndex":0,"x":320,"y":255,"type":"facilities","facilities":{"type":"qingdao_airport"}}}],"edges":[]},"svgViewBoxZoom":100,"svgViewBoxMin":{"x":0,"y":0},"version":39}';
+        const newParam = UPGRADE_COLLECTION[39](oldParam);
+        const graph = new MultiDirectedGraph() as MultiDirectedGraph<NodeAttributes, EdgeAttributes, GraphAttributes>;
+        expect(() => graph.import(JSON.parse(newParam))).not.toThrow();
+        const expectParam =
+            '{"graph":{"options":{"type":"directed","multi":true,"allowSelfLoops":true},"attributes":{},"nodes":[{"key":"misc_node_Of3OsZGk2E","attributes":{"visible":true,"zIndex":0,"x":320,"y":255,"type":"facilities","facilities":{"type":"airport_qingdao"}}}],"edges":[]},"svgViewBoxZoom":100,"svgViewBoxMin":{"x":0,"y":0},"version":40}';
+        expect(newParam).toEqual(expectParam);
+    });
 });

src/util/save.ts

@@ -30,7 +30,7 @@ export interface RMPSave {
     svgViewBoxMin: { x: number; y: number };
 }
 
-export const CURRENT_VERSION = 39;
+export const CURRENT_VERSION = 40;
 
 /**
  * Load the tutorial.
@@ -456,4 +456,23 @@ export const UPGRADE_COLLECTION: { [version: number]: (param: string) => string
     38: param =>
         // Bump save version to support Guangzhou 2024 facilities.
         JSON.stringify({ ...JSON.parse(param), version: 39 }),
+    39: param => {
+        // Bump save version to support Qingdao facilities name change.
+        const p = JSON.parse(param);
+        const graph = new MultiDirectedGraph() as MultiDirectedGraph<NodeAttributes, EdgeAttributes, GraphAttributes>;
+        graph.import(p?.graph);
+        graph
+            .filterNodes((node, attr) => node.startsWith('misc_node') && attr.type === MiscNodeType.Facilities)
+            .forEach(node => {
+                const type = graph.getNodeAttribute(node, 'type');
+                const attr = graph.getNodeAttribute(node, type) as any;
+                if (attr.type === 'qingdao_airport') attr.type = 'airport_qingdao';
+                else if (attr.type === 'qingdao_coach_station') attr.type = 'coach_station_qingdao';
+                else if (attr.type === 'qingdao_cruise_terminal') attr.type = 'cruise_terminal_qingdao';
+                else if (attr.type === 'qingdao_railway') attr.type = 'railway_qingdao';
+                else if (attr.type === 'qingdao_tram') attr.type = 'tram_qingdao';
+                graph.mergeNodeAttributes(node, { [type]: attr });
+            });
+        return JSON.stringify({ ...p, version: 40, graph: graph.export() });
+    },
 };