Sep 24, 2024 · Sep 17, 2024 · Sep 20, 2024 · Sep 20, 2024 · Sep 21, 2024 · Sep 22, 2024
diff --git a/site/src/api/queries/organizations.ts b/site/src/api/queries/organizations.ts
 },
 action: "read",
 },
 viewIdpSyncSettings: {
 object: {
 resource_type: "idpsync_settings",
 organization_id: organizationId,
 },
 action: "read",
 },
 });

 // The endpoint takes a flat array, so to avoid collisions prepend each
diff --git a/site/src/pages/ManagementSettingsPage/IdpSyncPage/IdpSyncPage.tsx b/site/src/pages/ManagementSettingsPage/IdpSyncPage/IdpSyncPage.tsx
 organizationsPermissions,
 roleIdpSyncSettings,
 } from "api/queries/organizations";
 import { ErrorAlert } from "components/Alert/ErrorAlert";
 import { EmptyState } from "components/EmptyState/EmptyState";
 import { FeatureStageBadge } from "components/FeatureStageBadge/FeatureStageBadge";
 import { Loader } from "components/Loader/Loader";
 const { organization: organizationName } = useParams() as {
 organization: string;
 };

 // feature visibility and permissions to be implemented when integrating with backend
 // const feats = useFeatureVisibility();
 // const { organization: organizationName } = useParams() as {
 // organization: string;
 // };
 const { organizations } = useOrganizationSettings();

 const organization = organizations?.find((o) => o.name === organizationName);
 roleIdpSyncSettings(organizationName),
 );

 // const permissions = permissionsQuery.data;

 if (!organization) {
 return <EmptyState message="Organization not found" />;
 }
 return <Loader />;
 }

 const error =
 groupIdpSyncSettingsQuery.error ||
 roleIdpSyncSettingsQuery.error ||
 groupsQuery.error;
 if (
 error ||
 !groupIdpSyncSettingsQuery.data ||
 !roleIdpSyncSettingsQuery.data ||
 !groupsQuery.data
 ) {
 return <ErrorAlert error={error} />;
 }

 return (
 <>
 <Helmet>
diff --git a/site/src/pages/ManagementSettingsPage/IdpSyncPage/IdpSyncPageView.tsx b/site/src/pages/ManagementSettingsPage/IdpSyncPage/IdpSyncPageView.tsx
 import type { Interpolation, Theme } from "@emotion/react";
 import { useTheme } from "@emotion/react";
 import LaunchOutlined from "@mui/icons-material/LaunchOutlined";
 import Button from "@mui/material/Button";
 import Skeleton from "@mui/material/Skeleton";
 roleSyncSettings,
 groups,
 }) => {
 // const theme = useTheme();

 const groupsMap = new Map<string, string>();
 if (groups) {
 for (const group of groups) {
 </Stack>
 </fieldset>
 </Stack>
 {groupSyncSettings?.mapping && roleSyncSettings?.mapping && (
 <div
 css={(theme) => ({
 margin: 0,
 fontSize: 13,
 paddingBottom: 14,
 color: theme.palette.text.secondary,
 "& strong": {
 color: theme.palette.text.primary,
 },
 })}
 >
 Showing{" "}
 <strong>
 {Object.entries(groupSyncSettings?.mapping).length}
 </strong>{" "}
 groups and{" "}
 <strong>
 {Object.entries(roleSyncSettings?.mapping).length}
 </strong>{" "}
 provisioners
 </div>
 )}
 <Stack spacing={6}>
 <IdpMappingTable
 type="Group"
diff --git a/site/src/pages/ManagementSettingsPage/SidebarView.tsx b/site/src/pages/ManagementSettingsPage/SidebarView.tsx
 Provisioners
 </SidebarNavSubItem>
 )}
 {organization.permissions.editMembers && (
 {organization.permissions.viewIdpSyncSettings && (
 <SidebarNavSubItem
 href={urlForSubpage(organization.name, "idp-sync")}
 >
Original file line number	Diff line number	Diff line change
Expand Up		@@ -269,6 +269,13 @@ export const organizationsPermissions = (
		},
		action: "read",
		},
		viewIdpSyncSettings: {
		object: {
		resource_type: "idpsync_settings",
		organization_id: organizationId,
		},
		action: "read",
		},
		});

		// The endpoint takes a flat array, so to avoid collisions prepend each
Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -7,6 +7,7 @@ import {
		organizationsPermissions,
		roleIdpSyncSettings,
		} from "api/queries/organizations";
		import { ErrorAlert } from "components/Alert/ErrorAlert";
		import { EmptyState } from "components/EmptyState/EmptyState";
		import { FeatureStageBadge } from "components/FeatureStageBadge/FeatureStageBadge";
		import { Loader } from "components/Loader/Loader";
Expand All		@@ -27,12 +28,6 @@ export const IdpSyncPage: FC = () => {
		const { organization: organizationName } = useParams() as {
		organization: string;
		};

		// feature visibility and permissions to be implemented when integrating with backend
		// const feats = useFeatureVisibility();
		// const { organization: organizationName } = useParams() as {
		// organization: string;
		// };
		const { organizations } = useOrganizationSettings();

		const organization = organizations?.find((o) => o.name === organizationName);
Expand All		@@ -48,8 +43,6 @@ export const IdpSyncPage: FC = () => {
		roleIdpSyncSettings(organizationName),
		);

		// const permissions = permissionsQuery.data;

		if (!organization) {
		return <EmptyState message="Organization not found" />;
		}
Expand All		@@ -62,6 +55,19 @@ export const IdpSyncPage: FC = () => {
		return <Loader />;
		}

		const error =
		groupIdpSyncSettingsQuery.error \|\|
		roleIdpSyncSettingsQuery.error \|\|
		groupsQuery.error;
		if (
		error \|\|
		!groupIdpSyncSettingsQuery.data \|\|
		!roleIdpSyncSettingsQuery.data \|\|
		!groupsQuery.data
		) {
		return <ErrorAlert error={error} />;
		}

		return (
		<>
		<Helmet>
Expand Down
Original file line number	Diff line number	Diff line change
		@@ -1,5 +1,4 @@
		import type { Interpolation, Theme } from "@emotion/react";
		import { useTheme } from "@emotion/react";
		import LaunchOutlined from "@mui/icons-material/LaunchOutlined";
		import Button from "@mui/material/Button";
		import Skeleton from "@mui/material/Skeleton";
Expand DownExpand Up		@@ -39,8 +38,6 @@ export const IdpSyncPageView: FC<IdpSyncPageViewProps> = ({
		roleSyncSettings,
		groups,
		}) => {
		// const theme = useTheme();

		const groupsMap = new Map<string, string>();
		if (groups) {
		for (const group of groups) {
Expand DownExpand Up		@@ -101,6 +98,29 @@ export const IdpSyncPageView: FC<IdpSyncPageViewProps> = ({
		</Stack>
		</fieldset>
		</Stack>
		{groupSyncSettings?.mapping && roleSyncSettings?.mapping && (
		<div
		css={(theme) => ({
		margin: 0,
		fontSize: 13,
		paddingBottom: 14,
		color: theme.palette.text.secondary,
		"& strong": {
		color: theme.palette.text.primary,
		},
		})}
		>
		Showing{" "}
		<strong>
		{Object.entries(groupSyncSettings?.mapping).length}
		</strong>{" "}
		groups and{" "}
		<strong>
		{Object.entries(roleSyncSettings?.mapping).length}
		</strong>{" "}
		provisioners
		</div>
		)}
		<Stack spacing={6}>
		<IdpMappingTable
		type="Group"
Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -297,7 +297,7 @@ const OrganizationSettingsNavigation: FC<
		Provisioners
		</SidebarNavSubItem>
		)}
		{organization.permissions.editMembers && (
		{organization.permissions.viewIdpSyncSettings && (
		<SidebarNavSubItem
		href={urlForSubpage(organization.name, "idp-sync")}
		>
Expand Down