Skip to content

Commit d8bcfc7

Browse files
kyle-ssgkyle-ssg
authored
fix: User display name (#5719)
1 parent 7747fa7 commit d8bcfc7

14 files changed

+45
-144
lines changed

‎frontend/common/utils/getUserDisplayName.tsx‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { User } from 'common/types/responses'
2+
3+
export default function (user: User | undefined, defaultName = 'Unknown') {
4+
if (!user) {
5+
return defaultName
6+
}
7+
if (user?.first_name || user?.last_name) {
8+
return `${user?.first_name} ${user?.last_name}`
9+
}
10+
return user?.email || defaultName
11+
}

‎frontend/common/utils/utils.tsx‎

Lines changed: 3 additions & 104 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ import { selectBuildVersion } from 'common/services/useBuildVersion'
2929
import { getStore } from 'common/store'
3030
import { TRACKED_UTMS, UtmsType } from 'common/types/utms'
3131
import { TimeUnit } from 'components/release-pipelines/constants'
32+
import getUserDisplayName from './getUserDisplayName'
3233

3334
const semver = require('semver')
3435

@@ -278,58 +279,6 @@ const Utils = Object.assign({}, require('./base/_utils'), {
278279
timeUnit: TimeUnit.MINUTE,
279280
}
280281
},
281-
getExistingWaitForTime: (
282-
waitFor: string | undefined,
283-
):
284-
| {
285-
amountOfTime: number
286-
timeUnit: (typeof TimeUnit)[keyof typeof TimeUnit]
287-
}
288-
| undefined => {
289-
if (!waitFor) {
290-
return
291-
}
292-
293-
const timeParts = waitFor.split(':')
294-
295-
if (timeParts.length != 3) return
296-
297-
const [hours, minutes, seconds] = timeParts
298-
299-
const amountOfMinutes = Number(minutes)
300-
const amountOfHours = Number(hours)
301-
const amountOfSeconds = Number(seconds)
302-
303-
if (amountOfHours + amountOfMinutes + amountOfSeconds === 0) {
304-
return
305-
}
306-
307-
// Days
308-
if (
309-
amountOfHours % 24 === 0 &&
310-
amountOfMinutes === 0 &&
311-
amountOfSeconds === 0
312-
) {
313-
return {
314-
amountOfTime: amountOfHours / 24,
315-
timeUnit: TimeUnit.DAY,
316-
}
317-
}
318-
319-
// Hours
320-
if (amountOfHours > 0 && amountOfMinutes === 0 && amountOfSeconds === 0) {
321-
return {
322-
amountOfTime: amountOfHours,
323-
timeUnit: TimeUnit.HOUR,
324-
}
325-
}
326-
327-
// Minutes
328-
return {
329-
amountOfTime: amountOfMinutes,
330-
timeUnit: TimeUnit.MINUTE,
331-
}
332-
},
333282
getFeatureStatesEndpoint(_project: ProjectType) {
334283
const project = _project || ProjectStore.model
335284
if (project && project.use_edge_identities) {
@@ -416,53 +365,6 @@ const Utils = Object.assign({}, require('./base/_utils'), {
416365
defaultFlags.integration_data,
417366
)
418367
},
419-
getExistingWaitForTime: (
420-
waitFor: string | undefined,
421-
): { amountOfTime: number; timeUnit: (typeof TimeUnit)[keyof typeof TimeUnit] } | undefined => {
422-
if (!waitFor) {
423-
return
424-
}
425-
426-
const timeParts = waitFor.split(':')
427-
428-
if (timeParts.length != 3) return
429-
430-
const [hours, minutes, seconds] = timeParts
431-
432-
const amountOfMinutes = Number(minutes)
433-
const amountOfHours = Number(hours)
434-
const amountOfSeconds = Number(seconds)
435-
436-
if (amountOfHours + amountOfMinutes + amountOfSeconds === 0) {
437-
return
438-
}
439-
440-
// Days
441-
if (
442-
amountOfHours % 24 === 0 &&
443-
amountOfMinutes === 0 &&
444-
amountOfSeconds === 0
445-
) {
446-
return {
447-
amountOfTime: amountOfHours / 24,
448-
timeUnit: TimeUnit.DAY,
449-
}
450-
}
451-
452-
// Hours
453-
if (amountOfHours > 0 && amountOfMinutes === 0 && amountOfSeconds === 0) {
454-
return {
455-
amountOfTime: amountOfHours,
456-
timeUnit: TimeUnit.HOUR,
457-
}
458-
}
459-
460-
// Minutes
461-
return {
462-
amountOfTime: amountOfMinutes,
463-
timeUnit: TimeUnit.MINUTE,
464-
}
465-
},
466368
getIsEdge() {
467369
const model = ProjectStore.model as null | ProjectType
468370

@@ -515,6 +417,7 @@ const Utils = Object.assign({}, require('./base/_utils'), {
515417
}
516418
return `/organisation/${orgId}/projects`
517419
},
420+
518421
getOrganisationIdFromUrl(match: any) {
519422
const organisationId = match?.params?.organisationId
520423
return organisationId ? parseInt(organisationId) : null
@@ -801,11 +704,7 @@ const Utils = Object.assign({}, require('./base/_utils'), {
801704
)
802705
if (window.$crisp) {
803706
$crisp.push(['set', 'user:email', user.email])
804-
$crisp.push([
805-
'set',
806-
'user:nickname',
807-
`${user.first_name} ${user.last_name}`,
808-
])
707+
$crisp.push(['set', 'user:nickname', `${getUserDisplayName(user)}`])
809708
if (otherOrgs.length) {
810709
$crisp.push([
811710
'set',

‎frontend/web/components/EditPermissions.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,7 @@ import { PermissionRow } from './PermissionRow'
6565
import Utils from 'common/utils/utils'
6666
import RemoveViewPermissionModal from './RemoveViewPermissionModal'
6767
import { useHistory } from 'react-router-dom'
68+
import getUserDisplayName from 'common/utils/getUserDisplayName'
6869

6970
const Project = require('common/project')
7071

@@ -792,7 +793,7 @@ const _EditPermissionsModal: FC<EditPermissionModalType> = withAdminPermissions(
792793
return `the ${group?.name ?? ''} group`
793794
}
794795
if (user) {
795-
return `${user.first_name ?? ''} ${user.last_name ?? ''}`
796+
return `${getUserDisplayName(user)}`
796797
}
797798
if (role) {
798799
return role.name
@@ -1011,7 +1012,7 @@ const EditPermissions: FC<EditPermissionsType> = (props) => {
10111012
openModal(
10121013
`Edit ${Format.camelCase(level)} Permissions`,
10131014
<EditPermissionsModal
1014-
name={`${user.first_name} ${user.last_name}`}
1015+
name={`${getUserDisplayName(user)}`}
10151016
id={id}
10161017
onSave={onSaveUser}
10171018
level={level}

‎frontend/web/components/FeatureHistory.tsx‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import DateList from './DateList'
1313
import classNames from 'classnames'
1414
import PlanBasedBanner from './PlanBasedAccess'
1515
import { useGetSubscriptionMetadataQuery } from 'common/services/useSubscriptionMetadata'
16+
import getUserDisplayName from 'common/utils/getUserDisplayName'
1617

1718
const widths = [250, 150]
1819
type FeatureHistoryPageType = {
@@ -99,11 +100,7 @@ const FeatureHistory: FC<FeatureHistoryPageType> = ({
99100
<div className='font-weight-medium d-flex gap-2 align-items-center mb-1'>
100101
{moment(v.live_from).format('HH:mma')}
101102
<div className='text-muted fw-normal text-small'>
102-
{user
103-
? `${user.first_name || ''} ${
104-
user.last_name || ''
105-
} `
106-
: 'System '}
103+
{user ? `${getUserDisplayName(user)} ` : 'System '}
107104
</div>
108105
{!i && <span className='chip chip--xs px-2'>Live</span>}
109106
</div>

‎frontend/web/components/FlagOwners.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import { getProjectFlag } from 'common/services/useProjectFlag'
99
import { getStore } from 'common/store'
1010
import SettingsButton from './SettingsButton'
1111
import OrganisationProvider from 'common/providers/OrganisationProvider'
12+
import getUserDisplayName from 'common/utils/getUserDisplayName'
1213

1314
class TheComponent extends Component {
1415
state = {}
@@ -66,7 +67,7 @@ class TheComponent extends Component {
6667
className='chip mr-2'
6768
>
6869
<span className='font-weight-bold'>
69-
{u.first_name} {u.last_name}
70+
{getUserDisplayName(u)}
7071
</span>
7172
<span className='chip-icon ion'>
7273
<IonIcon icon={close} />

‎frontend/web/components/modals/ChangeRequestModal.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import moment from 'moment'
1414
import Utils from 'common/utils/utils'
1515
import { Approval, ChangeRequest, User } from 'common/types/responses'
1616
import { Req } from 'common/types/requests'
17+
import getUserDisplayName from 'common/utils/getUserDisplayName'
1718

1819
interface ChangeRequestModalProps {
1920
changeRequest?: ChangeRequest
@@ -202,7 +203,7 @@ const ChangeRequestModal: FC<ChangeRequestModalProps> = ({
202203
style={{ marginBottom: 4, marginTop: 4 }}
203204
>
204205
<span className='font-weight-bold'>
205-
{u.first_name} {u.last_name}
206+
{getUserDisplayName(u)}
206207
</span>
207208
<span className='chip-icon ion'>
208209
<IonIcon icon={close} />

‎frontend/web/components/modals/CreateRole.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ import SettingsButton from 'components/SettingsButton'
3939
import PermissionsTabs from 'components/PermissionsTabs'
4040
import AccountStore from 'common/stores/account-store'
4141
import { RouteComponentProps } from 'react-router-dom'
42+
import getUserDisplayName from 'common/utils/getUserDisplayName'
4243
type TabRef = {
4344
onClosing: () => Promise<void>
4445
tabChanged: () => boolean
@@ -469,7 +470,7 @@ const CreateRole: FC<CreateRoleType> = ({
469470
className='chip my-1 justify-content-between'
470471
>
471472
<span className='font-weight-bold'>
472-
{u.first_name} {u.last_name}
473+
{getUserDisplayName(u)}
473474
</span>
474475
<span className='chip-icon ion'>
475476
<IonIcon icon={closeIcon} style={{ fontSize: '13px' }} />

‎frontend/web/components/pages/AuditLogItemPage.tsx‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ import { Environment } from 'common/types/responses'
1515
import { Link, useRouteMatch } from 'react-router-dom'
1616
import Button from 'components/base/forms/Button'
1717
import { useRouteContext } from 'components/providers/RouteContext'
18+
import getUserDisplayName from 'common/utils/getUserDisplayName'
1819

1920
interface RouteParams {
2021
environmentId: string
@@ -69,11 +70,7 @@ const AuditLogItemPage: FC = () => {
6970
>
7071
{!!data &&
7172
`Created ${moment(data.created_date).format('Do MMM YYYY HH:mma')}${
72-
data.author
73-
? ` by ${data.author.first_name || ''} ${
74-
data.author.last_name || ''
75-
}`
76-
: ''
73+
data.author ? ` by ${getUserDisplayName(data.author)}` : ''
7774
}`}
7875
</PageTitle>
7976
{isLoading ? (

‎frontend/web/components/pages/ChangeRequestDetailPage.js‎

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ import WarningMessage from 'components/WarningMessage'
2626
import ErrorMessage from 'components/ErrorMessage'
2727
import { Component } from 'react'
2828
import { useRouteContext } from 'components/providers/RouteContext'
29+
import getUserDisplayName from 'common/utils/getUserDisplayName'
2930

3031
const ChangeRequestDetailPage = class extends Component {
3132
static displayName = 'ChangeRequestDetailPage'
@@ -316,7 +317,7 @@ const ChangeRequestDetailPage = class extends Component {
316317
.filter((v) => !!v.approved_at)
317318
.map((v) => {
318319
const matchingUser = orgUsers.find((u) => u.id === v.user) || {}
319-
return `${matchingUser.first_name} ${matchingUser.last_name}`
320+
return `${getUserDisplayName(matchingUser)}`
320321
})
321322
const approved = !!approval && !!approval.approved_at
322323
const environment = ProjectStore.getEnvironment(
@@ -392,10 +393,7 @@ const ChangeRequestDetailPage = class extends Component {
392393
{moment(changeRequest.created_at).format(
393394
'Do MMM YYYY HH:mma',
394395
)}{' '}
395-
by{' '}
396-
{user
397-
? `${user.first_name} ${user.last_name}`
398-
: 'Unknown user'}
396+
by {getUserDisplayName(user)}
399397
</PageTitle>
400398
<p className='mt-2'>{changeRequest.description}</p>
401399
{isScheduled && (
@@ -440,7 +438,7 @@ const ChangeRequestDetailPage = class extends Component {
440438
}}
441439
>
442440
<span className='font-weight-bold'>
443-
{u.first_name} {u.last_name}
441+
{getUserDisplayName(u)}
444442
</span>
445443
<span className='chip-icon ion'>
446444
<IonIcon icon={close} />
@@ -570,7 +568,7 @@ const ChangeRequestDetailPage = class extends Component {
570568
{moment(changeRequest.committed_at).format(
571569
'Do MMM YYYY HH:mma',
572570
)}{' '}
573-
by {committedBy.first_name} {committedBy.last_name}
571+
by {getUserDisplayName(committedBy)}
574572
</div>
575573
) : (
576574
<Row className='text-right mt-2'>

‎frontend/web/components/pages/ChangeRequestsPage.js‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ import Utils from 'common/utils/utils'
1616
import PlanBasedAccess, {
1717
featureDescriptions,
1818
} from 'components/PlanBasedAccess'
19+
import getUserDisplayName from 'common/utils/getUserDisplayName'
1920

2021
const ChangeRequestsPage = class extends Component {
2122
static displayName = 'ChangeRequestsPage'
@@ -184,8 +185,7 @@ const ChangeRequestsPage = class extends Component {
184185
<div className='list-item-subtitle mt-1'>
185186
Created{' '}
186187
{moment(created_at).format('Do MMM YYYY HH:mma')}{' '}
187-
by {(user && user.first_name) || 'Unknown'}{' '}
188-
{(user && user.last_name) || 'user'}
188+
by {getUserDisplayName(user)}
189189
{description ? ` - ${description}` : ''}
190190
</div>
191191
</Flex>
@@ -265,8 +265,7 @@ const ChangeRequestsPage = class extends Component {
265265
<div className='list-item-subtitle mt-1'>
266266
Live from{' '}
267267
{moment(created_at).format('Do MMM YYYY HH:mma')}{' '}
268-
by {(user && user.first_name) || 'Unknown'}{' '}
269-
{(user && user.last_name) || 'user'}
268+
by {getUserDisplayName(user)}
270269
</div>
271270
</Flex>
272271
<div className='table-column'>

0 commit comments

Comments
 (0)