[UI] Fix several bugs (#254)

loic-sharma · Apr 13, 2019 · 288e782 · 288e782
1 parent 18751e5
commit 288e782
Show file tree

Hide file tree

Showing 13 changed files with 102 additions and 14 deletions.
diff --git a/src/BaGet.Core.Server/Controllers/Registration/RegistrationIndexController.cs b/src/BaGet.Core.Server/Controllers/Registration/RegistrationIndexController.cs
@@ -82,6 +82,7 @@ private RegistrationIndexPageItem ToRegistrationIndexPageItem(Package package) =
                     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,

diff --git a/src/BaGet.Core.Server/Extensions/IServiceCollectionExtensions.cs b/src/BaGet.Core.Server/Extensions/IServiceCollectionExtensions.cs
@@ -5,6 +5,7 @@
 using Microsoft.AspNetCore.Mvc;
 using Microsoft.Extensions.DependencyInjection;
 using Microsoft.Extensions.Options;
+using Newtonsoft.Json;
 
 namespace BaGet.Core.Server.Extensions
 {
@@ -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>();

diff --git a/src/BaGet.Core/Mirror/MirrorService.cs b/src/BaGet.Core/Mirror/MirrorService.cs
@@ -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(),
@@ -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)

diff --git a/src/BaGet.Core/Services/DatabaseSearchService.cs b/src/BaGet.Core/Services/DatabaseSearchService.cs
@@ -76,7 +76,7 @@ private async Task<List<IGrouping<string, Package>>> SearchImplAsync(
             string packageType,
             IReadOnlyList<string> frameworks)
         {
-            IQueryable<Package> search = _context.Packages;
+            IQueryable<Package> search = _context.Packages.Where(p => p.Listed);
 
             if (!string.IsNullOrEmpty(query))
             {

diff --git a/src/BaGet.Protocol/Registration/PackageMetadata.cs b/src/BaGet.Protocol/Registration/PackageMetadata.cs
@@ -22,6 +22,7 @@ public PackageMetadata(
             bool listed,
             string minClientVersion,
             string packageContent,
+            IReadOnlyList<string> packageTypes,
             string projectUrl,
             string repositoryUrl,
             string repositoryType,
@@ -46,6 +47,7 @@ public PackageMetadata(
             Listed = listed;
             MinClientVersion = minClientVersion;
             PackageContent = packageContent;
+            PackageTypes = packageTypes;
             ProjectUrl = projectUrl;
             RepositoryUrl = repositoryUrl;
             RepositoryType = repositoryType;
@@ -76,6 +78,7 @@ public 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; }

diff --git a/src/BaGet.UI/src/DisplayPackage/DisplayPackage.css b/src/BaGet.UI/src/DisplayPackage/DisplayPackage.css
@@ -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%;

diff --git a/src/BaGet.UI/src/DisplayPackage/DisplayPackage.tsx b/src/BaGet.UI/src/DisplayPackage/DisplayPackage.tsx
@@ -33,6 +33,7 @@ interface IPackage {
   repositoryUrl: string;
   repositoryType: string;
   totalDownloads: number;
+  isDotnetTool: boolean;
   downloads: number;
   authors: string;
   tags: string[];
@@ -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,
@@ -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 }} />
@@ -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>

diff --git a/src/BaGet.UI/src/DisplayPackage/InstallationInfo.tsx b/src/BaGet.UI/src/DisplayPackage/InstallationInfo.tsx
@@ -7,6 +7,7 @@ import './InstallationInfo.css';
 interface IInstallationInfoProps {
   id: string;
   version: string;
+  isDotnetTool: boolean;
 }
 
 interface IInstallationInfoState {
@@ -16,7 +17,9 @@ interface IInstallationInfoState {
 }
 
 enum Tab {
-  DotNet,
+  Dotnet,
+  DotnetTool,
+  PackageReference,
   Paket,
   PackageManager,
 }
@@ -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">
@@ -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 = ">";
@@ -89,6 +129,7 @@ class InstallationInfo extends React.Component<IInstallationInfoProps, IInstalla
 
 interface IInstallationInfoTabProps {
   type: Tab;
+  hidden: boolean;
   selected: Tab;
   onSelect(value: Tab): void;
 }
@@ -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>
     }

diff --git a/src/BaGet.UI/src/DisplayPackage/LicenseInfo.tsx b/src/BaGet.UI/src/DisplayPackage/LicenseInfo.tsx
@@ -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>
     );
   }

diff --git a/src/BaGet.UI/src/DisplayPackage/Registration.tsx b/src/BaGet.UI/src/DisplayPackage/Registration.tsx
@@ -25,6 +25,7 @@ export interface ICatalogEntry {
   iconUrl: string;
   projectUrl: string;
   licenseUrl: string;
+  packageTypes: string[];
   repositoryUrl: string;
   repositoryType: string;
   authors: string;

diff --git a/src/BaGet.UI/src/DisplayPackage/SourceRepository.tsx b/src/BaGet.UI/src/DisplayPackage/SourceRepository.tsx
@@ -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>
     );
   }

diff --git a/src/BaGet.UI/src/SearchResults.css b/src/BaGet.UI/src/SearchResults.css
@@ -41,6 +41,8 @@
   margin-left: -5px;
   line-height: 20px;
   color: #666;
+  overflow: hidden;
+  text-overflow: ellipsis;
   white-space: nowrap;
 }
 
@@ -65,3 +67,9 @@
   top: 2px;
   margin-right: 2px;
 }
+
+.search-result .tags {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
diff --git a/src/BaGet.UI/src/SearchResults.tsx b/src/BaGet.UI/src/SearchResults.tsx
@@ -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>