fix(container): fix project listing searchbox in legacy sidebar

- Fixed button visibility and misalignment - Fixed search not accepting caps in search ref: PRB0041877 Signed-off-by: Dustin Kroger <[email protected]>
ovh · Jan 13, 2025 · dca3f90 · dca3f90
1 parent 955f5d9
commit dca3f90
Showing 1 changed file with 11 additions and 11 deletions.
diff --git a/...ontainer/src/container/legacy/server-sidebar/universe/public-cloud/PublicCloudSidebar.tsx b/...ontainer/src/container/legacy/server-sidebar/universe/public-cloud/PublicCloudSidebar.tsx
@@ -123,9 +123,18 @@ export default function PublicCloudSidebar() {
 
         <div className={style.projectSearch}>
           <i className="ovh-font ovh-font-search" aria-hidden="true"></i>
+          <input
+            type="search"
+            className="oui-input"
+            placeholder={t('sidebar_pci_project_search')}
+            value={projectSearchQuery}
+            onChange={(e) => {
+              setProjectSearchQuery(e.target.value);
+            }}
+          ></input>
           {projectSearchQuery && (
             <button
-              className="d-block"
+              className="d-block border-0 bg-transparent"
               onClick={() => setProjectSearchQuery('')}
             >
               <i
@@ -134,15 +143,6 @@ export default function PublicCloudSidebar() {
               ></i>
             </button>
           )}
-          <input
-            type="search"
-            className="oui-input"
-            placeholder={t('sidebar_pci_project_search')}
-            value={projectSearchQuery}
-            onChange={(e) => {
-              setProjectSearchQuery(e.target.value);
-            }}
-          ></input>
         </div>
 
         {projects
@@ -151,7 +151,7 @@ export default function PublicCloudSidebar() {
               return (
                 (project.description || project.project_id)
                   ?.toLowerCase()
-                  .indexOf(projectSearchQuery.trim()) >= 0
+                  .indexOf(projectSearchQuery.toLowerCase().trim()) >= 0
               );
             }
             return true;