permissionsObserver.tsx 2.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. import {Component, Fragment} from 'react';
  2. import Panel from 'sentry/components/panels/panel';
  3. import PanelBody from 'sentry/components/panels/panelBody';
  4. import PanelHeader from 'sentry/components/panels/panelHeader';
  5. import {t} from 'sentry/locale';
  6. import {Permissions, Scope, WebhookEvent} from 'sentry/types';
  7. import {toResourcePermissions} from 'sentry/utils/consolidatedScopes';
  8. import PermissionSelection from 'sentry/views/settings/organizationDeveloperSettings/permissionSelection';
  9. import Subscriptions from 'sentry/views/settings/organizationDeveloperSettings/resourceSubscriptions';
  10. type DefaultProps = {
  11. appPublished: boolean;
  12. webhookDisabled: boolean;
  13. };
  14. type Props = DefaultProps & {
  15. events: WebhookEvent[];
  16. scopes: Scope[];
  17. };
  18. type State = {
  19. events: WebhookEvent[];
  20. permissions: Permissions;
  21. };
  22. export default class PermissionsObserver extends Component<Props, State> {
  23. static defaultProps: DefaultProps = {
  24. webhookDisabled: false,
  25. appPublished: false,
  26. };
  27. constructor(props: Props) {
  28. super(props);
  29. this.state = {
  30. permissions: this.scopeListToPermissionState(),
  31. events: this.props.events,
  32. };
  33. }
  34. /**
  35. * Converts the list of raw API scopes passed in to an object that can
  36. * before stored and used via `state`. This object is structured by
  37. * resource and holds "Permission" values. For example:
  38. *
  39. * {
  40. * 'Project': 'read',
  41. * ...,
  42. * }
  43. *
  44. */
  45. scopeListToPermissionState() {
  46. return toResourcePermissions(this.props.scopes);
  47. }
  48. onPermissionChange = (permissions: Permissions) => {
  49. this.setState({permissions});
  50. };
  51. onEventChange = (events: WebhookEvent[]) => {
  52. this.setState({events});
  53. };
  54. render() {
  55. const {permissions, events} = this.state;
  56. return (
  57. <Fragment>
  58. <Panel>
  59. <PanelHeader>{t('Permissions')}</PanelHeader>
  60. <PanelBody>
  61. <PermissionSelection
  62. permissions={permissions}
  63. onChange={this.onPermissionChange}
  64. appPublished={this.props.appPublished}
  65. />
  66. </PanelBody>
  67. </Panel>
  68. <Panel>
  69. <PanelHeader>{t('Webhooks')}</PanelHeader>
  70. <PanelBody>
  71. <Subscriptions
  72. permissions={permissions}
  73. events={events}
  74. onChange={this.onEventChange}
  75. webhookDisabled={this.props.webhookDisabled}
  76. />
  77. </PanelBody>
  78. </Panel>
  79. </Fragment>
  80. );
  81. }
  82. }