Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[RFC] Add GitLab auth #5594

Closed
wants to merge 29 commits into from
Closed
Show file tree
Hide file tree
Changes from 10 commits
Commits
Show all changes
29 commits
Select commit Hold shift + click to select a range
0dc385e
initial commit, framing in mattermost
jordanh Oct 16, 2021
99e4b43
feature complete
jordanh Oct 16, 2021
f91cffb
self-review fixups
jordanh Oct 20, 2021
e8ba78c
review changes
jordanh Oct 26, 2021
fb0bfd5
remove autofocus
jordanh Oct 26, 2021
e575a8b
Majority of Maintainer review fixups
jordanh Nov 2, 2021
40f8fec
refactor: add userId to MattermostAuth
jordanh Nov 2, 2021
49b363c
better scheduled jobs types
mattkrick Nov 5, 2021
1577aa6
address @mattkrick 2nd review comments
jordanh Nov 9, 2021
298dc22
Refactor Mattermost, add GitLab w/new auth scheme
jordanh Oct 16, 2021
9352749
remove notifyMattermost okResponse
jordanh Nov 12, 2021
b9a6fe5
refactor/rename field names
jordanh Nov 12, 2021
450baf3
self-review fixups
jordanh Nov 12, 2021
64c5db9
Merge branch master into add-mattermost
mattkrick Nov 16, 2021
a75833f
Merge branch 'master' into add-mattermost
jordanh Dec 3, 2021
adc7cef
maintainer review round 3 fixups
jordanh Dec 3, 2021
89f97d6
Webpack updates for server image assets
jordanh Dec 6, 2021
841afb8
fixed small nits
jordanh Dec 6, 2021
cedec5f
Merge branch 'add-mattermost' into add-gitlab-auth
jordanh Dec 6, 2021
e47d6ba
Merge branch 'master' into add-gitlab-auth
BartoszJarocki Dec 13, 2021
55a8ba1
fix: removed not needed mattermost queries
BartoszJarocki Dec 13, 2021
5fbfeae
fix: removed not needed mattermost queries
BartoszJarocki Dec 13, 2021
627a11c
fix: added integration auth loaders to CustomLoaderMakers
BartoszJarocki Dec 13, 2021
74bad44
fix: mattermost provider row missing variables
BartoszJarocki Dec 13, 2021
94ff90a
fix: various merge fixes, type improvements
BartoszJarocki Dec 13, 2021
59eaa56
fix: mattermost panel component types
BartoszJarocki Dec 13, 2021
4e05e68
refactor: lowercase integration provider enums, various fixes
BartoszJarocki Dec 14, 2021
94479be
Re-added mattermost webhook validation
jordanh Dec 15, 2021
130c02c
Merge branch 'master' into add-gitlab-auth
BartoszJarocki Dec 20, 2021
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 11 additions & 10 deletions codegen.json
Original file line number Diff line number Diff line change
@@ -1,16 +1,17 @@
{
"schema": "packages/server/utils/githubSchema.graphql",
"documents": "packages/server/utils/githubQueries/*.graphql",
"config": {
"content": "// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-nocheck"
},
"generates": {
"packages/server/types/githubTypes.ts": {
"plugins": [
"typescript",
"typescript-operations",
"add"
],
"config": {
"content": "// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-nocheck"
}
"schema": "packages/server/utils/githubSchema.graphql",
"documents": "packages/server/utils/githubQueries/*.graphql",
"plugins": ["typescript", "typescript-operations", "add"]
},
"packages/server/types/gitlabTypes.ts": {
"schema": "packages/server/graphql/nestedSchema/GitLab/gitlabSchema.graphql",
"documents": "packages/server/graphql/nestedSchema/GitLab/queries/*.graphql",
"plugins": ["typescript", "typescript-operations", "add"]
}
}
}
10 changes: 10 additions & 0 deletions packages/client/components/GitLabProviderLogo.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import styled from '@emotion/styled'
import logo from '../styles/theme/images/graphics/gitlab-icon-rgb.svg'

const GitLabProviderLogo = styled('div')({
background: `url("${logo}")`,
height: 48,
width: 48
})

export default GitLabProviderLogo
39 changes: 39 additions & 0 deletions packages/client/components/GitLabSVG.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import React from 'react'

const GitLabSVG = React.memo(() => {
return (
<svg
version='1.1'
width='24'
height='24'
viewBox='0 0 24 24'
xmlns='http://www.w3.org/2000/svg'
>
<g transform='matrix(1.3333 0 0 -1.3333 0 745.33)'>
<g transform='matrix(.0053314 0 0 .0053314 -6.6229 535.81)'>
<path d='m2930.3 1240.2 621.99 1913.2h-1243.1l621.08-1913.2' fill='#e33426' />
<path
d='m1438 3153.4-189.42-581.26c-17.13-52.78 1.37-111.04 46.61-143.94l1635.1-1188-1492.3 1913.2'
fill='#f79818'
/>
<path
d='m1438 3153.4h871.2l-374.94 1152.2c-19.19 58.95-102.82 58.95-122.7 0l-373.56-1152.2'
fill='#e33426'
/>
<path
d='m4423.5 3153.4 188.72-581.26c17.14-52.78-1.37-111.04-46.61-143.94l-1635.3-1188 1493.2 1913.2'
fill='#f79818'
/>
<path
d='m4423.5 3153.4h-871.21l374.25 1152.2c19.2 58.95 102.82 58.95 122.7 0l374.26-1152.2'
fill='#e33426'
/>
<path d='m2930.3 1240.2 621.99 1913.2h871.21z' fill='#f25923' />
<path d='m2930.3 1240.2-1492.3 1913.2h871.2z' fill='#f25923' />
</g>
</g>
</svg>
)
})

export default GitLabSVG
11 changes: 11 additions & 0 deletions packages/client/components/MattermostProviderLogo.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import styled from '@emotion/styled'
import logo from '../styles/theme/images/graphics/mattermost.svg'

const MattermostProviderLogo = styled('div')({
background: `url("${logo}")`,
height: 48,
width: 48,
backgroundSize: 'contain'
})

export default MattermostProviderLogo
28 changes: 28 additions & 0 deletions packages/client/components/MattermostSVG.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import React from 'react'

const MattermostSVG = React.memo(() => {
return (
<svg
width='24'
height='24'
viewBox='0 0 700 700'
fill='none'
xmlns='http://www.w3.org/2000/svg'
>
<path
fillRule='evenodd'
clipRule='evenodd'
d='M496.909 147.716L499.54 200.779C542.559 248.303 559.539 315.609 538.125 378.865C506.159 473.292 400.753 522.93 302.694 489.735C204.635 456.54 151.057 353.081 183.023 258.653C204.508 195.186 259.171 151.953 322.48 140.505L356.685 100.091C249.969 97.2018 149.288 163.442 113.265 269.853C69.0048 400.598 139.114 542.468 269.859 586.729C400.604 630.99 542.474 560.88 586.735 430.135C622.7 323.895 583.148 210.308 496.909 147.716Z'
fill='#222222'
/>
<path
fillRule='evenodd'
clipRule='evenodd'
d='M435.623 304.289L433.812 230.109L432.359 187.424L431.376 150.444C431.376 150.444 431.581 132.612 430.959 128.422C430.828 127.54 430.551 126.822 430.221 126.196C430.18 126.108 430.141 126.02 430.096 125.934C430.049 125.854 430.003 125.78 429.954 125.705C429.27 124.528 428.195 123.572 426.804 123.101C425.381 122.619 423.909 122.738 422.631 123.29C422.604 123.3 422.579 123.309 422.552 123.32C422.4 123.388 422.255 123.465 422.109 123.546C421.503 123.841 420.887 124.223 420.284 124.808C417.244 127.758 406.575 142.048 406.575 142.048L383.331 170.826L356.248 203.851L309.749 261.677C309.749 261.677 288.411 288.308 293.126 321.088C297.841 353.868 322.211 369.837 341.117 376.238C360.023 382.638 389.082 384.756 412.74 361.581C436.396 338.405 435.623 304.289 435.623 304.289Z'
fill='#222222'
/>
</svg>
)
})

export default MattermostSVG
36 changes: 28 additions & 8 deletions packages/client/components/StageTimerModalEndTimeSlackToggle.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,6 @@ const ButtonRow = styled(PlainButton)({
alignItems: 'center',
display: 'flex',
justifyContent: 'space-between',
paddingBottom: 8,
width: '100%'
})

Expand All @@ -34,6 +33,14 @@ const Label = styled('div')({
userSelect: 'none'
})

const Note = styled('div')({
fontSize: 12,
fontStyle: 'italic',
padding: '8px 0 8px 0px',
textAlign: 'center',
userSelect: 'none'
})

const StyledCheckbox = styled(Checkbox)({
fontSize: ICON_SIZE.MD18,
marginRight: 8,
Expand All @@ -44,13 +51,18 @@ const StyledCheckbox = styled(Checkbox)({

const Block = styled('div')({
display: 'flex',
flexDirection: 'column'
flexDirection: 'column',
width: '100%'
})

const StyledNotificationErrorMessage = styled(NotificationErrorMessage)({
paddingBottom: 8
})

const StageTimerModalEndTimeSlackToggle = (props: Props) => {
const {facilitator} = props
const {integrations, teamId} = facilitator
const {slack} = integrations
const {mattermost, slack} = integrations
const notifications = slack?.notifications ?? []
const timeLimitEvent = notifications.find(
(notification) => notification.event === 'MEETING_STAGE_TIME_LIMIT_START'
Expand All @@ -60,6 +72,8 @@ const StageTimerModalEndTimeSlackToggle = (props: Props) => {
const mutationProps = useMutationProps()
const {onError, onCompleted, submitMutation, error, submitting} = mutationProps

const noActiveIntegrations = !slack?.isActive && !mattermost?.isActive

const onClick = () => {
if (slack?.isActive) {
if (submitting) return
Expand All @@ -77,11 +91,14 @@ const StageTimerModalEndTimeSlackToggle = (props: Props) => {
}
return (
<Block>
<ButtonRow onClick={onClick}>
<StyledCheckbox active={slackToggleActive} />
<Label>{'Notify team via Slack'}</Label>
</ButtonRow>
<NotificationErrorMessage error={error} />
{(slack?.isActive || noActiveIntegrations) && (
<ButtonRow onClick={onClick}>
<StyledCheckbox active={slackToggleActive} />
<Label>{'Notify team via Slack'}</Label>
</ButtonRow>
)}
{mattermost?.isActive && <Note>{'Notifying via Mattermost'}</Note>}
<StyledNotificationErrorMessage error={error} />
</Block>
)
}
Expand All @@ -91,6 +108,9 @@ export default createFragmentContainer(StageTimerModalEndTimeSlackToggle, {
fragment StageTimerModalEndTimeSlackToggle_facilitator on TeamMember {
teamId
integrations {
mattermost {
isActive
}
slack {
isActive
defaultTeamChannelId
Expand Down
21 changes: 15 additions & 6 deletions packages/client/hooks/useMenu.ts
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,15 @@ const useMenu = <T extends HTMLElement = HTMLButtonElement>(
if (originCoords) {
;(originRef as any).current = {getBoundingClientRect: () => originCoords} as RectElement
}
const {portal, closePortal, togglePortal, portalStatus, setPortalStatus, openPortal} = usePortal({
const {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Changes here are only to return terminatePortal so it may be used

portal,
closePortal,
openPortal,
portalStatus,
terminatePortal,
togglePortal,
setPortalStatus
} = usePortal({
id,
onOpen,
onClose,
Expand All @@ -57,14 +65,15 @@ const useMenu = <T extends HTMLElement = HTMLButtonElement>(
)
const menuProps = {portalStatus, closePortal, isDropdown}
return {
togglePortal,
originRef,
menuPortal,
menuProps,
loadingDelay,
loadingWidth,
menuPortal,
menuProps,
openPortal,
originRef,
portalStatus,
openPortal
terminatePortal,
togglePortal
}
}

Expand Down
3 changes: 2 additions & 1 deletion packages/client/modules/demo/DemoUser.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@ export default class DemoUser {
createdAt = new Date().toJSON()
email: string
featureFlags = {
jira: false
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I presume it is ok to remove this flag of yesteryear...

gitlab: false,
video: false
}
facilitatorUserId: string
facilitatorName: string
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ import graphql from 'babel-plugin-relay/macro'
import SettingsWrapper from '../../../../components/Settings/SettingsWrapper'
import AtlassianProviderRow from '../ProviderRow/AtlassianProviderRow'
import GitHubProviderRow from '../ProviderRow/GitHubProviderRow'
import GitLabProviderRow from '../ProviderRow/GitLabProviderRow'
import MattermostProviderRow from '../ProviderRow/MattermostProviderRow'
import SlackProviderRow from '../ProviderRow/SlackProviderRow'

interface Props {
Expand All @@ -20,10 +22,15 @@ const StyledWrapper = styled(SettingsWrapper)({

const ProviderList = (props: Props) => {
const {viewer, retry, teamId} = props
const {
featureFlags: {gitlab: allowGitlab}
} = viewer
return (
<StyledWrapper>
<AtlassianProviderRow teamId={teamId} retry={retry} viewer={viewer} />
<GitHubProviderRow teamId={teamId} viewer={viewer} />
{allowGitlab && <GitLabProviderRow teamId={teamId} viewerRef={viewer} />}
<MattermostProviderRow teamId={teamId} viewerRef={viewer} />
<SlackProviderRow teamId={teamId} viewer={viewer} />
</StyledWrapper>
)
Expand All @@ -34,7 +41,13 @@ export default createFragmentContainer(ProviderList, {
fragment ProviderList_viewer on User {
...AtlassianProviderRow_viewer
...GitHubProviderRow_viewer
...GitLabProviderRow_viewer
...MattermostProviderRow_viewer
...SlackProviderRow_viewer

featureFlags {
gitlab
}
}
`
})
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
import React from 'react'
import useAtmosphere from '../../../../hooks/useAtmosphere'
import {MenuProps} from '../../../../hooks/useMenu'
import {MenuMutationProps} from '../../../../hooks/useMutationProps'
import RemoveIntegrationTokenMutation from '../../../../mutations/RemoveIntegrationTokenMutation'
import Menu from '../../../../components/Menu'
import MenuItem from '../../../../components/MenuItem'

interface Props {
menuProps: MenuProps
mutationProps: MenuMutationProps
providerId: string
teamId: string
terminatePortal: () => void
}

const GitLabConfigMenu = (props: Props) => {
const {menuProps, mutationProps, providerId, teamId, terminatePortal} = props
const {onError, onCompleted, submitMutation, submitting} = mutationProps
const atmosphere = useAtmosphere()

const removeGitLabAuth = () => {
if (submitting) return
submitMutation()
RemoveIntegrationTokenMutation(atmosphere, {providerId, teamId}, {onCompleted, onError})
// Our parent component does not unmount, and it often re-renders before the CSS menu transition
// can complete. We nuke the portal here to ensure the menu is closed.
terminatePortal()
}
return (
<Menu ariaLabel={'Configure your Mattermost integration'} {...menuProps}>
<MenuItem label='Remove Mattermost' onClick={removeGitLabAuth} />
</Menu>
)
}

export default GitLabConfigMenu
Loading