Search UI complete (#3)

"Back" doesn't preserve search results; need to fix that before this is done

src/JobsJobsJobs/Client/Pages/Profile/Search.razor

@@ -14,9 +14,9 @@
   {
     if (!Searched)
     {
-      <p>Instructions go here</p>
+      <p>Enter one or more criteria to filter results, or just click &ldquo;Search&rdquo; to list all profiles.</p>
     }
-    <section>
+    <Collapsible HeaderText="Search Criteria" Collapsed=@(Searched && SearchResults.Any())>
       <EditForm Model=@Criteria OnValidSubmit=@RetrieveProfiles>
         <div class="form-row">
           <div class="col col-12 col-sm-6 col-md-4 col-lg-3">
@@ -64,7 +64,8 @@
           </div>
         </div>
       </EditForm>
-    </section>
+    </Collapsible>
+    <br>
     @if (SearchResults.Any())
     {
       <table class="table table-sm table-hover">
@@ -93,5 +94,9 @@
         </tbody>
       </table>
     }
+    else if (Searched)
+    {
+      <p>No results found for the specified criteria</p>
+    }
   }
 </ErrorList>

src/JobsJobsJobs/Client/Pages/Profile/Search.razor.cs

@@ -54,9 +54,6 @@ namespace JobsJobsJobs.Client.Pages.Profile
             {
                 ErrorMessages.Add(continentResult.Error);
             }
-
-            // TODO: remove this call once the filter is ready
-            await RetrieveProfiles();
         }
 
         /// <summary>

src/JobsJobsJobs/Client/Shared/Collapsible.razor

@@ -0,0 +1,25 @@
+<div class="card">
+  <div class="card-header">
+    <a href="#" class="@(Collapsed ? "jjj-c-collapsed" : "jjj-c-open")"
+       @onclick=@Toggle @onclick:preventDefault>
+      @HeaderText
+    </a>
+  </div>
+  @if (!Collapsed)
+  {
+    <div class="card-body">@ChildContent</div>
+  }
+</div>
+
+@code {
+    [Parameter]
+    public RenderFragment ChildContent { get; set; } = default!;
+
+    [Parameter]
+    public bool Collapsed { get; set; } = false;
+
+    [Parameter]
+    public string HeaderText { get; set; } = "Toggle";
+
+    private void Toggle() => Collapsed = !Collapsed;
+}

src/JobsJobsJobs/Client/Shared/Collapsible.razor.css

@@ -0,0 +1,16 @@
+a.jjj-c-collapsed,
+a.jjj-c-open {
+  text-decoration: none;
+  font-weight: bold;
+  color: black;
+}
+a.jjj-c-collapsed:hover,
+a.jjj-c-open:hover {
+  cursor: pointer;
+}
+.jjj-c-collapsed::before {
+  content: '\2b9e \00a0';
+}
+.jjj-c-open::before {
+  content: '\2b9f \00a0';
+}

src/JobsJobsJobs/Directory.Build.props

@@ -2,7 +2,7 @@
   <PropertyGroup>
     <TargetFramework>net5.0</TargetFramework>
     <Nullable>enable</Nullable>
-    <AssemblyVersion>0.7.2.0</AssemblyVersion>
-    <FileVersion>0.7.2.0</FileVersion>
+    <AssemblyVersion>0.8.0.0</AssemblyVersion>
+    <FileVersion>0.8.0.0</FileVersion>
   </PropertyGroup>
 </Project>