Skip to content

fix: update uicore, replace and implement mui search input from uicore #867

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
smarcet merged 8 commits into from
May 4, 2026
Merged

fix: update uicore, replace and implement mui search input from uicore #867

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
5e3fc9a
fix: update uicore, replace and implement mui search input from uicore
tomrndom Apr 9, 2026
aa04977
fix: adjust search-input import at test file
tomrndom Apr 9, 2026
4899bc7
fix: adjust default page after search
tomrndom Apr 9, 2026
1250f0b
fix: revert changes in react dependencies
tomrndom Apr 27, 2026
c8ce3bc
fix: add missing import for search input on show pages
tomrndom Apr 27, 2026
c2aa9c0
fix: update imports mocks on unit test for search input
tomrndom Apr 27, 2026
f58be23
fix: adjust input size styling, remove searchTerm state unused
tomrndom Apr 28, 2026
566d639
fix: update uicore with latest search-input adjustments
tomrndom May 4, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@
"moment": "^2.29.1",
"moment-duration-format": "^2.3.2",
"moment-timezone": "^0.5.33",
"openstack-uicore-foundation": "5.0.15",
"openstack-uicore-foundation": "5.0.16",
"p-limit": "^6.1.0",
"path-browserify": "^1.0.1",
"postcss-loader": "^6.2.1",
Expand Down
58 changes: 0 additions & 58 deletions src/components/mui/search-input.js
View file
Open in desktop

This file was deleted.

2 changes: 1 addition & 1 deletion src/components/select-page-template-dialog/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ import {
Typography
} from "@mui/material";
import CloseIcon from "@mui/icons-material/Close";
import SearchInput from "../mui/search-input";
import SearchInput from "openstack-uicore-foundation/lib/components/mui/search-input";

@coderabbitai coderabbitai Bot Apr 9, 2026

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🔴 Critical

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
set -euo pipefail

python - <<'PY'
import io
import json
import tarfile
import urllib.parse
import urllib.request

name = "openstack-uicore-foundation"
version = "5.0.3"
encoded = urllib.parse.quote(name, safe="")
meta_url = f"https://registry.npmjs.org/{encoded}/{version}"

with urllib.request.urlopen(meta_url) as resp:
    meta = json.load(resp)

print("main:", meta.get("main"))
print("module:", meta.get("module"))
print("exports:", json.dumps(meta.get("exports"), indent=2, sort_keys=True))

with urllib.request.urlopen(meta["dist"]["tarball"]) as resp:
    blob = resp.read()

with tarfile.open(fileobj=io.BytesIO(blob), mode="r:gz") as tar:
    names = sorted(
        n for n in tar.getnames()
        if "search-input" in n.lower()
    )

print("\nPublished search-input paths:")
for name in names:
    print(name)

targets = {
    "package/lib/components/mui/search-input.js",
    "package/lib/components/mui/search-input/index.js",
}
print("\nTarget path published:", any(n in targets for n in names))
PY

Repository: fntechgit/summit-admin

Length of output: 2648

🌐 Web query:

openstack-uicore-foundation 5.0.3 SearchInput component public API documentation

💡 Result:

I couldn’t find any exported/public React component named SearchInput in openstack-uicore-foundation (including around the lib/components/inputs and lib/components listings I inspected). (app.unpkg.com)

What does exist in the public build is a search-related component named FreeTextSearch:

  • Built file: lib/components/free-text-search.js (app.unpkg.com)
  • You can browse other input components here: lib/components/inputs/ (app.unpkg.com)

Also, version 5.0.3 is present on UNPKG as a selectable/latest version for this package, so if you specifically need 5.0.3, you can switch the UNPKG version selector to 5.0.3 and then open the same paths (e.g., lib/components/free-text-search.js) to see the exact public API for that version. (app.unpkg.com)

Citations:

🏁 Script executed:

# Search for SearchInput imports across the codebase to understand the pattern
rg "SearchInput" --type js --type ts -B 2 -A 2 | head -100

Repository: fntechgit/summit-admin

Length of output: 9342

🏁 Script executed:

# Check package.json for the dependency
rg "openstack-uicore-foundation" --type json

Repository: fntechgit/summit-admin

Length of output: 122

🏁 Script executed:

# Search for local SearchInput components
fd -t f "search-input" src/components/

Repository: fntechgit/summit-admin

Length of output: 48

🏁 Script executed:

# Check if src/components/mui/search-input exists
ls -la src/components/mui/search-input* 2>/dev/null || echo "Not found in local structure"

Repository: fntechgit/summit-admin

Length of output: 94

🏁 Script executed:

# Search for all local SearchInput definitions or exports
ast-grep --pattern 'export.*SearchInput'

Repository: fntechgit/summit-admin

Length of output: 48

🏁 Script executed:

# Check package-lock.json or yarn.lock to see actual installed structure
ls -la | grep -E "package-lock|yarn.lock"

Repository: fntechgit/summit-admin

Length of output: 128

🏁 Script executed:

# Search git history for when SearchInput imports were added
git log --oneline --all -S "openstack-uicore-foundation/lib/components/mui/search-input" | head -20

Repository: fntechgit/summit-admin

Length of output: 152

🏁 Script executed:

# Check if maybe there's a dist or build output with this file
find . -path ./node_modules -prune -o -type f -name "*search-input*" -print 2>/dev/null | head -20

Repository: fntechgit/summit-admin

Length of output: 48

🏁 Script executed:

# Extract openstack-uicore-foundation entry from yarn.lock
rg -A 10 '"openstack-uicore-foundation@' yarn.lock | head -50

Repository: fntechgit/summit-admin

Length of output: 48

🏁 Script executed:

# Also check if there's a .d.ts or types definition that might export SearchInput
fd -t f "\.(d\.ts|ts)$" | xargs rg -l "SearchInput" 2>/dev/null | head -10

Repository: fntechgit/summit-admin

Length of output: 772

This import path does not exist in openstack-uicore-foundation@5.0.3.

Line 20 imports from openstack-uicore-foundation/lib/components/mui/search-input, but web search of the published v5.0.3 package shows no SearchInput component in the lib/components/mui/ directory. The package provides other components (e.g., FreeTextSearch, input components in lib/components/inputs/), but this specific path is not a documented or supported export. No local fallback component exists either. Either switch to a confirmed public export from the package, or if a SearchInput component is needed, create or import it from a local source.

🤖 Prompt for AI Agents 
Verify each finding against the current code and only fix it if needed.

In `@src/components/select-page-template-dialog/index.js` at line 20, The import
path for SearchInput is invalid in openstack-uicore-foundation@5.0.3; replace
the external import with a supported component or a local implementation: either
import the package's public search component (e.g., FreeTextSearch from the
library's inputs export) and update all uses of SearchInput in this file to the
new component name, or create a local SearchInput component and import it from a
relative path (e.g., ./SearchInput) and ensure the component API matches how
this file uses SearchInput. Target the import statement and all references to
SearchInput in this module (the import line and usages in
SelectPageTemplateDialog) when applying the fix.

import { getPageTemplates } from "../../actions/page-template-actions";
import { DEFAULT_PER_PAGE } from "../../utils/constants";
import MuiInfiniteTable from "../mui/infinite-table";
Expand Down
36 changes: 12 additions & 24 deletions src/pages/sponsors-global/form-templates/add-form-template-item-popup.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, { useEffect, useState } from "react";
import React, { useEffect } from "react";
import T from "i18n-react/dist/i18n-react";
import { connect } from "react-redux";
import PropTypes from "prop-types";
Expand All @@ -14,14 +14,13 @@ import {
FormControlLabel,
Grid2,
IconButton,
TextField,
Typography
} from "@mui/material";
import SwapVertIcon from "@mui/icons-material/SwapVert";
import SearchIcon from "@mui/icons-material/Search";
import CloseIcon from "@mui/icons-material/Close";
import ImageIcon from "@mui/icons-material/Image";
import MuiTable from "openstack-uicore-foundation/lib/components/mui/table";
import SearchInput from "openstack-uicore-foundation/lib/components/mui/search-input";
import MenuButton from "../../../components/mui/menu-button";
import {
clearAllSelectedInventoryItems,
Expand Down Expand Up @@ -50,8 +49,6 @@ const AddFormTemplateItemDialog = ({
selectedIds,
term = ""
}) => {
const [searchTerm, setSearchTerm] = useState("");

useEffect(() => {
getInventoryItems(term, currentPage, perPage, order, orderDir);
}, []);
Expand All @@ -68,9 +65,14 @@ const AddFormTemplateItemDialog = ({
getInventoryItems(term, currentPage, perPage, key, dir);
};

const handleOnSearch = (ev) => {
if (ev.key === "Enter")
getInventoryItems(searchTerm, currentPage, perPage, order, orderDir);
const handleOnSearch = (searchTerm) => {
getInventoryItems(
searchTerm,
DEFAULT_CURRENT_PAGE,
perPage,
order,
orderDir
);
};
Comment thread
coderabbitai[bot] marked this conversation as resolved.

const handleSelected = (id, isSelected) => {
Expand Down Expand Up @@ -222,25 +224,11 @@ const AddFormTemplateItemDialog = ({
</MenuButton>
</Grid2>
<Grid2 size={8}>
<TextField
variant="outlined"
value={searchTerm}
<SearchInput
onSearch={handleOnSearch}
placeholder={T.translate(
"inventory_items_list_modal.placeholders.search_inventory_items"
)}
slotProps={{
input: {
startAdornment: <SearchIcon sx={{ mr: 1 }} />
}
}}
onChange={(event) => setSearchTerm(event.target.value)}
onKeyDown={handleOnSearch}
fullWidth
sx={{
"& .MuiOutlinedInput-root": {
height: "36px"
}
}}
/>
</Grid2>
</Grid2>
Expand Down
26 changes: 5 additions & 21 deletions src/pages/sponsors-global/form-templates/form-template-from-duplicate-popup.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,13 +13,12 @@ import {
FormControlLabel,
Grid2,
IconButton,
TextField,
Typography
} from "@mui/material";
import SwapVertIcon from "@mui/icons-material/SwapVert";
import SearchIcon from "@mui/icons-material/Search";
import CloseIcon from "@mui/icons-material/Close";
import MuiTable from "openstack-uicore-foundation/lib/components/mui/table";
import SearchInput from "openstack-uicore-foundation/lib/components/mui/search-input";
import MenuButton from "../../../components/mui/menu-button";

const FormTemplateFromDuplicateDialog = ({
Expand All @@ -36,7 +35,6 @@ const FormTemplateFromDuplicateDialog = ({
onPageChange,
onPerPageChange
}) => {
const [searchTerm, setSearchTerm] = useState("");
const [selectedRow, setSelectedRow] = useState(null);

const handleSort = (key, dir) => {
Expand All @@ -57,8 +55,8 @@ const FormTemplateFromDuplicateDialog = ({
onDuplicate(selectedRow);
};

const handleOnSearch = (ev) => {
if (ev.key === "Enter") onSearch(searchTerm);
const handleOnSearch = (searchTerm) => {
onSearch(searchTerm);
};

const columns = [
Expand Down Expand Up @@ -134,25 +132,11 @@ const FormTemplateFromDuplicateDialog = ({
</MenuButton>
</Grid2>
<Grid2 size={8}>
<TextField
variant="outlined"
value={searchTerm}
<SearchInput
onSearch={handleOnSearch}
placeholder={T.translate(
"inventory_item_list.placeholders.search_inventory_items"
)}
slotProps={{
input: {
startAdornment: <SearchIcon sx={{ mr: 1 }} />
}
}}
onChange={(event) => setSearchTerm(event.target.value)}
onKeyDown={handleOnSearch}
fullWidth
sx={{
"& .MuiOutlinedInput-root": {
height: "36px"
}
}}
/>
</Grid2>
</Grid2>
Expand Down
56 changes: 19 additions & 37 deletions src/pages/sponsors-global/form-templates/form-template-list-page.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,11 @@ import {
Checkbox,
FormControlLabel,
FormGroup,
Grid2,
TextField
Grid2
} from "@mui/material";
import Box from "@mui/material/Box";
import AddIcon from "@mui/icons-material/Add";
import SearchIcon from "@mui/icons-material/Search";
import SearchInput from "openstack-uicore-foundation/lib/components/mui/search-input";
import { connect } from "react-redux";
import T from "i18n-react/dist/i18n-react";
import MuiTable from "openstack-uicore-foundation/lib/components/mui/table";
Expand Down Expand Up @@ -71,7 +70,6 @@ const FormTemplateListPage = ({
formTemplateFromDuplicatePopupOpen,
setFormTemplateFromDuplicatePopupOpen
] = useState(false);
const [searchTerm, setSearchTerm] = useState("");

useEffect(() => {
getFormTemplates(
Expand Down Expand Up @@ -104,20 +102,15 @@ const FormTemplateListPage = ({
getFormTemplates(term, currentPage, perPage, key, dir, showArchived);
};

const handleSearch = (ev) => {
if (ev.key === "Enter") {
getFormTemplates(
searchTerm,
currentPage,
perPage,
order,
orderDir,
showArchived
);
}
// search on duplicate popup
if (typeof ev === "string")
getFormTemplates(ev, currentPage, perPage, order, orderDir, showArchived);
const handleSearch = (searchTerm) => {
getFormTemplates(
searchTerm,
DEFAULT_CURRENT_PAGE,
perPage,
order,
orderDir,
showArchived
);
Comment thread
coderabbitai[bot] marked this conversation as resolved.
};

const handleRowEdit = (row) => {
Expand Down Expand Up @@ -267,25 +260,14 @@ const FormTemplateListPage = ({
/>
</FormGroup>

<TextField
variant="outlined"
value={searchTerm}
placeholder={T.translate(
"inventory_item_list.placeholders.search_inventory_items"
)}
slotProps={{
input: {
startAdornment: <SearchIcon sx={{ mr: 1 }} />
}
}}
onChange={(event) => setSearchTerm(event.target.value)}
onKeyDown={handleSearch}
sx={{
"& .MuiOutlinedInput-root": {
height: "36px"
}
}}
/>
<Grid2 size={3}>
<SearchInput
onSearch={handleSearch}
placeholder={T.translate(
"inventory_item_list.placeholders.search_inventory_items"
)}
/>
</Grid2>
<Button
variant="contained"
size="medium"
Expand Down
51 changes: 18 additions & 33 deletions src/pages/sponsors-global/inventory/inventory-list-page.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,14 +20,13 @@ import {
FormGroup,
Grid2,
Popover,
TextField,
Typography
} from "@mui/material";
import Box from "@mui/material/Box";
import AddIcon from "@mui/icons-material/Add";
import SearchIcon from "@mui/icons-material/Search";
import IconButton from "@mui/material/IconButton";
import ImageIcon from "@mui/icons-material/Image";
import SearchInput from "openstack-uicore-foundation/lib/components/mui/search-input";
import { connect } from "react-redux";
import T from "i18n-react/dist/i18n-react";
import MuiTable from "openstack-uicore-foundation/lib/components/mui/table";
Expand Down Expand Up @@ -178,7 +177,6 @@ const InventoryListPage = ({
resetInventoryItemForm
}) => {
const [open, setOpen] = useState(false);
const [searchTerm, setSearchTerm] = useState("");

const handleClose = () => {
resetInventoryItemForm();
Expand Down Expand Up @@ -215,17 +213,15 @@ const InventoryListPage = ({
getInventoryItems(term, currentPage, perPage, key, dir, showArchived);
};

const handleSearch = (ev) => {
if (ev.key === "Enter") {
getInventoryItems(
searchTerm,
DEFAULT_CURRENT_PAGE,
perPage,
order,
orderDir,
showArchived
);
}
const handleSearch = (searchTerm) => {
getInventoryItems(
searchTerm,
DEFAULT_CURRENT_PAGE,
perPage,
order,
orderDir,
showArchived
);
};

const handleShowArchivedForms = (ev) => {
Expand Down Expand Up @@ -357,25 +353,14 @@ const InventoryListPage = ({
label={T.translate("inventory_item_list.show_archived")}
/>
</FormGroup>
<TextField
variant="outlined"
value={searchTerm}
placeholder={T.translate(
"inventory_item_list.placeholders.search_inventory_items"
)}
slotProps={{
input: {
startAdornment: <SearchIcon sx={{ mr: 1 }} />
}
}}
onChange={(event) => setSearchTerm(event.target.value)}
onKeyDown={handleSearch}
sx={{
"& .MuiOutlinedInput-root": {
height: "36px"
}
}}
/>
<Grid2 size={3}>
<SearchInput
onSearch={handleSearch}
placeholder={T.translate(
"inventory_item_list.placeholders.search_inventory_items"
)}
/>
</Grid2>
<Button
variant="contained"
onClick={() => handleNewInventoryItem()}
Expand Down
Loading
Loading