Merge pull request #1509 from oci-labs/feature-1502/Fix_search_skills…

…_&_roles_text_box feature-1502/fixed skills and roles search box.
objectcomputing · Sep 21, 2021 · e555fc0 · e555fc0
2 parents 4ac59bd + f1cc870
commit e555fc0
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 13 deletions.
diff --git a/web-ui/src/components/admin/roles/Roles.jsx b/web-ui/src/components/admin/roles/Roles.jsx
@@ -150,8 +150,9 @@ const Roles = () => {
             <h2>Roles</h2>
             <TextField
               className="role-search"
-              label="Search Roles..."
-              placeholder="Role Name"
+              label="Search Roles"
+              placeholder="Role"
+              fullWidth={true}
               value={searchText}
               onChange={(e) => {
                 setSearchText(e.target.value);

diff --git a/web-ui/src/components/admin/roles/__snapshots__/Roles.test.js.snap b/web-ui/src/components/admin/roles/__snapshots__/Roles.test.js.snap
@@ -17,16 +17,16 @@ exports[`renders correctly 1`] = `
           Roles
         </h2>
         <div
-          className="MuiFormControl-root MuiTextField-root role-search"
+          className="MuiFormControl-root MuiTextField-root role-search MuiFormControl-fullWidth"
         >
           <label
             className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
             data-shrink={false}
           >
-            Search Roles...
+            Search Roles
           </label>
           <div
-            className="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-formControl MuiInput-formControl"
+            className="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
             onClick={[Function]}
           >
             <input
@@ -38,7 +38,7 @@ exports[`renders correctly 1`] = `
               onBlur={[Function]}
               onChange={[Function]}
               onFocus={[Function]}
-              placeholder="Role Name"
+              placeholder="Role"
               required={false}
               type="text"
               value=""

diff --git a/web-ui/src/components/edit_skills/__snapshots__/EditSkillsCard.test.js.snap b/web-ui/src/components/edit_skills/__snapshots__/EditSkillsCard.test.js.snap
@@ -112,7 +112,7 @@ exports[`renders correctly 2`] = `
   >
     <div>
       <div
-        className="MuiFormControl-root MuiTextField-root"
+        className="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
       >
         <label
           className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
@@ -121,7 +121,7 @@ exports[`renders correctly 2`] = `
           Search skills
         </label>
         <div
-          className="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-formControl MuiInput-formControl"
+          className="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
           onClick={[Function]}
         >
           <input
@@ -133,7 +133,7 @@ exports[`renders correctly 2`] = `
             onBlur={[Function]}
             onChange={[Function]}
             onFocus={[Function]}
-            placeholder="Skill Name"
+            placeholder="Skill"
             required={false}
             type="text"
             value=""

diff --git a/web-ui/src/pages/EditSkillsPage.jsx b/web-ui/src/pages/EditSkillsPage.jsx
@@ -31,7 +31,8 @@ const EditSkillsPage = (props) => {
         <div>
           <TextField
             label="Search skills"
-            placeholder="Skill Name"
+            placeholder="Skill"
+            fullWidth={true}
             value={searchText}
             onChange={(e) => {
               setSearchText(e.target.value);

diff --git a/web-ui/src/pages/__snapshots__/EditSkillsPage.test.js.snap b/web-ui/src/pages/__snapshots__/EditSkillsPage.test.js.snap
@@ -9,7 +9,7 @@ exports[`renders correctly 1`] = `
   >
     <div>
       <div
-        className="MuiFormControl-root MuiTextField-root"
+        className="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
       >
         <label
           className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
@@ -18,7 +18,7 @@ exports[`renders correctly 1`] = `
           Search skills
         </label>
         <div
-          className="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-formControl MuiInput-formControl"
+          className="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
           onClick={[Function]}
         >
           <input
@@ -30,7 +30,7 @@ exports[`renders correctly 1`] = `
             onBlur={[Function]}
             onChange={[Function]}
             onFocus={[Function]}
-            placeholder="Skill Name"
+            placeholder="Skill"
             required={false}
             type="text"
             value=""