Use old permission for old pages

Originally I thought I should update these to use the org-based permissions query but I think maybe I should scope my changes to just the multi-org settings page and leave the old pages alone for now.
coder · code-asher · Aug 6, 2024 · Jul 30, 2024 · Jul 30, 2024 · Jul 30, 2024
commit 0b4b00b4adb5ae4846fcce8b9d1cdbd1072adcb3
diff --git a/site/src/contexts/auth/permissions.tsx b/site/src/contexts/auth/permissions.tsx
@@ -15,6 +15,7 @@ export const checks = {
   createOrganization: "createOrganization",
   editAnyOrganization: "editAnyOrganization",
   viewAnyGroup: "viewAnyGroup",
+  createGroup: "createGroup",
   viewAllLicenses: "viewAllLicenses",
 } as const;
 
@@ -118,6 +119,12 @@ export const permissionsToCheck = {
     },
     action: "read",
   },
+  [checks.createGroup]: {
+    object: {
+      resource_type: "group",
+    },
+    action: "create",
+  },
   [checks.viewAllLicenses]: {
     object: {
       resource_type: "license",

diff --git a/site/src/pages/GroupsPage/GroupsPage.tsx b/site/src/pages/GroupsPage/GroupsPage.tsx
@@ -3,20 +3,16 @@ import { Helmet } from "react-helmet-async";
 import { useQuery } from "react-query";
 import { getErrorMessage } from "api/errors";
 import { groups } from "api/queries/groups";
-import { organizationPermissions } from "api/queries/organizations";
 import { displayError } from "components/GlobalSnackbar/utils";
-import { Loader } from "components/Loader/Loader";
-import { useDashboard } from "modules/dashboard/useDashboard";
+import { useAuthenticated } from "contexts/auth/RequireAuth";
 import { useFeatureVisibility } from "modules/dashboard/useFeatureVisibility";
 import { pageTitle } from "utils/page";
 import GroupsPageView from "./GroupsPageView";
 
 export const GroupsPage: FC = () => {
-  const { organizations } = useDashboard();
+  const { permissions } = useAuthenticated();
   const { template_rbac: isTemplateRBACEnabled } = useFeatureVisibility();
-  const organization = organizations.find((o) => o.is_default);
   const groupsQuery = useQuery(groups("default"));
-  const permissionsQuery = useQuery(organizationPermissions(organization?.id));
 
   useEffect(() => {
     if (groupsQuery.error) {
@@ -26,19 +22,6 @@ export const GroupsPage: FC = () => {
     }
   }, [groupsQuery.error]);
 
-  useEffect(() => {
-    if (permissionsQuery.error) {
-      displayError(
-        getErrorMessage(permissionsQuery.error, "Unable to load permissions."),
-      );
-    }
-  }, [permissionsQuery.error]);
-
-  const permissions = permissionsQuery.data;
-  if (!permissions) {
-    return <Loader />;
-  }
-
   return (
     <>
       <Helmet>

diff --git a/site/src/pages/UsersPage/UsersLayout.tsx b/site/src/pages/UsersPage/UsersLayout.tsx
@@ -2,14 +2,12 @@ import GroupAdd from "@mui/icons-material/GroupAddOutlined";
 import PersonAdd from "@mui/icons-material/PersonAddOutlined";
 import Button from "@mui/material/Button";
 import { type FC, Suspense } from "react";
-import { useQuery } from "react-query";
 import {
   Link as RouterLink,
   Outlet,
   useNavigate,
   useLocation,
 } from "react-router-dom";
-import { organizationPermissions } from "api/queries/organizations";
 import { Loader } from "components/Loader/Loader";
 import { Margins } from "components/Margins/Margins";
 import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader";
@@ -21,13 +19,11 @@ import { linkToUsers } from "modules/navigation";
 
 export const UsersLayout: FC = () => {
   const { permissions } = useAuthenticated();
-  const { experiments, organizations } = useDashboard();
+  const { experiments } = useDashboard();
   const navigate = useNavigate();
   const feats = useFeatureVisibility();
   const location = useLocation();
   const activeTab = location.pathname.endsWith("groups") ? "groups" : "users";
-  const organization = organizations.find((o) => o.is_default);
-  const permissionsQuery = useQuery(organizationPermissions(organization?.id));
 
   const canViewOrganizations =
     feats.multiple_organizations && experiments.includes("multi-organization");
@@ -48,7 +44,7 @@ export const UsersLayout: FC = () => {
                   Create user
                 </Button>
               )}
-              {permissionsQuery.data?.createGroup && feats.template_rbac && (
+              {permissions.createGroup && feats.template_rbac && (
                 <Button
                   component={RouterLink}
                   startIcon={<GroupAdd />}

diff --git a/site/src/testHelpers/entities.ts b/site/src/testHelpers/entities.ts
@@ -2499,6 +2499,7 @@ export const MockPermissions: Permissions = {
   createOrganization: true,
   editAnyOrganization: true,
   viewAnyGroup: true,
+  createGroup: true,
   viewAllLicenses: true,
 };