Improve UserPanelTable, moved from useState to handlePopUpOpen

This commit is contained in:
carlosmonastyrski
2025-03-04 16:54:28 -03:00
parent 53f7491441
commit f3786788fd
@@ -32,21 +32,20 @@ import {
} from "@app/hooks/api"; } from "@app/hooks/api";
import { UsePopUpState } from "@app/hooks/usePopUp"; import { UsePopUpState } from "@app/hooks/usePopUp";
const deleteUserUpgradePlanMessage = "Deleting users via Admin UI" const deleteUserUpgradePlanMessage = "Deleting users via Admin UI";
const addServerAdminUpgradePlanMessage = "Granting another user Server Admin permissions" const addServerAdminUpgradePlanMessage = "Granting another user Server Admin permissions";
const UserPanelTable = ({ const UserPanelTable = ({
handlePopUpOpen, handlePopUpOpen
setUpgradePlanMessage
}: { }: {
handlePopUpOpen: ( handlePopUpOpen: (
popUpName: keyof UsePopUpState<["removeUser", "upgradePlan", "upgradeToServerAdmin"]>, popUpName: keyof UsePopUpState<["removeUser", "upgradePlan", "upgradeToServerAdmin"]>,
data?: { data?: {
username: string; username: string;
id: string; id: string;
message?: string;
} }
) => void; ) => void;
setUpgradePlanMessage: (message: string) => void;
}) => { }) => {
const [searchUserFilter, setSearchUserFilter] = useState(""); const [searchUserFilter, setSearchUserFilter] = useState("");
const { user } = useUser(); const { user } = useUser();
@@ -110,8 +109,11 @@ const UserPanelTable = ({
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
if (!subscription?.instanceUserManagement) { if (!subscription?.instanceUserManagement) {
setUpgradePlanMessage(deleteUserUpgradePlanMessage) handlePopUpOpen("upgradePlan", {
handlePopUpOpen("upgradePlan"); username,
id,
message: deleteUserUpgradePlanMessage
});
return; return;
} }
handlePopUpOpen("removeUser", { username, id }); handlePopUpOpen("removeUser", { username, id });
@@ -124,8 +126,11 @@ const UserPanelTable = ({
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
if (!subscription?.instanceUserManagement) { if (!subscription?.instanceUserManagement) {
setUpgradePlanMessage(addServerAdminUpgradePlanMessage) handlePopUpOpen("upgradePlan", {
handlePopUpOpen("upgradePlan"); username,
id,
message: addServerAdminUpgradePlanMessage
});
return; return;
} }
handlePopUpOpen("upgradeToServerAdmin", { username, id }); handlePopUpOpen("upgradeToServerAdmin", { username, id });
@@ -171,8 +176,6 @@ export const UserPanel = () => {
"upgradeToServerAdmin" "upgradeToServerAdmin"
] as const); ] as const);
const [upgradePlanMessage, setUpgradePlanMessage] = useState<string>(deleteUserUpgradePlanMessage)
const { mutateAsync: deleteUser } = useAdminDeleteUser(); const { mutateAsync: deleteUser } = useAdminDeleteUser();
const { mutateAsync: grantAdminAccess } = useAdminGrantServerAdminAccess(); const { mutateAsync: grantAdminAccess } = useAdminGrantServerAdminAccess();
@@ -219,7 +222,7 @@ export const UserPanel = () => {
<div className="mb-4"> <div className="mb-4">
<p className="text-xl font-semibold text-mineshaft-100">Users</p> <p className="text-xl font-semibold text-mineshaft-100">Users</p>
</div> </div>
<UserPanelTable handlePopUpOpen={handlePopUpOpen} setUpgradePlanMessage={setUpgradePlanMessage}/> <UserPanelTable handlePopUpOpen={handlePopUpOpen} />
<DeleteActionModal <DeleteActionModal
isOpen={popUp.removeUser.isOpen} isOpen={popUp.removeUser.isOpen}
deleteKey="remove" deleteKey="remove"
@@ -243,7 +246,7 @@ export const UserPanel = () => {
<UpgradePlanModal <UpgradePlanModal
isOpen={popUp.upgradePlan.isOpen} isOpen={popUp.upgradePlan.isOpen}
onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)} onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
text={`${upgradePlanMessage} is only available on Infisical's Pro plan and above.`} text={`${popUp?.upgradePlan?.data?.message} is only available on Infisical's Pro plan and above.`}
/> />
</div> </div>
); );