Migrate pkg/header.mustache (#5000)

* Migrate pkg/header.mustache

* rename node function

Author: isoos

app/lib/frontend/templates/package.dart

@@ -6,6 +6,7 @@ import 'dart:convert';
 
 import 'package:client_data/page_data.dart';
 import 'package:pana/pana.dart' show getRepositoryUrl, LicenseNames;
+import 'package:pub_dev/frontend/templates/views/pkg/header.dart';
 import 'package:pubspec_parse/pubspec_parse.dart' show HostedDependency;
 
 import '../../package/model_properties.dart';
@@ -217,41 +218,19 @@ String renderPkgHeader(PackagePageData data) {
   final package = data.package!;
   final showPrereleaseVersion = data.latestReleases!.showPrerelease;
   final showPreviewVersion = data.latestReleases!.showPreview;
-  final bool showUpdated =
+  final bool showReleases =
       !data.isLatestStable || showPrereleaseVersion || showPreviewVersion;
 
   final isNullSafe =
       data.toPackageView().tags.contains(PackageVersionTags.isNullSafe);
-  final nullSafeBadgeHtml = isNullSafe ? nullSafeBadgeNode().toString() : null;
+  final metadataHtml = packageHeaderNode(
+    packageName: package.name!,
+    publisherId: package.publisherId,
+    published: data.version!.created!,
+    isNullSafe: isNullSafe,
+    releases: showReleases ? data.latestReleases : null,
+  ).toString();
 
-  final metadataHtml = templateCache.renderTemplate('pkg/header', {
-    'publisher_id': package.publisherId,
-    'publisher_url': package.publisherId == null
-        ? null
-        : urls.publisherUrl(package.publisherId!),
-    'null_safe_badge_html': nullSafeBadgeHtml,
-    'latest': {
-      'show_updated': showUpdated,
-      'show_prerelease_version': showPrereleaseVersion,
-      'show_preview_version': showPreviewVersion,
-      'stable_url': urls.pkgPageUrl(package.name!),
-      'stable_version': data.latestReleases!.stable.version,
-      'prerelease_url': showPrereleaseVersion
-          ? urls.pkgPageUrl(package.name!,
-              version: data.latestReleases!.prerelease!.version)
-          : null,
-      'prerelease_version': showPrereleaseVersion
-          ? data.latestReleases!.prerelease!.version
-          : null,
-      'preview_url': showPreviewVersion
-          ? urls.pkgPageUrl(package.name!,
-              version: data.latestReleases!.preview!.version)
-          : null,
-      'preview_version':
-          showPreviewVersion ? data.latestReleases!.preview!.version : null,
-    },
-    'short_created': data.version!.shortCreated,
-  });
   final pkgView = data.toPackageView();
   return renderDetailHeader(
     titleHtml: titleContentNode(

app/lib/frontend/templates/views/pkg/header.dart

@@ -0,0 +1,88 @@
+// Copyright (c) 2021, the Dart project authors.  Please see the AUTHORS file
+// for details. All rights reserved. Use of this source code is governed by a
+// BSD-style license that can be found in the LICENSE file.
+
+import '../../../../package/models.dart';
+import '../../../../shared/urls.dart' as urls;
+import '../../../../shared/utils.dart' show shortDateFormat;
+import '../../../dom/dom.dart' as d;
+import '../../../static_files.dart';
+import '../../package_misc.dart';
+
+d.Node packageHeaderNode({
+  required String packageName,
+  required String? publisherId,
+  required DateTime published,
+  required bool isNullSafe,
+  required LatestReleases? releases,
+}) {
+  return d.fragment([
+    d.text('Published '),
+    d.span(text: shortDateFormat.format(published)),
+    if (publisherId != null) ..._publisher(publisherId),
+    if (isNullSafe) nullSafeBadgeNode(),
+    if (releases != null) ..._releases(packageName, releases),
+  ]);
+}
+
+Iterable<d.Node> _publisher(String publisherId) {
+  return [
+    d.text('• '),
+    d.a(
+      classes: ['-pub-publisher'],
+      href: urls.publisherUrl(publisherId),
+      children: [
+        d.img(
+          classes: ['-pub-publisher-shield'],
+          title: 'Published by a pub.dev verified publisher',
+          src:
+              staticUrls.getAssetUrl('/static/img/verified-publisher-blue.svg'),
+        ),
+        d.text(publisherId),
+      ],
+    ),
+  ];
+}
+
+List<d.Node> _releases(String package, LatestReleases releases) {
+  return [
+    d.text('• Latest: '),
+    d.span(
+      child: d.a(
+        href: urls.pkgPageUrl(package),
+        text: releases.stable.version,
+      ),
+    ),
+    if (releases.showPreview)
+      ..._versionLink(
+        package: package,
+        version: releases.preview!.version,
+        label: 'Preview',
+        title: 'Preview is a stable version that depends on a prerelease SDK.',
+      ),
+    if (releases.showPrerelease)
+      ..._versionLink(
+        package: package,
+        version: releases.prerelease!.version,
+        label: 'Prerelease',
+      ),
+  ];
+}
+
+List<d.Node> _versionLink({
+  required String package,
+  required String version,
+  required String label,
+  String? title,
+}) {
+  return [
+    d.text(' / '),
+    d.span(
+      attributes: title != null ? {'title': title} : null,
+      children: [
+        d.text('$label: '),
+        d.a(href: urls.pkgPageUrl(package, version: version), text: version),
+      ],
+    ),
+  ];
+}

app/lib/frontend/templates/views/pkg/header.mustache

@@ -63,7 +63,7 @@ packages:
       name: async
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.8.2"
+    version: "2.8.1"
   basics:
     dependency: "direct main"
     description:
@@ -91,7 +91,7 @@ packages:
       name: build
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.1.0"
+    version: "2.0.3"
   build_config:
     dependency: transitive
     description:
@@ -119,14 +119,14 @@ packages:
       name: build_runner
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.1.1"
+    version: "2.0.6"
   build_runner_core:
     dependency: transitive
     description:
       name: build_runner_core
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "7.1.0"
+    version: "7.0.1"
   build_verify:
     dependency: "direct dev"
     description:
@@ -147,7 +147,7 @@ packages:
       name: built_value
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "8.1.2"
+    version: "8.1.1"
   charcode:
     dependency: transitive
     description:
@@ -301,7 +301,7 @@ packages:
       name: grpc
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "3.0.1"
+    version: "3.0.0"
   html:
     dependency: "direct main"
     description:
@@ -623,7 +623,7 @@ packages:
       name: source_gen
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "1.0.5"
+    version: "1.0.3"
   source_helper:
     dependency: transitive
     description:
@@ -749,7 +749,7 @@ packages:
       name: vm_service
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "7.2.0"
+    version: "7.1.1"
   watcher:
     dependency: "direct main"
     description:

app/pubspec.lock

@@ -137,8 +137,9 @@ <h1 class="title">
                   <span>
                     <a href="/packages/oxygen">1.2.0</a>
                   </span>
-                  / Prerelease:
+                  /
                   <span>
+                    Prerelease:
                     <a href="/packages/oxygen/versions/2.0.0-dev">2.0.0-dev</a>
                   </span>
                 </div>

app/test/frontend/golden/pkg_activity_log_page.html

@@ -137,8 +137,9 @@ <h1 class="title">
                   <span>
                     <a href="/packages/oxygen">1.2.0</a>
                   </span>
-                  / Prerelease:
+                  /
                   <span>
+                    Prerelease:
                     <a href="/packages/oxygen/versions/2.0.0-dev">2.0.0-dev</a>
                   </span>
                 </div>

app/test/frontend/golden/pkg_admin_page.html

@@ -138,8 +138,9 @@ <h1 class="title">
                   <span>
                     <a href="/packages/oxygen">1.2.0</a>
                   </span>
-                  / Prerelease:
+                  /
                   <span>
+                    Prerelease:
                     <a href="/packages/oxygen/versions/2.0.0-dev">2.0.0-dev</a>
                   </span>
                 </div>

app/test/frontend/golden/pkg_changelog_page.html

@@ -138,8 +138,9 @@ <h1 class="title">
                   <span>
                     <a href="/packages/oxygen">1.2.0</a>
                   </span>
-                  / Prerelease:
+                  /
                   <span>
+                    Prerelease:
                     <a href="/packages/oxygen/versions/2.0.0-dev">2.0.0-dev</a>
                   </span>
                 </div>

app/test/frontend/golden/pkg_example_page.html

@@ -138,8 +138,9 @@ <h1 class="title">
                   <span>
                     <a href="/packages/oxygen">1.2.0</a>
                   </span>
-                  / Prerelease:
+                  /
                   <span>
+                    Prerelease:
                     <a href="/packages/oxygen/versions/2.0.0-dev">2.0.0-dev</a>
                   </span>
                 </div>

app/test/frontend/golden/pkg_install_page.html

@@ -138,8 +138,9 @@ <h1 class="title">
                   <span>
                     <a href="/packages/oxygen">1.2.0</a>
                   </span>
-                  / Prerelease:
+                  /
                   <span>
+                    Prerelease:
                     <a href="/packages/oxygen/versions/2.0.0-dev">2.0.0-dev</a>
                   </span>
                 </div>

app/test/frontend/golden/pkg_score_page.html

@@ -138,8 +138,9 @@ <h1 class="title">
                   <span>
                     <a href="/packages/oxygen">1.2.0</a>
                   </span>
-                  / Prerelease:
+                  /
                   <span>
+                    Prerelease:
                     <a href="/packages/oxygen/versions/2.0.0-dev">2.0.0-dev</a>
                   </span>
                 </div>

app/test/frontend/golden/pkg_show_page.html

@@ -136,7 +136,7 @@ <h1 class="title">
                   <span>%%published-date%%</span>
                   •
                   <a class="-pub-publisher" href="/publishers/example.com">
-                    <img class="-pub-publisher-shield" title="Published by a pub.dev verified publisher" src="/static/img/verified-publisher-blue.svg"/>
+                    <img class="-pub-publisher-shield" src="/static/img/verified-publisher-blue.svg?hash=mocked_hash_919645162" title="Published by a pub.dev verified publisher"/>
                     example.com
                   </a>
                 </div>

app/test/frontend/golden/pkg_show_page_publisher.html

@@ -138,8 +138,9 @@ <h1 class="title">
                   <span>
                     <a href="/packages/oxygen">1.2.0</a>
                   </span>
-                  / Prerelease:
+                  /
                   <span>
+                    Prerelease:
                     <a href="/packages/oxygen/versions/2.0.0-dev">2.0.0-dev</a>
                   </span>
                 </div>

app/test/frontend/golden/pkg_show_version_page.html

@@ -138,8 +138,9 @@ <h1 class="title">
                   <span>
                     <a href="/packages/oxygen">1.2.0</a>
                   </span>
-                  / Prerelease:
+                  /
                   <span>
+                    Prerelease:
                     <a href="/packages/oxygen/versions/2.0.0-dev">2.0.0-dev</a>
                   </span>
                 </div>