diff --git a/workspaces/lightspeed/plugins/lightspeed/src/components/LightspeedPage.tsx b/workspaces/lightspeed/plugins/lightspeed/src/components/LightspeedPage.tsx index 45e625fe..dd70e2da 100644 --- a/workspaces/lightspeed/plugins/lightspeed/src/components/LightspeedPage.tsx +++ b/workspaces/lightspeed/plugins/lightspeed/src/components/LightspeedPage.tsx @@ -20,13 +20,13 @@ import { Content, Page } from '@backstage/core-components'; import { identityApiRef, useApi } from '@backstage/core-plugin-api'; import { createStyles, makeStyles, useTheme } from '@material-ui/core/styles'; -import { Alert, AlertTitle } from '@material-ui/lab'; import { QueryClientProvider } from '@tanstack/react-query'; import { useAllModels } from '../hooks/useAllModels'; import { useLightspeedViewPermission } from '../hooks/useLightspeedViewPermission'; import queryClient from '../utils/queryClient'; import { LightspeedChat } from './LightSpeedChat'; +import PermissionRequiredState from './PermissionRequiredState'; const useStyles = makeStyles(() => createStyles({ @@ -78,16 +78,12 @@ const LightspeedPageInner = () => { if (loading) { return null; } + return ( {!hasViewAccess ? ( - - Permission required - To view lightspeed plugin, contact your administrator to give you - the `lightspeed.conversations.read` and - `lightspeed.conversations.create` permission. - + ) : ( { + return permission required icon; +}; diff --git a/workspaces/lightspeed/plugins/lightspeed/src/components/PermissionRequiredState.tsx b/workspaces/lightspeed/plugins/lightspeed/src/components/PermissionRequiredState.tsx new file mode 100644 index 00000000..1c90c0c4 --- /dev/null +++ b/workspaces/lightspeed/plugins/lightspeed/src/components/PermissionRequiredState.tsx @@ -0,0 +1,65 @@ +/* + * Copyright 2024 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react'; + +import { EmptyState } from '@backstage/core-components'; + +import { Button } from '@material-ui/core'; +import { createStyles, makeStyles } from '@material-ui/core/styles'; + +import { PermissionRequiredIcon } from './PermissionRequiredIcon'; + +const useStyles = makeStyles(() => + createStyles({ + permissionError: { + display: 'flex', + height: '100%', + alignItems: 'center', + padding: '100px', + }, + }), +); + +const PermissionRequiredState = () => { + const classes = useStyles(); + + return ( +
+ + To view lightspeed plugin, contact your administrator to give the{' '} + lightspeed.conversations.read and{' '} + lightspeed.conversations.create permissions. + + } + missing={{ customImage: }} + action={ + + } + /> +
+ ); +}; +export default PermissionRequiredState; diff --git a/workspaces/lightspeed/plugins/lightspeed/src/components/__tests__/LightspeedPage.test.tsx b/workspaces/lightspeed/plugins/lightspeed/src/components/__tests__/LightspeedPage.test.tsx index 4a3330f5..1b8886db 100644 --- a/workspaces/lightspeed/plugins/lightspeed/src/components/__tests__/LightspeedPage.test.tsx +++ b/workspaces/lightspeed/plugins/lightspeed/src/components/__tests__/LightspeedPage.test.tsx @@ -72,7 +72,7 @@ describe('LightspeedPage', () => { }); }); - it('should display permission required alert', async () => { + it('should display missing permissions alert', async () => { mockUsePermission.mockReturnValue({ loading: false, allowed: false }); await renderInTestApp( @@ -82,7 +82,7 @@ describe('LightspeedPage', () => { ); await waitFor(() => { - expect(screen.getByText('Permission required')).toBeInTheDocument(); + expect(screen.getByText('Missing permissions')).toBeInTheDocument(); }); }); diff --git a/workspaces/lightspeed/plugins/lightspeed/src/images/permission-required.svg b/workspaces/lightspeed/plugins/lightspeed/src/images/permission-required.svg new file mode 100644 index 00000000..0c7667be --- /dev/null +++ b/workspaces/lightspeed/plugins/lightspeed/src/images/permission-required.svg @@ -0,0 +1,48 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +