Adds new view settings sections

package.json

@@ -1936,12 +1936,6 @@
 					"markdownDescription": "Specifies the description format of stashes in the views. See [_Commit Tokens_](https://github.com/eamodio/vscode-gitlens/wiki/Custom-Formatting#commit-tokens) in the GitLens docs",
 					"scope": "window"
 				},
-				"gitlens.views.stashes.avatars": {
-					"type": "boolean",
-					"default": true,
-					"markdownDescription": "Specifies whether to show avatar images instead of commit (or status) icons in the _Stashes_ view",
-					"scope": "window"
-				},
 				"gitlens.views.stashes.files.compact": {
 					"type": "boolean",
 					"default": true,
@@ -3901,16 +3895,6 @@
 				"icon": "$(list-flat)"
 			},
 			{
-				"command": "gitlens.views.stashes.setShowAvatarsOn",
-				"title": "Show Avatars",
-				"category": "GitLens"
-			},
-			{
-				"command": "gitlens.views.stashes.setShowAvatarsOff",
-				"title": "Hide Avatars",
-				"category": "GitLens"
-			},
-			{
 				"command": "gitlens.views.tags.copy",
 				"title": "Copy",
 				"category": "GitLens"
@@ -4988,14 +4972,6 @@
 					"when": "false"
 				},
 				{
-					"command": "gitlens.views.stashes.setShowAvatarsOn",
-					"when": "false"
-				},
-				{
-					"command": "gitlens.views.stashes.setShowAvatarsOff",
-					"when": "false"
-				},
-				{
 					"command": "gitlens.views.tags.copy",
 					"when": "false"
 				},
@@ -5829,16 +5805,6 @@
 					"group": "navigation@99"
 				},
 				{
-					"command": "gitlens.views.stashes.setShowAvatarsOn",
-					"when": "view =~ /^gitlens\\.views\\.stashes/ && !config.gitlens.views.stashes.avatars",
-					"group": "1_gitlens@0"
-				},
-				{
-					"command": "gitlens.views.stashes.setShowAvatarsOff",
-					"when": "view =~ /^gitlens\\.views\\.stashes/ && config.gitlens.views.stashes.avatars",
-					"group": "1_gitlens@0"
-				},
-				{
 					"command": "gitlens.views.tags.setLayoutToList",
 					"when": "view =~ /gitlens\\.views\\.tags/ && config.gitlens.views.tags.branches.layout == tree",
 					"group": "navigation@1"

src/config.ts

@@ -519,7 +519,7 @@ export interface SearchViewConfig {
 }
 
 export interface StashesViewConfig {
-	avatars: boolean;
+	// avatars: boolean;
 	files: ViewsFilesConfig;
 }
 

src/views/nodes/commitFileNode.ts

@@ -6,6 +6,7 @@ import { GlyphChars } from '../../constants';
 import { Container } from '../../container';
 import { CommitFormatter, GitFile, GitLogCommit, GitRevisionReference, StatusFileFormatter } from '../../git/git';
 import { GitUri } from '../../git/gitUri';
+import { StashesView } from '../stashesView';
 import { View } from '../viewBase';
 import { ContextValues, ViewNode, ViewRefFileNode } from './viewNode';
 
@@ -62,7 +63,7 @@ export class CommitFileNode extends ViewRefFileNode {
 		item.description = this.description;
 		item.tooltip = this.tooltip;
 
-		if (this._options.displayAsCommit && this.view.config.avatars) {
+		if (this._options.displayAsCommit && !(this.view instanceof StashesView) && this.view.config.avatars) {
 			item.iconPath = this.commit.getAvatarUri(Container.config.defaultGravatarsStyle);
 		} else {
 			const icon = GitFile.getStatusIcon(this.file.status);

src/views/nodes/commitNode.ts

@@ -2,14 +2,15 @@
 import * as paths from 'path';
 import { Command, ThemeIcon, TreeItem, TreeItemCollapsibleState } from 'vscode';
 import { Commands, DiffWithPreviousCommandArgs } from '../../commands';
+import { CommitFileNode } from './commitFileNode';
 import { ViewFilesLayout } from '../../configuration';
 import { GlyphChars } from '../../constants';
 import { Container } from '../../container';
+import { FileNode, FolderNode } from './folderNode';
 import { CommitFormatter, GitBranch, GitLogCommit, GitRevisionReference } from '../../git/git';
+import { StashesView } from '../stashesView';
 import { Arrays, Strings } from '../../system';
 import { ViewsWithFiles } from '../viewBase';
-import { CommitFileNode } from './commitFileNode';
-import { FileNode, FolderNode } from './folderNode';
 import { ContextValues, ViewNode, ViewRefNode } from './viewNode';
 
 export class CommitNode extends ViewRefNode<ViewsWithFiles, GitRevisionReference> {
@@ -76,9 +77,10 @@ export class CommitNode extends ViewRefNode
 			truncateMessageAtNewLine: true,
 			dateFormat: Container.config.defaultDateFormat,
 		});
-		item.iconPath = this.view.config.avatars
-			? this.commit.getAvatarUri(Container.config.defaultGravatarsStyle)
-			: new ThemeIcon('git-commit');
+		item.iconPath =
+			!(this.view instanceof StashesView) && this.view.config.avatars
+				? this.commit.getAvatarUri(Container.config.defaultGravatarsStyle)
+				: new ThemeIcon('git-commit');
 		item.tooltip = CommitFormatter.fromTemplate(
 			this.commit.isUncommitted
 				? `\${author} ${GlyphChars.Dash} \${id}\n\${ago} (\${date})`

src/views/stashesView.ts

@@ -194,8 +194,6 @@ export class StashesView extends ViewBase {
 			() => this.setFilesLayout(ViewFilesLayout.Tree),
 			this,
 		);
-		commands.registerCommand(this.getQualifiedCommand('setShowAvatarsOn'), () => this.setShowAvatars(true), this);
-		commands.registerCommand(this.getQualifiedCommand('setShowAvatarsOff'), () => this.setShowAvatars(false), this);
 	}
 
 	protected filterConfigurationChanged(e: ConfigurationChangeEvent) {
@@ -260,8 +258,4 @@ export class StashesView extends ViewBase {
 	private setFilesLayout(layout: ViewFilesLayout) {
 		return configuration.updateEffective('views', this.configKey, 'files', 'layout', layout);
 	}
-
-	private setShowAvatars(enabled: boolean) {
-		return configuration.updateEffective('views', this.configKey, 'avatars', enabled);
-	}
 }

src/webviews/apps/settings/partials/views.branches.html

@@ -0,0 +1,133 @@
+<section id="branches-view" class="section--settings section--collapsible">
+	<div class="section__header">
+		<h2>
+			Branches view
+			<a
+				class="link__learn-more"
+				title="Learn more"
+				href="https://github.com/eamodio/vscode-gitlens/tree/master/#branches-view-"
+			>
+				<i class="icon icon__info"></i>
+			</a>
+		</h2>
+
+		<p class="section__header-hint">Adds a Branches view to visualize, navigate, and explore Git branches</p>
+	</div>
+
+	<div class="section__collapsible">
+		<div class="section__group">
+			<div class="section__content">
+				<div class="settings settings--fixed ml-1">
+					<div class="setting">
+						<div class="setting__input">
+							<label for="views.branches.branches.layout">Layout branches</label>
+							<div class="select-container">
+								<select
+									id="views.branches.branches.layout"
+									name="views.branches.branches.layout"
+									data-setting
+								>
+									<option value="list">as a list</option>
+									<option value="tree">as a tree</option>
+								</select>
+							</div>
+						</div>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<label for="sortBranchesBy">Sort branches</label>
+							<div class="select-container">
+								<select id="sortBranchesBy" name="sortBranchesBy" data-setting>
+									<option value="name:desc">by name, descending</option>
+									<option value="name:asc">by name, ascending</option>
+									<option value="date:desc">by date, descending</option>
+									<option value="date:asc">by date, ascending</option>
+								</select>
+							</div>
+						</div>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<label for="views.branches.files.layout">Layout files</label>
+							<div class="select-container">
+								<select
+									id="views.branches.files.layout"
+									name="views.branches.files.layout"
+									data-setting
+								>
+									<option value="auto">automatically</option>
+									<option value="list">as a list</option>
+									<option value="tree">as a tree</option>
+								</select>
+							</div>
+						</div>
+						<p class="setting__hint" data-visibility="views.branches.files.layout =auto">
+							Chooses the best layout based on the number of files at each nesting level
+						</p>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<input
+								id="views.branches.files.compact"
+								name="views.branches.files.compact"
+								type="checkbox"
+								data-setting
+							/>
+							<label for="views.branches.files.compact">Use compact file layout</label>
+						</div>
+						<p class="setting__hint">Compacts (flattens) unnecessary nesting when using a tree layouts</p>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<input
+								id="views.branches.avatars"
+								name="views.branches.avatars"
+								type="checkbox"
+								data-setting
+							/>
+							<label for="views.branches.avatars">Use author avatars</label>
+						</div>
+					</div>
+				</div>
+			</div>
+
+			<div class="section__preview">
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-branches.png"
+					data-visibility="views.branches.files.layout !tree"
+				/>
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-branches-tree-compact.png"
+					data-visibility="views.branches.files.layout =tree &amp; views.branches.files.compact"
+				/>
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-branches-tree.png"
+					data-visibility="views.branches.files.layout =tree &amp; views.branches.files.compact =false"
+				/>
+				<img
+					class="image__preview--overlay hidden"
+					src="#{root}/images/settings/view-branches-avatars.png"
+					data-visibility="views.branches.avatars"
+				/>
+			</div>
+		</div>
+
+		<div class="section__group">
+			<p class="section__hint">
+				<i class="icon icon__info"></i> For more options, open
+				<a class="command" title="Open User Settings" href="command:workbench.action.openGlobalSettings"
+					>User Settings</a
+				>
+				and search for <b><i>gitlens.views.branches</i></b> or
+				<b><i>gitlens.views</i></b>
+			</p>
+		</div>
+	</div>
+</section>

src/webviews/apps/settings/partials/views.commits.html

@@ -0,0 +1,125 @@
+<section id="commits-view" class="section--settings section--collapsible">
+	<div class="section__header">
+		<h2>
+			Commits view
+			<a
+				class="link__learn-more"
+				title="Learn more"
+				href="https://github.com/eamodio/vscode-gitlens/tree/master/#commits-view-"
+			>
+				<i class="icon icon__info"></i>
+			</a>
+		</h2>
+
+		<p class="section__header-hint">Adds a Commits view to visualize, navigate, and explore Git commits</p>
+	</div>
+
+	<div class="section__collapsible">
+		<div class="section__group">
+			<div class="section__content">
+				<div class="settings settings--fixed ml-1">
+					<div class="setting">
+						<div class="setting__input">
+							<input
+								id="views.commits.showBranchComparison"
+								name="views.commits.showBranchComparison"
+								type="checkbox"
+								value="working"
+								data-setting
+							/>
+							<label for="views.commits.showBranchComparison"
+								>Show a comparison of a user-selected reference (branch, tag, etc) to the
+								<div class="select-container">
+									<select
+										id="views.commits.showBranchComparison"
+										name="views.commits.showBranchComparison"
+										data-setting
+										data-enablement="views.commits.showBranchComparison !false"
+									>
+										<option value="branch">current branch</option>
+										<option value="working">working tree</option>
+									</select>
+								</div>
+							</label>
+						</div>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<label for="views.commits.files.layout">Layout files</label>
+							<div class="select-container">
+								<select id="views.commits.files.layout" name="views.commits.files.layout" data-setting>
+									<option value="auto">automatically</option>
+									<option value="list">as a list</option>
+									<option value="tree">as a tree</option>
+								</select>
+							</div>
+						</div>
+						<p class="setting__hint" data-visibility="views.commits.files.layout =auto">
+							Chooses the best layout based on the number of files at each nesting level
+						</p>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<input
+								id="views.commits.files.compact"
+								name="views.commits.files.compact"
+								type="checkbox"
+								data-setting
+							/>
+							<label for="views.commits.files.compact">Use compact file layout</label>
+						</div>
+						<p class="setting__hint">Compacts (flattens) unnecessary nesting when using a tree layouts</p>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<input
+								id="views.commits.avatars"
+								name="views.commits.avatars"
+								type="checkbox"
+								data-setting
+							/>
+							<label for="views.commits.avatars">Use author avatars</label>
+						</div>
+					</div>
+				</div>
+			</div>
+
+			<div class="section__preview">
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-commits.png"
+					data-visibility="views.commits.files.layout !tree"
+				/>
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-commits-tree-compact.png"
+					data-visibility="views.commits.files.layout =tree &amp; views.commits.files.compact"
+				/>
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-commits-tree.png"
+					data-visibility="views.commits.files.layout =tree &amp; views.commits.files.compact =false"
+				/>
+				<img
+					class="image__preview--overlay hidden"
+					src="#{root}/images/settings/view-commits-avatars.png"
+					data-visibility="views.commits.avatars"
+				/>
+			</div>
+		</div>
+
+		<div class="section__group">
+			<p class="section__hint">
+				<i class="icon icon__info"></i> For more options, open
+				<a class="command" title="Open User Settings" href="command:workbench.action.openGlobalSettings"
+					>User Settings</a
+				>
+				and search for <b><i>gitlens.views.commits</i></b> or
+				<b><i>gitlens.views</i></b>
+			</p>
+		</div>
+	</div>
+</section>

src/webviews/apps/settings/partials/views.contributors.html

@@ -0,0 +1,103 @@
+<section id="contributors-view" class="section--settings section--collapsible">
+	<div class="section__header">
+		<h2>
+			Contributors view
+			<a
+				class="link__learn-more"
+				title="Learn more"
+				href="https://github.com/eamodio/vscode-gitlens/tree/master/#contributors-view-"
+			>
+				<i class="icon icon__info"></i>
+			</a>
+		</h2>
+
+		<p class="section__header-hint">Adds a Contributors view to visualize, navigate, and explore contributors</p>
+	</div>
+
+	<div class="section__collapsible">
+		<div class="section__group">
+			<div class="section__content">
+				<div class="settings settings--fixed ml-1">
+					<div class="setting">
+						<div class="setting__input">
+							<label for="views.contributors.files.layout">Layout files</label>
+							<div class="select-container">
+								<select
+									id="views.contributors.files.layout"
+									name="views.contributors.files.layout"
+									data-setting
+								>
+									<option value="auto">automatically</option>
+									<option value="list">as a list</option>
+									<option value="tree">as a tree</option>
+								</select>
+							</div>
+						</div>
+						<p class="setting__hint" data-visibility="views.contributors.files.layout =auto">
+							Chooses the best layout based on the number of files at each nesting level
+						</p>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<input
+								id="views.contributors.files.compact"
+								name="views.contributors.files.compact"
+								type="checkbox"
+								data-setting
+							/>
+							<label for="views.contributors.files.compact">Use compact file layout</label>
+						</div>
+						<p class="setting__hint">Compacts (flattens) unnecessary nesting when using a tree layouts</p>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<input
+								id="views.contributors.avatars"
+								name="views.contributors.avatars"
+								type="checkbox"
+								data-setting
+							/>
+							<label for="views.contributors.avatars">Use author avatars</label>
+						</div>
+					</div>
+				</div>
+			</div>
+
+			<div class="section__preview">
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-contributors.png"
+					data-visibility="views.contributors.files.layout !tree"
+				/>
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-contributors-tree-compact.png"
+					data-visibility="views.contributors.files.layout =tree &amp; views.contributors.files.compact"
+				/>
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-contributors-tree.png"
+					data-visibility="views.contributors.files.layout =tree &amp; views.contributors.files.compact =false"
+				/>
+				<img
+					class="image__preview--overlay hidden"
+					src="#{root}/images/settings/view-contributors-avatars.png"
+					data-visibility="views.contributors.avatars"
+				/>
+			</div>
+		</div>
+
+		<div class="section__group">
+			<p class="section__hint">
+				<i class="icon icon__info"></i> For more options, open
+				<a class="command" title="Open User Settings" href="command:workbench.action.openGlobalSettings"
+					>User Settings</a
+				>
+				and search for <b><i>gitlens.views.contributors</i></b> or
+				<b><i>gitlens.views</i></b>
+			</p>
+		</div>
+	</div>
+</section>

src/webviews/apps/settings/partials/views.html

@@ -10,6 +10,7 @@
 				<i class="icon icon__info"></i>
 			</a>
 		</h2>
+
 		<p class="section__header-hint">Adds rich views to visualize, navigate, and explore</p>
 	</div>
 

src/webviews/apps/settings/partials/views.remotes.html

@@ -0,0 +1,129 @@
+<section id="remotes-view" class="section--settings section--collapsible">
+	<div class="section__header">
+		<h2>
+			Remotes view
+			<a
+				class="link__learn-more"
+				title="Learn more"
+				href="https://github.com/eamodio/vscode-gitlens/tree/master/#remotes-view-"
+			>
+				<i class="icon icon__info"></i>
+			</a>
+		</h2>
+
+		<p class="section__header-hint">Adds a Remotes view to visualize, navigate, and explore Git remotes</p>
+	</div>
+
+	<div class="section__collapsible">
+		<div class="section__group">
+			<div class="section__content">
+				<div class="settings settings--fixed ml-1">
+					<div class="setting">
+						<div class="setting__input">
+							<label for="views.remotes.branches.layout">Layout branches</label>
+							<div class="select-container">
+								<select
+									id="views.remotes.branches.layout"
+									name="views.remotes.branches.layout"
+									data-setting
+								>
+									<option value="list">as a list</option>
+									<option value="tree">as a tree</option>
+								</select>
+							</div>
+						</div>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<label for="sortBranchesBy">Sort branches</label>
+							<div class="select-container">
+								<select id="sortBranchesBy" name="sortBranchesBy" data-setting>
+									<option value="name:desc">by name, descending</option>
+									<option value="name:asc">by name, ascending</option>
+									<option value="date:desc">by date, descending</option>
+									<option value="date:asc">by date, ascending</option>
+								</select>
+							</div>
+						</div>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<label for="views.remotes.files.layout">Layout files</label>
+							<div class="select-container">
+								<select id="views.remotes.files.layout" name="views.remotes.files.layout" data-setting>
+									<option value="auto">automatically</option>
+									<option value="list">as a list</option>
+									<option value="tree">as a tree</option>
+								</select>
+							</div>
+						</div>
+						<p class="setting__hint" data-visibility="views.remotes.files.layout =auto">
+							Chooses the best layout based on the number of files at each nesting level
+						</p>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<input
+								id="views.remotes.files.compact"
+								name="views.remotes.files.compact"
+								type="checkbox"
+								data-setting
+							/>
+							<label for="views.remotes.files.compact">Use compact file layout</label>
+						</div>
+						<p class="setting__hint">Compacts (flattens) unnecessary nesting when using a tree layouts</p>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<input
+								id="views.remotes.avatars"
+								name="views.remotes.avatars"
+								type="checkbox"
+								data-setting
+							/>
+							<label for="views.remotes.avatars">Use author avatars</label>
+						</div>
+					</div>
+				</div>
+			</div>
+
+			<div class="section__preview">
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-remotes.png"
+					data-visibility="views.remotes.files.layout !tree"
+				/>
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-remotes-tree-compact.png"
+					data-visibility="views.remotes.files.layout =tree &amp; views.remotes.files.compact"
+				/>
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-remotes-tree.png"
+					data-visibility="views.remotes.files.layout =tree &amp; views.remotes.files.compact =false"
+				/>
+				<img
+					class="image__preview--overlay hidden"
+					src="#{root}/images/settings/view-remotes-avatars.png"
+					data-visibility="views.remotes.avatars"
+				/>
+			</div>
+		</div>
+
+		<div class="section__group">
+			<p class="section__hint">
+				<i class="icon icon__info"></i> For more options, open
+				<a class="command" title="Open User Settings" href="command:workbench.action.openGlobalSettings"
+					>User Settings</a
+				>
+				and search for <b><i>gitlens.views.remotes</i></b> or
+				<b><i>gitlens.views</i></b>
+			</p>
+		</div>
+	</div>
+</section>

src/webviews/apps/settings/partials/views.stashes.html

@@ -0,0 +1,82 @@
+<section id="stashes-view" class="section--settings section--collapsible">
+	<div class="section__header">
+		<h2>
+			Stashes view
+			<a
+				class="link__learn-more"
+				title="Learn more"
+				href="https://github.com/eamodio/vscode-gitlens/tree/master/#stashes-view-"
+			>
+				<i class="icon icon__info"></i>
+			</a>
+		</h2>
+
+		<p class="section__header-hint">Adds a Stashes view to visualize, navigate, and explore Git stashes</p>
+	</div>
+
+	<div class="section__collapsible">
+		<div class="section__group">
+			<div class="section__content">
+				<div class="settings settings--fixed ml-1">
+					<div class="setting">
+						<div class="setting__input">
+							<label for="views.stashes.files.layout">Layout files</label>
+							<div class="select-container">
+								<select id="views.stashes.files.layout" name="views.stashes.files.layout" data-setting>
+									<option value="auto">automatically</option>
+									<option value="list">as a list</option>
+									<option value="tree">as a tree</option>
+								</select>
+							</div>
+						</div>
+						<p class="setting__hint" data-visibility="views.stashes.files.layout =auto">
+							Chooses the best layout based on the number of files at each nesting level
+						</p>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<input
+								id="views.stashes.files.compact"
+								name="views.stashes.files.compact"
+								type="checkbox"
+								data-setting
+							/>
+							<label for="views.stashes.files.compact">Use compact file layout</label>
+						</div>
+						<p class="setting__hint">Compacts (flattens) unnecessary nesting when using a tree layouts</p>
+					</div>
+				</div>
+			</div>
+
+			<div class="section__preview">
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-stashes.png"
+					data-visibility="views.stashes.files.layout !tree"
+				/>
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-stashes-tree-compact.png"
+					data-visibility="views.stashes.files.layout =tree &amp; views.stashes.files.compact"
+				/>
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-stashes-tree.png"
+					data-visibility="views.stashes.files.layout =tree &amp; views.stashes.files.compact =false"
+				/>
+			</div>
+		</div>
+
+		<div class="section__group">
+			<p class="section__hint">
+				<i class="icon icon__info"></i> For more options, open
+				<a class="command" title="Open User Settings" href="command:workbench.action.openGlobalSettings"
+					>User Settings</a
+				>
+				and search for <b><i>gitlens.views.stashes</i></b> or
+				<b><i>gitlens.views</i></b>
+			</p>
+		</div>
+	</div>
+</section>

src/webviews/apps/settings/partials/views.tags.html

@@ -0,0 +1,120 @@
+<section id="tags-view" class="section--settings section--collapsible">
+	<div class="section__header">
+		<h2>
+			Tags view
+			<a
+				class="link__learn-more"
+				title="Learn more"
+				href="https://github.com/eamodio/vscode-gitlens/tree/master/#tags-view-"
+			>
+				<i class="icon icon__info"></i>
+			</a>
+		</h2>
+
+		<p class="section__header-hint">Adds a Tags view to visualize, navigate, and explore Git tags</p>
+	</div>
+
+	<div class="section__collapsible">
+		<div class="section__group">
+			<div class="section__content">
+				<div class="settings settings--fixed ml-1">
+					<div class="setting">
+						<div class="setting__input">
+							<label for="views.tags.branches.layout">Layout tags</label>
+							<div class="select-container">
+								<select id="views.tags.branches.layout" name="views.tags.branches.layout" data-setting>
+									<option value="list">as a list</option>
+									<option value="tree">as a tree</option>
+								</select>
+							</div>
+						</div>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<label for="sortTagsBy">Sort tags</label>
+							<div class="select-container">
+								<select id="sortTagsBy" name="sortTagsBy" data-setting>
+									<option value="name:desc">by name, descending</option>
+									<option value="name:asc">by name, ascending</option>
+									<option value="date:desc">by date, descending</option>
+									<option value="date:asc">by date, ascending</option>
+								</select>
+							</div>
+						</div>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<label for="views.tags.files.layout">Layout files</label>
+							<div class="select-container">
+								<select id="views.tags.files.layout" name="views.tags.files.layout" data-setting>
+									<option value="auto">automatically</option>
+									<option value="list">as a list</option>
+									<option value="tree">as a tree</option>
+								</select>
+							</div>
+						</div>
+						<p class="setting__hint" data-visibility="views.tags.files.layout =auto">
+							Chooses the best layout based on the number of files at each nesting level
+						</p>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<input
+								id="views.tags.files.compact"
+								name="views.tags.files.compact"
+								type="checkbox"
+								data-setting
+							/>
+							<label for="views.tags.files.compact">Use compact file layout</label>
+						</div>
+						<p class="setting__hint">Compacts (flattens) unnecessary nesting when using a tree layouts</p>
+					</div>
+
+					<div class="setting">
+						<div class="setting__input">
+							<input id="views.tags.avatars" name="views.tags.avatars" type="checkbox" data-setting />
+							<label for="views.tags.avatars">Use author avatars</label>
+						</div>
+					</div>
+				</div>
+			</div>
+
+			<div class="section__preview">
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-tags.png"
+					data-visibility="views.tags.files.layout !tree"
+				/>
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-tags-tree-compact.png"
+					data-visibility="views.tags.files.layout =tree &amp; views.tags.files.compact"
+				/>
+				<img
+					class="image__preview hidden"
+					src="#{root}/images/settings/view-tags-tree.png"
+					data-visibility="views.tags.files.layout =tree &amp; views.tags.files.compact =false"
+				/>
+				<img
+					class="image__preview--overlay hidden"
+					src="#{root}/images/settings/view-tags-avatars.png"
+					data-visibility="views.tags.avatars"
+				/>
+			</div>
+		</div>
+
+		<div class="section__group">
+			<p class="section__hint">
+				<i class="icon icon__info"></i> For more options, open
+				<a class="command" title="Open User Settings" href="command:workbench.action.openGlobalSettings"
+					>User Settings</a
+				>
+				and search for <b><i>gitlens.views.tags</i></b> or
+				<b><i>gitlens.views</i></b>
+			</p>
+		</div>
+	</div>
+</section>

src/webviews/apps/settings/settings.html

@@ -180,10 +180,22 @@
 				<!-- prettier-ignore -->
 				<%= require('html-loader!./partials/views.repositories.html') %>
 				<!-- prettier-ignore -->
+				<%= require('html-loader!./partials/views.commits.html') %>
+				<!-- prettier-ignore -->
 				<%= require('html-loader!./partials/views.file-history.html') %>
 				<!-- prettier-ignore -->
 				<%= require('html-loader!./partials/views.line-history.html') %>
 				<!-- prettier-ignore -->
+				<%= require('html-loader!./partials/views.branches.html') %>
+				<!-- prettier-ignore -->
+				<%= require('html-loader!./partials/views.remotes.html') %>
+				<!-- prettier-ignore -->
+				<%= require('html-loader!./partials/views.stashes.html') %>
+				<!-- prettier-ignore -->
+				<%= require('html-loader!./partials/views.tags.html') %>
+				<!-- prettier-ignore -->
+				<%= require('html-loader!./partials/views.contributors.html') %>
+				<!-- prettier-ignore -->
 				<%= require('html-loader!./partials/views.search.html') %>
 				<!-- prettier-ignore -->
 				<%= require('html-loader!./partials/views.compare.html') %>
@@ -266,6 +278,15 @@
 							<a
 								class="sidebar__jump-link"
 								data-action="jump"
+								href="#commits-view"
+								title="Jump to Commits view settings"
+								>Commits view</a
+							>
+						</li>
+						<li>
+							<a
+								class="sidebar__jump-link"
+								data-action="jump"
 								href="#file-history-view"
 								title="Jump to File History view settings"
 								>File History view</a
@@ -284,6 +305,51 @@
 							<a
 								class="sidebar__jump-link"
 								data-action="jump"
+								href="#branches-view"
+								title="Jump to Branches view settings"
+								>Branches view</a
+							>
+						</li>
+						<li>
+							<a
+								class="sidebar__jump-link"
+								data-action="jump"
+								href="#remotes-view"
+								title="Jump to Remotes view settings"
+								>Remotes view</a
+							>
+						</li>
+						<li>
+							<a
+								class="sidebar__jump-link"
+								data-action="jump"
+								href="#stashes-view"
+								title="Jump to Stashes view settings"
+								>Stashes view</a
+							>
+						</li>
+						<li>
+							<a
+								class="sidebar__jump-link"
+								data-action="jump"
+								href="#tags-view"
+								title="Jump to Tags view settings"
+								>Tags view</a
+							>
+						</li>
+						<li>
+							<a
+								class="sidebar__jump-link"
+								data-action="jump"
+								href="#contributors-view"
+								title="Jump to Contributors view settings"
+								>Contributors view</a
+							>
+						</li>
+						<li>
+							<a
+								class="sidebar__jump-link"
+								data-action="jump"
 								href="#search-commits-view"
 								title="Jump to Search Commits view settings"
 								>Search Commits view</a