Merge pull request #235 from sharelatex/ja-show-deleted-files-in-v2-history

Handle deleted and renamed files better in v2 history UI; Fixes #226

services/web/app/views/project/editor.pug

@@ -65,6 +65,7 @@ block content
 				)
 					.ui-layout-west
 						include ./editor/file-tree
+						include ./editor/history-file-tree
 
 					.ui-layout-center
 						include ./editor/editor

services/web/app/views/project/editor/file-tree.pug

@@ -1,4 +1,4 @@
-aside#file-tree(ng-controller="FileTreeController", ng-class="{ 'multi-selected': multiSelectedCount > 0 }").full-size
+aside.file-tree(ng-controller="FileTreeController", ng-class="{ 'multi-selected': multiSelectedCount > 0 }", ng-show="ui.view != 'history' || !history.isV2").full-size
 	.toolbar.toolbar-filetree(ng-if="permissions.write")
 		a(
 			href,

services/web/app/views/project/editor/history-file-tree.pug

@@ -0,0 +1,17 @@
+aside.file-tree.file-tree-history(ng-controller="FileTreeController", ng-class="{ 'multi-selected': multiSelectedCount > 0 }", ng-show="ui.view == 'history' && history.isV2").full-size
+	.toolbar.toolbar-filetree
+		span Modified files
+
+	.file-tree-inner
+		ul.list-unstyled.file-tree-list
+			li(
+				ng-repeat="(pathname, doc) in history.selection.docs"
+				ng-class="{ 'selected': history.selection.pathname == pathname }"
+			)
+				.entity
+					.entity-name.entity-name-history(
+						ng-click="history.selection.pathname = pathname",
+						ng-class="{ 'deleted': doc.deleted }"
+					)
+						i.fa.fa-fw.fa-pencil
+						span  {{ pathname }}

services/web/app/views/project/editor/history.pug

@@ -145,6 +145,9 @@ div#history(ng-show="ui.view == 'history'")
 							div(ng-if="project_op.add")
 								.action Created
 								.doc {{ project_op.add.pathname }}
+							div(ng-if="project_op.remove")
+								.action Deleted
+								.doc {{ project_op.remove.pathname }}
 						div.users
 							div.user(ng-repeat="update_user in update.meta.users")
 								.color-square(ng-if="update_user != null", ng-style="{'background-color': 'hsl({{ update_user.hue }}, 70%, 50%)'}")
@@ -175,11 +178,15 @@ div#history(ng-show="ui.view == 'history'")
 						}"
 					)
 					|  in <strong>{{history.diff.pathname}}</strong>
-				.toolbar-right(ng-if="!history.isV2")
+				.toolbar-right
 					a.btn.btn-danger.btn-sm(
 						href,
+						ng-if="!history.isV2"
 						ng-click="openRestoreDiffModal()"
 					) #{translate("restore_to_before_these_changes")}
+					.deleted-warning(
+						ng-show="history.selection.docs[history.selection.pathname].deleted"
+					) This file was deleted
 			.diff-editor.hide-ace-cursor(
 				ace-editor="history",
 				theme="settings.theme",

services/web/public/coffee/ide/history/HistoryV2Manager.coffee

@@ -20,10 +20,8 @@ define [
 					@_selectDocFromUpdates()
 					@reloadDiff()
 
-			@$scope.$on "entity:selected", (event, entity) =>
-				if (@$scope.ui.view == "history") and (entity.type == "doc")
-					@$scope.history.selection.pathname = _ide.fileTreeManager.getEntityPath(entity)
-					@reloadDiff()
+			@$scope.$watch "history.selection.pathname", () =>
+				@reloadDiff()
 
 		show: () ->
 			@$scope.ui.view = "history"
@@ -31,8 +29,6 @@ define [
 
 		hide: () ->
 			@$scope.ui.view = "editor"
-			# Make sure we run the 'open' logic for whatever is currently selected
-			@$scope.$emit "entity:selected", @ide.fileTreeManager.findSelectedEntity()
 
 		reset: () ->
 			@$scope.history = {
@@ -42,6 +38,7 @@ define [
 				atEnd: false
 				selection: {
 					updates: []
+					docs: {}
 					pathname: null
 					range: {
 						fromV: null
@@ -51,7 +48,7 @@ define [
 				diff: null
 			}
 
-		MAX_RECENT_UPDATES_TO_SELECT: 2
+		MAX_RECENT_UPDATES_TO_SELECT: 5
 		autoSelectRecentUpdates: () ->
 			return if @$scope.history.updates.length == 0
 
@@ -205,7 +202,7 @@ define [
 			# Map of original pathname -> doc summary
 			docs_summary = {}
 
-			updatePathnameWithUpdateVersions = (pathname, update) ->
+			updatePathnameWithUpdateVersions = (pathname, update, deleted) ->
 				# docs_summary is indexed by the original pathname the doc
 				# had at the start, so we have to look this up from the current
 				# pathname via original_pathname first
@@ -223,6 +220,8 @@ define [
 					doc_summary.toV,
 					update.toV
 				)
+				if deleted?
+					doc_summary.deleted = true
 
 			# Put updates in ascending chronological order
 			updates = updates.slice().reverse()
@@ -238,6 +237,9 @@ define [
 					if project_op.add?
 						add = project_op.add
 						updatePathnameWithUpdateVersions(add.pathname, update)
+					if project_op.remove?
+						remove = project_op.remove
+						updatePathnameWithUpdateVersions(remove.pathname, update, true)
 
 			return docs_summary
 
@@ -258,6 +260,7 @@ define [
 		# then prefer this one if present.
 		_selectDocFromUpdates: () ->
 			affected_docs = @_perDocSummaryOfUpdates(@$scope.history.selection.updates)
+			@$scope.history.selection.docs = affected_docs
 
 			selected_pathname = @$scope.history.selection.pathname
 			if selected_pathname? and affected_docs[selected_pathname]
@@ -269,10 +272,6 @@ define [
 					break
 
 			@$scope.history.selection.pathname = selected_pathname
-			if selected_pathname?
-				entity = @ide.fileTreeManager.findEntityByPath(selected_pathname)
-				if entity?
-					@ide.fileTreeManager.selectEntity(entity)
 
 		_updateContainsUserId: (update, user_id) ->
 			for user in update.meta.users

services/web/public/stylesheets/app/editor/file-tree.less

@@ -8,7 +8,7 @@
 	}
 }
 
-#file-tree {
+.file-tree {
 	.toolbar.toolbar-filetree {
 		.toolbar-small-mixin;
 		.toolbar-alt-mixin;
@@ -42,6 +42,15 @@
 		padding: (@line-height-computed / 4) 0;
 	}
 
+	&-history {
+		.entity-name {
+			padding-left: 6px;
+			&.deleted {
+				text-decoration: line-through;
+			}
+		}
+	}
+
 	ul.file-tree-list {
 		margin: 0;
 		overflow-x: hidden;

services/web/public/stylesheets/app/editor/history.less

@@ -67,6 +67,12 @@
 		.diff-deleted {
 			padding: @line-height-computed;
 		}
+		.deleted-warning {
+			background-color: @brand-danger;
+			color: white;
+			padding: @line-height-computed / 2;
+			margin-right: @line-height-computed / 4;
+		}
 	}
 
 	aside.change-list {

services/web/test/unit_frontend/coffee/HistoryManagerV2Tests.coffee

@@ -28,6 +28,7 @@ describe "HistoryV2Manager", ->
 			selection: {
 				updates: []
 				pathname: null
+				docs: {}
 				range: {
 					fromV: null
 					toV: null
@@ -132,3 +133,32 @@ describe "HistoryV2Manager", ->
 			expect(result).to.deep.equal({
 				"main.tex": { fromV: 0, toV: 1 }
 			})
+
+		it "should track deletions", ->
+			result = @historyManager._perDocSummaryOfUpdates([{
+				pathnames: ["main.tex"]
+				fromV: 0, toV: 1
+			}, {
+				project_ops: [{
+					remove:
+						pathname: "main.tex"
+				}]
+				fromV: 1, toV: 2
+			}])
+
+			expect(result).to.deep.equal({
+				"main.tex": { fromV: 0, toV: 2, deleted: true }
+			})
+
+		it "should track single deletions", ->
+			result = @historyManager._perDocSummaryOfUpdates([{
+				project_ops: [{
+					remove:
+						pathname: "main.tex"
+				}]
+				fromV: 0, toV: 1
+			}])
+
+			expect(result).to.deep.equal({
+				"main.tex": { fromV: 0, toV: 1, deleted: true }
+			})