feat(store): new function for renaming pages

src/store/project/page-ref.ts

@@ -80,6 +80,20 @@ export class PageRef {
 		this.setProject(undefined);
 	}
 
+	/*
+	* Sets the technical (internal) ID of the page.
+	*/
+	public setId(id: string): void {
+		this.id = id;
+	}
+
+	/**
+	 * Sets the human-friendly name of the page.
+	 */
+	public setName(name: string): void {
+		this.name = name;
+	}
+
 	/**
 	 * Sets the project this page belongs to.
 	 * If it belonged to a project before, it is removed from that project.

src/store/store.ts

@@ -1,4 +1,5 @@
 import { PatternFolder } from './pattern/folder';
+import * as FileUtils from 'fs';
 import { JsonArray, JsonObject, Persister } from './json';
 import * as MobX from 'mobx';
 import { IObservableArray } from 'mobx/lib/types/observablearray';
@@ -427,6 +428,22 @@ export class Store {
 		(this.projects as IObservableArray<Project>).remove(project);
 	}
 
+	/**
+	 * Renames the name of the pages files and update the names
+	 * @param id The new ID of the page.
+	 */
+
+	public renamePage(id: string): void {
+		if (this.currentPage) {
+			const oldPath = PathUtils.join(
+				this.styleGuidePath,
+				`/alva/page-${this.currentPage.getId()}.yaml`
+			);
+			const newPath = PathUtils.join(this.styleGuidePath, `/alva/page-${id}.yaml`);
+			FileUtils.renameSync(oldPath, newPath);
+		}
+	}
+
 	/**
 	 * Saves the entire store. This includes the project definitions and page references and
 	 * the currently opened page and its elements.