Fix few minor Slack connection issues (#3327)
# What this PR does Closes https://github.com/grafana/oncall-private/issues/2289 - Fix issue where if you try connecting your Slack user to your OnCall user and the first time around you encounter an error (ex. connecting to the wrong Slack workspace), you will see the same error banner message despite a successful connection. Now we clear the session upon successful connection to ensure that you will not see any previously encountered errors. - Fix some alignment issues on the Slack connection buttons **Before** <img width="564" alt="Screenshot 2023-11-10 at 15 07 48" src="https://github.com/grafana/oncall/assets/9406895/1a256ae9-668c-4a76-b101-cb4e0af29c43"> <img width="789" alt="Screenshot 2023-11-10 at 15 16 22" src="https://github.com/grafana/oncall/assets/9406895/61649d9d-2f11-497a-9f2d-274c6dbe90eb"> **After** <img width="470" alt="Screenshot 2023-11-10 at 15 10 28" src="https://github.com/grafana/oncall/assets/9406895/92c0f1d3-75eb-4de2-a3d3-4e014489f970"> <img width="738" alt="Screenshot 2023-11-10 at 15 16 42" src="https://github.com/grafana/oncall/assets/9406895/dc825266-c45e-4c48-af78-0cd5c3c5b64e"> - On the "User Info" user settings modal tab, render `display_name` instead of `slack_login`. Currently we prefix `@` before `slack_login`, which is a bit confusing as it makes you think that this is the handle you would use to `@` your user in Slack. `display_name` corresponds to the handle that would be used to `@` your user ## Checklist - [ ] Unit, integration, and e2e (if applicable) tests updated - [x] Documentation added (or `pr:no public docs` PR label added if not required) - [x] `CHANGELOG.md` updated (or `pr:no changelog` PR label added if not required)
This commit is contained in:
Joey Orlando
GitHub
parent
6fa4df0afe
commit
dcf08425eb
8 changed files with 22 additions and 8 deletions
|
|
@ -17,6 +17,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|||
|
||||
### Fixed
|
||||
|
||||
- Fix issue where Slack user connection error message is sometimes shown despite successful connection by @joeyorlando ([#3327](https://github.com/grafana/oncall/pull/3327))
|
||||
- Forward headers for Amazon SNS when organizations are moved @mderynck ([#3326](https://github.com/grafana/oncall/pull/3326))
|
||||
|
||||
## v1.3.57 (2023-11-10)
|
||||
|
|
|
|||
|
|
@ -57,6 +57,11 @@ def connect_user_to_slack(response, backend, strategy, user, organization, *args
|
|||
strategy.session[REDIRECT_FIELD_NAME] = url
|
||||
return HttpResponse(status=status.HTTP_400_BAD_REQUEST)
|
||||
|
||||
# at this point everything is correct and we can create the SlackUserIdentity
|
||||
# be sure to clear any pre-existing sessions, in case the user previously enecountered errors we want
|
||||
# to be sure to clear these so they do not see them again
|
||||
strategy.session.flush()
|
||||
|
||||
slack_user_identity, _ = SlackUserIdentity.objects.get_or_create(
|
||||
slack_id=slack_user_id,
|
||||
slack_team_identity=slack_team_identity,
|
||||
|
|
|
|||
|
|
@ -152,7 +152,8 @@ const MobileAppConnection = observer(({ userPk }: Props) => {
|
|||
App connected <Icon name="check-circle" size="md" className={cx('icon')} />
|
||||
</Text>
|
||||
<Text type="primary">
|
||||
You can sync one application to your account. To setup new device please disconnect app first.
|
||||
You can only sync one application to your account. To setup a new device, please disconnect the currently
|
||||
connected device first.
|
||||
</Text>
|
||||
<div className={cx('disconnect__container')}>
|
||||
<img src={qrCodeImage} className={cx('disconnect__qrCode')} />
|
||||
|
|
@ -168,7 +169,9 @@ const MobileAppConnection = observer(({ userPk }: Props) => {
|
|||
<Text type="primary" strong>
|
||||
Sign In
|
||||
</Text>
|
||||
<Text type="primary">Open Grafana IRM mobile application and scan this code to sync it with your account.</Text>
|
||||
<Text type="primary">
|
||||
Open the Grafana IRM mobile application and scan this code to sync it with your account.
|
||||
</Text>
|
||||
<div className={cx('u-width-100', 'u-flex', 'u-flex-center', 'u-position-relative')}>
|
||||
<QRCode className={cx({ 'qr-code': true, blurry: isQRBlurry })} value={QRCodeValue} />
|
||||
{isQRBlurry && <QRLoading />}
|
||||
|
|
|
|||
|
|
@ -120,7 +120,7 @@ exports[`MobileAppConnection if we disconnect the app, it disconnects and fetche
|
|||
<span
|
||||
class="root text text--primary text--medium"
|
||||
>
|
||||
Open Grafana IRM mobile application and scan this code to sync it with your account.
|
||||
Open the Grafana IRM mobile application and scan this code to sync it with your account.
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
|
|
@ -2855,7 +2855,7 @@ exports[`MobileAppConnection it shows a message when the mobile app is already c
|
|||
<span
|
||||
class="root text text--primary text--medium"
|
||||
>
|
||||
You can sync one application to your account. To setup new device please disconnect app first.
|
||||
You can only sync one application to your account. To setup a new device, please disconnect the currently connected device first.
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@ const SlackConnector = (props: SlackConnectorProps) => {
|
|||
<Input
|
||||
disabled={true}
|
||||
value={
|
||||
storeUser.slack_user_identity?.slack_login ? '@' + storeUser.slack_user_identity?.slack_login : ''
|
||||
storeUser.slack_user_identity?.display_name ? '@' + storeUser.slack_user_identity?.display_name : ''
|
||||
}
|
||||
/>
|
||||
<WithConfirm title="Are you sure to disconnect your Slack account?" confirmText="Disconnect">
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import React, { useCallback } from 'react';
|
||||
|
||||
import { Button, VerticalGroup, Icon } from '@grafana/ui';
|
||||
import { Button, VerticalGroup, Icon, HorizontalGroup } from '@grafana/ui';
|
||||
import cn from 'classnames/bind';
|
||||
|
||||
import Block from 'components/GBlock/Block';
|
||||
|
|
@ -48,7 +48,9 @@ export const SlackTab = () => {
|
|||
</VerticalGroup>
|
||||
</Block>
|
||||
<Button onClick={handleClickConnectSlackAccount}>
|
||||
<Icon name="external-link-alt" className={cx('external-link-style')} /> Open Slack connection page
|
||||
<HorizontalGroup spacing="xs" align="center">
|
||||
<Icon name="external-link-alt" className={cx('external-link-style')} /> Open Slack connection page
|
||||
</HorizontalGroup>
|
||||
</Button>
|
||||
</VerticalGroup>
|
||||
</WithPermissionControlDisplay>
|
||||
|
|
|
|||
|
|
@ -34,6 +34,7 @@ export interface User extends BaseUser {
|
|||
unverified_phone_number?: string;
|
||||
slack_user_identity: {
|
||||
avatar: string;
|
||||
display_name: string;
|
||||
name: string;
|
||||
slack_id: string;
|
||||
slack_login: string;
|
||||
|
|
|
|||
|
|
@ -289,7 +289,9 @@ class SlackSettings extends Component<SlackProps, SlackState> {
|
|||
) : (
|
||||
<HorizontalGroup>
|
||||
<Button onClick={this.handleOpenSlackInstructions}>
|
||||
<Icon name="external-link-alt" className={cx('external-link-style')} /> Open Slack connection page
|
||||
<HorizontalGroup spacing="xs" align="center">
|
||||
<Icon name="external-link-alt" className={cx('external-link-style')} /> Open Slack connection page
|
||||
</HorizontalGroup>
|
||||
</Button>
|
||||
{store.hasFeature(AppFeature.LiveSettings) && (
|
||||
<PluginLink query={{ page: 'live-settings' }}>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue