qpp-style 9.42.1 → 9.42.2-mo-beta.0

package/components/HeaderSearchBar/index.jsx

@@ -1,6 +1,22 @@
-import React from "react";
+import React, { useState } from "react";
 
 const HeaderSearchBar = () => {
+  const [inputValue, setInputValue] = useState("");
+
+  const onChangeHandler = (event) => {
+    setInputValue(event.target.value);
+  };
+
+  function validateNpi(val) {
+    const pattern = /^\d{10}$/;
+    return val && val.length === 10 && pattern.test(val);
+  }
+
+  // If inputValue is a valid NPI, then navigate to NPI Lookup page
+  if (validateNpi(inputValue)) {
+    window.location.replace(`/participation-lookup?npi=${inputValue}`);
+  }
+
   return (
     <div className="qpp-c-search--header-container">
       <div className="qpp-c-search--header-container__block">
@@ -47,6 +63,8 @@ const HeaderSearchBar = () => {
                 name="query"
                 type="text"
                 maxLength="50"
+                onChange={onChangeHandler}
+                value={inputValue}
               />
             </div>
             <button