maxmustermann/vscode
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

- show tags

Browse source 
- show more info - release and last updated
- fix packs
This commit is contained in:
Sandeep Somavarapu 2021-07-15 00:49:45 +02:00
parent 9b596f91b4
commit 60a1da8d3f
6 changed files with 88 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/vs/platform/extensionManagement/common/extensionGalleryService.ts
View file

@ -56,6 +56,9 @@ interface IRawGalleryExtension {
readonly versions: IRawGalleryExtensionVersion[];
readonly statistics: IRawGalleryExtensionStatistics[];
readonly tags: string[] | undefined;
readonly releaseDate: string;
readonly publishedDate: string;
readonly lastUpdated: string;
readonly categories: string[] | undefined;
readonly flags: string;
}
@ -336,6 +339,9 @@ function toExtension(galleryExtension: IRawGalleryExtension, version: IRawGaller
ratingCount: getStatistic(galleryExtension.statistics, 'ratingcount'),
assetUri: URI.parse(version.assetUri),
categories: galleryExtension.categories || [],
tags: galleryExtension.tags || [],
releaseDate: Date.parse(galleryExtension.releaseDate),
lastUpdated: Date.parse(galleryExtension.lastUpdated),
webExtension: !!galleryExtension.tags?.includes(WEB_EXTENSION_TAG),
assetTypes: version.files.map(({ assetType }) => assetType),
assets,

3
src/vs/platform/extensionManagement/common/extensionManagement.ts
View file

@ -86,6 +86,9 @@ export interface IGalleryExtension {
rating: number;
ratingCount: number;
categories: readonly string[];
tags: readonly string[];
releaseDate: number;
lastUpdated: number;
assetUri: URI;
assetTypes: string[];
assets: IGalleryExtensionAssets;

41
src/vs/workbench/contrib/extensions/browser/extensionEditor.ts
View file

@ -753,7 +753,9 @@ export class ExtensionEditor extends EditorPane {
private renderAdditionalDetails(container: HTMLElement, extension: IExtension): void {
this.renderCategories(container, extension);
this.renderTags(container, extension);
this.renderResources(container, extension);
this.renderMoreInfo(container, extension);
}
private renderCategories(container: HTMLElement, extension: IExtension): void {
@ -773,6 +775,23 @@ export class ExtensionEditor extends EditorPane {
}
}
private renderTags(container: HTMLElement, extension: IExtension): void {
const tagsContainer = append(container, $('.tags-container'));
append(tagsContainer, $('.additional-details-title', undefined, localize('tags', "Tags")));
const tagsElement = append(tagsContainer, $('.tags'));
if (extension.tags.length) {
for (const tag of extension.tags) {
this.transientDisposables.add(this.onClick(append(tagsElement, $('span.tag', undefined, tag)), () => {
this.viewletService.openViewlet(VIEWLET_ID, true)
.then(viewlet => viewlet?.getViewPaneContainer() as IExtensionsViewPaneContainer)
.then(viewlet => viewlet.search(`@tag:"${tag}"`));
}));
}
} else {
append(tagsElement, $('span', undefined, localize('none', "None")));
}
}
private renderResources(container: HTMLElement, extension: IExtension): void {
const resourcesContainer = append(container, $('.resources-container'));
append(resourcesContainer, $('.additional-details-title', undefined, localize('resources', "Resources")));
@ -797,6 +816,26 @@ export class ExtensionEditor extends EditorPane {
}
}
private renderMoreInfo(container: HTMLElement, extension: IExtension): void {
const gallery = extension.gallery;
if (!gallery) {
return;
}
const moreInfoContainer = append(container, $('.more-info-container'));
append(moreInfoContainer, $('.additional-details-title', undefined, localize('more info', "More Info")));
const moreInfo = append(moreInfoContainer, $('.more-info'));
append(moreInfo,
$('.more-info-entry', undefined,
$('span', undefined, localize('release date', "Released on")),
$('span', undefined, new Date(gallery.releaseDate).toLocaleString())
),
$('.more-info-entry', undefined,
$('span', undefined, localize('last published', "Last published")),
$('span', undefined, new Date(gallery.lastUpdated).toLocaleString())
)
);
}
private openChangelog(template: IExtensionEditorTemplate, token: CancellationToken): Promise<IActiveElement | null> {
return this.openMarkdown(this.extensionChangelog!.get(), localize('noChangelog', "No Changelog available."), template.content, WebviewIndex.Changelog, token);
}
@ -1617,11 +1656,13 @@ registerThemingParticipant((theme: IColorTheme, collector: ICssStyleCollector) =
const buttonHoverBackgroundColor = theme.getColor(buttonHoverBackground);
if (buttonHoverBackgroundColor) {
collector.addRule(`.monaco-workbench .extension-editor .content > .details > .additional-details-container > .categories-container > .categories > .category:hover { background-color: ${buttonHoverBackgroundColor}; border-color: ${buttonHoverBackgroundColor}; }`);
collector.addRule(`.monaco-workbench .extension-editor .content > .details > .additional-details-container > .tags-container > .tags > .tag:hover { background-color: ${buttonHoverBackgroundColor}; border-color: ${buttonHoverBackgroundColor}; }`);
}
const buttonForegroundColor = theme.getColor(buttonForeground);
if (buttonForegroundColor) {
collector.addRule(`.monaco-workbench .extension-editor .content > .details > .additional-details-container > .categories-container > .categories > .category:hover { color: ${buttonForegroundColor}; }`);
collector.addRule(`.monaco-workbench .extension-editor .content > .details > .additional-details-container > .tags-container > .tags > .tag:hover { color: ${buttonForegroundColor}; }`);
}
});

8
src/vs/workbench/contrib/extensions/browser/extensionsWorkbenchService.ts
View file

@ -304,6 +304,14 @@ ${this.description}
return [];
}
get tags(): readonly string[] {
const { gallery } = this;
if (gallery) {
return gallery.tags.filter(tag => !tag.startsWith('_'));
}
return [];
}
get dependencies(): string[] {
const { local, gallery } = this;
if (local && local.manifest.extensionDependencies && !this.outdated) {

46
src/vs/workbench/contrib/extensions/browser/media/extensionEditor.css
View file

@ -323,11 +323,14 @@
}
.extension-editor > .body > .content > .details > .additional-details-container > .categories-container > .categories,
.extension-editor > .body > .content > .details > .additional-details-container > .resources-container > .resources {
.extension-editor > .body > .content > .details > .additional-details-container > .tags-container > .tags,
.extension-editor > .body > .content > .details > .additional-details-container > .resources-container > .resources,
.extension-editor > .body > .content > .details > .additional-details-container > .more-info-container > .more-info {
margin: 15px 0px;
}
.extension-editor > .body > .content > .details > .additional-details-container > .categories-container > .categories > .category {
.extension-editor > .body > .content > .details > .additional-details-container > .categories-container > .categories > .category,
.extension-editor > .body > .content > .details > .additional-details-container > .tags-container > .tags > .tag {
display: inline-block;
border: 1px solid rgba(136, 136, 136, 0.45);
padding: 2px 4px;
@ -346,49 +349,58 @@
text-decoration: underline;
}
.extension-editor > .body > .content > .extension-pack-readme {
.extension-editor > .body > .content > .details > .additional-details-container > .more-info-container > .more-info > .more-info-entry {
font-size: 90%;
display: flex;
}
.extension-editor > .body > .content > .details > .additional-details-container > .more-info-container > .more-info > .more-info-entry span {
flex: 0.5
}
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme {
height: 100%;
}
.extension-editor > .body > .content > .extension-pack-readme > .extension-pack {
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme > .extension-pack {
height: 224px;
padding-left: 20px;
}
.extension-editor > .body > .content > .extension-pack-readme.one-row > .extension-pack {
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme.one-row > .extension-pack {
height: 142px;
}
.extension-editor > .body > .content > .extension-pack-readme.two-rows > .extension-pack {
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme.two-rows > .extension-pack {
height: 224px;
}
.extension-editor > .body > .content > .extension-pack-readme.three-rows > .extension-pack {
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme.three-rows > .extension-pack {
height: 306px;
}
.extension-editor > .body > .content > .extension-pack-readme.more-rows > .extension-pack {
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme.more-rows > .extension-pack {
height: 326px;
}
.extension-editor > .body > .content > .extension-pack-readme.one-row > .readme-content {
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme.one-row > .readme-content {
height: calc(100% - 142px);
}
.extension-editor > .body > .content > .extension-pack-readme.two-rows > .readme-content {
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme.two-rows > .readme-content {
height: calc(100% - 224px);
}
.extension-editor > .body > .content > .extension-pack-readme.three-rows > .readme-content {
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme.three-rows > .readme-content {
height: calc(100% - 306px);
}
.extension-editor > .body > .content > .extension-pack-readme.more-rows > .readme-content {
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme.more-rows > .readme-content {
height: calc(100% - 326px);
}
.extension-editor > .body > .content > .extension-pack-readme > .extension-pack > .header,
.extension-editor > .body > .content > .extension-pack-readme > .extension-pack > .footer {
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme > .extension-pack > .header,
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme > .extension-pack > .footer {
margin-bottom: 10px;
margin-right: 30px;
font-weight: bold;
@ -398,15 +410,15 @@
line-height: 22px;
}
.extension-editor > .body > .content > .extension-pack-readme > .extension-pack > .extension-pack-content {
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme > .extension-pack > .extension-pack-content {
height: calc(100% - 60px);
}
.extension-editor > .body > .content > .extension-pack-readme > .extension-pack > .extension-pack-content > .monaco-scrollable-element {
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme > .extension-pack > .extension-pack-content > .monaco-scrollable-element {
height: 100%;
}
.extension-editor > .body > .content .extension-pack-readme > .extension-pack > .extension-pack-content > .monaco-scrollable-element > .subcontent {
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme > .extension-pack > .extension-pack-content > .monaco-scrollable-element > .subcontent {
height: 100%;
overflow-y: scroll;
box-sizing: border-box;

1
src/vs/workbench/contrib/extensions/common/extensions.ts
View file

@ -58,6 +58,7 @@ export interface IExtension {
readonly ratingCount?: number;
readonly outdated: boolean;
readonly enablementState: EnablementState;
readonly tags: readonly string[];
readonly categories: readonly string[];
readonly dependencies: string[];
readonly extensionPack: string[];