feat(project): rename unlink dialog to change link, allow unlinking (f…

…ixes #118)

package.json

@@ -104,7 +104,7 @@
     "@angular/material": "^5.2.4",
     "@angular/platform-browser": "^5.2.8",
     "@angular/platform-browser-dynamic": "^5.2.8",
-    "@mixer/cdk-std": "^0.2.13",
+    "@mixer/cdk-std": "^0.2.17",
     "@ngrx/effects": "^5.2.0",
     "@ngrx/entity": "^5.2.0",
     "@ngrx/store": "^5.2.0",

src/app/editor/project/link-dialog/link-dialog.component.html

@@ -12,7 +12,7 @@ <h4 matLine>{{ game.name }}</h4>
       <p matLine>Updated: {{ game.updatedAt | amTimeAgo }}</p>
       <button mat-raised-button color="primary" *ngIf="(linkedGame | async)?.id !== game.id "
         (click)="link(game)">Link</button>
-      <button mat-raised-button disabled *ngIf="(linkedGame | async)?.id === game.id">Linked</button>
+      <button mat-raised-button (click)="unlink()" *ngIf="(linkedGame | async)?.id === game.id">Unlink</button>
     </mat-list-item>
   </mat-list>
 </div>

src/app/editor/project/link-dialog/link-dialog.component.ts

@@ -3,7 +3,7 @@ import { MatDialogRef } from '@angular/material';
 import { Store } from '@ngrx/store';
 
 import * as fromRoot from '../../bedrock.reducers';
-import { IInteractiveGame, SetInteractiveGame } from '../project.actions';
+import { IInteractiveGame, SetInteractiveGame, UnlinkInteractiveGame } from '../project.actions';
 import * as fromProject from '../project.reducer';
 
 /**
@@ -31,10 +31,18 @@ export class LinkProjectDialogComponent {
   ) {}
 
   /**
-   * Deletes a snapshot from the store.
+   * Unlink a game from the project.
    */
   public link(project: IInteractiveGame) {
     this.store.dispatch(new SetInteractiveGame(project));
     this.dialog.close(project);
   }
+
+  /**
+   * Unlinks the linked game from the control.
+   */
+  public unlink() {
+    this.store.dispatch(new UnlinkInteractiveGame());
+    this.dialog.close(undefined);
+  }
 }

src/app/editor/project/project-dropdown/project-dropdown.component.html

@@ -16,7 +16,7 @@
     <menu-bar-item
       (click)="changeLink()"
       *ngIf="linkedProject | async"
-      text="Unlink from {{ (linkedProject | async)?.name }}">
+      text="Change Linked Game">
     </menu-bar-item>
     <menu-bar-item
       (click)="changeLink()"

src/app/editor/project/project.actions.ts

@@ -66,6 +66,7 @@ export const enum ProjectActionTypes {
   TRY_OPEN_PROJECT = '[Project] Attempt to open a directory',
   SET_OPEN_PROJECT = '[Project] Set the currently open project',
   SET_GAME_LINK = '[Project] Set the linked Interactive version',
+  UNSET_GAME_LINK = '[Project] Unset the linked Interactive version',
   SET_CONFIRM_SCHEMA = '[Project] Set whether to confirm schema upload',
   OPEN_DIRECTORY = '[Project] Open directory',
   START_CHANGE_LINK = '[Project] Start changing the linked project',
@@ -78,6 +79,7 @@ export const enum ProjectActionTypes {
 export const enum ProjectMethods {
   OpenDirectory = '[Project] Open directory',
   LinkGameToControls = '[Project] Link game to controls',
+  UnlinkGameFromControls = '[Project] Unlink game to controls',
   GetOwnedGames = '[Project] Get owned games',
   RenameProject = '[Project] Rename',
 }
@@ -148,6 +150,14 @@ export class StartChangeLink implements Action {
   public readonly type = ProjectActionTypes.START_CHANGE_LINK;
 }
 
+/**
+ * Fired to start the process of changing which project the
+ * controls are linked to.
+ */
+export class UnlinkInteractiveGame implements Action {
+  public readonly type = ProjectActionTypes.UNSET_GAME_LINK;
+}
+
 /**
  * Fired when the user starts the linking process, loads Interactive games
  * that they own.
@@ -197,4 +207,5 @@ export type ProjectActions =
   | LoadOwnedGames
   | SetOwnedGames
   | RequireLink
-  | RenameProject;
+  | RenameProject
+  | UnlinkInteractiveGame;

src/app/editor/project/project.effects.ts

@@ -105,6 +105,21 @@ export class ProjectEffects {
       ),
     );
 
+  /**
+   * Persists a link to an interactive project to the server.
+   */
+  @Effect({ dispatch: false })
+  public readonly unsetLinkedVersion = this.actions
+    .ofType<SetInteractiveGame>(ProjectActionTypes.UNSET_GAME_LINK)
+    .pipe(
+      withLatestDirectory(this.store),
+      switchMap(([, directory]) =>
+        this.electron
+          .call(ProjectMethods.UnlinkGameFromControls, { directory })
+          .catch(RpcError, () => undefined),
+      ),
+    );
+
   /**
    * Updates the name of the project package.json.
    */

src/app/editor/project/project.reducer.ts

@@ -34,6 +34,14 @@ export function projectReducer(state: IProjectState = {}, action: ProjectActions
   switch (action.type) {
     case ProjectActionTypes.SET_GAME_LINK:
       return { ...state, project: { ...state.project, interactiveGame: action.game } };
+    case ProjectActionTypes.UNSET_GAME_LINK:
+      return {
+        ...state,
+        project: {
+          ...state.project,
+          interactiveGame: null,
+        },
+      };
     case ProjectActionTypes.SET_CONFIRM_SCHEMA:
       return { ...state, project: { ...state.project, confirmSchemaUpload: action.confirm } };
     case ProjectActionTypes.RENAME_PROJECT:

src/server/datastore.ts

@@ -1,7 +1,7 @@
 import { isPlainObject, merge } from 'lodash';
 import * as os from 'os';
 import * as path from 'path';
-import { appendFile, exists, mkdir, readFile, writeFile } from './util';
+import { appendFile, exists, mkdir, readFile, unlink, writeFile } from './util';
 
 /**
  * IDataStore is a system-aware store for project files and settings.
@@ -74,13 +74,25 @@ export class FileDataStore implements IDataStore {
   }
 
   public async saveGlobal<T>(file: string, value: T): Promise<void> {
+    const filePath = this.filePath(this.homedir, file);
     await this.ensureMiixFolderInDir(this.homedir, false);
-    await writeFile(this.filePath(this.homedir, file), JSON.stringify(value, null, 2));
+
+    if (value === undefined) {
+      await unlink(filePath);
+    } else {
+      await writeFile(filePath, JSON.stringify(value, null, 2));
+    }
   }
 
   public async saveProject<T>(file: string, projectPath: string, value: T): Promise<void> {
+    const filePath = this.filePath(projectPath, file);
     await this.ensureMiixFolderInDir(projectPath, true);
-    await writeFile(this.filePath(projectPath, file), JSON.stringify(value, null, 2));
+
+    if (value === undefined) {
+      await unlink(filePath);
+    } else {
+      await writeFile(filePath, JSON.stringify(value, null, 2));
+    }
   }
 
   private filePath(base: string, file: string) {

src/server/electron-server.ts

@@ -228,6 +228,13 @@ const methods: { [methodName: string]: (data: any, server: ElectronServer) => Pr
     return new ProjectLinker(new Project(options.directory)).linkGame(options.game);
   },
 
+  /**
+   * Links the Interactive game to the set of controls.
+   */
+  [forProject.ProjectMethods.UnlinkGameFromControls]: async (options: { directory: string }) => {
+    return new ProjectLinker(new Project(options.directory)).unlinkGame();
+  },
+
   /**
    * Links the Interactive game to the set of controls.
    */

src/server/project-linker.ts

@@ -51,6 +51,13 @@ export class ProjectLinker {
     });
   }
 
+  /**
+   * Gets rid of any previous game link.
+   */
+  public async unlinkGame() {
+    await this.project.saveSetting(storageKey, undefined);
+  }
+
   /**
    * Returns the linked Interactive game if any.
    */

src/server/util.ts

@@ -11,6 +11,13 @@ export async function readFile(file: string): Promise<string> {
   return promiseCallback<string>(callback => fs.readFile(file, 'utf8', callback));
 }
 
+/**
+ * Promisified fs.unlink
+ */
+export async function unlink(file: string): Promise<void> {
+  return promiseCallback(callback => fs.unlink(file, callback));
+}
+
 /**
  * Promisified fs.writeFile
  */

test/datastore.test.ts

@@ -42,6 +42,8 @@ describe('FileDataStore', () => {
     expect(await exists(path.join(homedir(), '.miix', 'foo.json'))).to.be.false;
     await store.saveGlobal('foo', true);
     expect(await readFile(path.join(homedir(), '.miix', 'foo.json'))).to.equal('true');
+    await store.saveGlobal('foo', undefined);
+    expect(await exists(path.join(homedir(), '.miix', 'foo.json'))).to.be.false;
   });
 
   it('saves project data correctly', async () => {
@@ -50,6 +52,8 @@ describe('FileDataStore', () => {
     await store.saveProject('foo', projdir(), true);
     expect(await readFile(path.join(projdir(), '.miix', 'foo.json'))).to.equal('true');
     expect(await readFile(path.join(projdir(), '.gitignore'))).to.equal('\n/.miix\n');
+    await store.saveProject('foo', projdir(), undefined);
+    expect(await exists(path.join(projdir(), '.miix', 'foo.json'))).to.be.false;
   });
 
   it('saves project data correctly', async () => {