Browse Source

Updates views layout options (to work w/ d&d)

Adds setViewsLayout command
main
Eric Amodio 4 years ago
parent
commit
cc3ca76bc9
12 changed files with 182 additions and 339 deletions
  1. +5
    -0
      package.json
  2. +1
    -0
      src/commands.ts
  3. +1
    -0
      src/commands/common.ts
  4. +69
    -0
      src/commands/setViewsLayout.ts
  5. +5
    -0
      src/config.ts
  6. +18
    -1
      src/container.ts
  7. +13
    -0
      src/webviews/apps/scss/main.scss
  8. +22
    -136
      src/webviews/apps/settings/index.html
  9. +48
    -157
      src/webviews/apps/welcome/index.html
  10. +0
    -34
      src/webviews/helpers.ts
  11. +0
    -5
      src/webviews/settingsWebview.ts
  12. +0
    -6
      src/webviews/welcomeWebview.ts

+ 5
- 0
package.json View File

@ -2310,6 +2310,11 @@
"category": "GitLens"
},
{
"command": "gitlens.setViewsLayout",
"title": "Set Views Layout",
"category": "GitLens"
},
{
"command": "gitlens.showCommitSearch",
"title": "Search Commits",
"category": "GitLens",

+ 1
- 0
src/commands.ts View File

@ -35,6 +35,7 @@ export * from './commands/gitCommands';
export * from './commands/remoteProviders';
export * from './commands/repositories';
export * from './commands/resetSuppressedWarnings';
export * from './commands/setViewsLayout';
export * from './commands/searchCommits';
export * from './commands/showCommitsInView';
export * from './commands/showLastQuickPick';

+ 1
- 0
src/commands/common.ts View File

@ -79,6 +79,7 @@ export enum Commands {
RevealCommitInView = 'gitlens.revealCommitInView',
SearchCommits = 'gitlens.showCommitSearch',
SearchCommitsInView = 'gitlens.views.search.searchCommits',
SetViewsLayout = 'gitlens.setViewsLayout',
ShowCommitInView = 'gitlens.showCommitInView',
ShowCommitsInView = 'gitlens.showCommitsInView',
ShowCompareView = 'gitlens.showCompareView',

+ 69
- 0
src/commands/setViewsLayout.ts View File

@ -0,0 +1,69 @@
'use strict';
import { commands, ConfigurationTarget, window } from 'vscode';
import { configuration, viewKeys, ViewLocation } from '../configuration';
import { command, Command, Commands } from './common';
import { extensionId } from '../constants';
enum ViewsLayout {
Default = 'default',
SourceControl = 'scm',
}
export interface SetViewsLayoutCommandArgs {
layout: ViewsLayout;
}
@command()
export class SetViewsLayoutCommand extends Command {
constructor() {
super(Commands.SetViewsLayout);
}
async execute(args?: SetViewsLayoutCommandArgs) {
let layout = args?.layout;
if (layout === undefined) {
const pick = await window.showQuickPick(
[
{
label: 'GitLens Layout',
description: '(default)',
detail: 'Shows all the views together on the GitLens side bar',
layout: ViewsLayout.Default,
},
{
label: 'Source Control Layout',
description: '',
detail: 'Shows all the views together on the Source Control side bar',
layout: ViewsLayout.SourceControl,
},
],
{
placeHolder: 'Choose a GitLens views layout',
},
);
if (pick == null) return;
layout = pick.layout;
}
let location;
switch (layout) {
case ViewsLayout.Default:
location = ViewLocation.GitLens;
break;
case ViewsLayout.SourceControl:
location = ViewLocation.SourceControl;
break;
default:
return;
}
for (const view of viewKeys) {
if (configuration.get('views', view, 'location') === location) {
await commands.executeCommand(`${extensionId}.views.${view}:${location}.resetViewLocation`);
} else {
await configuration.update('views', view, 'location', location, ConfigurationTarget.Global);
}
}
}
}

+ 5
- 0
src/config.ts View File

@ -456,3 +456,8 @@ export interface ViewsFilesConfig {
layout: ViewFilesLayout;
threshold: number;
}
export const viewKeys: (keyof Pick<
Config['views'],
'repositories' | 'fileHistory' | 'lineHistory' | 'compare' | 'search'
>)[] = ['repositories', 'fileHistory', 'lineHistory', 'compare', 'search'];

+ 18
- 1
src/container.ts View File

@ -6,7 +6,8 @@ import { LineAnnotationController } from './annotations/lineAnnotationController
import { clearAvatarCache } from './avatars';
import { GitCodeLensController } from './codelens/codeLensController';
import { Commands, ToggleFileBlameCommandArgs } from './commands';
import { AnnotationsToggleMode, Config, configuration, ConfigurationWillChangeEvent } from './configuration';
import { AnnotationsToggleMode, Config, configuration, ConfigurationWillChangeEvent, viewKeys } from './configuration';
import { extensionId } from './constants';
import { GitFileSystemProvider } from './git/fsProvider';
import { GitService } from './git/gitService';
import { LineHoverController } from './hovers/lineHoverController';
@ -134,6 +135,22 @@ export class Container {
clearAvatarCache();
}
for (const view of viewKeys) {
if (configuration.changed(e.change, 'views', view, 'location')) {
setTimeout(
() =>
commands.executeCommand(
`${extensionId}.views.${view}:${configuration.get(
'views',
view,
'location',
)}.resetViewLocation`,
),
0,
);
}
}
if (configuration.changed(e.change, 'mode') || configuration.changed(e.change, 'modes')) {
if (this._applyModeConfigurationTransformBound === undefined) {
this._applyModeConfigurationTransformBound = this.applyModeConfigurationTransform.bind(this);

+ 13
- 0
src/webviews/apps/scss/main.scss View File

@ -631,6 +631,19 @@ ul {
flex-wrap: wrap;
}
.preset {
text-align: center;
p {
color: var(--color-foreground--75);
display: block;
font-weight: 200;
font-size: 1.3rem;
margin: -0.5em 1em 0.5em 1em;
text-align: center;
}
}
section {
display: flex;
flex-wrap: wrap;

+ 22
- 136
src/webviews/apps/settings/index.html View File

@ -1103,147 +1103,33 @@
<div class="section__content">
<p class="blurb mt-0">
GitLens views can be configured to be shown in different side bar layouts to best
match your workflow. You can easily change the default layout (where all views are
shown together on the GitLens side bar) below
match your workflow
</p>
<div class="presets mb-1">
<a
class="button button--flat"
title="Shows all the views together on the GitLens side bar"
href="command:gitlens.settings.applyViewLayoutPreset?%22default%22"
>Default Layout</a
>
<a
class="button button--flat"
title="Shows all the views together on the Source Control side bar"
href="command:gitlens.settings.applyViewLayoutPreset?%22scm%22"
>Source Control Layout</a
>
<a
class="button button--flat"
title="Shows Repositories on the Source Control side bar, File and Line History on the Explorer side bar, and others on the GitLens side bar"
href="command:gitlens.settings.applyViewLayoutPreset?%22contextual%22"
>Contextual Layout</a
>
</div>
<div class="settings ml-2 mr-2">
<div class="setting" data-enablement="views.repositories.enabled">
<div class="setting__input nowrap">
<label for="views.repositories.location">Show Repositories in the </label>
<select
id="views.repositories.location"
name="views.repositories.location"
data-setting
disabled
>
<option value="gitlens">GitLens side bar</option>
<option value="explorer">Explorer side bar</option>
<option value="scm">Source Control side bar</option>
</select>
<a
class="link__configure"
data-action="jump"
title="Jump to Repositories view settings"
href="#repositories-view"
>
<i class="icon icon__gear"></i>
</a>
</div>
</div>
<div class="setting" data-enablement="views.fileHistory.enabled">
<div class="setting__input nowrap">
<label for="views.fileHistory.location">Show File History in the </label>
<select
id="views.fileHistory.location"
name="views.fileHistory.location"
data-setting
disabled
>
<option value="gitlens">GitLens side bar</option>
<option value="explorer">Explorer side bar</option>
<option value="scm">Source Control side bar</option>
</select>
<a
class="link__configure"
data-action="jump"
title="Jump to File History view settings"
href="#file-history-view"
>
<i class="icon icon__gear"></i>
</a>
</div>
</div>
<div class="setting" data-enablement="views.lineHistory.enabled">
<div class="setting__input nowrap">
<label for="views.lineHistory.location">Show Line History in the </label>
<select
id="views.lineHistory.location"
name="views.lineHistory.location"
data-setting
disabled
>
<option value="gitlens">GitLens side bar</option>
<option value="explorer">Explorer side bar</option>
<option value="scm">Source Control side bar</option>
</select>
<a
class="link__configure"
data-action="jump"
title="Jump to Line History view settings"
href="#line-history-view"
>
<i class="icon icon__gear"></i>
</a>
</div>
</div>
<div class="setting" data-enablement="views.search.enabled">
<div class="setting__input nowrap">
<label for="views.search.location">Show Search Commits in the </label>
<select
id="views.search.location"
name="views.search.location"
data-setting
disabled
>
<option value="gitlens">GitLens side bar</option>
<option value="explorer">Explorer side bar</option>
<option value="scm">Source Control side bar</option>
</select>
<a
class="link__configure"
data-action="jump"
title="Jump to Search Commits view settings"
href="#search-commits-view"
>
<i class="icon icon__gear"></i>
</a>
</div>
<div class="preset">
<a
class="button button--flat"
title="Shows all the views together on the GitLens side bar"
href="command:gitlens.setViewsLayout?%7B%22layout%22%3A%22default%22%7D"
>GitLens Layout (default)</a
>
<p>Shows all the views together on the GitLens side bar</p>
</div>
<div class="setting" data-enablement="views.compare.enabled">
<div class="setting__input nowrap">
<label for="views.compare.location">Show Compare in the </label>
<select
id="views.compare.location"
name="views.compare.location"
data-setting
disabled
>
<option value="gitlens">GitLens side bar</option>
<option value="explorer">Explorer side bar</option>
<option value="scm">Source Control side bar</option>
</select>
<a
class="link__configure"
data-action="jump"
title="Jump to Compare view settings"
href="#compare-view"
>
<i class="icon icon__gear"></i>
</a>
</div>
<div class="preset">
<a
class="button button--flat"
title="Shows all the views together on the Source Control side bar"
href="command:gitlens.setViewsLayout?%7B%22layout%22%3A%22scm%22%7D"
>Source Control Layout</a
>
<p>Shows all the views together on the Source Control side bar</p>
</div>
</div>
<p class="section__hint">
<i class="icon icon__info"></i> You can also simply drag &amp; drop individual views
to create custom layouts
</p>
</div>
</div>
</div>

+ 48
- 157
src/webviews/apps/welcome/index.html View File

@ -245,6 +245,54 @@
</div>
</section>
<section id="views" class="section--settings">
<div class="section__content">
<div class="section__header">
<h2>
Views
<a
class="link__configure"
title="Jump to more View settings"
href="command:gitlens.showSettingsPage?%22views%22"
>
<i class="icon icon__gear"></i>
</a>
</h2>
</div>
<p class="blurb mt-0">
GitLens views can be configured to be shown in different side bar layouts to best match your
workflow
</p>
<div class="presets mb-1">
<div class="preset">
<a
class="button button--flat"
title="Shows all the views together on the GitLens side bar"
href="command:gitlens.setViewsLayout?%7B%22layout%22%3A%22default%22%7D"
>GitLens Layout (default)</a
>
<p>Shows all the views together on the GitLens side bar</p>
</div>
<div class="preset">
<a
class="button button--flat"
title="Shows all the views together on the Source Control side bar"
href="command:gitlens.setViewsLayout?%7B%22layout%22%3A%22scm%22%7D"
>Source Control Layout</a
>
<p>Shows all the views together on the Source Control side bar</p>
</div>
</div>
<p class="section__hint">
<i class="icon icon__info"></i> You can also simply drag &amp; drop individual views to
create custom layouts
</p>
</div>
</section>
<section id="dates" class="section--settings">
<div class="section__content">
<div class="section__header">
@ -346,163 +394,6 @@
</div>
</div>
</section>
<section id="views" class="section--settings">
<div class="section__content">
<div class="section__header">
<h2>
Views
<a
class="link__configure"
title="Jump to more View settings"
href="command:gitlens.showSettingsPage?%22views%22"
>
<i class="icon icon__gear"></i>
</a>
</h2>
</div>
<p class="blurb mt-0">
GitLens views can be configured to be shown in different side bar layouts to best match your
workflow. You can easily change the default layout (where all views are shown together on
the GitLens side bar) below
</p>
<div class="presets mb-1">
<a
class="button button--flat"
title="Shows all the views together on the GitLens side bar"
href="command:gitlens.welcome.applyViewLayoutPreset?%22default%22"
>Default Layout</a
>
<a
class="button button--flat"
title="Shows all the views together on the Source Control side bar"
href="command:gitlens.welcome.applyViewLayoutPreset?%22scm%22"
>Source Control Layout</a
>
<a
class="button button--flat"
title="Shows Repositories on the Source Control side bar, File and Line History on the Explorer side bar, and others on the GitLens side bar"
href="command:gitlens.welcome.applyViewLayoutPreset?%22contextual%22"
>Contextual Layout</a
>
</div>
<div class="settings ml-2 mr-2">
<div class="setting" data-enablement="views.repositories.enabled">
<div class="setting__input nowrap">
<label for="views.repositories.location">Show Repositories in the </label>
<select
id="views.repositories.location"
name="views.repositories.location"
data-setting
disabled
>
<option value="gitlens">GitLens side bar</option>
<option value="explorer">Explorer side bar</option>
<option value="scm">Source Control side bar</option>
</select>
<a
class="link__configure"
title="Jump to Repositories view settings"
href="command:gitlens.showSettingsPage?%22repositories-view%22"
>
<i class="icon icon__gear"></i>
</a>
</div>
</div>
<div class="setting" data-enablement="views.fileHistory.enabled">
<div class="setting__input nowrap">
<label for="views.fileHistory.location">Show File History in the </label>
<select
id="views.fileHistory.location"
name="views.fileHistory.location"
data-setting
disabled
>
<option value="gitlens">GitLens side bar</option>
<option value="explorer">Explorer side bar</option>
<option value="scm">Source Control side bar</option>
</select>
<a
class="link__configure"
title="Jump to File History view settings"
href="command:gitlens.showSettingsPage?%22file-history-view%22"
>
<i class="icon icon__gear"></i>
</a>
</div>
</div>
<div class="setting" data-enablement="views.lineHistory.enabled">
<div class="setting__input nowrap">
<label for="views.lineHistory.location">Show Line History in the </label>
<select
id="views.lineHistory.location"
name="views.lineHistory.location"
data-setting
disabled
>
<option value="gitlens">GitLens side bar</option>
<option value="explorer">Explorer side bar</option>
<option value="scm">Source Control side bar</option>
</select>
<a
class="link__configure"
title="Jump to Line History view settings"
href="command:gitlens.showSettingsPage?%22line-history-view%22"
>
<i class="icon icon__gear"></i>
</a>
</div>
</div>
<div class="setting" data-enablement="views.search.enabled">
<div class="setting__input nowrap">
<label for="views.search.location">Show Search Commits in the </label>
<select
id="views.search.location"
name="views.search.location"
data-setting
disabled
>
<option value="gitlens">GitLens side bar</option>
<option value="explorer">Explorer side bar</option>
<option value="scm">Source Control side bar</option>
</select>
<a
class="link__configure"
title="Jump to Search Commits view settings"
href="command:gitlens.showSettingsPage?%22search-commits-view%22"
>
<i class="icon icon__gear"></i>
</a>
</div>
</div>
<div class="setting" data-enablement="views.compare.enabled">
<div class="setting__input nowrap">
<label for="views.compare.location">Show Compare in the </label>
<select
id="views.compare.location"
name="views.compare.location"
data-setting
disabled
>
<option value="gitlens">GitLens side bar</option>
<option value="explorer">Explorer side bar</option>
<option value="scm">Source Control side bar</option>
</select>
<a
class="link__configure"
title="Jump to Compare view settings"
href="command:gitlens.showSettingsPage?%22compare-view%22"
>
<i class="icon icon__gear"></i>
</a>
</div>
</div>
</div>
</div>
</section>
</div>
<div class="sidebar">

+ 0
- 34
src/webviews/helpers.ts View File

@ -1,34 +0,0 @@
'use strict';
import { ConfigurationTarget } from 'vscode';
import { configuration, ViewLocation } from '../configuration';
export function applyViewLayoutPreset(preset: 'contextual' | 'default' | 'scm') {
let repositories;
let histories;
let compareAndSearch;
switch (preset) {
case 'contextual':
repositories = ViewLocation.SourceControl;
histories = ViewLocation.Explorer;
compareAndSearch = ViewLocation.GitLens;
break;
case 'default':
repositories = ViewLocation.GitLens;
histories = ViewLocation.GitLens;
compareAndSearch = ViewLocation.GitLens;
break;
case 'scm':
repositories = ViewLocation.SourceControl;
histories = ViewLocation.SourceControl;
compareAndSearch = ViewLocation.SourceControl;
break;
default:
return;
}
configuration.update('views', 'repositories', 'location', repositories, ConfigurationTarget.Global);
configuration.update('views', 'fileHistory', 'location', histories, ConfigurationTarget.Global);
configuration.update('views', 'lineHistory', 'location', histories, ConfigurationTarget.Global);
configuration.update('views', 'compare', 'location', compareAndSearch, ConfigurationTarget.Global);
configuration.update('views', 'search', 'location', compareAndSearch, ConfigurationTarget.Global);
}

+ 0
- 5
src/webviews/settingsWebview.ts View File

@ -10,7 +10,6 @@ import {
SettingsState,
} from './protocol';
import { WebviewBase } from './webviewBase';
import { applyViewLayoutPreset } from './helpers';
const anchorRegex = /.*?#(.*)/;
@ -95,8 +94,4 @@ export class SettingsWebview extends WebviewBase {
bootstrap,
)};</script>`;
}
registerCommands() {
return [commands.registerCommand(`${this.id}.applyViewLayoutPreset`, applyViewLayoutPreset, this)];
}
}

+ 0
- 6
src/webviews/welcomeWebview.ts View File

@ -1,10 +1,8 @@
'use strict';
import { commands } from 'vscode';
import { Commands } from '../commands';
import { Container } from '../container';
import { WelcomeState } from './protocol';
import { WebviewBase } from './webviewBase';
import { applyViewLayoutPreset } from './helpers';
export class WelcomeWebview extends WebviewBase {
constructor() {
@ -23,10 +21,6 @@ export class WelcomeWebview extends WebviewBase {
return 'Welcome to GitLens';
}
registerCommands() {
return [commands.registerCommand(`${this.id}.applyViewLayoutPreset`, applyViewLayoutPreset, this)];
}
renderEndOfBody() {
const bootstrap: WelcomeState = {
config: Container.config,

Loading…
Cancel
Save