diff --git a/static/app/views/settings/organizationIntegrations/installedPlugin.tsx b/static/app/views/settings/organizationIntegrations/installedPlugin.tsx index 21cf87cad4ea7f..e6f4377d59ede5 100644 --- a/static/app/views/settings/organizationIntegrations/installedPlugin.tsx +++ b/static/app/views/settings/organizationIntegrations/installedPlugin.tsx @@ -7,7 +7,6 @@ import { addSuccessMessage, } from 'sentry/actionCreators/indicator'; import type {Client} from 'sentry/api'; -import Access from 'sentry/components/acl/access'; import Confirm from 'sentry/components/confirm'; import {Alert} from 'sentry/components/core/alert'; import {Button, LinkButton} from 'sentry/components/core/button'; @@ -31,6 +30,7 @@ type Props = { projectItem: PluginProjectItem; trackIntegrationAnalytics: (eventKey: IntegrationAnalyticsKey) => void; // analytics callback className?: string; + hasAccess?: boolean; }; class InstalledPlugin extends Component { @@ -120,55 +120,50 @@ class InstalledPlugin extends Component { } render() { - const {className, plugin, organization, projectItem} = this.props; + const {className, plugin, organization, hasAccess, projectItem} = this.props; return ( - - {({hasAccess}) => ( - - - - -
- } - disabled={!hasAccess} - to={`/settings/${organization.slug}/projects/${projectItem.projectSlug}/plugins/${plugin.id}/`} - data-test-id="integration-configure-button" - > - {t('Configure')} - -
-
- this.handleReset()} - message={this.getConfirmMessage()} - > - } - data-test-id="integration-remove-button" - > - {t('Uninstall')} - - -
- - this.toggleEnablePlugin(projectItem.projectId, !projectItem.enabled) - } + + + + +
+ } + to={`/settings/${organization.slug}/projects/${projectItem.projectSlug}/plugins/${plugin.id}/`} + data-test-id="integration-configure-button" + > + {hasAccess ? t('Configure') : t('View')} + +
+
+ this.handleReset()} + message={this.getConfirmMessage()} + > + - - )} - + borderless + icon={} + data-test-id="integration-remove-button" + > + {t('Uninstall')} + + +
+ + this.toggleEnablePlugin(projectItem.projectId, !projectItem.enabled) + } + disabled={!hasAccess} + /> +
); } diff --git a/static/app/views/settings/organizationIntegrations/pluginDetailedView.tsx b/static/app/views/settings/organizationIntegrations/pluginDetailedView.tsx index b4f55ab9591bbe..0b3c518047263d 100644 --- a/static/app/views/settings/organizationIntegrations/pluginDetailedView.tsx +++ b/static/app/views/settings/organizationIntegrations/pluginDetailedView.tsx @@ -2,6 +2,7 @@ import {Fragment, useCallback, useEffect, useMemo} from 'react'; import styled from '@emotion/styled'; import {openModal} from 'sentry/actionCreators/modal'; +import {hasEveryAccess} from 'sentry/components/acl/access'; import ContextPickerModal from 'sentry/components/contextPickerModal'; import {Button} from 'sentry/components/core/button'; import LoadingError from 'sentry/components/loadingError'; @@ -25,6 +26,7 @@ import normalizeUrl from 'sentry/utils/url/normalizeUrl'; import {useNavigate} from 'sentry/utils/useNavigate'; import useOrganization from 'sentry/utils/useOrganization'; import {useParams} from 'sentry/utils/useParams'; +import useProjects from 'sentry/utils/useProjects'; import withOrganization from 'sentry/utils/withOrganization'; import { INSTALLED, @@ -58,6 +60,8 @@ function PluginDetailedView() { const navigate = useNavigate(); const {integrationSlug} = useParams<{integrationSlug: string}>(); + const {projects} = useProjects(); + const {data: plugins, isPending} = useApiQuery( makePluginQueryKey({orgSlug: organization.slug, pluginSlug: integrationSlug}), {staleTime: Infinity, retry: false} @@ -248,6 +252,10 @@ function PluginDetailedView() { key={projectItem.projectId} organization={organization} plugin={plugin} + hasAccess={hasEveryAccess(['project:write'], { + organization, + project: projects.find(p => p.id === projectItem.projectId.toString()), + })} projectItem={projectItem} onResetConfiguration={handleResetConfiguration} onPluginEnableStatusChange={handlePluginEnableStatus} @@ -288,6 +296,7 @@ function PluginDetailedView() { organization, plugin, renderTopButton, + projects, ]); if (isPending) { diff --git a/static/app/views/settings/projectPlugins/projectPluginRow.tsx b/static/app/views/settings/projectPlugins/projectPluginRow.tsx index c3cb2d74c5c7da..5db58dce5f66fc 100644 --- a/static/app/views/settings/projectPlugins/projectPluginRow.tsx +++ b/static/app/views/settings/projectPlugins/projectPluginRow.tsx @@ -58,8 +58,6 @@ class ProjectPluginRow extends PureComponent { return ( {({hasAccess}) => { - const LinkOrSpan = hasAccess ? Link : 'span'; - return ( @@ -84,9 +82,9 @@ class ProjectPluginRow extends PureComponent { {' '} ·{' '} - - {t('Configure plugin')} - + + {hasAccess ? t('Configure plugin') : t('View plugin')} + )}