= [
{
key: 'user_profile_picture',
@@ -106,7 +113,7 @@ export function Invites(): JSX.Element {
title: '',
key: 'actions',
width: 24,
- render: makeActionsComponent(deleteInvite),
+ render: !restrictionReason ? makeActionsComponent(deleteInvite) : undefined,
},
]
diff --git a/frontend/src/scenes/settings/organization/OrgDisplayName.tsx b/frontend/src/scenes/settings/organization/OrgDisplayName.tsx
index 1aa82e493e4b0..611f8ed05e043 100644
--- a/frontend/src/scenes/settings/organization/OrgDisplayName.tsx
+++ b/frontend/src/scenes/settings/organization/OrgDisplayName.tsx
@@ -29,13 +29,15 @@ export function OrganizationDisplayName(): JSX.Element {
updateOrganization({ name })
}}
disabledReason={
- !name
+ restrictionReason
+ ? restrictionReason
+ : !name
? 'You must provide a name'
: !currentOrganization
? 'Organization not loaded'
: currentOrganization.name === name
? 'Name unchanged'
- : restrictionReason
+ : undefined
}
loading={currentOrganizationLoading}
>
diff --git a/frontend/src/scenes/settings/organization/OrgLogo.tsx b/frontend/src/scenes/settings/organization/OrgLogo.tsx
index 56cd3ac5993e8..8ca8a22b67960 100644
--- a/frontend/src/scenes/settings/organization/OrgLogo.tsx
+++ b/frontend/src/scenes/settings/organization/OrgLogo.tsx
@@ -34,6 +34,7 @@ export function OrganizationLogo(): JSX.Element {
onChange={setFilesToUpload}
loading={uploading}
value={filesToUpload}
+ disabled={!!restrictionReason}
callToAction={
<>
@@ -76,11 +77,13 @@ export function OrganizationLogo(): JSX.Element {
updateOrganization({ logo_media_id: logoMediaId })
}}
disabledReason={
- !currentOrganization
+ restrictionReason
+ ? restrictionReason
+ : !currentOrganization
? 'Organization not loaded'
: logoMediaId === currentOrganization.logo_media_id
? 'Logo unchanged'
- : restrictionReason
+ : undefined
}
loading={currentOrganizationLoading || uploading}
>
diff --git a/frontend/src/scenes/settings/organization/OrganizationDangerZone.tsx b/frontend/src/scenes/settings/organization/OrganizationDangerZone.tsx
index 33b90a257646d..1d68d92b8a93b 100644
--- a/frontend/src/scenes/settings/organization/OrganizationDangerZone.tsx
+++ b/frontend/src/scenes/settings/organization/OrganizationDangerZone.tsx
@@ -1,7 +1,7 @@
import { IconTrash } from '@posthog/icons'
import { LemonButton, LemonInput, LemonModal } from '@posthog/lemon-ui'
import { useActions, useValues } from 'kea'
-import { useRestrictedArea } from 'lib/components/RestrictedArea'
+import { RestrictionScope, useRestrictedArea } from 'lib/components/RestrictedArea'
import { OrganizationMembershipLevel } from 'lib/constants'
import { Dispatch, SetStateAction, useState } from 'react'
import { organizationLogic } from 'scenes/organizationLogic'
@@ -67,7 +67,11 @@ export function DeleteOrganizationModal({
export function OrganizationDangerZone(): JSX.Element {
const { currentOrganization } = useValues(organizationLogic)
const [isModalVisible, setIsModalVisible] = useState(false)
- const restrictionReason = useRestrictedArea({ minimumAccessLevel: OrganizationMembershipLevel.Admin })
+
+ const restrictionReason = useRestrictedArea({
+ minimumAccessLevel: OrganizationMembershipLevel.Owner,
+ scope: RestrictionScope.Organization,
+ })
return (
<>
diff --git a/frontend/src/scenes/settings/organization/Permissions/PermissionsGrid.tsx b/frontend/src/scenes/settings/organization/Permissions/PermissionsGrid.tsx
index 7c4aee4123bcb..b7fc0caf8579a 100644
--- a/frontend/src/scenes/settings/organization/Permissions/PermissionsGrid.tsx
+++ b/frontend/src/scenes/settings/organization/Permissions/PermissionsGrid.tsx
@@ -2,7 +2,7 @@ import { IconInfo } from '@posthog/icons'
import { LemonButton, LemonCheckbox, LemonTable } from '@posthog/lemon-ui'
import { useActions, useValues } from 'kea'
import { PayGateMini } from 'lib/components/PayGateMini/PayGateMini'
-import { useRestrictedArea } from 'lib/components/RestrictedArea'
+import { RestrictionScope, useRestrictedArea } from 'lib/components/RestrictedArea'
import { TitleWithIcon } from 'lib/components/TitleWithIcon'
import { OrganizationMembershipLevel } from 'lib/constants'
import { LemonTableColumns } from 'lib/lemon-ui/LemonTable'
@@ -22,7 +22,11 @@ export function PermissionsGrid(): JSX.Element {
const { roles, rolesLoading } = useValues(rolesLogic)
const { setRoleInFocus, openCreateRoleModal } = useActions(rolesLogic)
const { isAdminOrOwner } = useValues(organizationLogic)
- const restrictionReason = useRestrictedArea({ minimumAccessLevel: OrganizationMembershipLevel.Admin }) // TODO: check if this is correct
+
+ const restrictionReason = useRestrictedArea({
+ minimumAccessLevel: OrganizationMembershipLevel.Admin,
+ scope: RestrictionScope.Organization,
+ })
const columns: LemonTableColumns = [
{
@@ -107,17 +111,24 @@ export function PermissionsGrid(): JSX.Element {
Edit organizational default permission levels for PostHog resources. Use roles to apply
permissions to specific sets of users.
- {!restrictionReason && (
-
- Create role
-
- )}