Modals and API calls working for admin tab

src/ui/account/AccountsLoader.tsx

@@ -0,0 +1,45 @@
+import PrimaryButton from "@/components/button/PrimaryButton";
+import { useGetAccounts } from "@/hooks/AccountHooks";
+import { useState } from "react";
+import AccountsList from "./AccountsList";
+import AccountsListSkeleton from "./AccountsListSkeleton";
+import AccountModal from "./modals/AccountModal";
+
+
+export default function AccountsLoader(){
+	const [ displayCreateAccountModal, setDisplayCreateAccountModal ] = useState(false);
+
+	const accountsQuery = useGetAccounts(0, 20);
+
+
+	if(accountsQuery.isLoading){
+		return <AccountsListSkeleton/>
+	}
+	else if(accountsQuery.isError){
+		//TODO:
+		return <div>Error: {accountsQuery.error.message}</div>
+	}
+	else{
+		return (
+			<>
+				{/* TODO: Add Account Button */}
+				<PrimaryButton
+					className="mb-8"
+					onClick={() => setDisplayCreateAccountModal(true)}
+				>
+					Create Account
+				</PrimaryButton>
+				<AccountModal
+					display={displayCreateAccountModal}
+					close={() => setDisplayCreateAccountModal(false)}
+					account={undefined}
+				/>
+				{/* Account Search Bar */}
+				<AccountsList
+					accounts={accountsQuery.data ?? []}
+				/>
+				{/* TODO: Add Pagination */}
+			</>
+		);
+	}
+}