Reland "dart migrate: Move title bar and add 'Migrate' check box next…

… to title"

This is a reland of 17226bb

Remove generated files

Original change's description:
> dart migrate: Move title bar and add 'Migrate' check box next to title
>
> This check box displays whether a file is migrating, opting out, or
> already migrated. The check box can be clicked to toggle between
> migrating and opting out. Clicking the check box updates status in the
> navigation tree. Clicking on check boxes updates the status in the
> title bar.
>
> Screenshot here: https://screenshot.googleplex.com/9z9v9L5DHhBXzEU.png
>
> In terms of the HTML, a new parent above '.content' div was added:
> the '.file' div, which includes a '.title-bar' div above the '.content'
> div.
>
> Bug: dart-lang/sdk#44101 and
> Change-Id: I021f0dd873119ae801e29faa92e97fe48d03ef3c
> dart-lang/sdk#44124
> Reviewed-on: https://dart-review.googlesource.com/c/sdk/+/174440
> Commit-Queue: Samuel Rawlins <srawlins@google.com>
> Reviewed-by: Paul Berry <paulberry@google.com>

Bug: dart-lang/sdk#44101 and
Change-Id: Iefada3e2fc8cbbc767cfc539204dc51b369888a2
Reviewed-on: https://dart-review.googlesource.com/c/sdk/+/174720
Commit-Queue: Samuel Rawlins <srawlins@google.com>
Reviewed-by: Paul Berry <paulberry@google.com>

pkg/nnbd_migration/lib/src/front_end/navigation_tree_renderer.dart

@@ -56,7 +56,8 @@ class NavigationTreeRenderer {
       for (var entry in linksGroupedByDirectory.entries)
         NavigationTreeDirectoryNode(
           name: entry.key,
-          path: pathContext.joinAll(entry.value.first.pathParts),
+          path: pathContext
+              .dirname(pathContext.joinAll(entry.value.first.pathParts)),
           subtree: _renderNavigationSubtree(entry.value, depth + 1),
         )..setSubtreeParents(),
       for (var link in links.where((link) => link.depth == depth))

pkg/nnbd_migration/lib/src/front_end/resources/index.html

@@ -25,7 +25,6 @@ <h2></h2><!-- header placeholder element -->
     <h1>Dart</h1>
     <h2 class="before-apply">Proposed null safety changes</h2>
     <h2 class="after-apply">&#10003; Null safety migration applied</h2>
-    <h3 id="unit-name">&nbsp;</h3>
     <a target="_blank"
        href="https://goo.gle/dart-null-safety-migration-tool">
       <button class="action-button">
@@ -63,16 +62,26 @@ <h3 id="unit-name">&nbsp;</h3>
             <div class="nav-tree"></div>
         </div><!-- /nav-inner -->
     </div><!-- /nav -->
-    <div class="content">
-        <div class="regions">
-            <!-- The regions overlay code copy of the content to provide -->
-            <!-- tooltips for modified regions. -->
-        </div><!-- /regions -->
-        <div class="code">
-            <!-- Compilation unit content is written here. -->
-            <p class="welcome">
-                Select a source file on the left to preview the proposed edits.
-            </p>
+    <div class="file">
+        <div class="title-bar">
+            <h3 id="unit-name">&nbsp;</h3>
+            <span id="migrate-unit-status-icon-label">Migrate
+                <span
+                    class="material-icons status-icon migrating"
+                    id="migrate-unit-status-icon">check_box</span>
+            </span>
+        </div>
+        <div class="content">
+            <div class="regions">
+                <!-- The regions overlay code copy of the content to provide -->
+                <!-- tooltips for modified regions. -->
+            </div><!-- /regions -->
+            <div class="code">
+                <!-- Compilation unit content is written here. -->
+                <p class="welcome">
+                    Select a source file on the left to preview the proposed edits.
+                </p>
+            </div>
         </div>
     </div><!-- /content -->
     <div class="info-panel">

pkg/nnbd_migration/lib/src/front_end/resources/migration.css

@@ -93,8 +93,7 @@ header {
 }
 
 header h1,
-header h2,
-header h3 {
+header h2 {
   display: inline-block;
   font-family: "Google Sans","Roboto",sans-serif;
   font-weight: 400;
@@ -113,13 +112,6 @@ header h2 {
   top: -2px;
 }
 
-header h3 {
-  /* Shift text up */
-  position: relative;
-  top: -2px;
-}
-
-
 header .action-button, header a {
   right: 0px;
   float: right;
@@ -222,23 +214,23 @@ footer .sdk-version {
   color: #676767; /* $secondary-color */
 }
 
-.nav-tree .status-icon.already-migrated {
+.status-icon.already-migrated {
   color: #007a27; /* $light-green */
 }
 
-.nav-tree .status-icon.opted-out {
+.status-icon.opted-out {
   color: #676767; /* $secondary-color */
 }
 
-.nav-tree .status-icon.opted-out:hover {
+.status-icon.opted-out:hover {
   color: #ffffff;
 }
 
-.nav-tree .status-icon.migrating {
+.status-icon.migrating {
   color: #51c686; /* $dark-green */
 }
 
-.nav-tree .status-icon.migrating:hover {
+.status-icon.migrating:hover {
   color: #ffffff;
 }
 
@@ -300,14 +292,41 @@ footer .sdk-version {
   line-height: 1em;
 }
 
-.content {
+.file {
   flex: 4 300px;
+  font-family: "Google Sans","Roboto",sans-serif;
   background: #12202f;
-  font-family: "Roboto Mono", monospace;
-  margin: 0 6px;
+  margin: 6px;
+  overflow: scroll;
+}
+
+.title-bar h3 {
+  display: inline-block;
+  font-weight: 400;
+  /* This aligns the title text with the content text, accounting for the width
+   * of the line numbers.
+   */
+  margin: 0.5em 24px 0.5em 63px;
+}
+
+.title-bar #migrate-unit-status-icon-label {
+  display: none;
+  user-select: none;
+}
+
+.title-bar #migrate-unit-status-icon-label.visible {
+  /* Change to 'inline' to enable the incremental migration feature. */
+  display: none;
+}
+
+.title-bar #migrate-unit-status-icon {
+  vertical-align: text-bottom;
+}
+
+.content {
+  font-family: "Roboto Mono",monospace;
   position: relative;
   white-space: pre;
-  overflow: scroll;
 }
 
 .code {
@@ -659,7 +678,7 @@ button[disabled] {
  * Adjustments to align material icons in the toolbar buttons.
 */
 .action-button > span {
-  position:relative;
+  position: relative;
   top: -3px;
 }