-
Notifications
You must be signed in to change notification settings - Fork 52
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: implemented an ability to reject the authorisation opt-out flag
Signed-off-by: Oleksii Orel <[email protected]>
- Loading branch information
Showing
10 changed files
with
537 additions
and
140 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
129 changes: 129 additions & 0 deletions
129
packages/dashboard-frontend/src/pages/UserPreferences/GitServicesTab/ProviderIcon/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,129 @@ | ||
/* | ||
* Copyright (c) 2018-2023 Red Hat, Inc. | ||
* This program and the accompanying materials are made | ||
* available under the terms of the Eclipse Public License 2.0 | ||
* which is available at https://www.eclipse.org/legal/epl-2.0/ | ||
* | ||
* SPDX-License-Identifier: EPL-2.0 | ||
* | ||
* Contributors: | ||
* Red Hat, Inc. - initial API and implementation | ||
*/ | ||
|
||
import { api } from '@eclipse-che/common'; | ||
import { Tooltip, TooltipPosition } from '@patternfly/react-core'; | ||
import { | ||
CheckCircleIcon, | ||
ExclamationTriangleIcon, | ||
ResourcesEmptyIcon, | ||
} from '@patternfly/react-icons'; | ||
import React from 'react'; | ||
import { connect, ConnectedProps } from 'react-redux'; | ||
|
||
import { AppState } from '@/store'; | ||
import * as GitOauthConfig from '@/store/GitOauthConfig'; | ||
import { | ||
selectProvidersWithToken, | ||
selectSkipOauthProviders, | ||
} from '@/store/GitOauthConfig/selectors'; | ||
|
||
type State = { | ||
hasOauthToken: boolean; | ||
isSkipOauth: boolean; | ||
}; | ||
|
||
type Props = MappedProps & { | ||
gitProvider: api.GitOauthProvider; | ||
}; | ||
|
||
export class ProviderIcon extends React.PureComponent<Props, State> { | ||
constructor(props: Props) { | ||
super(props); | ||
const hasOauthToken = this.hasOauthToken(this.props.gitProvider); | ||
const isSkipOauth = this.isSkipOauth(this.props.gitProvider); | ||
this.state = { | ||
hasOauthToken, | ||
isSkipOauth, | ||
}; | ||
} | ||
|
||
public async componentDidMount(): Promise<void> { | ||
const hasOauthToken = this.hasOauthToken(this.props.gitProvider); | ||
const isSkipOauth = this.isSkipOauth(this.props.gitProvider); | ||
this.setState({ | ||
hasOauthToken, | ||
isSkipOauth, | ||
}); | ||
} | ||
|
||
public async componentDidUpdate(): Promise<void> { | ||
const hasOauthToken = this.hasOauthToken(this.props.gitProvider); | ||
const isSkipOauth = this.isSkipOauth(this.props.gitProvider); | ||
this.setState({ | ||
hasOauthToken, | ||
isSkipOauth, | ||
}); | ||
} | ||
|
||
private isSkipOauth(providerName: api.GitOauthProvider): boolean { | ||
return this.props.skipOauthProviders.includes(providerName); | ||
} | ||
|
||
private hasOauthToken(providerName: api.GitOauthProvider): boolean { | ||
return this.props.providersWithToken.includes(providerName); | ||
} | ||
|
||
public render(): React.ReactElement { | ||
const { hasOauthToken, isSkipOauth } = this.state; | ||
if (hasOauthToken) { | ||
return ( | ||
<Tooltip | ||
exitDelay={3000} | ||
isContentLeftAligned={true} | ||
position={TooltipPosition.right} | ||
content={<span>Successfully authenticated.</span>} | ||
style={{ border: '1px solid', borderRadius: '3px', opacity: '0.9' }} | ||
> | ||
<CheckCircleIcon | ||
color="var(--pf-global--success-color--100)" | ||
style={{ verticalAlign: 'text-top', marginTop: '2px' }} | ||
/> | ||
</Tooltip> | ||
); | ||
} else if (isSkipOauth) { | ||
return ( | ||
<Tooltip | ||
exitDelay={3000} | ||
isContentLeftAligned={true} | ||
position={TooltipPosition.right} | ||
content={ | ||
<span>Authentication request has been rejected by user.</span> | ||
} | ||
style={{ border: '1px solid', borderRadius: '3px', opacity: '0.9' }} | ||
> | ||
<ExclamationTriangleIcon | ||
color="var(--pf-global--warning-color--100)" | ||
style={{ verticalAlign: 'text-top', marginTop: '2px' }} | ||
/> | ||
</Tooltip> | ||
); | ||
} | ||
|
||
return ( | ||
<ResourcesEmptyIcon | ||
color="var(--pf-global--disabled-color--100)" | ||
style={{ verticalAlign: 'text-top', marginTop: '2px' }} | ||
/> | ||
); | ||
} | ||
} | ||
|
||
const mapStateToProps = (state: AppState) => ({ | ||
providersWithToken: selectProvidersWithToken(state), | ||
skipOauthProviders: selectSkipOauthProviders(state), | ||
}); | ||
|
||
const connector = connect(mapStateToProps, GitOauthConfig.actionCreators); | ||
|
||
type MappedProps = ConnectedProps<typeof connector>; | ||
export default connector(ProviderIcon); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.