Skip to content

Commit

Permalink
conditionally show assist popover (#32267)
Browse files Browse the repository at this point in the history
  • Loading branch information
michellescripts authored Sep 27, 2023
1 parent 3d16a93 commit b2e6c16
Show file tree
Hide file tree
Showing 4 changed files with 155 additions and 34 deletions.
5 changes: 3 additions & 2 deletions web/packages/teleport/src/Main/Main.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -161,6 +161,7 @@ export function Main(props: MainProps) {
const onboard = localStorage.getOnboardDiscover();
const requiresOnboarding =
onboard && !onboard.hasResource && !onboard.notified;
const displayOnboardDiscover = requiresOnboarding && showOnboardDiscover;

return (
<FeaturesContextProvider value={features}>
Expand All @@ -175,14 +176,14 @@ export function Main(props: MainProps) {
<HorizontalSplit>
<ContentMinWidth>
<Suspense fallback={null}>
<TopBar />
<TopBar hidePopup={displayOnboardDiscover} />
<FeatureRoutes lockedFeatures={ctx.lockedFeatures} />
</Suspense>
</ContentMinWidth>
</HorizontalSplit>
</MainContainer>
</BannerList>
{requiresOnboarding && showOnboardDiscover && (
{displayOnboardDiscover && (
<OnboardDiscover onClose={handleOnClose} onOnboard={handleOnboard} />
)}
{showOnboardSurvey && (
Expand Down
112 changes: 112 additions & 0 deletions web/packages/teleport/src/TopBar/TopBar.test.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,112 @@
/**
* Copyright 2023 Gravitational, Inc
*
* 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 { render, screen } from 'design/utils/testing';

import { Router } from 'react-router';
import { createMemoryHistory } from 'history';

import { LayoutContextProvider } from 'teleport/Main/LayoutContext';
import TeleportContextProvider from 'teleport/TeleportContextProvider';
import { FeaturesContextProvider } from 'teleport/FeaturesContext';
import { getOSSFeatures } from 'teleport/features';
import TeleportContext, {
disabledFeatureFlags,
} from 'teleport/teleportContext';

import { makeUserContext } from 'teleport/services/user';

import { mockUserContextProviderWith } from 'teleport/User/testHelpers/mockUserContextWith';
import { makeTestUserContext } from 'teleport/User/testHelpers/makeTestUserContext';

import { clusters } from 'teleport/Clusters/fixtures';

import { TopBar } from './TopBar';

let ctx;

function setup(): void {
ctx = new TeleportContext();
jest
.spyOn(ctx, 'getFeatureFlags')
.mockReturnValue({ ...disabledFeatureFlags, assist: true });
ctx.clusterService.fetchClusters = () => Promise.resolve(clusters);

ctx.assistEnabled = true;
ctx.storeUser.state = makeUserContext({
userName: 'admin',
cluster: {
name: 'test-cluster',
lastConnected: Date.now(),
},
});
mockUserContextProviderWith(makeTestUserContext());
}

test('does not show assist popup if hidePopup is true', () => {
setup();

render(
<Router history={createMemoryHistory()}>
<LayoutContextProvider>
<TeleportContextProvider ctx={ctx}>
<FeaturesContextProvider value={getOSSFeatures()}>
<TopBar hidePopup={true} />
</FeaturesContextProvider>
</TeleportContextProvider>
</LayoutContextProvider>
</Router>
);

expect(screen.queryByTestId('assistPopup')).not.toBeInTheDocument();
});

test('shows assist popup if hidePopup is absent', () => {
setup();

render(
<Router history={createMemoryHistory()}>
<LayoutContextProvider>
<TeleportContextProvider ctx={ctx}>
<FeaturesContextProvider value={getOSSFeatures()}>
<TopBar />
</FeaturesContextProvider>
</TeleportContextProvider>
</LayoutContextProvider>
</Router>
);

expect(screen.getByTestId('assistPopup')).toBeInTheDocument();
});

test('shows assist popup if hidePopup is false', () => {
setup();

render(
<Router history={createMemoryHistory()}>
<LayoutContextProvider>
<TeleportContextProvider ctx={ctx}>
<FeaturesContextProvider value={getOSSFeatures()}>
<TopBar hidePopup={false} />
</FeaturesContextProvider>
</TeleportContextProvider>
</LayoutContextProvider>
</Router>
);

expect(screen.getByTestId('assistPopup')).toBeInTheDocument();
});
14 changes: 10 additions & 4 deletions web/packages/teleport/src/TopBar/TopBar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,14 @@ const Background = styled.div`
background: rgba(0, 0, 0, 0.6);
`;

export function TopBar() {
type TopBarProps = {
// hidePopup indicates if the popup should be hidden based on parent component states.
// if true, another modal is present; and we do not want to display the assist popup.
// if false or absent, display as pre normal logical rules.
hidePopup?: boolean;
};

export function TopBar({ hidePopup = false }: TopBarProps) {
const theme = useTheme();

const ctx = useTeleport();
Expand Down Expand Up @@ -185,11 +192,10 @@ export function TopBar() {
<AssistButton onClick={() => setShowAssist(true)}>
<BrainIcon />
</AssistButton>

{showAssistPopup && (
{showAssistPopup && !hidePopup && (
<>
<Background />
<Popup>
<Popup data-testid="assistPopup">
<PopupTitle>
<PopupTitleBackground>New!</PopupTitleBackground>
</PopupTitle>{' '}
Expand Down
58 changes: 30 additions & 28 deletions web/packages/teleport/src/teleportContext.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -96,34 +96,7 @@ class TeleportContext implements types.Context {
const userContext = this.storeUser;

if (!this.storeUser.state) {
return {
activeSessions: false,
applications: false,
audit: false,
authConnector: false,
billing: false,
databases: false,
desktops: false,
kubernetes: false,
nodes: false,
recordings: false,
roles: false,
trustedClusters: false,
users: false,
newAccessRequest: false,
accessRequests: false,
downloadCenter: false,
discover: false,
plugins: false,
integrations: false,
deviceTrust: false,
enrollIntegrationsOrPlugins: false,
enrollIntegrations: false,
locks: false,
newLocks: false,
assist: false,
managementSection: false,
};
return disabledFeatureFlags;
}

// If feature hiding is enabled in the license, this returns true if the user has no list access to any feature within the management section.
Expand Down Expand Up @@ -195,4 +168,33 @@ class TeleportContext implements types.Context {
}
}

export const disabledFeatureFlags: types.FeatureFlags = {
activeSessions: false,
applications: false,
audit: false,
authConnector: false,
billing: false,
databases: false,
desktops: false,
kubernetes: false,
nodes: false,
recordings: false,
roles: false,
trustedClusters: false,
users: false,
newAccessRequest: false,
accessRequests: false,
downloadCenter: false,
discover: false,
plugins: false,
integrations: false,
deviceTrust: false,
enrollIntegrationsOrPlugins: false,
enrollIntegrations: false,
locks: false,
newLocks: false,
assist: false,
managementSection: false,
};

export default TeleportContext;

0 comments on commit b2e6c16

Please sign in to comment.