diff --git a/pkgs/ui/src/components/dashboard/quickActions/index.tsx b/pkgs/ui/src/components/dashboard/quickActions/index.tsx
index b303e9a46..1340007db 100644
--- a/pkgs/ui/src/components/dashboard/quickActions/index.tsx
+++ b/pkgs/ui/src/components/dashboard/quickActions/index.tsx
@@ -48,7 +48,7 @@ export const QuickActions = () => {
{actions.map(({ id, icon, label, eventHandler }) => (
= {
+ [P in K]?: T;
};
-type Filters = Filter[];
-type MachineContextType =
- | {
- rawData: AxiosResponse | undefined;
- data: Machine[];
- isLoading: boolean;
- flakeName: string;
- error: AxiosError | undefined;
- isValidating: boolean;
+export type MachineFilter = PartialRecord<
+ keyof Machine,
+ Machine[keyof Machine]
+>;
- filters: Filters;
- setFilters: Dispatch>;
- mutate: KeyedMutator>;
- swrKey: string | false | Record;
- }
- | {
- isLoading: true;
- data: readonly [];
- };
+type MachineContextType = {
+ rawData: AxiosResponse | undefined;
+ data: Machine[];
+ isLoading: boolean;
+ error: AxiosError | undefined;
+ isValidating: boolean;
-const initialState = {
- isLoading: true,
- data: [],
-} as const;
+ filters: MachineFilter;
+ setFilters: Dispatch>;
+ mutate: KeyedMutator>;
+ swrKey: string | false | Record;
+};
export function CreateMachineContext() {
- return createContext({
- ...initialState,
- });
+ return createContext({} as MachineContextType);
}
interface MachineContextProviderProps {
children: ReactNode;
- flakeName: string;
+ clanDir: string;
}
const MachineContext = CreateMachineContext();
export const MachineContextProvider = (props: MachineContextProviderProps) => {
- const { children, flakeName } = props;
+ const { children, clanDir } = props;
const {
data: rawData,
isLoading,
@@ -65,18 +57,27 @@ export const MachineContextProvider = (props: MachineContextProviderProps) => {
isValidating,
mutate,
swrKey,
- } = useListMachines({ flake_dir: flakeName });
- const [filters, setFilters] = useState([]);
+ } = useListMachines({ flake_dir: clanDir });
+
+ const [filters, setFilters] = useState({});
+
+ useEffect(() => {
+ if (error) {
+ clanErrorToast(error);
+ }
+ }, [error]);
const data = useMemo(() => {
- if (!isLoading && !error && !isValidating && rawData) {
+ if (!isLoading && rawData) {
const { machines } = rawData.data;
- return machines.filter((m) =>
- filters.every((f) => m[f.name] === f.value),
+ return machines.filter(
+ (m) =>
+ !filters.name ||
+ m.name.toLowerCase().includes(filters.name.toLowerCase()),
);
}
return [];
- }, [isLoading, error, isValidating, rawData, filters]);
+ }, [isLoading, filters, rawData]);
return (
{
data,
isLoading,
- flakeName,
+
error,
isValidating,
diff --git a/pkgs/ui/src/components/sidebar/index.tsx b/pkgs/ui/src/components/sidebar/index.tsx
index 8e801f09d..4f87c8ef5 100644
--- a/pkgs/ui/src/components/sidebar/index.tsx
+++ b/pkgs/ui/src/components/sidebar/index.tsx
@@ -13,13 +13,10 @@ import { ReactNode } from "react";
import { tw } from "@/utils/tailwind";
import AppsIcon from "@mui/icons-material/Apps";
import BackupIcon from "@mui/icons-material/Backup";
-import DashboardIcon from "@mui/icons-material/Dashboard";
-import DesignServicesIcon from "@mui/icons-material/DesignServices";
-import DevicesIcon from "@mui/icons-material/Devices";
-import LanIcon from "@mui/icons-material/Lan";
-import Link from "next/link";
-
import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
+import DashboardIcon from "@mui/icons-material/Dashboard";
+import DevicesIcon from "@mui/icons-material/Devices";
+import Link from "next/link";
type MenuEntry = {
icon: ReactNode;
@@ -49,24 +46,24 @@ const menuEntries: MenuEntry[] = [
to: "/applications",
disabled: true,
},
- {
- icon: ,
- label: "Network",
- to: "/network",
- disabled: true,
- },
- {
- icon: ,
- label: "Templates",
- to: "/templates",
- disabled: false,
- },
{
icon: ,
label: "Backups",
to: "/backups",
disabled: true,
},
+ // {
+ // icon: ,
+ // label: "Network",
+ // to: "/network",
+ // disabled: true,
+ // },
+ // {
+ // icon: ,
+ // label: "Templates",
+ // to: "/templates",
+ // disabled: false,
+ // },
];
const hideSidebar = tw`-translate-x-14 lg:-translate-x-64`;
@@ -75,38 +72,35 @@ const showSidebar = tw`lg:translate-x-0`;
interface SidebarProps {
show: boolean;
onClose: () => void;
- clanSelect: React.ReactNode;
}
export function Sidebar(props: SidebarProps) {
- const { show, onClose, clanSelect } = props;
+ const { show, onClose } = props;
return (