Skip to content

Commit

Permalink
[UI] Fix several bugs (#254)
Browse files Browse the repository at this point in the history
  • Loading branch information
loic-sharma committed Apr 13, 2019
1 parent 18751e5 commit 288e782
Show file tree
Hide file tree
Showing 13 changed files with 102 additions and 14 deletions.
Expand Up @@ -82,6 +82,7 @@ public async Task<IActionResult> Get(string id, CancellationToken cancellationTo
listed: package.Listed,
minClientVersion: package.MinClientVersion,
packageContent: Url.PackageDownload(package.Id, package.Version),
packageTypes: package.PackageTypes.Select(t => t.Name).ToList(),
projectUrl: package.ProjectUrlString,
repositoryUrl: package.RepositoryUrlString,
repositoryType: package.RepositoryType,
Expand Down
Expand Up @@ -5,6 +5,7 @@
using Microsoft.AspNetCore.Mvc;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Options;
using Newtonsoft.Json;

namespace BaGet.Core.Server.Extensions
{
Expand All @@ -15,7 +16,11 @@ public static IServiceCollection ConfigureHttpServices(this IServiceCollection s
services
.AddMvc()
.AddApplicationPart(typeof(BaGet.Controllers.PackageController).Assembly)
.SetCompatibilityVersion(CompatibilityVersion.Version_2_2);
.SetCompatibilityVersion(CompatibilityVersion.Version_2_2)
.AddJsonOptions(options =>
{
options.SerializerSettings.DateTimeZoneHandling = DateTimeZoneHandling.Utc;
});

services.AddCors();
services.AddSingleton<IConfigureOptions<CorsOptions>, ConfigureCorsOptions>();
Expand Down
13 changes: 13 additions & 0 deletions src/BaGet.Core/Mirror/MirrorService.cs
Expand Up @@ -122,6 +122,7 @@ private Package ToPackage(PackageMetadata metadata)
IconUrl = ParseUri(metadata.IconUrl),
LicenseUrl = ParseUri(metadata.LicenseUrl),
ProjectUrl = ParseUri(metadata.ProjectUrl),
PackageTypes = ParsePackageTypes(metadata.PackageTypes),
RepositoryUrl = ParseUri(metadata.RepositoryUrl),
RepositoryType = metadata.RepositoryType,
Tags = metadata.Tags.ToArray(),
Expand Down Expand Up @@ -152,6 +153,18 @@ private string[] ParseAuthors(string authors)
.ToArray();
}

private List<PackageType> ParsePackageTypes(IReadOnlyList<string> packageTypes)
{
if (packageTypes == null || packageTypes.Count == 0)
{
return new List<PackageType>();
}

return packageTypes
.Select(t => new PackageType { Name = t, Version = "0.0.0" })
.ToList();
}

private List<PackageDependency> FindDependencies(PackageMetadata package)
{
if ((package.DependencyGroups?.Count ?? 0) == 0)
Expand Down
2 changes: 1 addition & 1 deletion src/BaGet.Core/Services/DatabaseSearchService.cs
Expand Up @@ -76,7 +76,7 @@ private IReadOnlyList<string> GetCompatibleFrameworks(string framework)
string packageType,
IReadOnlyList<string> frameworks)
{
IQueryable<Package> search = _context.Packages;
IQueryable<Package> search = _context.Packages.Where(p => p.Listed);

if (!string.IsNullOrEmpty(query))
{
Expand Down
3 changes: 3 additions & 0 deletions src/BaGet.Protocol/Registration/PackageMetadata.cs
Expand Up @@ -22,6 +22,7 @@ public class PackageMetadata
bool listed,
string minClientVersion,
string packageContent,
IReadOnlyList<string> packageTypes,
string projectUrl,
string repositoryUrl,
string repositoryType,
Expand All @@ -46,6 +47,7 @@ public class PackageMetadata
Listed = listed;
MinClientVersion = minClientVersion;
PackageContent = packageContent;
PackageTypes = packageTypes;
ProjectUrl = projectUrl;
RepositoryUrl = repositoryUrl;
RepositoryType = repositoryType;
Expand Down Expand Up @@ -76,6 +78,7 @@ public class PackageMetadata
public bool Listed { get; }
public string MinClientVersion { get; }
public string PackageContent { get; }
public IReadOnlyList<string> PackageTypes { get; }
public string ProjectUrl { get; }
public string RepositoryUrl { get; }
public string RepositoryType { get; }
Expand Down
5 changes: 5 additions & 0 deletions src/BaGet.UI/src/DisplayPackage/DisplayPackage.css
Expand Up @@ -2,6 +2,11 @@
margin-top: 15px;
}

.display-package .package-title {
word-break: break-word;
overflow-wrap: break-word;
}

.display-package h1 small {
margin-left: 10px;
font-size: 45%;
Expand Down
9 changes: 7 additions & 2 deletions src/BaGet.UI/src/DisplayPackage/DisplayPackage.tsx
Expand Up @@ -33,6 +33,7 @@ interface IPackage {
repositoryUrl: string;
repositoryType: string;
totalDownloads: number;
isDotnetTool: boolean;
downloads: number;
authors: string;
tags: string[];
Expand Down Expand Up @@ -135,10 +136,14 @@ class DisplayPackage extends React.Component<IDisplayPackageProps, IDisplayPacka
readme = currentItem.catalogEntry.description;
}

const isDotnetTool = (currentItem.catalogEntry.packageTypes &&
currentItem.catalogEntry.packageTypes.indexOf("DotnetTool") !== -1);

this.setState({
package: {
...currentItem.catalogEntry,
downloadUrl: currentItem.packageContent,
isDotnetTool,
lastUpdate,
latestVersion,
readme,
Expand Down Expand Up @@ -188,7 +193,7 @@ class DisplayPackage extends React.Component<IDisplayPackageProps, IDisplayPacka

</div>

<InstallationInfo id={this.state.package.id} version={this.state.package.version} />
<InstallationInfo id={this.state.package.id} version={this.state.package.version} isDotnetTool={this.state.package.isDotnetTool} />

{/* TODO: Fix this */}
<div dangerouslySetInnerHTML={{ __html: this.state.package.readme }} />
Expand All @@ -215,7 +220,7 @@ class DisplayPackage extends React.Component<IDisplayPackageProps, IDisplayPacka
<LicenseInfo url={this.state.package.licenseUrl} />
<li>
<Icon iconName="CloudDownload" className="ms-Icon" />
<a href={this.state.package.downloadUrl}>Download Package</a>
<a href={this.state.package.downloadUrl}>Download package</a>
</li>
</ul>
</div>
Expand Down
61 changes: 54 additions & 7 deletions src/BaGet.UI/src/DisplayPackage/InstallationInfo.tsx
Expand Up @@ -7,6 +7,7 @@ import './InstallationInfo.css';
interface IInstallationInfoProps {
id: string;
version: string;
isDotnetTool: boolean;
}

interface IInstallationInfoState {
Expand All @@ -16,7 +17,9 @@ interface IInstallationInfoState {
}

enum Tab {
DotNet,
Dotnet,
DotnetTool,
PackageReference,
Paket,
PackageManager,
}
Expand All @@ -26,16 +29,43 @@ class InstallationInfo extends React.Component<IInstallationInfoProps, IInstalla
constructor(props: IInstallationInfoProps) {
super(props);

this.state = this.buildState(Tab.DotNet);
// tslint:disable-next-line:no-console
console.log(props);
this.state = props.isDotnetTool
? this.buildState(Tab.DotnetTool)
: this.buildState(Tab.Dotnet);
}

public render() {
return (
<div className="installation-info">
<ul className="nav">
<InstallationInfoTab type={Tab.DotNet} selected={this.state.selected} onSelect={this.handleSelect} />
<InstallationInfoTab type={Tab.Paket} selected={this.state.selected} onSelect={this.handleSelect} />
<InstallationInfoTab type={Tab.PackageManager} selected={this.state.selected} onSelect={this.handleSelect} />
<InstallationInfoTab
type={Tab.Dotnet}
hidden={this.props.isDotnetTool}
selected={this.state.selected}
onSelect={this.handleSelect} />
<InstallationInfoTab
type={Tab.PackageReference}
hidden={this.props.isDotnetTool}
selected={this.state.selected}
onSelect={this.handleSelect} />
<InstallationInfoTab
type={Tab.Paket}
hidden={this.props.isDotnetTool}
selected={this.state.selected}
onSelect={this.handleSelect} />
<InstallationInfoTab
type={Tab.PackageManager}
hidden={this.props.isDotnetTool}
selected={this.state.selected}
onSelect={this.handleSelect} />

<InstallationInfoTab
type={Tab.DotnetTool}
hidden={!this.props.isDotnetTool}
selected={this.state.selected}
onSelect={this.handleSelect} />
</ul>

<div className="content">
Expand All @@ -62,11 +92,21 @@ class InstallationInfo extends React.Component<IInstallationInfoProps, IInstalla
let prefix: string;

switch (tab) {
case Tab.DotNet:
case Tab.Dotnet:
content = `dotnet add package ${this.props.id} --version ${this.props.version}`;
prefix = ">";
break;

case Tab.DotnetTool:
content = `dotnet tool install --global ${this.props.id} --version ${this.props.version}`;
prefix = ">";
break;

case Tab.PackageReference:
content = `<PackageReference Include="${this.props.id}" Version="${this.props.version}" />`;
prefix = "";
break;

case Tab.Paket:
content = `paket add ${this.props.id} --version ${this.props.version}`;
prefix = ">";
Expand All @@ -89,6 +129,7 @@ class InstallationInfo extends React.Component<IInstallationInfoProps, IInstalla

interface IInstallationInfoTabProps {
type: Tab;
hidden: boolean;
selected: Tab;
onSelect(value: Tab): void;
}
Expand All @@ -102,13 +143,19 @@ class InstallationInfoTab extends React.Component<IInstallationInfoTabProps> {
super(props);

switch (props.type) {
case Tab.DotNet: this.title = ".NET CLI"; break;
case Tab.Dotnet: this.title = ".NET CLI"; break;
case Tab.DotnetTool: this.title = ".NET CLI"; break;
case Tab.PackageReference: this.title = "PackageReference"; break;
case Tab.Paket: this.title = "Paket CLI"; break;
case Tab.PackageManager: this.title = "Package Manager"; break;
}
}

public render() {
if (this.props.hidden) {
return null;
}

if (this.props.type === this.props.selected) {
return <li className="active"><a href="#">{this.title}</a></li>
}
Expand Down
2 changes: 1 addition & 1 deletion src/BaGet.UI/src/DisplayPackage/LicenseInfo.tsx
Expand Up @@ -19,7 +19,7 @@ class LicenseInfo extends React.Component<ILicenseInfoProps> {
return (
<li>
<Icon iconName="Certificate" className="ms-Icon" />
<a href={this.props.url}>License Info</a>
<a href={this.props.url}>License</a>
</li>
);
}
Expand Down
1 change: 1 addition & 0 deletions src/BaGet.UI/src/DisplayPackage/Registration.tsx
Expand Up @@ -25,6 +25,7 @@ export interface ICatalogEntry {
iconUrl: string;
projectUrl: string;
licenseUrl: string;
packageTypes: string[];
repositoryUrl: string;
repositoryType: string;
authors: string;
Expand Down
2 changes: 1 addition & 1 deletion src/BaGet.UI/src/DisplayPackage/SourceRepository.tsx
Expand Up @@ -21,7 +21,7 @@ class SourceRepository extends React.Component<ISourceRepositoryProps> {
return (
<li>
<img className="icon" aria-hidden="true" alt="GitHub logo" src="https://www.nuget.org/Content/gallery/img/github-32x32.png" />
<a href={this.props.url}>Source Code</a>
<a href={this.props.url}>Source code</a>
</li>
);
}
Expand Down
8 changes: 8 additions & 0 deletions src/BaGet.UI/src/SearchResults.css
Expand Up @@ -41,6 +41,8 @@
margin-left: -5px;
line-height: 20px;
color: #666;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

Expand All @@ -65,3 +67,9 @@
top: 2px;
margin-right: 2px;
}

.search-result .tags {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
2 changes: 1 addition & 1 deletion src/BaGet.UI/src/SearchResults.tsx
Expand Up @@ -178,7 +178,7 @@ class SearchResults extends React.Component<ISearchResultsProps, ISearchResultsS
</span>
</li>
<li>
<span>
<span className="tags">
<Icon iconName="Tag" className="ms-Icon" />
{value.tags.join(' ')}
</span>
Expand Down

0 comments on commit 288e782

Please sign in to comment.