mirror of
https://github.com/crocofied/CoreControl.git
synced 2025-12-23 18:36:16 +00:00
Server Search Function
This commit is contained in:
parent
1373c5b92e
commit
8589ccb35f
@ -391,7 +391,6 @@ export default function Dashboard() {
|
|||||||
onChange={(e) => setSearchTerm(e.target.value)}
|
onChange={(e) => setSearchTerm(e.target.value)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<br />
|
<br />
|
||||||
{!loading ? (
|
{!loading ? (
|
||||||
<div
|
<div
|
||||||
|
|||||||
@ -108,6 +108,9 @@ export default function Dashboard() {
|
|||||||
const [editRam, setEditRam] = useState<string>("");
|
const [editRam, setEditRam] = useState<string>("");
|
||||||
const [editDisk, setEditDisk] = useState<string>("");
|
const [editDisk, setEditDisk] = useState<string>("");
|
||||||
|
|
||||||
|
const [searchTerm, setSearchTerm] = useState<string>("");
|
||||||
|
const [isSearching, setIsSearching] = useState<boolean>(false);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const savedLayout = Cookies.get('layoutPreference-servers');
|
const savedLayout = Cookies.get('layoutPreference-servers');
|
||||||
setIsGridLayout(savedLayout === 'grid');
|
setIsGridLayout(savedLayout === 'grid');
|
||||||
@ -210,6 +213,33 @@ export default function Dashboard() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const searchServers = async () => {
|
||||||
|
try {
|
||||||
|
setIsSearching(true);
|
||||||
|
const response = await axios.post<{ results: Server[] }>(
|
||||||
|
"/api/servers/search",
|
||||||
|
{ searchterm: searchTerm }
|
||||||
|
);
|
||||||
|
setServers(response.data.results);
|
||||||
|
setIsSearching(false);
|
||||||
|
} catch (error: any) {
|
||||||
|
console.error("Search error:", error.response?.data);
|
||||||
|
setIsSearching(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const delayDebounce = setTimeout(() => {
|
||||||
|
if (searchTerm.trim() === "") {
|
||||||
|
getServers();
|
||||||
|
} else {
|
||||||
|
searchServers();
|
||||||
|
}
|
||||||
|
}, 300);
|
||||||
|
|
||||||
|
return () => clearTimeout(delayDebounce);
|
||||||
|
}, [searchTerm]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<SidebarProvider>
|
<SidebarProvider>
|
||||||
<AppSidebar />
|
<AppSidebar />
|
||||||
@ -345,6 +375,14 @@ export default function Dashboard() {
|
|||||||
</AlertDialog>
|
</AlertDialog>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div className="flex flex-col gap-2 mb-4 pt-2">
|
||||||
|
<Input
|
||||||
|
id="application-search"
|
||||||
|
placeholder="Type to search..."
|
||||||
|
value={searchTerm}
|
||||||
|
onChange={(e) => setSearchTerm(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
<br />
|
<br />
|
||||||
{!loading ?
|
{!loading ?
|
||||||
<div className={isGridLayout ?
|
<div className={isGridLayout ?
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user