diff --git a/.changeset/moody-scissors-yell.md b/.changeset/moody-scissors-yell.md new file mode 100644 index 0000000000..deb06b3c6f --- /dev/null +++ b/.changeset/moody-scissors-yell.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-home': patch +--- + +Fix undefined identity bug in `WelcomeTitle` caused by using deprecated methods of the IdentityApi diff --git a/plugins/home/src/homePageComponents/WelcomeTitle/WelcomeTitle.tsx b/plugins/home/src/homePageComponents/WelcomeTitle/WelcomeTitle.tsx index 04ec7e1673..9cb18bd430 100644 --- a/plugins/home/src/homePageComponents/WelcomeTitle/WelcomeTitle.tsx +++ b/plugins/home/src/homePageComponents/WelcomeTitle/WelcomeTitle.tsx @@ -13,20 +13,39 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { identityApiRef, useApi } from '@backstage/core-plugin-api'; +import { + alertApiRef, + identityApiRef, + useApi, +} from '@backstage/core-plugin-api'; import { Tooltip } from '@material-ui/core'; -import React, { useMemo } from 'react'; +import React, { useEffect, useMemo } from 'react'; +import { useAsync } from 'react-use'; import { getTimeBasedGreeting } from './timeUtil'; export const WelcomeTitle = () => { const identityApi = useApi(identityApiRef); - const profile = identityApi.getProfile(); - const userId = identityApi.getUserId(); + const alertApi = useApi(alertApiRef); const greeting = useMemo(() => getTimeBasedGreeting(), []); + const { value: profile, error } = useAsync(() => + identityApi.getProfileInfo(), + ); + + useEffect(() => { + if (error) { + alertApi.post({ + message: `Failed to load user identity: ${error}`, + severity: 'error', + }); + } + }, [error, alertApi]); + return ( - {`${greeting.greeting}, ${profile.displayName || userId}!`} + {`${greeting.greeting}${ + profile?.displayName ? `, ${profile?.displayName}` : '' + }!`} ); };