Bug fix/type spec upload (#5858)

* Fix TypeSpec Instruction and ReviewLanguageSelect drop down

src/dotnet/APIView/APIViewUnitTests/APIViewUnitTests.csproj

@@ -17,6 +17,7 @@
   </ItemGroup>
 
   <ItemGroup>
+    <PackageReference Include="FluentAssertions" Version="6.10.0" />
     <PackageReference Include="Microsoft.Azure.Cosmos" Version="3.26.1" />
     <PackageReference Include="Microsoft.Extensions.DependencyModel" Version="3.1.0" />
     <PackageReference Include="Azure.Storage.Blobs" Version="12.13.0" />

src/dotnet/APIView/APIViewUnitTests/LanguageServiceTests.cs

@@ -1,13 +1,8 @@
-using System;
-using System.Collections.Generic;
-using System.IO;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-using ApiView;
 using APIViewWeb;
+using APIViewWeb.Helpers;
 using Microsoft.Extensions.Configuration;
 using Xunit;
+using FluentAssertions;
 
 namespace APIViewUnitTests
 {
@@ -21,5 +16,11 @@ namespace APIViewUnitTests
             Assert.True(languageService.IsSupportedFile("specification/cognitiveservices/HealthInsights/healthinsights.common/primitives.tsp"));
             Assert.False(languageService.IsSupportedFile("specification/cognitiveservices/HealthInsights/healthinsights.common/primitives.json"));
         }
+
+        [Fact]
+        public void SupportedLanguages_Is_In_Alphabetical_Order()
+        {
+            LanguageServiceHelpers.SupportedLanguages.Should().BeInAscendingOrder();
+        }
     }
 }

src/dotnet/APIView/APIViewWeb/Client/src/pages/index.ts

@@ -119,7 +119,6 @@ $(() => {
     updateListedReviews();
   });
 
-  var prevLanguageValue = languageSelect.val();
   languageSelect.on('sumo:closed', function (e) {
     var val = $(this).val() as string;
     if (val == "C++" || val == "C#") {
@@ -128,13 +127,14 @@ $(() => {
     $("#uploadModel").find(".card-body > div").addClass("d-none");
     var helpName = "#" + val.toLowerCase() + "-help";
     $(helpName).removeClass("d-none");
-    if (val == 'TypeSpec' || prevLanguageValue == 'TypeSpec') {
-      const fileSelectors = $(".package-selector");
-      for (var i = 0; i < fileSelectors.length; i++) {
-        $(fileSelectors[i]).toggleClass("d-none");
-      }
+    if (val == 'TypeSpec') {
+      $("#create-review-via-upload").addClass("d-none");
+      $("#create-review-via-path").removeClass("d-none");
+    }
+    else {
+      $("#create-review-via-upload").removeClass("d-none");
+      $("#create-review-via-path").addClass("d-none");
     }
-    prevLanguageValue = val;
   });
 
   // Open / Close right Offcanvas Menu

src/dotnet/APIView/APIViewWeb/Helpers/LanguageServiceHelpers.cs

@@ -5,7 +5,7 @@ namespace APIViewWeb.Helpers
 {
     public class LanguageServiceHelpers
     {
-        public static string[] SupportedLanguages = new string[] { "C", "C++", "C#", "TypeSpec", "Go", "Java", "JavaScript", "Json", "Kotlin", "Python", "Swagger", "Swift", "Xml" };
+        public static string[] SupportedLanguages = new string[] { "C", "C#", "C++", "Go", "Java", "JavaScript", "Json", "Kotlin", "Python", "Swagger", "Swift", "TypeSpec", "Xml" };
 
         public static IEnumerable<string> MapLanguageAliases(IEnumerable<string> languages)
         {

src/dotnet/APIView/APIViewWeb/Pages/Assemblies/Index.cshtml

@@ -97,11 +97,11 @@
                                         }
                                     </select>
                                 </div>
-                                <div class="input-group package-selector mb-3 custom-file-label">
+                                <div class="input-group mb-3 custom-file-label" id="create-review-via-upload">
                                     <label for="uploadReviewFile" class="input-group-text small mb-0">Select File to Include in API Review</label>
                                     <input asp-for="Upload.Files" type="file" class="form-control" id="uploadReviewFile">
                                 </div>
-                                <div class="form-group package-selector d-none mb-3">
+                                <div class="form-group d-none mb-3" id="create-review-via-path">
                                     <input asp-for="Upload.FilePath" class="form-control" type="text" placeholder="Package root e.g https://github.com/Azure/azure-rest-api-specs/specification/cognitiveservices/AnomalyDetector/">
                                 </div>
                                 <div class="form-group mb-3 d-none">

src/dotnet/APIView/APIViewWeb/Pages/Shared/_ReviewUploadHelp.cshtml

@@ -124,15 +124,27 @@
         </div>
         <div class="d-none" id="typespec-help">
             <p class="card-text">
+                TypeSpec review can be generated manually using one of the following options.
                 <ol>
                     <li>
-                        Install <code>@@azure-tools/typespec-apiview</code>
+                        <strong>Option 1:</strong> Create API review using a link to TypeSpec project. Provide the URL to project and click Upload.
                     </li>
                     <li>
-                        Compile and emit the apiview file: <code>typespec compile .\main.tsp --emit "@@azure-tools/typespec-apiview"</code>
-                    </li>
-                    <li>
-                        Upload the JSON file that is emitted.
+                        <strong>Option 2:</strong> Create API review file locally using following steps.
+                        <ul>
+                            <li>
+                                Install  <code>@@azure-tools/typespec-apiview</code>
+                            </li>
+                            <li>
+                                Compile and emit the apiview file: <code>typespec compile .\main.tsp --emit "@@azure-tools/typespec-apiview"</code>
+                            </li>
+                            <li>
+                                Select Json as the language option in Create review page.
+                            </li>
+                            <li>
+                                Upload the JSON file that is emitted.
+                            </li>
+                        </ul>
                     </li>
                 </ol>
             </p>