From 50b833cf5085e4d401f20fd4abb1e7ed99458802 Mon Sep 17 00:00:00 2001
From: jtmst <josh.troy.mills@gmail.com>
Date: Thu, 6 Jun 2024 11:55:39 -0400
Subject: [PATCH] error for spot, also css fix for nav mobile

---
 src/app/components/HeroSection.tsx          | 16 +++++++++++++---
 src/app/components/SpotResultsContainer.tsx |  5 ++++-
 src/app/globals.css                         |  2 ++
 3 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/src/app/components/HeroSection.tsx b/src/app/components/HeroSection.tsx
index 8c43060..31dcdd5 100644
--- a/src/app/components/HeroSection.tsx
+++ b/src/app/components/HeroSection.tsx
@@ -6,12 +6,14 @@ import { fetchSpotData } from '../../data/fetchSpotData';
 
 const HeroSection = ({ path, interviews, isError }) => {
   const [text, setText] = useState('');
-  const [saveData, setSaveData] = useState(false);
+  const [saveData, setSaveData] = useState(true);
   const [results, setResults] = useState(null);
   const [error, setError] = useState('');
+  const [validationError, setValidationError] = useState('');
 
   const handleInputChange = (event) => {
     setText(event.target.value);
+    if (validationError) setValidationError('');
   };
 
   const handleCheckboxChange = () => {
@@ -19,6 +21,13 @@ const HeroSection = ({ path, interviews, isError }) => {
   };
 
   const handleFindHelpClick = async () => {
+    if (text.length < 6) {
+      setValidationError(
+        'Please enter at least 6 characters to perform a search.'
+      );
+      return;
+    }
+
     try {
       const data = { text: text, save_data: saveData ? 1 : 0 };
       const fetchedResults = await fetchSpotData(data);
@@ -26,7 +35,6 @@ const HeroSection = ({ path, interviews, isError }) => {
       setError('');
       // Manage display of topic cards when spot search is used. dom manipulation is used to keep Page components server components
       const topicCards = document.querySelectorAll('.topic-card-parent');
-      console.log(topicCards);
       topicCards.forEach((card) => {
         card.classList.add('hidden');
       });
@@ -74,11 +82,13 @@ const HeroSection = ({ path, interviews, isError }) => {
                   Use my reply to help others
                 </label>
               </div>
-
               <Button onClick={handleFindHelpClick} className="hero-button">
                 Find help
               </Button>
             </div>
+            {validationError && (
+              <p className="text-danger">{validationError}</p>
+            )}
             {error && (
               <p className="text-danger">Error. Please try again later.</p>
             )}
diff --git a/src/app/components/SpotResultsContainer.tsx b/src/app/components/SpotResultsContainer.tsx
index d9101f5..24c9a84 100644
--- a/src/app/components/SpotResultsContainer.tsx
+++ b/src/app/components/SpotResultsContainer.tsx
@@ -20,7 +20,10 @@ const SpotResultsContainer = ({ data, interviews, path }) => {
       ...label,
       topic: legalTopics.find((t) => t.codes.includes(label.id)),
     }))
-    .filter(({ topic }) => topic) // Ensure the topic exists
+    .filter(
+      ({ topic }) =>
+        topic && interviews[topic.name] && interviews[topic.name].length > 0
+    ) // Ensure the topic exists and has available interviews
     .sort((a, b) => b.pred - a.pred) // Sort by confidence score
     .map(({ topic }) => topic); // Extract sorted topics
 
diff --git a/src/app/globals.css b/src/app/globals.css
index b626d2c..f75f136 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -167,6 +167,8 @@ footer {
 }
 
 .courtformsonline-navbar .nav-link {
+  padding: 1rem;
+  background-color: #002e60;
   color: white;
   margin-right: 2em;
 }