Проверка на корретность ввода

Address Directory/frontend/src/common/SearchBar.jsx

@@ -8,12 +8,37 @@ const SearchBar = () => {
   const [query, setQuery] = useState(''); // Поисковый запрос
   const [results, setResults] = useState([]); // Результаты поиска
   const [selectedStreet, setSelectedStreet] = useState(null); // Выбранная улица
+  const [error, setError] = useState(''); // Сообщение об ошибке
+
+  const handleInputChange = (e) => {
+    const value = e.target.value;
+
+    // Проверка на наличие цифр
+    if (/\d/.test(value)) {
+      setError('Ввод цифр запрещен. Пожалуйста, введите название улицы.');
+    } else {
+      setError('');
+    }
+
+    setQuery(value);
+  };
 
   const handleSearch = async (e) => {
     e.preventDefault();
-    const data = await searchStreet(query);
+
-    setResults(data); // Установить результаты поиска
+    // Проверка перед выполнением поиска
-    setSelectedStreet(null); // Сбросить выбранный адрес
+    if (error) {
+      alert('Исправьте ошибки перед поиском.');
+      return;
+    }
+
+    try {
+      const data = await searchStreet(query);
+      setResults(data);
+      setSelectedStreet(null);
+    } catch (err) {
+      setError('Ошибка поиска. Попробуйте снова.');
+    }
   };
 
   return (
@@ -21,29 +46,32 @@ const SearchBar = () => {
       <form className="form-container d-flex mb-4" onSubmit={handleSearch}>
         <input
           type="text"
-          className="form-control"
+          className={`form-control ${error ? 'is-invalid' : ''}`}
           placeholder="Введите название улицы"
           value={query}
-          onChange={(e) => setQuery(e.target.value)}
+          onChange={handleInputChange}
           aria-label="Search"
         />
-        <button className="btn btn-outline-success" type="submit">
+        <button className="btn btn-outline-success" type="submit" disabled={!!error}>
           Поиск
         </button>
       </form>
 
+      {/* Вывод сообщения об ошибке */}
+      {error && <div className="invalid-feedback d-block">{error}</div>}
+
       {selectedStreet ? (
         <div className="table-container">
           <h2>Информация об адресе</h2>
           <SearchResults
             selectedStreet={selectedStreet}
-            onBack={() => setSelectedStreet(null)} 
+            onBack={() => setSelectedStreet(null)}
           />
         </div>
       ) : (
         <SearchResults
           results={results}
-          onSelect={(street) => setSelectedStreet(street)} 
+          onSelect={(street) => setSelectedStreet(street)}
         />
       )}
     </div>